feat: added auth to navbar

beat-forge · Aug 10, 2023 · 9feeccc · 9feeccc
1 parent 32aa0a4
commit 9feeccc
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 2 deletions.
diff --git a/apps/web/src/lib/components/layout/NavBar.svelte b/apps/web/src/lib/components/layout/NavBar.svelte
@@ -1,5 +1,11 @@
 <script>
 	import { Link } from 'ui/link';
+	import { Button } from 'ui/button';
+	import { env } from '$env/dynamic/public';
+	import { isAuthenticated, user } from '$lib/stores/user';
+
+	$: isAuthenticated;
+	$: user;
 </script>
 
 <div class="beatforge-page-navbar flex w-full items-center py-8 px-4 mx-auto max-w-7xl z-[100] text-sm font-bold">
@@ -8,8 +14,25 @@
 	</Link>
 
 	<div class="ml-auto mr-4 flex flex-row gap-8 items-center">
-		<Link variant="text" href="https://discord.gg/HTVrjFENaZ" external>
-			Discord
+		<Link variant="text" href="/discover">
+			Discover Mods
 		</Link>
+		{#if $isAuthenticated}
+			<Link variant="text" href="/dashboard">
+				<Button variant="secondary" disabled={false}>
+					{user.username}
+					<img slot="trailing" alt="user icon" src={user.avatar} draggable="false" class="w-10 h-10 rounded-full">
+				</Button>
+			</Link>
+		{:else}
+			<Link variant="text" href="https://discord.gg/HTVrjFENaZ" external>
+				Discord
+			</Link>
+			<Link variant="text" href={env.PUBLIC_GITHUB_CALL_URL}>
+				<Button variant="secondary" disabled={false}>
+					Login
+				</Button>
+			</Link>
+		{/if}
 	</div>
 </div>
diff --git a/apps/web/src/lib/stores/user.ts b/apps/web/src/lib/stores/user.ts
@@ -0,0 +1,4 @@
+import { writable } from "svelte/store";
+
+export const isAuthenticated = writable(false);
+export const user = writable(null);