feature: A new landing page

apps/web/app/page.tsx

@@ -1,12 +1,13 @@
 import { redirect } from "next/navigation";
+import LandingPage from "@/components/landing/LandingPage";
 import { getServerAuthSession } from "@/server/auth";
 
 export default async function Home() {
   // TODO: Home currently just redirects between pages until we build a proper landing page
   const session = await getServerAuthSession();
-  if (!session) {
-    redirect("/signin");
+  if (session) {
+    redirect("/dashboard/bookmarks");
   }
 
-  redirect("/dashboard/bookmarks");
+  return <LandingPage />;
 }

apps/web/components/landing/LandingPage.tsx

@@ -0,0 +1,91 @@
+import Image from "next/image";
+import Link from "next/link";
+import { cn } from "@/lib/utils";
+import screenshot from "@/public/landing/screenshot.png";
+import { ExternalLink, Github, PackageOpen } from "lucide-react";
+
+import { Button, buttonVariants } from "../ui/button";
+
+const GITHUB_LINK = "https://github.com/MohamedBassem/hoarder-app";
+
+function NavBar() {
+  return (
+    <div className="flex justify-between px-3 py-4">
+      <div className="flex items-center justify-center gap-x-2">
+        <PackageOpen size="40" className="" />
+        <p className="text-2xl">Hoarder</p>
+      </div>
+      <div className="hidden gap-10 sm:flex">
+        <Link href="#" className="flex justify-center gap-2 text-center">
+          Docs
+        </Link>
+        <Link
+          href={GITHUB_LINK}
+          className="flex justify-center gap-2 text-center"
+        >
+          Github <ExternalLink />
+        </Link>
+      </div>
+    </div>
+  );
+}
+
+function Hero() {
+  return (
+    <div className="mt-32 flex flex-grow flex-col items-center justify-center gap-4">
+      <div className="mt-4 w-full space-y-6 text-center">
+        <p className="text-center text-5xl font-bold">
+          The{" "}
+          <span className="bg-gradient-to-r from-purple-600 to-red-600 bg-clip-text text-transparent">
+            Bookmark Everything
+          </span>{" "}
+          App
+        </p>
+        <div className="mx-auto w-full gap-2 text-xl md:w-3/5">
+          <p className="text-center text-gray-400">
+            Quickly save links, notes, and images and hoarder will automatically
+            tag them for you using AI for faster retrieval. Built for the data
+            hoarders out there!
+          </p>
+          <p className="text-center text-gray-400">
+            Open source, and self hostable!
+          </p>
+        </div>
+      </div>
+      <div className="flex h-10 gap-4">
+        <Button className="h-full w-28" variant="default">
+          Demo
+        </Button>
+        <Link
+          href={GITHUB_LINK}
+          className={cn(
+            "flex h-full w-28 gap-2",
+            buttonVariants({ variant: "outline" }),
+          )}
+        >
+          <Github /> Github
+        </Link>
+      </div>
+    </div>
+  );
+}
+
+function Screenshots() {
+  return (
+    <div className="mx-auto mt-6 w-11/12">
+      <Image alt="screenshot" src={screenshot} />
+    </div>
+  );
+}
+
+export default function LandingPage() {
+  return (
+    <div className="flex min-h-screen flex-col">
+      <div className="container flex flex-col pb-10">
+        <NavBar />
+        <Hero />
+      </div>
+      <Screenshots />
+    </div>
+  );
+}