remember me with max age 30 days :).
This commit is contained in:
@@ -9,6 +9,7 @@ import { useTranslations } from 'next-intl';
|
||||
import { Link } from '@/i18n/navigation';
|
||||
import { Mail, Lock } from 'lucide-react';
|
||||
import { useAuth } from '@/lib/hooks/useAuth';
|
||||
import { getRememberedEmail } from '@/lib/auth/rememberMe';
|
||||
import { Button } from '@/components/ui/shared/Button';
|
||||
import { Input } from '@/components/ui/shared/Input';
|
||||
import { TopBarControls } from '@/components/ui/shared/TopBarControls';
|
||||
@@ -16,6 +17,7 @@ import { TopBarControls } from '@/components/ui/shared/TopBarControls';
|
||||
type LoginForm = {
|
||||
email: string;
|
||||
password: string;
|
||||
rememberMe: boolean;
|
||||
};
|
||||
|
||||
export default function LoginPage() {
|
||||
@@ -25,12 +27,14 @@ export default function LoginPage() {
|
||||
const { login, isLoading, user, isAuthReady } = useAuth();
|
||||
const router = useRouter();
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [savedEmail] = useState(() => getRememberedEmail());
|
||||
|
||||
const loginSchema = useMemo(
|
||||
() =>
|
||||
z.object({
|
||||
email: z.string().email(tValidation('emailInvalid')),
|
||||
password: z.string().min(1, tValidation('passwordRequired')),
|
||||
rememberMe: z.boolean(),
|
||||
}),
|
||||
[tValidation],
|
||||
);
|
||||
@@ -47,12 +51,16 @@ export default function LoginPage() {
|
||||
formState: { errors },
|
||||
} = useForm<LoginForm>({
|
||||
resolver: zodResolver(loginSchema),
|
||||
defaultValues: {
|
||||
email: savedEmail,
|
||||
rememberMe: Boolean(savedEmail),
|
||||
},
|
||||
});
|
||||
|
||||
const onSubmit = async (data: LoginForm) => {
|
||||
try {
|
||||
setError(null);
|
||||
await login(data.email, data.password);
|
||||
await login(data.email, data.password, data.rememberMe);
|
||||
} catch (err: unknown) {
|
||||
const message = err instanceof Error ? err.message : t('invalidCredentials');
|
||||
setError(message || t('invalidCredentials'));
|
||||
@@ -112,9 +120,9 @@ export default function LoginPage() {
|
||||
<div className="flex items-center">
|
||||
<input
|
||||
id="remember-me"
|
||||
name="remember-me"
|
||||
type="checkbox"
|
||||
className="h-4 w-4 rounded border-border bg-background-secondary text-primary focus:ring-primary/40"
|
||||
{...register('rememberMe')}
|
||||
/>
|
||||
<label htmlFor="remember-me" className="ml-2 block text-sm text-text-secondary">
|
||||
{t('rememberMe')}
|
||||
|
||||
14
frontend/src/lib/auth/rememberMe.ts
Normal file
14
frontend/src/lib/auth/rememberMe.ts
Normal file
@@ -0,0 +1,14 @@
|
||||
const REMEMBERED_EMAIL_KEY = 'rememberedEmail';
|
||||
|
||||
export function getRememberedEmail(): string {
|
||||
if (typeof window === 'undefined') return '';
|
||||
return localStorage.getItem(REMEMBERED_EMAIL_KEY) ?? '';
|
||||
}
|
||||
|
||||
export function setRememberedEmail(email: string): void {
|
||||
localStorage.setItem(REMEMBERED_EMAIL_KEY, email);
|
||||
}
|
||||
|
||||
export function clearRememberedEmail(): void {
|
||||
localStorage.removeItem(REMEMBERED_EMAIL_KEY);
|
||||
}
|
||||
@@ -4,6 +4,11 @@ import React, { createContext, useCallback, useContext, useEffect, useMemo, useS
|
||||
import { useTranslations } from 'next-intl';
|
||||
import { useRouter } from '@/i18n/navigation';
|
||||
import { authApi } from '@/lib/api/auth';
|
||||
import {
|
||||
clearRememberedEmail,
|
||||
getRememberedEmail,
|
||||
setRememberedEmail,
|
||||
} from '@/lib/auth/rememberMe';
|
||||
import { User, Organization } from '@/types/organization';
|
||||
import { isAppLocale, getLocaleFromPathname } from '@/i18n/routing';
|
||||
|
||||
@@ -22,7 +27,7 @@ interface AuthContextType {
|
||||
organizationEmail: string,
|
||||
organizationType: 'CLINIC' | 'LAB'
|
||||
) => Promise<void>;
|
||||
login: (email: string, password: string) => Promise<void>;
|
||||
login: (email: string, password: string, rememberMe?: boolean) => Promise<void>;
|
||||
logout: () => Promise<void>;
|
||||
selectOrganization: (orgId: string) => Promise<void>;
|
||||
createOrganization: (
|
||||
@@ -196,12 +201,22 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
|
||||
}, [applyUrlLocaleToUser, router, t]);
|
||||
|
||||
// ✅ LOGIN
|
||||
const login = useCallback(async (email: string, password: string) => {
|
||||
const login = useCallback(async (
|
||||
email: string,
|
||||
password: string,
|
||||
rememberMe = false,
|
||||
) => {
|
||||
try {
|
||||
setIsLoading(true);
|
||||
setError(null);
|
||||
|
||||
const response = await authApi.login({ email, password });
|
||||
const response = await authApi.login({ email, password, rememberMe });
|
||||
|
||||
if (rememberMe) {
|
||||
setRememberedEmail(email);
|
||||
} else {
|
||||
clearRememberedEmail();
|
||||
}
|
||||
|
||||
const userData = await applyUrlLocaleToUser(response.data.user);
|
||||
setUser(userData);
|
||||
@@ -235,7 +250,11 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
|
||||
} catch (err) {
|
||||
console.error('Logout API failed:', err);
|
||||
} finally {
|
||||
const rememberedEmail = getRememberedEmail();
|
||||
localStorage.clear();
|
||||
if (rememberedEmail) {
|
||||
setRememberedEmail(rememberedEmail);
|
||||
}
|
||||
setUser(null);
|
||||
setOrganizations([]);
|
||||
setCurrentOrganization(null);
|
||||
|
||||
@@ -22,4 +22,5 @@ export interface TrialRegistrationData {
|
||||
export interface LoginData {
|
||||
email: string;
|
||||
password: string;
|
||||
rememberMe?: boolean;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user