feat(dashboard): add the toolbar, five status columns, and task cards - #29
Conversation
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
📝 WalkthroughWalkthroughThe PR adds typed task-board data and reusable icons, replaces placeholder task pages with responsive dashboards, and expands route tests for headings, columns, task-card metadata, and navigation controls. ChangesTask dashboard
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant Dashboard
participant Toolbar
participant TaskBoard
participant TaskCard
Dashboard->>Toolbar: render task controls
Dashboard->>TaskBoard: pass sampleColumns
TaskBoard->>TaskCard: pass each task
TaskCard-->>TaskBoard: render task metadata
Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/features/tasks/Toolbar.tsx`:
- Around line 7-24: Update the mobile and desktop view switchers in the Toolbar
component to use NavLink elements targeting the dashboard and my-task routes
instead of static spans. Derive each item’s text, border, and indicator styles
from NavLink’s active state so the correct view is highlighted on both routes,
and add coverage verifying the active toolbar item for each route.
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 3811bbef-67b4-4ce2-90b9-538b1e9ee185
📒 Files selected for processing (10)
src/app/router.test.tsxsrc/components/layout/Sidebar.tsxsrc/components/ui/icons.tsxsrc/features/tasks/Dashboard.tsxsrc/features/tasks/MyTask.tsxsrc/features/tasks/TaskBoard.tsxsrc/features/tasks/TaskCard.tsxsrc/features/tasks/Toolbar.tsxsrc/features/tasks/icons.tsxsrc/features/tasks/sample-tasks.ts
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/features/tasks/TaskCard.tsx (1)
42-53: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winExpose fork and comment counts to assistive technology.
The fork and comment icons are decorative, and their numeric wrappers have no accessible labels. Screen readers expose bare values such as
5and3, without identifying whether they represent forks or comments. (raw.githubusercontent.com)Add an accessible name to each count group, or provide visually hidden labels.
Proposed fix
- <span className="flex items-center gap-1 text-body-m"> + <span + role="img" + aria-label={`${task.forks} forks`} + className="flex items-center gap-1 text-body-m" + > {task.forks} <ForkIcon className="size-4" /> </span> - <span className="flex items-center gap-1 text-body-m"> + <span + role="img" + aria-label={`${task.comments} comments`} + className="flex items-center gap-1 text-body-m" + > {task.comments} <ChatIcon className="size-4" /> </span>🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/features/tasks/TaskCard.tsx` around lines 42 - 53, The fork and comment count groups in TaskCard need accessible names while their icons remain decorative. Update the respective count wrappers around task.forks and task.comments to include descriptive accessible labels or visually hidden text identifying “forks” and “comments.”
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In @.npmrc:
- Line 2: Ensure the CI/tooling configuration pins npm to version 11.10.0 or
newer, or fails when the installed npm version is below that minimum before
relying on the min-release-age setting in .npmrc. Validate the npm CLI version
directly rather than using npm config get min-release-age, which may report null
after npm converts the setting.
---
Outside diff comments:
In `@src/features/tasks/TaskCard.tsx`:
- Around line 42-53: The fork and comment count groups in TaskCard need
accessible names while their icons remain decorative. Update the respective
count wrappers around task.forks and task.comments to include descriptive
accessible labels or visually hidden text identifying “forks” and “comments.”
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 2ee28132-d1b2-4890-b940-32e249e1b28f
📒 Files selected for processing (12)
.npmrcREADME.mdsrc/app/router.test.tsxsrc/app/router.tsxsrc/components/layout/Header.tsxsrc/components/layout/Sidebar.tsxsrc/components/ui/icons.tsxsrc/features/tasks/TaskBoard.tsxsrc/features/tasks/TaskCard.tsxsrc/features/tasks/Toolbar.tsxsrc/features/tasks/sample-tasks.tssrc/features/tasks/types.ts
💤 Files with no reviewable changes (1)
- src/app/router.tsx
🚧 Files skipped from review as they are similar to previous changes (4)
- src/features/tasks/TaskBoard.tsx
- src/components/layout/Sidebar.tsx
- src/features/tasks/Toolbar.tsx
- src/app/router.test.tsx
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@package.json`:
- Around line 7-8: Align the package engine constraints by updating the node and
npm requirements in package.json: either raise the node minimum to >=24.14.1
while retaining npm >=11.10.0, or lower the npm minimum to >=11.3.0 while
retaining node >=24.
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@README.md`:
- Line 29: Update the Node/npm version note in the README to state that
min-release-age was introduced in npm 11.10.0, while retaining the Node 24.14.1
and bundled npm 11.11.0 details as applicable. Remove the inaccurate claim that
npm 11.11.0 is the first enforcing release.
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 0534024e-7392-4999-adbd-e3ed46232216
📒 Files selected for processing (2)
README.mdpackage.json
🚧 Files skipped from review as they are similar to previous changes (1)
- package.json
Summary by CodeRabbit
New Features
Documentation
Tests