refac: hardening pass with multiple overhauls

web/src/views/AcceptInviteView.vue

@@ -9,7 +9,7 @@ import { ApiError, useApi } from '@/composables/useApi'
 import { VERIFIED_REDIRECT_DELAY_MS, wait } from '@/lib/verifiedRedirect'
 import { useSessionStore } from '@/stores/session'
 
-type InviteState = 'checking' | 'form' | 'invalid' | 'expired' | 'success'
+type InviteState = 'checking' | 'form' | 'invalid' | 'expired' | 'failed' | 'success'
 
 const EMAIL_HAS_ACCOUNT_MESSAGE = 'This address already has an account.'
 const USERNAME_TAKEN_MESSAGE = 'That username is taken. Try another.'
@@ -100,6 +100,7 @@ function applyDeadLinkStatus(error: unknown): boolean {
 }
 
 async function loadInvite() {
+	state.value = 'checking'
 	try {
 		const invite = await api.request<{ email: string }>(
 			`/v1/auth/invite?c=${encodeURIComponent(code)}`,
@@ -108,7 +109,9 @@ async function loadInvite() {
 		inviteEmail.value = invite.email
 		state.value = 'form'
 	} catch (error) {
-		applyDeadLinkStatus(error)
+		if (!applyDeadLinkStatus(error)) {
+			state.value = 'failed'
+		}
 	}
 }
 
@@ -203,6 +206,28 @@ onMounted(() => {
 				<p class="text-base text-muted">This only takes a moment.</p>
 			</div>
 
+			<div v-else-if="state === 'failed'" class="flex flex-col gap-4.5">
+				<UAlert
+					color="error"
+					icon="i-lucide-circle-x"
+					title="Couldn't check your invite"
+					description="Something went wrong on the server. Try again in a moment."
+					variant="soft"
+					:close="false"
+					role="alert"
+				/>
+				<UButton
+					block
+					color="neutral"
+					variant="outline"
+					:size="controlSize"
+					:ui="{ base: controlClass }"
+					@click="loadInvite"
+				>
+					Try again
+				</UButton>
+			</div>
+
 			<ResultPanel
 				v-else-if="state === 'invalid'"
 				tone="error"