Open
Conversation
Add a fully interactive 2×2 prioritization matrix (Eisenhower-style) that lets users visually organize tasks across four quadrants. Backend: - Database migrations for matrices and task_matrices tables - Sequelize models with validation and associations - Full REST API module (controller, service, repository, routes, validation) - Endpoints: CRUD matrices, assign/remove tasks, browse available tasks, bulk placements for dot indicators - Swagger documentation Frontend: - TypeScript entities, API service, and Zustand-powered hooks - MatrixBoard with @dnd-kit drag-and-drop (PointerSensor + TouchSensor) - DragOverlay for smooth cross-quadrant moves with optimistic updates - MatrixModal with Eisenhower preset and cross-layout axis inputs - Universal task browser (by project, area, or tag) as a sidebar drawer - QuadrantDot indicators on task cards across the app - Shared quadrant color constants (rose/amber/sky/emerald) - Full i18n support (en, es, fr, de, it, pt, ja, ko, zh, el) - React Router integration with sidebar navigation Tests (128 total): - Backend validation unit tests (33) - Backend model unit tests (13) - Backend integration tests (45) - Frontend constants tests (9) - Frontend hook helper tests (9) - Frontend API service tests (19) Co-authored-by: GitHub Copilot (Claude) <noreply@github.com>
Owner
|
As I mentioned in another PR, we are on a feature freeze at the moment. Only bug fixes accepted, in order to release v1.0! Cheers! |
Contributor
|
I like this @dansj1 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
2×2 Prioritization Matrix
Closes #863
What
Adds a fully interactive 2×2 prioritization matrix (Eisenhower-style) that lets users visually organize tasks across four customizable quadrants using drag-and-drop.
Screenshots
Matrix Board — Eisenhower view with drag-and-drop quadrants:
Task Detail —
Quick-add to matrix (2-step: pick matrix → pick quadrant):
Matrix List — Overview of all matrices with task counts:
Changes
Backend (6 new files + 2 migrations):
backend/models/matrix.js/task_matrix.js— Sequelize models with validationbackend/modules/matrices/— controller, service, repository, routes, validationGET/POST /matrices,GET/PUT/DELETE /matrices/:id,PUT/DELETE /matrices/:id/tasks/:taskId,GET /matrices/placements,GET /matrices/:id/browse,GET /tasks/:taskId/matricesFrontend (16 new files):
frontend/entities/Matrix.ts— TypeScript interfacesfrontend/utils/matrixService.ts— API client with full endpoint coveragefrontend/hooks/useMatrix.ts— React hooks with optimistic drag-and-drop updatesfrontend/store/useMatrixStore.ts— Zustand UI state (sidebar, selected task)frontend/contexts/MatrixPlacementsContext.tsx— bulk placement cache for dot indicatorsfrontend/constants/matrixColors.ts— shared quadrant color definitions (single source of truth)frontend/components/Matrix/— MatrixListPage, MatrixDetailPage, MatrixBoard, MatrixModal, Quadrant, DraggableTask, UnassignedSidebarfrontend/components/Shared/QuadrantDot.tsx— colored dot indicators on task cardsfrontend/components/Task/TaskDetails/TaskMatrixCard.tsx— 2-step quick-add from task detail (pick matrix → pick quadrant), with navigation to matrix pagesfrontend/components/Sidebar/SidebarMatrices.tsx— sidebar navigation entryTests (128 total, all passing):
i18n: en, es, fr, de, it, pt, ja, ko, zh, el
Technical Highlights
@dnd-kit/corewithPointerSensor+TouchSensorandDragOverlayfor smooth cross-quadrant movesQUADRANT_STYLESconstant ensures consistent rose/amber/sky/emerald quadrant colors across all componentsNotes
This PR was developed with AI assistance (GitHub Copilot powered by Claude). All code has been reviewed, tested, and refined through multiple iterations.
47 files changed, ~5,600 lines added.