5.8 KiB
Implementation Plan
-
1. Set up backend bulk action endpoints
- Create bulk status update endpoint in
backend/routers/tasks.py - Create bulk assignment endpoint in
backend/routers/tasks.py - Implement transaction handling for atomicity
- Add request/response schemas in
backend/schemas/task.py - Requirements: 4.2, 4.4, 5.3, 5.5
- Create bulk status update endpoint in
-
* 1.1 Write property test for bulk status update atomicity
- Property 4: Bulk status update atomicity
- Validates: Requirements 4.2, 4.4
-
* 1.2 Write property test for bulk assignment atomicity
- Property 5: Bulk assignment atomicity
- Validates: Requirements 5.3, 5.5
-
2. Update task service with bulk action methods
- Add
bulkUpdateStatusmethod tofrontend/src/services/task.ts - Add
bulkAssignTasksmethod tofrontend/src/services/task.ts - Define TypeScript interfaces for bulk action requests and responses
- Requirements: 4.2, 5.3
- Add
-
3. Add checkbox selection column to TaskBrowser
- Update
frontend/src/components/task/columns.tsto add select column - Implement header checkbox for select all functionality
- Implement row checkboxes for individual selection
- Ensure checkbox column is not sortable or hideable
- Requirements: 1.1, 1.2, 1.3
- Update
-
* 3.1 Write property test for selection state consistency
- Property 1: Selection state consistency
- Validates: Requirements 1.2, 1.3, 2.3
-
4. Implement row selection state in TaskBrowser
- Add
rowSelectionstate using TanStack Table's row selection - Configure table with
enableRowSelection: true - Add computed property for
selectedTasksarray - Add computed property for
selectedCount - Implement visual feedback for selected rows (background highlight)
- Requirements: 1.2, 1.3, 1.4, 2.1, 2.2, 2.3
- Add
-
5. Implement selection count display
- Update task count display area to show selection count when tasks are selected
- Show format: "X tasks selected" when selection is active
- Show normal count when no selection
- Requirements: 2.1, 2.2, 2.3
-
6. Implement filter-based selection clearing
- Add watchers for filter changes (status, type, episode, assignee, context, search)
- Clear
rowSelectionstate when any filter changes - Requirements: 1.5
-
* 6.1 Write property test for filter clears selection
- Property 2: Filter clears selection
- Validates: Requirements 1.5
-
7. Create TaskBulkActionsMenu component
- Create new component at
frontend/src/components/task/TaskBulkActionsMenu.vue - Use DropdownMenu from shadcn-vue for base structure
- Implement absolute positioning based on cursor coordinates
- Add viewport boundary detection for menu positioning
- Create "Set Status" menu item with status submenu
- Create "Assign To" menu item with user list submenu
- Emit events for status-selected and assignee-selected
- Requirements: 3.1, 3.3, 4.1, 5.1, 5.2
- Create new component at
-
8. Implement context menu trigger in TaskBrowser
- Add
@contextmenuevent handler to table rows - Implement
handleContextMenumethod to position and show menu - Ensure right-clicked unselected row gets selected before menu shows
- Add click-outside handler to close context menu
- Prevent context menu on empty table areas
- Requirements: 3.1, 3.2, 3.3, 3.4
- Add
-
* 8.1 Write property test for context menu task inclusion
- Property 3: Context menu task inclusion
- Validates: Requirements 3.2
-
9. Implement bulk status update action
- Create
handleBulkStatusUpdatemethod in TaskBrowser - Extract selected task IDs from selection state
- Call
taskService.bulkUpdateStatuswith task IDs and new status - Show loading state during operation
- Display success toast with count of updated tasks
- Handle errors and display error toast
- Refresh task list after successful update
- Close context menu and clear selection after completion
- Requirements: 4.2, 4.3, 4.4, 4.5, 6.1, 6.3
- Create
-
10. Implement bulk assignment action
- Create
handleBulkAssignmentmethod in TaskBrowser - Extract selected task IDs from selection state
- Call
taskService.bulkAssignTaskswith task IDs and user ID - Show loading state during operation
- Display success toast with count of assigned tasks
- Handle errors and display error toast
- Refresh task list after successful update
- Close context menu and clear selection after completion
- Requirements: 5.3, 5.4, 5.5, 5.6, 6.1, 6.3
- Create
-
11. Implement keyboard shortcuts
- Add
@keydownevent handler to table container - Implement Ctrl+A (Cmd+A on Mac) to select all visible tasks
- Implement Escape to clear selection and close context menu
- Implement Ctrl+Click (Cmd+Click on Mac) for toggle selection
- Implement Shift+Click for range selection
- Track
lastSelectedIndexfor range selection - Requirements: 7.1, 7.2, 7.3, 7.4
- Add
-
* 11.1 Write property test for Ctrl+A selection
- Property 6: Keyboard shortcut selection
- Validates: Requirements 7.1
-
* 11.2 Write property test for Shift-click range selection
- Property 7: Shift-click range selection
- Validates: Requirements 7.4
-
12. Add loading and disabled states
- Add
isProcessingBulkActionstate flag - Disable context menu options during bulk operations
- Show loading spinner or disabled state in menu
- Prevent duplicate operations while processing
- Requirements: 6.2
- Add
-
* 13. Write unit tests for edge cases
- Test empty selection state handling
- Test single task selection
- Test select all with no tasks
- Test context menu positioning at viewport edges
- Test keyboard event handling with various modifier keys
-
14. Final checkpoint - Ensure all tests pass
- Ensure all tests pass, ask the user if questions arise.