Extend user session duration to improve the overall user experience

Removes `useSessionTimeout` hook and increases the session `maxAge` to 24 hours in `server/routes.ts`.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: dec54137-d5a2-4406-8ad4-5f2f9fb110bf
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/0715008c-7244-40f4-befc-26c014852236/0fcd8a07-209c-4438-b4c7-bd4229e22926.jpg
This commit is contained in:
michaelschal committed 2025-07-10 09:52:12 +00:00
1 parent f828278efa
commit 28ca128ab6
3 files changed
+1 -107

No files matched your search

-4
View File
@@ -3,15 +3,11 @@ import { queryClient } from "./lib/queryClient";
import { Toaster } from "@/components/ui/toaster";
import { TooltipProvider } from "@/components/ui/tooltip";
import { useAuth } from "@/hooks/useAuth";
import { useSessionTimeout } from "@/hooks/useSessionTimeout";
import Login from "@/pages/Login";
import Dashboard from "@/pages/Dashboard";
function AppContent() {
const { isAuthenticated, isLoading } = useAuth();
// Initialize session timeout management
useSessionTimeout();
if (isLoading) {
return (
-102
View File
@@ -1,102 +0,0 @@
import { useEffect, useRef, useCallback } from 'react';
import { useAuth } from './useAuth';
const SESSION_TIMEOUT_MS = 15 * 60 * 1000; // 15 minutes
const WARNING_TIME_MS = 2 * 60 * 1000; // 2 minutes before timeout
export function useSessionTimeout() {
const { isAuthenticated } = useAuth();
const timeoutRef = useRef<NodeJS.Timeout | null>(null);
const warningTimeoutRef = useRef<NodeJS.Timeout | null>(null);
const lastActivityRef = useRef<number>(Date.now());
const logout = useCallback(() => {
// Redirect to logout endpoint which will handle the logout process
window.location.href = '/api/auth/logout';
}, []);
const showWarning = useCallback(() => {
// Show a warning that session will expire soon
const remainingTime = Math.ceil((SESSION_TIMEOUT_MS - (Date.now() - lastActivityRef.current)) / 1000 / 60);
if (confirm(`Votre session va expirer dans ${remainingTime} minute(s). Voulez-vous rester connecté ?`)) {
// User wants to stay logged in, reset the timer
resetTimer();
} else {
// User chose to logout or didn't respond
logout();
}
}, [logout]);
const resetTimer = useCallback(() => {
if (!isAuthenticated) return;
lastActivityRef.current = Date.now();
// Clear existing timeouts
if (timeoutRef.current) {
clearTimeout(timeoutRef.current);
}
if (warningTimeoutRef.current) {
clearTimeout(warningTimeoutRef.current);
}
// Set warning timeout (2 minutes before expiration)
warningTimeoutRef.current = setTimeout(showWarning, SESSION_TIMEOUT_MS - WARNING_TIME_MS);
// Set logout timeout
timeoutRef.current = setTimeout(logout, SESSION_TIMEOUT_MS);
}, [isAuthenticated, logout, showWarning]);
const handleActivity = useCallback(() => {
resetTimer();
}, [resetTimer]);
useEffect(() => {
if (!isAuthenticated) {
// Clear timeouts if user is not authenticated
if (timeoutRef.current) {
clearTimeout(timeoutRef.current);
}
if (warningTimeoutRef.current) {
clearTimeout(warningTimeoutRef.current);
}
return;
}
// Start the timer when component mounts or user becomes authenticated
resetTimer();
// Activity events to monitor
const events = [
'mousedown',
'mousemove',
'keypress',
'scroll',
'touchstart',
'click'
];
// Add event listeners for user activity
events.forEach(event => {
document.addEventListener(event, handleActivity, true);
});
// Cleanup function
return () => {
if (timeoutRef.current) {
clearTimeout(timeoutRef.current);
}
if (warningTimeoutRef.current) {
clearTimeout(warningTimeoutRef.current);
}
events.forEach(event => {
document.removeEventListener(event, handleActivity, true);
});
};
}, [isAuthenticated, handleActivity, resetTimer]);
return {
resetTimer,
timeRemaining: () => Math.max(0, SESSION_TIMEOUT_MS - (Date.now() - lastActivityRef.current))
};
}
+1 -1
View File
@@ -61,7 +61,7 @@ export async function registerRoutes(app: Express): Promise<Server> {
saveUninitialized: false,
cookie: {
secure: false, // Set to true in production with HTTPS
maxAge: 15 * 60 * 1000 // 15 minutes
maxAge: 24 * 60 * 60 * 1000 // 24 hours
}
}));