✨ Added base users page

dnrm · Sep 11, 2022 · 9e5d109 · 9e5d109
1 parent 094450c
commit 9e5d109
Show file tree

Hide file tree

Showing 3 changed files with 108 additions and 38 deletions.
diff --git a/pages/api/users.ts b/pages/api/users.ts
@@ -1,13 +1,19 @@
 import type { NextApiRequest, NextApiResponse } from "next";
+import { getSession } from "next-auth/react";
+import { MongoClient } from "mongodb";
+
+const client = new MongoClient(process.env.MONGODB_URI || "");
 
 export default async (req: NextApiRequest, res: NextApiResponse) => {
-    try {
-        const response = await fetch("https://api.medina.dev/v1/usernames");
-        const usernames = await response.json();
-        res.send(usernames);
-    } catch (e) {
-        res.send({
-            error: e
-        })
-    }
+  const session = await getSession({ req });
+  if (!session) {
+    return res.status(404).send({
+      message: "Not logged in",
+    });
+  }
+
+  await client.connect();
+  let db = await client.db("auth");
+  let users = await db.collection("users").find().toArray();
+  return res.status(200).send(users);
 };
diff --git a/pages/user/[id].tsx b/pages/user/[id].tsx
@@ -0,0 +1,93 @@
+import React, { useEffect } from "react";
+import { useRouter } from "next/router";
+import Head from "next/head";
+import Navbar from "../../components/Navbar";
+import { MongoClient } from "mongodb";
+import { getSession } from "next-auth/react";
+import { GetServerSideProps, GetServerSidePropsContext } from "next";
+
+type Props = {
+  message: string;
+  user: {
+    name: string;
+    email: string;
+    image: string;
+    bio: string;
+  };
+};
+
+const User = ({ message, user, error }: Props) => {
+  console.log(message, user);
+  const router = useRouter();
+  const { id } = router.query;
+
+  return (
+    <>
+      <Navbar />
+      <div className="flex justify-center items-center w-screen h-[90vh]">
+        <Head>
+          <title>{user?.name} | dnrm</title>
+          <meta name="description" content={`View ${user}'s profile!`} />
+        </Head>
+        {!error ? (
+          <div className="user-info text-center">
+            <div className="image flex justify-center items-center">
+              <img src={user.image} alt="" className="rounded-full" />
+            </div>
+            <h1 className="text-4xl sm:text-6xl md:text-8xl font-bold tracking-tighter">
+              {user?.name}
+            </h1>
+            <p className="text-neutral-500">{user.bio || "No bio yet..."}</p>
+          </div>
+        ) : (
+          <h1 className="text-4xl sm:text-6xl md:text-8xl font-bold tracking-tighter">
+            user not found
+          </h1>
+        )}
+      </div>
+    </>
+  );
+};
+
+export default User;
+
+export async function getServerSideProps(context: GetServerSidePropsContext) {
+  const client = new MongoClient(process.env.MONGODB_URI || "");
+  const session = await getSession(context);
+  if (!session) {
+    return {
+      props: {
+        message: "Not logged in",
+      },
+    };
+  }
+
+  try {
+    await client.connect();
+    let db = await client.db("auth");
+    console.log(context?.params?.id);
+    let user = await db
+      .collection("users")
+      .findOne({ username: context?.params?.id });
+
+    if (!user) {
+      return {
+        props: {
+          error: true,
+        },
+      };
+    }
+
+    return {
+      props: {
+        user: JSON.parse(JSON.stringify(user)),
+      },
+    };
+  } catch (e) {
+    return {
+      props: {
+        error: true,
+      },
+    };
+  }
+}
diff --git a/pages/users/[user].tsx b/pages/users/[user].tsx