feat: update session cookie options and enhance authentication flow

- Changed SameSite attribute for session cookies from 'strict' to 'lax' to allow cross-origin fetches, improving compatibility with various client requests.
- Updated cookie clearing logic in the authentication route to use `res.cookie()` for better reliability in cross-origin environments.
- Refactored the login view to implement a state machine for managing authentication phases, enhancing clarity and maintainability.
- Introduced a new logged-out view to inform users of session expiration and provide options to log in or retry.
- Added account and security sections to the settings view, allowing users to manage their account and security preferences more effectively.
This commit is contained in:
webdevcody
2026-01-07 12:55:23 -05:00
parent 927451013c
commit 70c04b5a3f
20 changed files with 895 additions and 304 deletions

View File

@@ -0,0 +1,33 @@
import { useNavigate } from '@tanstack/react-router';
import { Button } from '@/components/ui/button';
import { LogOut, RefreshCcw } from 'lucide-react';
export function LoggedOutView() {
const navigate = useNavigate();
return (
<div className="flex min-h-screen items-center justify-center bg-background p-4">
<div className="w-full max-w-md space-y-8">
<div className="text-center">
<div className="mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-primary/10">
<LogOut className="h-8 w-8 text-primary" />
</div>
<h1 className="mt-6 text-2xl font-bold tracking-tight">Youve been logged out</h1>
<p className="mt-2 text-sm text-muted-foreground">
Your session expired, or the server restarted. Please log in again.
</p>
</div>
<div className="space-y-3">
<Button className="w-full" onClick={() => navigate({ to: '/login' })}>
Go to login
</Button>
<Button className="w-full" variant="secondary" onClick={() => window.location.reload()}>
<RefreshCcw className="mr-2 h-4 w-4" />
Retry
</Button>
</div>
</div>
</div>
);
}