From efbec1419ef4920816fb94330c38880b564ca1b1 Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Tue, 19 Mar 2024 17:45:33 +0000
Subject: feature: A new landing page

---
 apps/web/app/page.tsx                       |   7 ++-
 apps/web/components/landing/LandingPage.tsx |  91 ++++++++++++++++++++++++++++
 apps/web/public/landing/app-store-badge.png | Bin 0 -> 16782 bytes
 apps/web/public/landing/extension-badge.png | Bin 0 -> 9171 bytes
 apps/web/public/landing/screenshot.png      | Bin 0 -> 3196208 bytes
 5 files changed, 95 insertions(+), 3 deletions(-)
 create mode 100644 apps/web/components/landing/LandingPage.tsx
 create mode 100644 apps/web/public/landing/app-store-badge.png
 create mode 100644 apps/web/public/landing/extension-badge.png
 create mode 100644 apps/web/public/landing/screenshot.png

(limited to 'apps')

diff --git a/apps/web/app/page.tsx b/apps/web/app/page.tsx
index ca076cbf..d86c91be 100644
--- a/apps/web/app/page.tsx
+++ b/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 />;
 }
diff --git a/apps/web/components/landing/LandingPage.tsx b/apps/web/components/landing/LandingPage.tsx
new file mode 100644
index 00000000..cf8e8abd
--- /dev/null
+++ b/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>
+  );
+}
diff --git a/apps/web/public/landing/app-store-badge.png b/apps/web/public/landing/app-store-badge.png
new file mode 100644
index 00000000..059e2133
Binary files /dev/null and b/apps/web/public/landing/app-store-badge.png differ
diff --git a/apps/web/public/landing/extension-badge.png b/apps/web/public/landing/extension-badge.png
new file mode 100644
index 00000000..224c12bf
Binary files /dev/null and b/apps/web/public/landing/extension-badge.png differ
diff --git a/apps/web/public/landing/screenshot.png b/apps/web/public/landing/screenshot.png
new file mode 100644
index 00000000..d4403659
Binary files /dev/null and b/apps/web/public/landing/screenshot.png differ
-- 
cgit v1.2.3-70-g09d2