Fix issue where unauthenticated users were not automatically
redirected to the login page.
Root Cause:
- authStore.ts: isLoading was not set to false after hydration
- AuthGuard.tsx: Used isLoading instead of isHydrated for checks
Changes:
- Set isLoading = false in authStore onRehydrateStorage callback
- Changed AuthGuard to use isHydrated instead of isLoading
- Added console log for redirect debugging
This ensures:
- Hydration completes with correct loading state
- Unauthenticated users are immediately redirected to /login
- More explicit state management with isHydrated
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Automatically migrate old localStorage format where user object has userId field
to new format with id field. This prevents users from needing to re-login after
the backend API response changed from userId to id.
Changes:
- Added migrate function to Zustand persist config to handle userId → id migration
- Added post-hydration safety check in onRehydrateStorage callback
- Added detailed console.log for debugging migration process
Fixes: User data mismatch after API response format change
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Fix race condition where Epic form checked user authentication before
Zustand persist middleware completed hydration from localStorage.
Root cause:
- authStore uses persist middleware to restore from localStorage
- Hydration is asynchronous
- Epic form checked user state before hydration completed
- Result: "User not authenticated" error on page refresh
Changes:
- Add isHydrated state to authStore interface
- Add onRehydrateStorage callback to track hydration completion
- Update epic-form to check isHydrated before checking user
- Disable submit button until hydration completes
- Show "Loading..." button text during hydration
- Improve error messages for better UX
- Add console logging to track hydration process
Testing:
- Page refresh should now wait for hydration
- Epic form correctly identifies logged-in users
- Submit button disabled until auth state ready
- Clear user feedback during loading state
Fixes: Epic creation "User not authenticated" error on refresh
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Address all Critical and High Priority issues identified in frontend code review report:
Critical Issues Fixed:
- Created unified logger utility (lib/utils/logger.ts) to replace all console.log statements
- Consolidated User type definitions - removed duplicate from authStore, using single source from types/user.ts
- Eliminated 'any' types in API client - added proper generic types with AxiosRequestConfig
- Fixed SignalR ConnectionManager - replaced 'any' with generic types <T>
- Created API error types (lib/types/errors.ts) with ApiError and getErrorMessage helper
- Fixed IssueCard component - removed all type assertions, created discriminated union types for Kanban items
- Added React.memo to IssueCard for performance optimization
- Added proper ARIA labels and accessibility attributes to IssueCard
High Priority Issues Fixed:
- Fixed hardcoded user ID in CreateProjectDialog - now uses actual user from authStore
- Added useCallback to CreateProjectDialog onSubmit handler
- Fixed error handlers in use-epics.ts - replaced 'any' with ApiError type
- Updated all error handling to use logger and getErrorMessage
Type Safety Improvements:
- Created KanbanItem discriminated union (KanbanEpic | KanbanStory | KanbanTask) with proper type guards
- Added 'never' types to prevent invalid property access
- Fixed User interface to include all required fields (createdAt, updatedAt)
- Maintained backward compatibility with LegacyKanbanBoard for existing code
Files Changed:
- lib/utils/logger.ts - New centralized logging utility
- lib/types/errors.ts - New API error types and helpers
- types/user.ts - Consolidated User type with TenantRole
- types/kanban.ts - New discriminated union types for type-safe Kanban items
- components/features/kanban/IssueCard.tsx - Type-safe with React.memo
- components/features/projects/CreateProjectDialog.tsx - Fixed hardcoded user ID, added useCallback
- lib/api/client.ts - Eliminated 'any', added proper generics
- lib/signalr/ConnectionManager.ts - Replaced console.log, added generics
- lib/hooks/use-epics.ts - Fixed error handler types
- stores/authStore.ts - Removed duplicate User type
- lib/hooks/useAuth.ts - Added createdAt field to User
TypeScript compilation: ✅ All type checks passing (0 errors)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented comprehensive JWT-based authentication with token refresh mechanism, user state management, and protected routes.
Changes:
- Upgraded API client from fetch to Axios with automatic token refresh interceptors
- Created API configuration with centralized endpoint definitions
- Implemented Zustand auth store for user state management with persistence
- Created React Query hooks for login, register, logout, and current user
- Built login and registration pages with form validation (Zod + React Hook Form)
- Implemented AuthGuard component for route protection
- Enhanced Header with user dropdown menu and logout functionality
- Updated Sidebar with user information display at bottom
- Added Team navigation item to sidebar
- Configured environment variables for API base URL
Technical Details:
- JWT token storage in localStorage with secure key names
- Automatic token refresh on 401 responses
- Request queueing during token refresh to prevent race conditions
- TypeScript strict typing throughout
- ESLint compliant code (fixed type safety issues)
- Proper error handling with user-friendly messages
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
