From 0cb2bb2ea780499d0b509a527da078843ce30475 Mon Sep 17 00:00:00 2001 From: t0ng7u Date: Sun, 27 Jul 2025 09:49:57 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=97=82=EF=B8=8F=20refactor(table):=20isol?= =?UTF-8?q?ate=20column=20preferences=20per=20role?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Summary • Added role-specific localStorage keys for column visibility in three hooks: - `useUsageLogsData.js` → `logs-table-columns-admin` / `logs-table-columns-user` - `useMjLogsData.js` → `mj-logs-table-columns-admin` / `mj-logs-table-columns-user` - `useTaskLogsData.js` → `task-logs-table-columns-admin` / `task-logs-table-columns-user` Details 1. Each hook now derives a `STORAGE_KEY` based on `isAdminUser`, preventing admin and non-admin sessions from overwriting one another’s column settings. 2. Removed the previous “save but strip admin columns” workaround—settings are persisted unmodified to each role’s key. 3. Kept runtime behaviour: non-admin users still see admin-only columns forcibly hidden. 4. Replaced newly added Chinese comments with clear English equivalents for consistency. Result Switching between admin and non-admin accounts no longer corrupts column visibility preferences, and codebase comments are fully English-localized. --- web/src/hooks/mj-logs/useMjLogsData.js | 13 ++++++++----- web/src/hooks/task-logs/useTaskLogsData.js | 13 ++++++++----- web/src/hooks/usage-logs/useUsageLogsData.js | 16 ++++++++-------- 3 files changed, 24 insertions(+), 18 deletions(-) diff --git a/web/src/hooks/mj-logs/useMjLogsData.js b/web/src/hooks/mj-logs/useMjLogsData.js index 00330785..b204ed7a 100644 --- a/web/src/hooks/mj-logs/useMjLogsData.js +++ b/web/src/hooks/mj-logs/useMjLogsData.js @@ -60,6 +60,8 @@ export const useMjLogsData = () => { // User and admin const isAdminUser = isAdmin(); + // Role-specific storage key to prevent different roles from overwriting each other + const STORAGE_KEY = isAdminUser ? 'mj-logs-table-columns-admin' : 'mj-logs-table-columns-user'; // Modal states const [isModalOpen, setIsModalOpen] = useState(false); @@ -88,13 +90,14 @@ export const useMjLogsData = () => { // Load saved column preferences from localStorage useEffect(() => { - const savedColumns = localStorage.getItem('mj-logs-table-columns'); + const savedColumns = localStorage.getItem(STORAGE_KEY); if (savedColumns) { try { const parsed = JSON.parse(savedColumns); const defaults = getDefaultColumnVisibility(); const merged = { ...defaults, ...parsed }; - // If not admin, force hide columns only visible to admins + + // For non-admin users, force-hide admin-only columns (does not touch admin settings) if (!isAdminUser) { merged[COLUMN_KEYS.CHANNEL] = false; merged[COLUMN_KEYS.SUBMIT_RESULT] = false; @@ -139,7 +142,7 @@ export const useMjLogsData = () => { const initDefaultColumns = () => { const defaults = getDefaultColumnVisibility(); setVisibleColumns(defaults); - localStorage.setItem('mj-logs-table-columns', JSON.stringify(defaults)); + localStorage.setItem(STORAGE_KEY, JSON.stringify(defaults)); }; // Handle column visibility change @@ -167,10 +170,10 @@ export const useMjLogsData = () => { setVisibleColumns(updatedColumns); }; - // Update table when column visibility changes + // Persist column settings to the role-specific STORAGE_KEY useEffect(() => { if (Object.keys(visibleColumns).length > 0) { - localStorage.setItem('mj-logs-table-columns', JSON.stringify(visibleColumns)); + localStorage.setItem(STORAGE_KEY, JSON.stringify(visibleColumns)); } }, [visibleColumns]); diff --git a/web/src/hooks/task-logs/useTaskLogsData.js b/web/src/hooks/task-logs/useTaskLogsData.js index 23ed8a85..173be604 100644 --- a/web/src/hooks/task-logs/useTaskLogsData.js +++ b/web/src/hooks/task-logs/useTaskLogsData.js @@ -58,6 +58,8 @@ export const useTaskLogsData = () => { // User and admin const isAdminUser = isAdmin(); + // Role-specific storage key to prevent different roles from overwriting each other + const STORAGE_KEY = isAdminUser ? 'task-logs-table-columns-admin' : 'task-logs-table-columns-user'; // Modal state const [isModalOpen, setIsModalOpen] = useState(false); @@ -86,13 +88,14 @@ export const useTaskLogsData = () => { // Load saved column preferences from localStorage useEffect(() => { - const savedColumns = localStorage.getItem('task-logs-table-columns'); + const savedColumns = localStorage.getItem(STORAGE_KEY); if (savedColumns) { try { const parsed = JSON.parse(savedColumns); const defaults = getDefaultColumnVisibility(); const merged = { ...defaults, ...parsed }; - // If not admin, force hide columns only visible to admins + + // For non-admin users, force-hide admin-only columns (does not touch admin settings) if (!isAdminUser) { merged[COLUMN_KEYS.CHANNEL] = false; } @@ -127,7 +130,7 @@ export const useTaskLogsData = () => { const initDefaultColumns = () => { const defaults = getDefaultColumnVisibility(); setVisibleColumns(defaults); - localStorage.setItem('task-logs-table-columns', JSON.stringify(defaults)); + localStorage.setItem(STORAGE_KEY, JSON.stringify(defaults)); }; // Handle column visibility change @@ -152,10 +155,10 @@ export const useTaskLogsData = () => { setVisibleColumns(updatedColumns); }; - // Update table when column visibility changes + // Persist column settings to the role-specific STORAGE_KEY useEffect(() => { if (Object.keys(visibleColumns).length > 0) { - localStorage.setItem('task-logs-table-columns', JSON.stringify(visibleColumns)); + localStorage.setItem(STORAGE_KEY, JSON.stringify(visibleColumns)); } }, [visibleColumns]); diff --git a/web/src/hooks/usage-logs/useUsageLogsData.js b/web/src/hooks/usage-logs/useUsageLogsData.js index c25c155c..03e09eb8 100644 --- a/web/src/hooks/usage-logs/useUsageLogsData.js +++ b/web/src/hooks/usage-logs/useUsageLogsData.js @@ -74,6 +74,8 @@ export const useLogsData = () => { // User and admin const isAdminUser = isAdmin(); + // Role-specific storage key to prevent different roles from overwriting each other + const STORAGE_KEY = isAdminUser ? 'logs-table-columns-admin' : 'logs-table-columns-user'; // Statistics state const [stat, setStat] = useState({ @@ -110,13 +112,14 @@ export const useLogsData = () => { // Load saved column preferences from localStorage useEffect(() => { - const savedColumns = localStorage.getItem('logs-table-columns'); + const savedColumns = localStorage.getItem(STORAGE_KEY); if (savedColumns) { try { const parsed = JSON.parse(savedColumns); const defaults = getDefaultColumnVisibility(); const merged = { ...defaults, ...parsed }; - // If not admin, force hide columns only visible to admins + + // For non-admin users, force-hide admin-only columns (does not touch admin settings) if (!isAdminUser) { merged[COLUMN_KEYS.CHANNEL] = false; merged[COLUMN_KEYS.USERNAME] = false; @@ -156,7 +159,7 @@ export const useLogsData = () => { const initDefaultColumns = () => { const defaults = getDefaultColumnVisibility(); setVisibleColumns(defaults); - localStorage.setItem('logs-table-columns', JSON.stringify(defaults)); + localStorage.setItem(STORAGE_KEY, JSON.stringify(defaults)); }; // Handle column visibility change @@ -186,13 +189,10 @@ export const useLogsData = () => { setVisibleColumns(updatedColumns); }; - // Update table when column visibility changes + // Persist column settings to the role-specific STORAGE_KEY useEffect(() => { if (Object.keys(visibleColumns).length > 0) { - localStorage.setItem( - 'logs-table-columns', - JSON.stringify(visibleColumns), - ); + localStorage.setItem(STORAGE_KEY, JSON.stringify(visibleColumns)); } }, [visibleColumns]);