Replace setOpen(!open) toggles with functional setOpen(prev => !prev) across codebase #1007
Description
Description
Multiple components use setX(!x) to toggle boolean state. The functional form setX(prev => !prev) is the recommended pattern because it avoids stale closures if the toggle is ever wrapped in useCallback, used inside startTransition, or called from an async context.
Vercel React Best Practices Rule: rerender-functional-setstate (5.9)
Files to change
| File | Line | Change |
|---|---|---|
components/assistant-ui/thinking-steps.tsx |
68 | setIsOpen(!isOpen) → setIsOpen(prev => !prev) |
components/assistant-ui/tool-fallback.tsx |
48 | setIsExpanded(!isExpanded) → setIsExpanded(prev => !prev) |
components/homepage/navbar.tsx |
165 | setOpen(!open) → setOpen(prev => !prev) |
components/chat-comments/comment-thread/comment-thread.tsx |
96 | setIsRepliesExpanded(!isRepliesExpanded) → setIsRepliesExpanded(prev => !prev) |
components/ui/mode-toolbar-button.tsx |
14 | setReadOnly(!readOnly) → setReadOnly(prev => !prev) |
components/assistant-ui/connector-popup/connect-forms/components/mcp-connect-form.tsx |
246 | setShowDetails(!showDetails) → setShowDetails(prev => !prev) |
components/assistant-ui/connector-popup/connector-configs/components/mcp-config.tsx |
251 | setShowDetails(!showDetails) → setShowDetails(prev => !prev) |
components/assistant-ui/connector-popup/connector-configs/components/webcrawler-config.tsx |
89 | setShowApiKey(!showApiKey) → setShowApiKey(prev => !prev) |
components/assistant-ui/connector-popup/connector-configs/components/composio-drive-config.tsx |
247 | setIsFolderTreeOpen(!isFolderTreeOpen) → setIsFolderTreeOpen(prev => !prev) |
All files are under surfsense_web/.
What to do
For each file listed above, find the toggle pattern and replace it:
// Before
onClick={() => setIsOpen(!isOpen)}
// After
onClick={() => setIsOpen(prev => !prev)}No other changes needed — the component logic remains identical.
Acceptance criteria
- All listed toggles use the functional updater form
- All toggles still work correctly (open/close, expand/collapse, show/hide)