From a330baeaa14fe01c8b43f6a5ad48d609e87869fc Mon Sep 17 00:00:00 2001
From: Tim Haasdyk <tim_haasdyk@sil.org>
Date: Thu, 23 Nov 2023 17:03:15 +0100
Subject: [PATCH] Do full page loads for home and logout

---
 frontend/src/hooks.client.ts                             | 2 +-
 frontend/src/hooks.server.ts                             | 2 +-
 frontend/src/hooks.shared.ts                             | 5 +++--
 frontend/src/lib/layout/AppMenu.svelte                   | 2 +-
 frontend/src/lib/user.ts                                 | 9 +++++++++
 .../src/routes/(unauthenticated)/login/+page.server.ts   | 7 +++----
 frontend/src/routes/(unauthenticated)/login/+page.svelte | 5 ++---
 .../src/routes/(unauthenticated)/register/+page.svelte   | 5 ++---
 8 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/frontend/src/hooks.client.ts b/frontend/src/hooks.client.ts
index 794e1c526..a886d68f1 100644
--- a/frontend/src/hooks.client.ts
+++ b/frontend/src/hooks.client.ts
@@ -65,7 +65,7 @@ handleFetch(async ({ fetch, args }) => {
   const response = await traceFetch(async () => {
     const response = await fetch(...args);
 
-    validateFetchResponse(response,
+    await validateFetchResponse(response,
       location.pathname === '/login',
       location.pathname === '/' || location.pathname === '/home' || location.pathname === '/admin');
 
diff --git a/frontend/src/hooks.server.ts b/frontend/src/hooks.server.ts
index 479169f3d..055ac4a0e 100644
--- a/frontend/src/hooks.server.ts
+++ b/frontend/src/hooks.server.ts
@@ -58,7 +58,7 @@ export const handleFetch: HandleFetch = async ({ event, request, fetch }) => {
     const response = await fetch(request);
 
     const routeId = event.route.id ?? '';
-    validateFetchResponse(response,
+    await validateFetchResponse(response,
       routeId.endsWith('/login'),
       routeId.endsWith(AUTHENTICATED_ROOT) || routeId.endsWith('/home') || routeId.endsWith('/admin'));
 
diff --git a/frontend/src/hooks.shared.ts b/frontend/src/hooks.shared.ts
index dce16ebb2..b81737471 100644
--- a/frontend/src/hooks.shared.ts
+++ b/frontend/src/hooks.shared.ts
@@ -1,3 +1,4 @@
+import { goHome } from '$lib/user';
 import { redirect } from '@sveltejs/kit';
 
 const sayWuuuuuuut = 'We\'re not sure what happened.';
@@ -20,7 +21,7 @@ export function getErrorMessage(error: unknown): string {
   );
 }
 
-export function validateFetchResponse(response: Response, isAtLogin: boolean, isHome: boolean): void {
+export async function validateFetchResponse(response: Response, isAtLogin: boolean, isHome: boolean): Promise<void> {
   if (response.status === 401 && !isAtLogin) {
     throw redirect(307, '/logout');
   }
@@ -31,7 +32,7 @@ export function validateFetchResponse(response: Response, isAtLogin: boolean, is
       throw redirect(307, '/logout');
     } else {
       // the user tried to access something they don't have permission for
-      throw redirect(307, '/home');
+      await goHome();
     }
   }
 
diff --git a/frontend/src/lib/layout/AppMenu.svelte b/frontend/src/lib/layout/AppMenu.svelte
index 6c8dca39d..7d932464e 100644
--- a/frontend/src/lib/layout/AppMenu.svelte
+++ b/frontend/src/lib/layout/AppMenu.svelte
@@ -19,7 +19,7 @@
   </header>
 
   <li>
-    <a href="/logout" data-sveltekit-preload-data="tap">
+    <a href="/logout" data-sveltekit-reload>
       {$t('appmenu.log_out')}
       <LogoutIcon />
     </a>
diff --git a/frontend/src/lib/user.ts b/frontend/src/lib/user.ts
index ac393aecf..c425a108c 100644
--- a/frontend/src/lib/user.ts
+++ b/frontend/src/lib/user.ts
@@ -48,6 +48,15 @@ export function getHomePath(user: LexAuthUser | null): string {
   return isAdmin(user) ? '/admin' : '/';
 }
 
+export async function goHome(): Promise<void> {
+  if (browser) {
+    location.pathname = '/home';
+    return new Promise(() => {});
+  } else {
+    throw redirect(307, '/home');
+  }
+}
+
 export async function login(userId: string, password: string): Promise<boolean> {
   const response = await fetch('/api/login', {
     method: 'post',
diff --git a/frontend/src/routes/(unauthenticated)/login/+page.server.ts b/frontend/src/routes/(unauthenticated)/login/+page.server.ts
index f306dee77..e9c71238d 100644
--- a/frontend/src/routes/(unauthenticated)/login/+page.server.ts
+++ b/frontend/src/routes/(unauthenticated)/login/+page.server.ts
@@ -1,9 +1,8 @@
-import { isAuthn } from '$lib/user';
-import { redirect } from '@sveltejs/kit';
+import { goHome, isAuthn } from '$lib/user';
 import type { PageServerLoad } from './$types';
 
-export const load = (({ cookies }) => {
+export const load = (async ({ cookies }) => {
   if (isAuthn(cookies)) {
-    throw redirect(307, '/home');
+    await goHome();
   }
 }) satisfies PageServerLoad
diff --git a/frontend/src/routes/(unauthenticated)/login/+page.svelte b/frontend/src/routes/(unauthenticated)/login/+page.svelte
index 5a198194c..887d1cfce 100644
--- a/frontend/src/routes/(unauthenticated)/login/+page.svelte
+++ b/frontend/src/routes/(unauthenticated)/login/+page.svelte
@@ -1,9 +1,8 @@
 <script lang="ts">
-  import { goto } from '$app/navigation';
   import { SubmitButton, Form, FormError, Input, lexSuperForm } from '$lib/forms';
   import t from '$lib/i18n';
   import { PageHeader } from '$lib/layout';
-  import { login, logout } from '$lib/user';
+  import { goHome, login, logout } from '$lib/user';
   import { onMount } from 'svelte';
   import SvelteMarkdown from 'svelte-markdown';
   import flexLogo from '$lib/assets/flex-logo.png';
@@ -20,7 +19,7 @@
     formSchema,
     async () => {
       if (await login($form.email, $form.password)) {
-        await goto('/home');
+        await goHome();
         return;
       }
       $message = $t('login.bad_credentials');
diff --git a/frontend/src/routes/(unauthenticated)/register/+page.svelte b/frontend/src/routes/(unauthenticated)/register/+page.svelte
index f6c72f5b9..90cf5cfa0 100644
--- a/frontend/src/routes/(unauthenticated)/register/+page.svelte
+++ b/frontend/src/routes/(unauthenticated)/register/+page.svelte
@@ -1,10 +1,9 @@
 <script lang="ts">
-  import { goto } from '$app/navigation';
   import { SubmitButton, FormError, Input, ProtectedForm, lexSuperForm } from '$lib/forms';
   import { passwordFormRules } from '$lib/forms/utils';
   import t from '$lib/i18n';
   import { Page } from '$lib/layout';
-  import { register } from '$lib/user';
+  import { goHome, register } from '$lib/user';
   import { z } from 'zod';
 
   let turnstileToken = '';
@@ -26,7 +25,7 @@
       return;
     }
     if (user) {
-      await goto('/home');
+      await goHome();
       return;
     }
     throw new Error('Unknown error, no error from server, but also no user.');