Mahitha - Fix badges earned notification logic and restore badges UI layout

[Mahitha-pasupuleti]

Description

Fix Badges Earned notification behavior and restore Badges section formatting.

Related PRs (if any):

N/A

Main changes explained:

• Fixed badge notification count behavior.
• Added notification dismissal and persistence after refresh.
• Restored badge layout and count positioning in the Badges section.

How to test:

1. Checkout this branch.
2. Run the application locally.
3. Clear browser cache/site data.
4. Log in as an admin user.
5. Navigate to User Profile.
6. Assign yourself a badge and click Confirm.
7. Go to the Dashboard and verify the badge icon displays a notification count.
8. Click the badge icon and verify it navigates to the Badges tab.
9. Verify the notification count is cleared.
10. Refresh the page and verify the notification count remains cleared.
11. Verify the badge layout matches the expected design.

Screenshots or videos of changes:

Screen.Recording.2026-06-25.at.12.18.14.AM.mov

Note:

• Clicking the badge notification clears the dashboard notification count.
• Badge counts and formatting in the Badges section remain visible and are displayed in the restored layout.

[netlify]

✅ Deploy Preview for highestgoodnetwork-dev ready!

Name	Link
🔨 Latest commit	d7ef99f
🔍 Latest deploy log	https://app.netlify.com/projects/highestgoodnetwork-dev/deploys/6a3cbaf6ee9e7300082d26c8
😎 Deploy Preview	https://deploy-preview-5356--highestgoodnetwork-dev.netlify.app
📱 Preview on mobile	Toggle 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]

Quality Gate passed

Issues
1 New issue
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud