From fd39a0c57ed88f37d00656d1093ad7198026ae7b Mon Sep 17 00:00:00 2001
From: setsun <seanjeluo@gmail.com>
Date: Thu, 29 Jun 2023 20:41:06 -0400
Subject: [PATCH] scaffold pages

---
 components/Layout.tsx       |  8 +++---
 pages/games/index.tsx       | 15 ++++++++++
 pages/index.tsx             | 55 +++++++++----------------------------
 pages/now-playing/index.tsx | 21 ++++++++++++++
 pages/photos/index.tsx      | 15 ++++++++++
 pages/visualizers/index.tsx | 15 ++++++++++
 pages/writing/index.tsx     | 38 +++++++++++++++++++++++++
 7 files changed, 121 insertions(+), 46 deletions(-)
 create mode 100644 pages/games/index.tsx
 create mode 100644 pages/now-playing/index.tsx
 create mode 100644 pages/photos/index.tsx
 create mode 100644 pages/visualizers/index.tsx
 create mode 100644 pages/writing/index.tsx

diff --git a/components/Layout.tsx b/components/Layout.tsx
index 581942ca..c320cce5 100644
--- a/components/Layout.tsx
+++ b/components/Layout.tsx
@@ -17,12 +17,12 @@ const Layout: React.FC<Props> = (props) => (
     <div className="flex h-screen overflow-hidden">
       <Navigation />
 
-      <div className="w-full overflow-scroll">
-        <div className="p-4">
+      <div className="w-full overflow-scroll relative">
+        <main className="p-4" style={{ minHeight: 'calc(100vh - 4rem)'}}>
           {props.children}
+        </main>
 
-          <Footer />
-        </div>
+        <Footer />
       </div>
     </div>
   </>
diff --git a/pages/games/index.tsx b/pages/games/index.tsx
new file mode 100644
index 00000000..fe8d236e
--- /dev/null
+++ b/pages/games/index.tsx
@@ -0,0 +1,15 @@
+import Layout from "../../components/Layout"
+
+interface Props { }
+
+const Games: React.FC<Props> = (props) => {
+  return (
+    <Layout>
+      <div className="h-screen text-3xl flex justify-center items-center">
+        🚧 🚧 🚧
+      </div>
+    </Layout>
+  );
+}
+
+export default Games;
diff --git a/pages/index.tsx b/pages/index.tsx
index 8a8cce84..b6b7f1c7 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -1,10 +1,6 @@
 import React from "react"
 import { GetStaticProps } from "next"
-import dynamic from "next/dynamic";
 import Layout from "../components/Layout"
-import Post, { PostProps } from "../components/Post"
-import prisma from "../lib/prisma";
-import SpotifyIframePlaylist from "../components/SpotifyIframePlaylist";
 import { Canvas } from "@react-three/fiber";
 import WireframePlanet from "../components/hero-scenes/WireframePlanet";
 
@@ -18,54 +14,29 @@ import WireframePlanet from "../components/hero-scenes/WireframePlanet";
 // );
 
 export const getStaticProps: GetStaticProps = async () => {
-  const feed = await prisma.post.findMany({
-    where: { published: true },
-    include: {
-      author: {
-        select: { name: true },
-      },
-    },
-  });
+  // todo: determine what data to fetch in home page
 
   return {
-    props: { feed },
+    props: {},
     revalidate: 10
   }
 }
 
-type Props = {
-  feed: PostProps[]
-}
+interface Props {}
 
-const Blog: React.FC<Props> = (props) => {
+const Index: React.FC<Props> = (props) => {
   return (
     <Layout>
-      <main>
-        <Canvas
-          className="w-full aspect-video"
-          camera={{
-            position: [0, 0, -30]
-          }}
-        >
-          <WireframePlanet />
-        </Canvas>
-
-        <div className="mt-6">
-          <h2 className="underline mb-2">Recent Posts</h2>
-          {props.feed.map((post, i) => (
-            <Post key={i} post={post} />
-          ))}
-        </div>
-
-        {/* <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/1bUUPhe0zP9FgrsqYjxbTp?theme=0" />
-        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/1cUbQxIOFcxeL5oUheu85i?theme=0" />
-        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/3xx5COLUZ7Xwvyfg8MF4Nb?theme=0" />
-        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/4LddzZkIk08J3IwqXladlJ?theme=0" />
-        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/1aQK4Hz4Xmz3Y4NEhz9ReT?theme=0" />
-        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/26ItkYptyl56YEIYQDQs7r?theme=0" /> */}
-      </main>
+      <Canvas
+        className="w-full aspect-video"
+        camera={{
+          position: [0, 0, -30]
+        }}
+      >
+        <WireframePlanet />
+      </Canvas>
     </Layout>
   )
 }
 
-export default Blog
+export default Index;
diff --git a/pages/now-playing/index.tsx b/pages/now-playing/index.tsx
new file mode 100644
index 00000000..922f37be
--- /dev/null
+++ b/pages/now-playing/index.tsx
@@ -0,0 +1,21 @@
+import Layout from "../../components/Layout"
+import SpotifyIframePlaylist from "../../components/SpotifyIframePlaylist";
+
+interface Props { }
+
+const NowPlaying: React.FC<Props> = (props) => {
+  return (
+    <Layout>
+      <div className="grid grid-cols-3 gap-4">
+        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/1bUUPhe0zP9FgrsqYjxbTp?theme=0" />
+        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/1cUbQxIOFcxeL5oUheu85i?theme=0" />
+        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/3xx5COLUZ7Xwvyfg8MF4Nb?theme=0" />
+        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/4LddzZkIk08J3IwqXladlJ?theme=0" />
+        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/1aQK4Hz4Xmz3Y4NEhz9ReT?theme=0" />
+        <SpotifyIframePlaylist src="https://open.spotify.com/embed/playlist/26ItkYptyl56YEIYQDQs7r?theme=0" />
+      </div>
+    </Layout>
+  );
+}
+
+export default NowPlaying;
diff --git a/pages/photos/index.tsx b/pages/photos/index.tsx
new file mode 100644
index 00000000..0e264256
--- /dev/null
+++ b/pages/photos/index.tsx
@@ -0,0 +1,15 @@
+import Layout from "../../components/Layout"
+
+interface Props { }
+
+const Photos: React.FC<Props> = (props) => {
+  return (
+    <Layout>
+      <div className="h-screen text-3xl flex justify-center items-center">
+        🚧 🚧 🚧
+      </div>
+    </Layout>
+  );
+}
+
+export default Photos;
diff --git a/pages/visualizers/index.tsx b/pages/visualizers/index.tsx
new file mode 100644
index 00000000..c4ceba66
--- /dev/null
+++ b/pages/visualizers/index.tsx
@@ -0,0 +1,15 @@
+import Layout from "../../components/Layout"
+
+interface Props { }
+
+const Visualizers: React.FC<Props> = (props) => {
+  return (
+    <Layout>
+      <div className="h-screen text-3xl flex justify-center items-center">
+        🚧 🚧 🚧
+      </div>
+    </Layout>
+  );
+}
+
+export default Visualizers;
diff --git a/pages/writing/index.tsx b/pages/writing/index.tsx
new file mode 100644
index 00000000..59d7ef12
--- /dev/null
+++ b/pages/writing/index.tsx
@@ -0,0 +1,38 @@
+import React from "react"
+import { GetStaticProps } from "next"
+import Layout from "../../components/Layout"
+import Post, { PostProps } from "../../components/Post"
+import prisma from "../../lib/prisma";
+
+export const getStaticProps: GetStaticProps = async () => {
+  const feed = await prisma.post.findMany({
+    where: { published: true },
+    include: {
+      author: {
+        select: { name: true },
+      },
+    },
+  });
+
+  return {
+    props: { feed },
+    revalidate: 10
+  }
+}
+
+type Props = {
+  feed: PostProps[]
+}
+
+const Blog: React.FC<Props> = (props) => {
+  return (
+    <Layout>
+      <h2 className="underline mb-2">Recent Posts</h2>
+      {props.feed.map((post, i) => (
+        <Post key={i} post={post} />
+      ))}
+    </Layout>
+  );
+}
+
+export default Blog