feat: add Remember Me checkbox with 15-day auto-logout

This commit is contained in:
nmemmert committed 2026-01-16 09:00:06 -05:00
1 parent 52fd7e7c00
commit a3bdb11ad7
2 files changed
+41

No files matched your search

+21
View File
@@ -8,6 +8,7 @@ export default function Login() {
const [password, setPassword] = useState(''); const [password, setPassword] = useState('');
const [confirmPassword, setConfirmPassword] = useState(''); const [confirmPassword, setConfirmPassword] = useState('');
const [isSignup, setIsSignup] = useState(false); const [isSignup, setIsSignup] = useState(false);
const [rememberMe, setRememberMe] = useState(false);
const [error, setError] = useState(''); const [error, setError] = useState('');
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const { login, signup } = useAuth(); const { login, signup } = useAuth();
@@ -31,6 +32,12 @@ export default function Login() {
} else { } else {
try { try {
await login(email, password); await login(email, password);
// Store remember me timestamp if checked
if (rememberMe) {
localStorage.setItem('rememberMeTimestamp', Date.now().toString());
} else {
localStorage.removeItem('rememberMeTimestamp');
}
} catch (err: unknown) { } catch (err: unknown) {
setError(err instanceof Error ? err.message : 'An error occurred'); setError(err instanceof Error ? err.message : 'An error occurred');
} }
@@ -90,6 +97,20 @@ export default function Login() {
/> />
</div> </div>
)} )}
{!isSignup && (
<div className="flex items-center">
<input
type="checkbox"
id="rememberMe"
checked={rememberMe}
onChange={(e) => setRememberMe(e.target.checked)}
className="w-4 h-4 rounded border-gray-600 bg-gray-700 text-blue-600 focus:ring-2 focus:ring-blue-500 cursor-pointer"
/>
<label htmlFor="rememberMe" className="ml-2 text-sm text-gray-300 cursor-pointer">
Remember me for 15 days
</label>
</div>
)}
<button <button
type="submit" type="submit"
disabled={loading} disabled={loading}
+20
View File
@@ -26,6 +26,25 @@ export function AuthProvider({ children }: { children: ReactNode }) {
const unsubscribe = onAuthStateChanged(auth, (user) => { const unsubscribe = onAuthStateChanged(auth, (user) => {
if (mounted) { if (mounted) {
// Check if "Remember Me" has expired (15 days)
if (user) {
const rememberMeTimestamp = localStorage.getItem('rememberMeTimestamp');
if (rememberMeTimestamp) {
const fifteenDaysInMs = 15 * 24 * 60 * 60 * 1000;
const now = Date.now();
const loginTime = parseInt(rememberMeTimestamp, 10);
if (now - loginTime > fifteenDaysInMs) {
// More than 15 days have passed, logout
localStorage.removeItem('rememberMeTimestamp');
signOut(auth);
setUser(null);
setLoading(false);
return;
}
}
}
setUser(user); setUser(user);
setLoading(false); setLoading(false);
} }
@@ -58,6 +77,7 @@ export function AuthProvider({ children }: { children: ReactNode }) {
}; };
const logout = async () => { const logout = async () => {
localStorage.removeItem('rememberMeTimestamp');
await signOut(auth); await signOut(auth);
}; };