fix: persist unread notification count across refreshes

[seffhunnn]

Summary

Fixed the unread notification badge flicker after page refresh by persisting the last known unread count in localStorage and restoring it immediately on initial render before the client-side fetch completes.

Closes #1031

Type of Change

• Bug fix
• New feature
• Documentation update
• Refactor / code cleanup

Changes Made

• Added localStorage persistence for unread notification count
• Restored cached unread count on initial client render
• Added validation for invalid/non-numeric cached values
• Added SSR-safe guards for localStorage access
• Updated cache after successful notification fetches
• Prevented notification badge flicker on hard refresh

How to Test

Steps for the reviewer to verify this works:

1. Run the project locally using npm run dev
2. Ensure there are unread notifications available
3. Refresh the dashboard page using Ctrl + R
4. Verify the notification badge appears immediately without flickering to 0
5. Open DevTools → Network and enable Slow 3G
6. Refresh the page again and verify the cached unread count appears before the fetch completes
7. Open DevTools → Application → Local Storage
8. Verify devtrack:unread-notification-count is stored correctly
9. Run the following in the browser console:

   localStorage.setItem("devtrack:unread-notification-count", "abc")

10. Refresh the page and verify the app safely falls back to 0 without crashing
11. Run npm run lint
12. Run npm run type-check

Screenshots (if UI change)

N/A

Checklist

• Linked issue in summary
• npm run lint passes locally
• No TypeScript errors (npm run type-check)
• Self-reviewed the diff
• Added/updated tests if applicable

[vercel]

@seffhunnn is attempting to deploy a commit to the PRIYANSHU DOSHI's projects Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

GSSoC Label Checklist 🏷️

@Priyanshu-byte-coder — please apply the appropriate labels before merging:

Difficulty (pick one):

• level:beginner — 20 pts
• level:intermediate — 35 pts
• level:advanced — 55 pts
• level:critical — 80 pts

Quality (optional):

• quality:clean — ×1.2 multiplier
• quality:exceptional — ×1.5 multiplier

Validation (required to score):

• gssoc:approved — counts for points
• gssoc:invalid / gssoc:spam / gssoc:ai-slop — does not score

Type labels (type:*) are auto-detected from files and title. Review and adjust if needed.
Points formula: (difficulty × quality_multiplier) + type_bonus

[Priyanshu-byte-coder]

Playwright smoke tests are failing on this PR. Check the CI logs, fix failing tests, then push an update. Cannot merge while tests are red.

[Priyanshu-byte-coder]

Playwright smoke tests are failing on this PR. Please check the E2E test failures and fix them before merging.

[seffhunnn]

hii @Priyanshu-byte-coder i synced the latest playwright workflow fixes into this branch, verified that the ci issue was caused by the previous playwright version mismatch, and confirmed that e2e tests, lint, and type checks are now all passing successfully.

[github-actions]

🎉 Merged! Thanks for contributing to DevTrack.

If the project has been useful to you, a ⭐ star on the repo is the easiest way to support it — it helps DevTrack get discovered by more developers.

Keep an eye on open issues for your next contribution!