From 2a5d27ffc05bdc4bde4df321b10f10a4208f540e Mon Sep 17 00:00:00 2001 From: SyedaAnshrahGillani Date: Wed, 1 Oct 2025 17:04:35 +0500 Subject: [PATCH 1/3] fix(accessibility): Use buttons for modal backdrops --- src/App.jsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/App.jsx b/src/App.jsx index eb3237f..ef82f67 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -491,9 +491,10 @@ function AppContent() { return (
{/* Backdrop */} -
setShowVersionModal(false)} + aria-label="Close version upgrade modal" /> {/* Modal */} @@ -604,7 +605,7 @@ function AppContent() {
-
{ e.stopPropagation(); @@ -615,6 +616,7 @@ function AppContent() { e.stopPropagation(); setSidebarOpen(false); }} + aria-label="Close sidebar" />
Date: Wed, 1 Oct 2025 17:16:09 +0500 Subject: [PATCH 2/3] refactor: Create useLocalStorage hook to reduce code duplication --- src/App.jsx | 41 ++++++++--------------------------- src/hooks/useLocalStorage.jsx | 28 ++++++++++++++++++++++++ 2 files changed, 37 insertions(+), 32 deletions(-) create mode 100644 src/hooks/useLocalStorage.jsx diff --git a/src/App.jsx b/src/App.jsx index ef82f67..5024680 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -33,6 +33,7 @@ import { TasksSettingsProvider } from './contexts/TasksSettingsContext'; import { WebSocketProvider, useWebSocketContext } from './contexts/WebSocketContext'; import ProtectedRoute from './components/ProtectedRoute'; import { useVersionCheck } from './hooks/useVersionCheck'; +import useLocalStorage from './hooks/useLocalStorage'; import { api, authenticatedFetch } from './utils/api'; @@ -54,22 +55,10 @@ function AppContent() { const [isInputFocused, setIsInputFocused] = useState(false); const [showSettings, setShowSettings] = useState(false); const [showQuickSettings, setShowQuickSettings] = useState(false); - const [autoExpandTools, setAutoExpandTools] = useState(() => { - const saved = localStorage.getItem('autoExpandTools'); - return saved !== null ? JSON.parse(saved) : false; - }); - const [showRawParameters, setShowRawParameters] = useState(() => { - const saved = localStorage.getItem('showRawParameters'); - return saved !== null ? JSON.parse(saved) : false; - }); - const [autoScrollToBottom, setAutoScrollToBottom] = useState(() => { - const saved = localStorage.getItem('autoScrollToBottom'); - return saved !== null ? JSON.parse(saved) : true; - }); - const [sendByCtrlEnter, setSendByCtrlEnter] = useState(() => { - const saved = localStorage.getItem('sendByCtrlEnter'); - return saved !== null ? JSON.parse(saved) : false; - }); + const [autoExpandTools, setAutoExpandTools] = useLocalStorage('autoExpandTools', false); + const [showRawParameters, setShowRawParameters] = useLocalStorage('showRawParameters', false); + const [autoScrollToBottom, setAutoScrollToBottom] = useLocalStorage('autoScrollToBottom', true); + const [sendByCtrlEnter, setSendByCtrlEnter] = useLocalStorage('sendByCtrlEnter', false); // Session Protection System: Track sessions with active conversations to prevent // automatic project updates from interrupting ongoing chats. When a user sends // a message, the session is marked as "active" and project updates are paused @@ -690,25 +679,13 @@ function AppContent() { isOpen={showQuickSettings} onToggle={setShowQuickSettings} autoExpandTools={autoExpandTools} - onAutoExpandChange={(value) => { - setAutoExpandTools(value); - localStorage.setItem('autoExpandTools', JSON.stringify(value)); - }} + onAutoExpandChange={setAutoExpandTools} showRawParameters={showRawParameters} - onShowRawParametersChange={(value) => { - setShowRawParameters(value); - localStorage.setItem('showRawParameters', JSON.stringify(value)); - }} + onShowRawParametersChange={setShowRawParameters} autoScrollToBottom={autoScrollToBottom} - onAutoScrollChange={(value) => { - setAutoScrollToBottom(value); - localStorage.setItem('autoScrollToBottom', JSON.stringify(value)); - }} + onAutoScrollChange={setAutoScrollToBottom} sendByCtrlEnter={sendByCtrlEnter} - onSendByCtrlEnterChange={(value) => { - setSendByCtrlEnter(value); - localStorage.setItem('sendByCtrlEnter', JSON.stringify(value)); - }} + onSendByCtrlEnterChange={setSendByCtrlEnter} isMobile={isMobile} /> )} diff --git a/src/hooks/useLocalStorage.jsx b/src/hooks/useLocalStorage.jsx new file mode 100644 index 0000000..9d98af4 --- /dev/null +++ b/src/hooks/useLocalStorage.jsx @@ -0,0 +1,28 @@ +import { useState } from 'react'; + +function useLocalStorage(key, initialValue) { + const [storedValue, setStoredValue] = useState(() => { + try { + const item = window.localStorage.getItem(key); + return item ? JSON.parse(item) : initialValue; + } catch (error) { + console.log(error); + return initialValue; + } + }); + + const setValue = (value) => { + try { + const valueToStore = + value instanceof Function ? value(storedValue) : value; + setStoredValue(valueToStore); + window.localStorage.setItem(key, JSON.stringify(valueToStore)); + } catch (error) { + console.log(error); + } + }; + + return [storedValue, setValue]; +} + +export default useLocalStorage; From e5a05d98651aa9c3f70871d130eaac489fe35f40 Mon Sep 17 00:00:00 2001 From: SyedaAnshrahGillani Date: Thu, 2 Oct 2025 01:12:52 +0500 Subject: [PATCH 3/3] fix: Address coderabbitai feedback --- src/hooks/useLocalStorage.jsx | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/hooks/useLocalStorage.jsx b/src/hooks/useLocalStorage.jsx index 9d98af4..2a42df9 100644 --- a/src/hooks/useLocalStorage.jsx +++ b/src/hooks/useLocalStorage.jsx @@ -1,7 +1,17 @@ import { useState } from 'react'; +/** + * Custom hook to persist state in localStorage. + * + * @param {string} key The key to use for localStorage. + * @param {any} initialValue The initial value to use if nothing is in localStorage. + * @returns {[any, Function]} A tuple containing the stored value and a setter function. + */ function useLocalStorage(key, initialValue) { const [storedValue, setStoredValue] = useState(() => { + if (typeof window === 'undefined') { + return initialValue; + } try { const item = window.localStorage.getItem(key); return item ? JSON.parse(item) : initialValue; @@ -12,11 +22,14 @@ function useLocalStorage(key, initialValue) { }); const setValue = (value) => { + if (typeof window === 'undefined') { + return; + } try { const valueToStore = value instanceof Function ? value(storedValue) : value; - setStoredValue(valueToStore); window.localStorage.setItem(key, JSON.stringify(valueToStore)); + setStoredValue(valueToStore); } catch (error) { console.log(error); }