From 62087493270ceab9e4bda12b1efc1351a060e008 Mon Sep 17 00:00:00 2001
From: Aamir Azad <82281117+aamirazad@users.noreply.github.com>
Date: Fri, 28 Jun 2024 19:50:32 +0530
Subject: [PATCH] fix: broken top nav on mobile when signed out (#44)

---
 src/components/topnav.tsx | 45 ++++++++++++++++++++++-----------------
 1 file changed, 25 insertions(+), 20 deletions(-)

diff --git a/src/components/topnav.tsx b/src/components/topnav.tsx
index 277dba8..15e63f8 100644
--- a/src/components/topnav.tsx
+++ b/src/components/topnav.tsx
@@ -144,26 +144,31 @@ export function TopNav() {
           <ModeToggle />
         </div>
         {/* Mobile dropdown */}
-        <div className="flex h-full items-center space-x-4 rounded-l rounded-r bg-slate-300 dark:bg-slate-700 md:hidden px-4 -mt-1">
-          <DropdownMenu>
-            <DropdownMenuTrigger>
-              <AlignJustify />
-            </DropdownMenuTrigger>
-            <DropdownMenuContent>
-              <DropdownMenuLabel>Links</DropdownMenuLabel>
-              <DropdownMenuItem asChild>
-                <Link
-                  href="/paperless"
-                  className={buttonVariants({ variant: "link" })}
-                >
-                  Paperless-ngx
-                </Link>
-              </DropdownMenuItem>
-              <ImmichTooltip />
-              <DropdownMenuSeparator />
-            </DropdownMenuContent>
-          </DropdownMenu>
-          <UserSettings />
+        <div className="-mt-1 flex h-full items-center space-x-4 rounded-l rounded-r bg-slate-300 px-4 dark:bg-slate-700 md:hidden">
+          <SignedIn>
+            <DropdownMenu>
+              <DropdownMenuTrigger>
+                <AlignJustify />
+              </DropdownMenuTrigger>
+              <DropdownMenuContent>
+                <DropdownMenuLabel>Links</DropdownMenuLabel>
+                <DropdownMenuItem asChild>
+                  <Link
+                    href="/paperless"
+                    className={buttonVariants({ variant: "link" })}
+                  >
+                    Paperless-ngx
+                  </Link>
+                </DropdownMenuItem>
+                <ImmichTooltip />
+                <DropdownMenuSeparator />
+              </DropdownMenuContent>
+            </DropdownMenu>
+            <UserSettings />
+          </SignedIn>
+          <SignedOut>
+            <SignInButton />
+          </SignedOut>
         </div>
       </div>
     </nav>