App directory #3

apps/leafcutter/app/(main)/setup/_components/Setup.tsx

@@ -0,0 +1,49 @@
+"use client";
+
+import { FC } from "react";
+import { useLayoutEffect } from "react";
+import { useRouter } from "next/navigation";
+import { Grid, CircularProgress } from "@mui/material";
+import Iframe from "react-iframe";
+import { useAppContext } from "@/app/_components/AppProvider";
+
+export const Setup:FC = () => {
+  const {
+    colors: { leafcutterElectricBlue },
+  } = useAppContext();
+  const router = useRouter();
+  useLayoutEffect(() => {
+    setTimeout(() => router.push("/"), 4000);
+  }, [router]);
+
+  return (
+    <Grid
+      sx={{ width: "100%", height: 700 }}
+      direction="row"
+      justifyContent="space-around"
+      alignItems="center"
+      alignContent="center"
+    >
+      <Grid
+        item
+        xs={12}
+        sx={{
+          width: "200px",
+          height: 700,
+          textAlign: "center",
+          margin: "0 auto",
+          pt: 30,
+        }}
+      >
+        <Iframe url="/app/home" height="1" width="1" frameBorder={0} />
+        <CircularProgress
+          size={80}
+          thickness={5}
+          sx={{ color: leafcutterElectricBlue }}
+        />
+      </Grid>
+    </Grid>
+  );
+};
+
+export default Setup;

apps/leafcutter/app/(main)/setup/page.tsx

@@ -0,0 +1,6 @@
+import { Setup } from './_components/Setup';
+
+export default function Page() {
+  return <Setup />;
+}
+