SessionExpiredDialog
src/lib/components/auth/SessionExpiredDialog.svelte
Purpose
A modal that appears when the user's session expires mid-task. It embeds
a LoginForm so the user can
re-authenticate without leaving the page; on success it closes the
dialog, drains the queue of pending API requests, and retries each one
with a _sessionRetry flag. On repeated failure it offers a "go to
login" fallback that preserves the current URL as a redirect.
Origin
Custom — Primebrick-written. Uses the shadcn-svelte™ Dialog +
Button + Alert, @lucide/svelte's ShieldUser icon, the
sessionExpiredStore, and the redirect cache in
$lib/auth/redirect-cache. Not vendored from any registry.
Usage
Mount once
Code
The component takes no props. Its visibility is bound to
sessionExpiredStore.isOpen, which is toggled by the API layer when a
request returns 401.
How it wires LoginForm
Code
handleLoginSuccess closes the dialog, drains
sessionExpiredStore.drainPending(), and retries each queued request
with _sessionRetry: true so the API layer does not re-trigger the
dialog. handleLoginError flips sessionExpiredStore.hasFailedAttempt,
which surfaces a destructive alert and a "go to login" button.
Behavior
- Controlled by the store:
bind:open={sessionExpiredStore.isOpen}— the dialog opens/closes purely through the store. - Failed attempt: when
hasFailedAttemptis set, a destructiveAlertis shown and the footer renders a "go to login" button. - Go to login:
saveRedirectUrlstasheswindow.location.pathname + window.location.search, then navigates to/loginso the login page can redirect back after success. - Inline retry: successful re-auth drains the pending request queue and resolves/rejects each original promise, so callers are unaware the session was ever expired.
Props
Full prop table: see API reference — sessionexpireddialog.
This component takes no props.