feat: add wip page and dialog popup

app/components/view-popup.tsx

@@ -0,0 +1,57 @@
+import { useEffect, useRef } from "react";
+import { Button } from "@/components/ui/button";
+import {
+	Dialog,
+	DialogClose,
+	DialogContent,
+	DialogDescription,
+	DialogFooter,
+	DialogHeader,
+	DialogTitle,
+	DialogTrigger,
+} from "@/components/ui/dialog";
+import { useNavigate } from "@remix-run/react";
+
+export function ViewPopup() {
+	let navigate = useNavigate();
+	const triggerRef = useRef<HTMLButtonElement>(null);
+
+	useEffect(() => {
+		const timer = setTimeout(() => {
+			triggerRef.current?.click();
+		}, 5000);
+		return () => clearTimeout(timer);
+	}, []);
+
+	return (
+		<Dialog>
+			<DialogTrigger asChild>
+				<Button
+					variant="outline"
+					style={{ display: "none" }}
+					id="auto-dialog-trigger"
+					ref={triggerRef}
+				></Button>
+			</DialogTrigger>
+			<DialogContent className="sm:max-w-md">
+				<DialogHeader>
+					<DialogTitle>Change view</DialogTitle>
+					<DialogDescription>
+						Would you like to stick with a normal portfolio view or a more
+						exciting view?
+					</DialogDescription>
+				</DialogHeader>
+				<DialogFooter className="sm:justify-start">
+					<Button type="button" onClick={() => navigate("/fun")}>
+						Take me to fun land
+					</Button>
+					<DialogClose asChild>
+						<Button type="button" variant="secondary">
+							Stick to current view
+						</Button>
+					</DialogClose>
+				</DialogFooter>
+			</DialogContent>
+		</Dialog>
+	);
+}