ezpie1 · EzpieCo · Feb 17, 2025 · Nov 25, 2024 · Nov 26, 2024 · Nov 26, 2024
diff --git a/README.md b/README.md
diff --git a/cypress.config.ts b/cypress.config.ts
diff --git a/cypress/e2e/Auth.cy.ts b/cypress/e2e/Auth.cy.ts
diff --git a/cypress/e2e/PostingBlog.cy.ts b/cypress/e2e/PostingBlog.cy.ts
diff --git a/cypress/support/commands.ts b/cypress/support/commands.ts
diff --git a/cypress/support/e2e.ts b/cypress/support/e2e.ts
diff --git a/next.config.js b/next.config.js
@@ -1,4 +1,6 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {};
+const nextConfig = {
+  reactStrictMode: false,
+};
 
 module.exports = nextConfig;
diff --git a/package.json b/package.json
@@ -6,8 +6,7 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint",
-    "cypress:open": "npx cypress open"
+    "lint": "next lint"
   },
   "dependencies": {
     "@supabase/auth-helpers-nextjs": "^0.8.1",
@@ -34,4 +33,4 @@
     "tailwindcss": "^3",
     "typescript": "^5"
   }
-}
+}
diff --git a/public/logos/logo.svg b/public/logos/logo.svg
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -16,6 +16,7 @@ export default async function RootLayout({
 }) {
   // Used for checking if the user is authenticated or not. If yes then display the navbars
   const supabase = createServerComponentClient({ cookies });
+
   const {
     data: { session },
   } = await supabase.auth.getSession();
@@ -24,11 +25,11 @@ export default async function RootLayout({
     <html lang="en">
       <head>
         <link rel="icon" href="/logos/logo.svg" />
-        <title>Lambda</title>
+        <title>Privatus</title>
       </head>
-      <body className="w-[100vw] overflow-x-hidden">
+      <body>
         {session && <NavBar />}
-        <main className="mb-20">{children}</main>
+        <main>{children}</main>
         <Analytics />
       </body>
     </html>

diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx
@@ -6,7 +6,7 @@ import LogInForm from "@/components/Auth/LogInForm";
 import Separator from "@/components/form/separator";
 
 // StyleSheet used for styling the form
-import "@/styles/form.css";
+import "@/styles/auth/auth.css";
 
 // Tell's vercel that this is a dynamic function
 export const dynamic = "force-dynamic";
@@ -22,9 +22,20 @@ export default async function LogIn() {
   }
 
   return (
-    <div>
-      <div className="form-wrapper">
-        <h1 className="text-4xl">LogIn Using Your Lambda Account</h1>
+    <div className="flex mx-9 mt-16 justify-between">
+      <div className="default-text">
+        <section>
+          <h1 className="main-text">Privatus</h1>
+          <p>The Social Media App</p>
+          <p>That values privacy</p>
+        </section>
+        <section className="grid mt-16">
+          <p>It&apos;s <span className="main-text">Open-source</span></p>
+          <p className="justify-self-center">and</p>
+          <p className="main-text justify-self-center">Privacy based</p>
+        </section>
+      </div>
+      <div className="w-1/2">
         <LogInForm />
         <Separator displayText="SignUp" redirectLink="signup" />
       </div>

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -3,7 +3,7 @@ import { cookies } from "next/headers";
 import { redirect } from "next/navigation";
 import { createServerComponentClient } from "@supabase/auth-helpers-nextjs";
 
-import Posts from "@/components/HomePage/DisplayPost";
+import HomePage from "@/components/HomePage/HomePageRenderer";
 
 // Tell's vercel that this is a dynamic function
 export const dynamic = "force-dynamic";
@@ -21,31 +21,25 @@ export default async function Home() {
     redirect("/login");
   }
 
-  // get the posts in latest order
-  const { data: latestPosts } = await supabase
-    .from("Blogs")
-    .select("*, author: profiles(*)")
-    .order("created_at", { ascending: false });
-
   // get the posts in most liked order
   const { data: popularPosts } = await supabase
     .from("Blogs")
     .select("*, author: profiles(*)")
     .order("likes", { ascending: false });
 
-  /* eslint-disable max-len */
-  return (
-    <RenderedContent latestPostsList={latestPosts || []} popularPostsList={popularPosts || []} />
-  );
-}
+  // get current logged in username
+  const { data: loggedInUser } = await supabase.auth.getUser();
+  const userID = loggedInUser.user?.id
+  const { data: loggedInUsername } = await supabase
+  .from("profiles")
+  .select("username")
+  .eq("id", String(userID))
+  .single();
 
-function RenderedContent({latestPostsList, popularPostsList}: {latestPostsList: postWithAuthor[], popularPostsList: postWithAuthor[]}) {
+  const username = String(loggedInUsername?.username)
+
+  /* eslint-disable max-len */
   return (
-    <div className="m-12 flex flex-col items-center">
-      <Posts
-        latestPosts={latestPostsList || []}
-        popularPosts={popularPostsList || []}
-      />
-    </div>
+    <HomePage popularPosts={popularPosts || []} loggedInUsername={username}/>
   );
-}
+}
diff --git a/src/app/post/[postId]/PostPageRenderer.tsx b/src/app/post/[postId]/PostPageRenderer.tsx
@@ -0,0 +1,53 @@
+"use client";
+
+import Link from "next/link";
+
+import Like from "@/components/Post/LikeBtn";
+import Formatter from "@/components/Post/MarkupFormatter";
+import SideBar from "@/components/Banners/SideBar";
+
+import "@/styles/PostPage/PostPage.css";
+
+interface Props {
+  post: postWithAuthor;
+  loggedInUsername: string | undefined;
+}
+
+export default function PostRenderer({ post, loggedInUsername }: Props) {
+
+  return (
+    <>
+      <nav className="sidebar">
+        <SideBar
+          loggedInUsername={String(loggedInUsername)}
+        />
+      </nav>
+      <section className="post p-5">
+        <div className="mb-10">
+          <h1 className="font-anonymous mb-8 text-2xl font-extrabold">
+            {post.title}
+          </h1>
+          <div className="post-content">
+            {post.content && <Formatter postContent={post.content} />}
+          </div>
+        </div>
+        <div>
+          <Like post={post} />
+        </div>
+      </section>
+      <section className="w-80">
+        <p>
+          <Link
+            href={`/user/${post.author?.username}`}
+            className="font-anonymous hover:underline"
+          >
+            {post.author?.username}
+          </Link>
+        </p>
+        <p className="font-inter text-sm text-neural-300">
+          {post.author?.description}
+        </p>
+      </section>
+    </>
+  )
+}