Skip to content

Feature/bonus points - #39

Merged
Alejandroq12 merged 4 commits into
devfrom
feature/bonus-points
Aug 8, 2026
Merged

Feature/bonus points#39
Alejandroq12 merged 4 commits into
devfrom
feature/bonus-points

Conversation

@Alejandroq12

@Alejandroq12 Alejandroq12 commented Aug 8, 2026

Copy link
Copy Markdown
Owner

Summary by CodeRabbit

  • New Features

    • Added clear due-date styling with distinct colors for each status.
    • Newly created tasks now animate into view and automatically scroll into focus.
    • Added task count and layout-toggle details to the project documentation.
  • Style

    • Improved task card entry animations.
    • Preserved reduced-motion accessibility behavior.

@vercel

vercel Bot commented Aug 8, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
task-flow Ready Ready Preview Aug 8, 2026 12:43am

@coderabbitai

coderabbitai Bot commented Aug 8, 2026

Copy link
Copy Markdown

Review Change Stack

Warning

Review limit reached

@Alejandroq12, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 8 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: cb94e1c0-80b1-41c1-a158-6f61645a7f86

📥 Commits

Reviewing files that changed from the base of the PR and between 1afa5ed and 4a4cb61.

⛔ Files ignored due to path filters (1)
  • src/assets/readme/readme.png is excluded by !**/*.png
📒 Files selected for processing (1)
  • README.md
📝 Walkthrough

Walkthrough

The task UI now uses DueTone mappings for due-date colors. New tasks receive an entry animation and are located after creation by polling for their refreshed card. The README documents the completed bonus features.

Changes

Task UI updates

Layer / File(s) Summary
Due-date tone rendering
src/features/tasks/TaskCard.tsx, src/features/tasks/TaskList.tsx
Task cards and task lists now apply color classes from DueTone mappings.
Post-creation task feedback
src/features/tasks/CreateTaskModal.tsx, src/features/tasks/TaskCard.tsx, src/index.css
Task creation invalidates the task query, then polls for the created card and scrolls it into view. Cards use a data-task-id attribute and card-in animation.
Documentation and stylesheet cleanup
README.md, src/index.css
The README documents completed bonus features. Existing stylesheet values remain unchanged while explanatory comments are removed.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant CreateTaskModal
  participant TaskQuery
  participant TaskCard
  User->>CreateTaskModal: Create task
  CreateTaskModal->>TaskQuery: Invalidate tasks query
  TaskQuery-->>CreateTaskModal: Refresh task data
  CreateTaskModal->>TaskCard: Find created task by ID
  CreateTaskModal->>TaskCard: Scroll into view
  TaskCard->>TaskCard: Run entry animation
Loading

Possibly related PRs

Suggested labels: ui

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly identifies the bonus-points feature, which matches the main changes in the pull request.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feature/bonus-points

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🤖 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 123: Update the README due-date colors description for dueInfo to say
amber applies “within two days” (or explicitly state the inclusive dayDiff <= 2
boundary), while preserving the existing green and red descriptions.

In `@src/features/tasks/CreateTaskModal.tsx`:
- Around line 9-10: Make the task identity contract consistent by adding the
data-task-id attribute with task.id to the TaskRow root used by the list layout,
so scrollToTask can locate newly created tasks. Keep the existing board-card
attribute and scrollToTask behavior unchanged.
🪄 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: cb1b9ac1-4cc2-4b45-9ab9-98944f49d877

📥 Commits

Reviewing files that changed from the base of the PR and between dcfa33a and 1afa5ed.

📒 Files selected for processing (5)
  • README.md
  • src/features/tasks/CreateTaskModal.tsx
  • src/features/tasks/TaskCard.tsx
  • src/features/tasks/TaskList.tsx
  • src/index.css

Comment thread README.md
<!-- TODO: list which bonus features I tackled, if any -->
- **Total count of tasks by column** — board column headers and list group headers both carry live counts.
- **Layout toggle (columns ↔ list)** — the desktop icon switcher and the mobile Dashboard/Task tabs drive one shared selection that survives navigation and resizes.
- **Due-date colors** — green on time, amber under two days, red overdue: one rule (`dueInfo` in `task-display.ts`) drives the card date chips, the list view's row indicators, and the list date text. The mockup only shows the red/neutral chip states; the requirement asks for three colors, and requirements outrank mockups.

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Correct the due-date boundary wording.

dueInfo uses the amber tone when dayDiff <= 2. This includes tasks due today, tomorrow, and exactly two days from now. Replace “under two days” with “within two days” or document the exact boundary.

🤖 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 `@README.md` at line 123, Update the README due-date colors description for
dueInfo to say amber applies “within two days” (or explicitly state the
inclusive dayDiff <= 2 boundary), while preserving the existing green and red
descriptions.

Comment on lines +9 to +10
function scrollToTask(id: string, attempts = 10) {
const card = document.querySelector(`[data-task-id="${id}"]`)

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win

Make the task identity contract consistent across layouts.

scrollToTask searches for [data-task-id="${id}"]. The board card exposes this attribute, but the list view's TaskRow does not. When a user creates a task in list layout, the refresh succeeds but the polling loop never finds the row, so the new task is not scrolled into view. Add data-task-id={task.id} to the TaskRow root or use a shared anchor in both layouts. The add-task control is available in list layout, so this path is reachable. (raw.githubusercontent.com)

Proposed contract fix
--- a/src/features/tasks/TaskList.tsx
+++ b/src/features/tasks/TaskList.tsx
@@
-      <div className="flex">
+      <div data-task-id={task.id} className="flex">
🤖 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/CreateTaskModal.tsx` around lines 9 - 10, Make the task
identity contract consistent by adding the data-task-id attribute with task.id
to the TaskRow root used by the list layout, so scrollToTask can locate newly
created tasks. Keep the existing board-card attribute and scrollToTask behavior
unchanged.

Source: MCP tools

@Alejandroq12
Alejandroq12 merged commit 5bcf707 into dev Aug 8, 2026
5 checks passed
@claude

claude Bot commented Aug 8, 2026

Copy link
Copy Markdown

Code review

No issues found. Checked for bugs and CLAUDE.md compliance.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant