From 953151d253bc927c7a09426d05b2315a442ca197 Mon Sep 17 00:00:00 2001
From: MohamedBassem <me@mbassem.com>
Date: Thu, 21 Mar 2024 05:05:07 +0000
Subject: [PATCH] landing: Add the demo link to the landing page and mention it
 in the docs

---
 apps/landing/app/page.tsx | 15 ++++++++++++---
 docs/docs/01-intro.md     | 12 ++++++++++++
 docs/docusaurus.config.ts | 24 ++++++++++++------------
 3 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/apps/landing/app/page.tsx b/apps/landing/app/page.tsx
index 1c852b80..9a7b023c 100644
--- a/apps/landing/app/page.tsx
+++ b/apps/landing/app/page.tsx
@@ -1,12 +1,13 @@
 import Image from "next/image";
 import Link from "next/link";
-import { Button, buttonVariants } from "@/components/ui/button";
+import { buttonVariants } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
 import screenshot from "@/public/screenshot.png";
 import { ExternalLink, Github, PackageOpen } from "lucide-react";
 
 const GITHUB_LINK = "https://github.com/MohamedBassem/hoarder-app";
 const DOCS_LINK = "https://docs.hoarder.app";
+const DEMO_LINK = "https://try.hoarder.app";
 
 function NavBar() {
   return (
@@ -56,11 +57,19 @@ function Hero() {
         </div>
       </div>
       <div className="flex h-10 gap-4">
-        <Button className="h-full w-28" variant="default">
+        <Link
+          href={DEMO_LINK}
+          target="_blank"
+          className={cn(
+            "flex h-full w-28 gap-2",
+            buttonVariants({ variant: "default" }),
+          )}
+        >
           Demo
-        </Button>
+        </Link>
         <Link
           href={GITHUB_LINK}
+          target="_blank"
           className={cn(
             "flex h-full w-28 gap-2",
             buttonVariants({ variant: "outline" }),
diff --git a/docs/docs/01-intro.md b/docs/docs/01-intro.md
index 2de4c88b..7418bbb6 100644
--- a/docs/docs/01-intro.md
+++ b/docs/docs/01-intro.md
@@ -22,3 +22,15 @@ Hoarder is an open source "Bookmark Everything" app that uses AI for automatical
 - [Planned] Archiving the content for offline reading.
 
 **⚠️ This app is under heavy development and it's far from stable.**
+
+
+## Demo
+
+You can access the demo at [https://try.hoarder.app](https://try.hoarder.app). Login with the following creds:
+
+```
+email: demo@hoarder.app
+password: demodemo
+```
+
+The demo is seeded with some content, but it's in read-only mode to prevent abuse.
diff --git a/docs/docusaurus.config.ts b/docs/docusaurus.config.ts
index b1414661..4b1fb920 100644
--- a/docs/docusaurus.config.ts
+++ b/docs/docusaurus.config.ts
@@ -76,7 +76,7 @@ const config: Config = {
           title: 'Docs',
           items: [
             {
-              label: 'Tutorial',
+              label: 'Introduction',
               to: '/',
             },
           ],
@@ -85,30 +85,30 @@ const config: Config = {
           title: 'Community',
           items: [
             {
-              label: 'Stack Overflow',
-              href: 'https://stackoverflow.com/questions/tagged/docusaurus',
-            },
-            {
-              label: 'Discord',
-              href: 'https://discordapp.com/invite/docusaurus',
-            },
-            {
-              label: 'Twitter',
-              href: 'https://twitter.com/docusaurus',
+              label: 'GitHub',
+              href: 'https://github.com/MohamedBassem/hoarder-app',
             },
           ],
         },
         {
           title: 'More',
           items: [
+            {
+              label: 'Homepage',
+              href: 'https://hoarder.app',
+            },
             {
               label: 'GitHub',
               href: 'https://github.com/MohamedBassem/hoarder-app',
             },
+            {
+              label: 'Demo',
+              href: 'https://try.hoarder.app',
+            },
           ],
         },
       ],
-      copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`,
+      copyright: `Copyright © ${new Date().getFullYear()} Hoarder App. Built with Docusaurus.`,
     },
     prism: {
       theme: prismThemes.github,