Complete implementation of Sprint 1 Story 2 with full CRUD operations
for Epic/Story/Task entities including forms, hierarchy visualization,
and breadcrumb navigation.
Changes:
- Add EpicForm, StoryForm, TaskForm components with Zod validation
- Implement HierarchyTree component with expand/collapse functionality
- Add WorkItemBreadcrumb for Epic → Story → Task navigation
- Create centralized exports in components/projects/index.ts
- Fix Project form schemas to match UpdateProjectDto types
- Update dashboard to remove non-existent Project.status field
API Client & Hooks (already completed):
- epicsApi, storiesApi, tasksApi with full CRUD operations
- React Query hooks with optimistic updates and invalidation
- Error handling and JWT authentication integration
Technical Implementation:
- TypeScript type safety throughout
- Zod schema validation for all forms
- React Query optimistic updates
- Hierarchical data loading (lazy loading on expand)
- Responsive UI with Tailwind CSS
- Loading states and error handling
Story Points: 8 SP
Estimated Hours: 16h
Status: Completed
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implemented comprehensive Projects UI with full CRUD functionality following
modern React best practices and using shadcn/ui components.
Changes:
- Created ProjectForm component with react-hook-form + zod validation
- Auto-uppercase project key input
- Comprehensive field validation (name, key, description)
- Support for both create and edit modes
- Toast notifications for success/error states
- Enhanced Projects List Page (app/(dashboard)/projects/page.tsx)
- Beautiful card-based grid layout with hover effects
- Skeleton loading states for better UX
- Empty state with call-to-action
- Project metadata display (key badge, created date)
- Integrated ProjectForm in Dialog for creation
- Enhanced Project Detail Page (app/(dashboard)/projects/[id]/page.tsx)
- Comprehensive project information display
- Edit functionality with dialog form
- Delete functionality with confirmation AlertDialog
- Epics preview section with stats
- Quick actions sidebar (Kanban, Epics)
- Statistics card (Total/Active/Completed epics)
- Skeleton loading states
- Error handling with retry capability
- Added toast notifications (Sonner)
- Installed and configured sonner package
- Added Toaster component to root layout
- Success/error notifications for all CRUD operations
- Installed required dependencies
- date-fns for date formatting
- sonner for toast notifications
- shadcn/ui alert-dialog component
Technical highlights:
- TypeScript with strict type checking
- React Query for data fetching and caching
- Optimistic updates with automatic rollback
- Responsive design (mobile-friendly)
- Accessibility-focused components
- Clean error handling throughout
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add comprehensive Issue management functionality with drag-and-drop Kanban board.
Changes:
- Created Issue API client (issues.ts) with CRUD operations
- Implemented React Query hooks for Issue data management
- Added IssueCard component with drag-and-drop support using @dnd-kit
- Created KanbanColumn component with droppable zones
- Built CreateIssueDialog with form validation using zod
- Implemented Kanban page at /projects/[id]/kanban with DnD status changes
- Added missing UI components (textarea, select, skeleton)
- Enhanced API client with helper methods (get, post, put, patch, delete)
- Installed dependencies: @dnd-kit/core, @dnd-kit/sortable, @dnd-kit/utilities, @radix-ui/react-select, sonner
- Fixed SignalR ConnectionManager TypeScript error
- Preserved legacy KanbanBoard component for backward compatibility
Features:
- Drag and drop issues between Backlog, Todo, InProgress, and Done columns
- Real-time status updates via API
- Issue creation with type (Story, Task, Bug, Epic) and priority
- Visual feedback with priority colors and type icons
- Toast notifications for user actions
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add complete project detail page with real-time updates via SignalR.
Changes:
- Updated project detail page with edit and archive buttons
- Created EditProjectDialog component for updating projects
- Created ArchiveProjectDialog component for archiving projects
- Integrated SignalR real-time updates (onProjectUpdated, onProjectArchived)
- Added SignalR connection status indicator
- Enhanced useProjectHub hook to support callback options
- Improved UI layout with two-column card grid
- Added toast notifications for user feedback
Features:
- View project details (name, description, status, timestamps)
- Edit project name and description
- Archive active projects
- Real-time updates when project is modified by other users
- Automatic redirect when project is archived
🤖 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>
