fix: resolve WebSocket connection issues and API errors

- Fix React StrictMode double-mount causing WebSocket connection loops
  - Add isMountedRef to Tasks.tsx and NotificationContext.tsx
  - Delay WebSocket connection by 100ms to avoid race conditions
  - Check mounted state before reconnection attempts

- Fix React Router v7 deprecation warnings
  - Add future flags: v7_startTransition, v7_relativeSplatPath

- Fix CalendarView 422 API error
  - Send full ISO 8601 datetime format instead of date-only
  - Add URL encoding for query parameters

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
beabigegg
2026-01-08 22:49:19 +08:00
parent a7c452ffd8
commit 934decd314
5 changed files with 55 additions and 26 deletions

View File

@@ -122,14 +122,28 @@ export default function Tasks() {
}
// Subscribe to project WebSocket when project changes
// Use isMounted ref to handle React StrictMode's double-mount behavior
const isMountedRef = useRef(true)
useEffect(() => {
isMountedRef.current = true
if (projectId) {
subscribeToProject(projectId)
// Small delay to avoid race conditions with StrictMode's rapid mount/unmount
const timeoutId = setTimeout(() => {
if (isMountedRef.current) {
subscribeToProject(projectId)
}
}, 100)
return () => {
clearTimeout(timeoutId)
isMountedRef.current = false
unsubscribeFromProject()
}
}
return () => {
unsubscribeFromProject()
isMountedRef.current = false
}
}, [projectId, subscribeToProject, unsubscribeFromProject])
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [projectId])
// Handle real-time task events from WebSocket
const handleTaskEvent = useCallback((event: TaskEvent) => {