feat: per-admin localStorage namespacing with migration

Made-with: Cursor

frontend/src/context/AuthContext.jsx

@@ -1,5 +1,6 @@
 import React, { createContext, useState, useContext, useEffect } from 'react';
 import axios from 'axios';
+import { migratePreferences } from '../utils/adminPrefs';
 
 const AuthContext = createContext();
 
@@ -13,6 +14,7 @@ export const useAuth = () => {
 
 export const AuthProvider = ({ children }) => {
   const [token, setToken] = useState(localStorage.getItem('adminToken'));
+  const [adminName, setAdminName] = useState(localStorage.getItem('adminName'));
   const [isAuthenticated, setIsAuthenticated] = useState(false);
   const [loading, setLoading] = useState(true);
 
@@ -20,10 +22,17 @@ export const AuthProvider = ({ children }) => {
     const verifyToken = async () => {
       if (token) {
         try {
-          await axios.post('/api/auth/verify', {}, {
+          const response = await axios.post('/api/auth/verify', {}, {
             headers: { Authorization: `Bearer ${token}` }
           });
           setIsAuthenticated(true);
+          const name = response.data.user?.name;
+          if (name) {
+            setAdminName(name);
+            localStorage.setItem('adminName', name);
+          } else {
+            logout();
+          }
         } catch (error) {
           console.error('Token verification failed:', error);
           logout();
@@ -38,10 +47,13 @@ export const AuthProvider = ({ children }) => {
   const login = async (key) => {
     try {
       const response = await axios.post('/api/auth/login', { key });
-      const newToken = response.data.token;
+      const { token: newToken, name } = response.data;
       localStorage.setItem('adminToken', newToken);
+      localStorage.setItem('adminName', name);
       setToken(newToken);
+      setAdminName(name);
       setIsAuthenticated(true);
+      migratePreferences(name);
       return { success: true };
     } catch (error) {
       return {
@@ -53,12 +65,15 @@ export const AuthProvider = ({ children }) => {
 
   const logout = () => {
     localStorage.removeItem('adminToken');
+    localStorage.removeItem('adminName');
     setToken(null);
+    setAdminName(null);
     setIsAuthenticated(false);
   };
 
   const value = {
     token,
+    adminName,
     isAuthenticated,
     loading,
     login,
@@ -67,4 +82,3 @@ export const AuthProvider = ({ children }) => {
 
   return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
 };
-

frontend/src/pages/History.jsx

@@ -4,9 +4,10 @@ import { useAuth } from '../context/AuthContext';
 import { useToast } from '../components/Toast';
 import api from '../api/axios';
 import { formatLocalDate, isSunday } from '../utils/dateUtils';
+import { prefixKey } from '../utils/adminPrefs';
 
 function History() {
-  const { isAuthenticated } = useAuth();
+  const { isAuthenticated, adminName } = useAuth();
   const { error, success } = useToast();
   const navigate = useNavigate();
 
@@ -15,8 +16,8 @@ function History() {
   const [totalCount, setTotalCount] = useState(0);
   const [closingSession, setClosingSession] = useState(null);
 
-  const [filter, setFilter] = useState(() => localStorage.getItem('history-filter') || 'default');
+  const [filter, setFilter] = useState(() => localStorage.getItem(prefixKey(adminName, 'history-filter')) || 'default');
-  const [limit, setLimit] = useState(() => localStorage.getItem('history-show-limit') || '5');
+  const [limit, setLimit] = useState(() => localStorage.getItem(prefixKey(adminName, 'history-show-limit')) || '5');
 
   const [selectMode, setSelectMode] = useState(false);
   const [selectedIds, setSelectedIds] = useState(new Set());
@@ -50,15 +51,24 @@ function History() {
     return () => clearInterval(interval);
   }, [loadSessions]);
 
+  useEffect(() => {
+    if (adminName) {
+      const savedFilter = localStorage.getItem(prefixKey(adminName, 'history-filter'));
+      const savedLimit = localStorage.getItem(prefixKey(adminName, 'history-show-limit'));
+      if (savedFilter) setFilter(savedFilter);
+      if (savedLimit) setLimit(savedLimit);
+    }
+  }, [adminName]);
+
   const handleFilterChange = (newFilter) => {
     setFilter(newFilter);
-    localStorage.setItem('history-filter', newFilter);
+    localStorage.setItem(prefixKey(adminName, 'history-filter'), newFilter);
     setSelectedIds(new Set());
   };
 
   const handleLimitChange = (newLimit) => {
     setLimit(newLimit);
-    localStorage.setItem('history-show-limit', newLimit);
+    localStorage.setItem(prefixKey(adminName, 'history-show-limit'), newLimit);
     setSelectedIds(new Set());
   };
 

frontend/src/utils/adminPrefs.js

@@ -0,0 +1,19 @@
+const PREF_KEYS = ['history-filter', 'history-show-limit'];
+
+export function prefixKey(adminName, key) {
+  if (!adminName) return key;
+  return `${adminName}:${key}`;
+}
+
+export function migratePreferences(adminName) {
+  if (!adminName) return;
+
+  for (const key of PREF_KEYS) {
+    const oldValue = localStorage.getItem(key);
+    const newKey = prefixKey(adminName, key);
+    if (oldValue !== null && localStorage.getItem(newKey) === null) {
+      localStorage.setItem(newKey, oldValue);
+      localStorage.removeItem(key);
+    }
+  }
+}