Added Spline component for 404 logo to remove spline logo

apps/webapp/app/components/ErrorDisplay.tsx

@@ -5,6 +5,7 @@ import { friendlyErrorDisplay } from "~/utils/httpErrors";
 import { LinkButton } from "./primitives/Buttons";
 import { Header1 } from "./primitives/Headers";
 import { Paragraph } from "./primitives/Paragraph";
+import Spline from "@splinetool/react-spline";
 
 type ErrorDisplayOptions = {
   button?: {
@@ -55,18 +56,13 @@ export function ErrorDisplay({ title, message, button }: DisplayOptionsProps) {
           {button ? button.title : "Go to homepage"}
         </LinkButton>
       </div>
-      <div className="pointer-events-none absolute bottom-4 right-4 z-10 h-[70px] w-[200px] bg-[rgb(24,26,30)]" />
       <motion.div
         className="pointer-events-none absolute inset-0 overflow-hidden"
         initial={{ opacity: 0 }}
         animate={{ opacity: 1 }}
         transition={{ delay: 0.5, duration: 2, ease: "easeOut" }}
       >
-        <iframe
-          src="https://my.spline.design/untitled-a6f70b5ebc46bdb2dcc0f21d5397e8ac/"
-          className="pointer-events-none absolute inset-0 h-full w-full object-cover"
-          style={{ border: "none" }}
-        />
+        <Spline scene="https://prod.spline.design/wRly8TZN-e0Twb8W/scene.splinecode" />
       </motion.div>
     </div>
   );

apps/webapp/package.json

@@ -89,6 +89,7 @@
     "@remix-run/v1-meta": "^0.1.3",
     "@slack/web-api": "^6.8.1",
     "@socket.io/redis-adapter": "^8.3.0",
+    "@splinetool/react-spline": "^2.2.6",
     "@tabler/icons-react": "^2.39.0",
     "@tailwindcss/container-queries": "^0.1.1",
     "@tanstack/react-virtual": "^3.0.4",
@@ -254,4 +255,4 @@
   "engines": {
     "node": ">=16.0.0"
   }
-}
+}