Header auth fix

README.md

@@ -136,7 +136,7 @@ SMTP does not need to be configured for the app to function. SMTP enables inviti
 If you have a reverse proxy you want to use to login your users, you do it via our proxy authentication method. To configure this method, your proxy must send HTTP headers containing the name, username and email for the logged in user.
 You configure this using environment variables.
 
-`HEADER_AUTH`: Enable proxy authentication
+`HEADER_AUTH_ENABLED`: Enable proxy authentication
 
 `HEADER_USERNAME`: The name of the headers that contains the username of the user
 

src/app.d.ts

@@ -7,6 +7,7 @@ declare global {
         // Locals must be an interface and not a type
         interface Locals {
             user: import("lucia").User | null;
+            isProxyUser: boolean;
             session: import("lucia").Session | null;
         }
     }

src/hooks.server.ts

@@ -1,3 +1,4 @@
+import { env } from "$env/dynamic/private";
 import { auth } from "$lib/server/auth";
 import type { Handle } from "@sveltejs/kit";
 
@@ -24,6 +25,12 @@ export const handle: Handle = async ({ event, resolve }) => {
             ...sessionCookie.attributes
         });
     }
+    const isProxyUser =
+        (env.HEADER_AUTH_ENABLED ?? "false") == "true" &&
+        !!env.HEADER_USERNAME &&
+        !!event.request.headers.get(env.HEADER_USERNAME);
+
+    event.locals.isProxyUser = isProxyUser;
     event.locals.user = user;
     event.locals.session = session;
     return resolve(event);

src/lib/components/navigation/NavBar.svelte

@@ -10,9 +10,10 @@
     interface Props {
         navItems: NavItem[];
         user: User | null;
+        isProxyUser: boolean;
     }
 
-    let { navItems, user }: Props = $props();
+    let { navItems, user, isProxyUser }: Props = $props();
 
     const drawerStore = getDrawerStore();
     const drawerSettings: DrawerSettings = {
@@ -61,6 +62,6 @@
     {/if}
 
     {#snippet trail()}
-        <NavMenu {user} />
+        <NavMenu {isProxyUser} {user} />
     {/snippet}
 </AppBar>

src/lib/components/navigation/NavMenu/NavMenu.svelte

@@ -8,9 +8,10 @@
 
     interface Props {
         user: User | null;
+        isProxyUser: boolean;
     }
 
-    let { user }: Props = $props();
+    let { user, isProxyUser }: Props = $props();
 
     const menuSettings: PopupSettings = {
         event: "click",
@@ -43,20 +44,21 @@
 
                     <hr />
                     <GroupSubMenu {user} />
-                    <hr />
-
-                    <li>
-                        <button
-                            class="list-option w-full"
-                            onclick={async () => {
-                                await fetch("/logout", { method: "POST" });
-                                invalidateAll();
-                            }}
-                        >
-                            <iconify-icon icon="ion:log-out"></iconify-icon>
-                            <p>Sign Out</p>
-                        </button>
-                    </li>
+                    {#if !isProxyUser}
+                        <hr />
+                        <li>
+                            <button
+                                class="list-option w-full"
+                                onclick={async () => {
+                                    await fetch("/logout", { method: "POST" });
+                                    invalidateAll();
+                                }}
+                            >
+                                <iconify-icon icon="ion:log-out"></iconify-icon>
+                                <p>Sign Out</p>
+                            </button>
+                        </li>
+                    {/if}
                     <hr class="pb-1" />
                     <li>
                         <div class="flex w-full justify-around">

src/routes/+layout.server.ts

@@ -1,5 +1,5 @@
 import type { LayoutServerLoad } from "./$types";
 
 export const load = (async ({ locals }) => {
-    return { user: locals.user };
+    return { user: locals.user, isProxyUser: locals.isProxyUser };
 }) satisfies LayoutServerLoad;

src/routes/+layout.svelte

@@ -98,7 +98,7 @@
         {#if showNavigationLoadingBar}
             <NavigationLoadingBar />
         {/if}
-        <NavBar {navItems} user={data.user} />
+        <NavBar isProxyUser={data.isProxyUser} {navItems} user={data.user} />
     </header>
 
     <main id="main" class="h-full min-h-screen px-4 py-4 md:px-12 lg:px-32 xl:px-56">

src/routes/account/+page.server.ts

@@ -1,4 +1,3 @@
-import { env } from "$env/dynamic/private";
 import { auth } from "$lib/server/auth";
 import { client } from "$lib/server/prisma";
 import { getResetPasswordSchema } from "$lib/validations";
@@ -9,20 +8,15 @@ import type { PrismaClientKnownRequestError } from "@prisma/client/runtime/libra
 import { createImage, tryDeleteImage } from "$lib/server/image-util";
 import { LegacyScrypt } from "lucia";
 
-export const load: PageServerLoad = async ({ locals, request }) => {
+export const load: PageServerLoad = async ({ locals }) => {
     const user = locals.user;
     if (!user) {
         redirect(302, `/login?ref=/account`);
     }
 
-    const isProxyUser =
-        (env.HEADER_AUTH_ENABLED ?? "false") == "true" &&
-        !!env.HEADER_USERNAME &&
-        !!request.headers.get(env.HEADER_USERNAME);
-
     return {
         user,
-        isProxyUser
+        isProxyUser: locals.isProxyUser
     };
 };