Skip to content

Sayali: add task age indicator below progress bar on dashboard#5272

Open
sayali-2308 wants to merge 1 commit into
developmentfrom
Sayali-Task-Age-Indicator
Open

Sayali: add task age indicator below progress bar on dashboard#5272
sayali-2308 wants to merge 1 commit into
developmentfrom
Sayali-Task-Age-Indicator

Conversation

@sayali-2308
Copy link
Copy Markdown
Contributor

image

Description

Implements #(your task number) (Priority Medium)

Related PRs:

No related PRs — frontend only change.

Main changes explained:

  • Updated src/components/TeamMemberTasks/TeamMemberTask.jsx to display a task age badge below the progress bar, calculated from task.createdDatetime
  • Updated src/components/TeamMemberTasks/style.module.css to add styles for the task age badge with color coding (green ≤7 days, teal ≤30 days, yellow ≤90 days, red 90+ days)

How to test:

  1. Check out branch Sayali-Task-Age-Indicator
  2. npm install && npm run start:local
  3. Clear cache, log in as admin
  4. Navigate to Dashboard → Tasks tab
  5. Verify a colored badge showing "XX Days Old" appears below the progress bar for each task
  6. Verify color changes based on age (green=new, teal=recent, yellow=old, red=very old)
  7. Verify dark mode works correctly

Screenshots:

image image image

Note:

Frontend only change. task.createdDatetime is already included in the API response from getTasksForTeams in taskHelper.js — no backend changes required.

@netlify
Copy link
Copy Markdown

netlify Bot commented May 14, 2026

Deploy Preview for highestgoodnetwork-dev ready!

Name Link
🔨 Latest commit 13eefd0
🔍 Latest deploy log https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/6a05a131007843000845bce9
😎 Deploy Preview https://deploy-preview-5272--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@sonarqubecloud
Copy link
Copy Markdown

Copy link
Copy Markdown

@HemanthNidamanuru HemanthNidamanuru left a comment

Choose a reason for hiding this comment

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

Hi,

I tested this locally. The "XX Days Old" badge appears correctly below the progress bar for each task. Color coding works as expected, green for new tasks, teal for recent, yellow for old, and red for very old. Dark mode looks good too.

Image Image Image

Copy link
Copy Markdown

@DeepighaJ DeepighaJ left a comment

Choose a reason for hiding this comment

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

Check out current branch and tested PR locally.
The colored badge showing "XX Days Old" appears below the progress bar for each task as expected and color changes based on age as expected.
Dark mode works correctly as expected.

Image Image Image Image

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.

3 participants