Add a notification bell in the nav bar showing unread count and a dropdown of recent notifications

[Chucks1093]

Summary

Users currently have no in-app notification centre. A bell icon in the nav bar with an unread badge and a dropdown listing the five most recent notifications would surface key events (new follower, key purchase, price milestone) without requiring a dedicated page visit.

Scope

• Show a bell icon in the nav bar; display an unread count badge when count > 0
• Clicking the bell opens a dropdown with the five most recent notifications
• Each notification entry shows the message, time ago, and a read/unread indicator
• Clicking a notification marks it as read and navigates to the relevant page
• Include a 'View all' link at the bottom of the dropdown navigating to the full notifications page

Acceptance Criteria

• Unread count badge visible when there are unread notifications
• Dropdown shows up to five most recent notifications
• Clicking a notification marks it read and navigates correctly
• Badge count decrements when a notification is marked read
• 'View all' link navigates to the notifications page

ETA: 12 hours

---

Coordinate on Telegram

[OLAMIGHTY010]

@OLAMIGHTY010 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

I would like to work on this project

ℹ️ Repo Maintainers: To accept this application, review their application or assign @OLAMIGHTY010 to this issue.

[Stanley471]

@Stanley471 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hi maintainer, I've reviewed the issue and would like to work on it

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Stanley471 to this issue.

[Trovic1]

@Trovic1 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hi maintainer can I work on this issue

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Trovic1 to this issue.

[onajidavid87-web]

@onajidavid87-web has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hello, I’d love to work on this issue

ℹ️ Repo Maintainers: To accept this application, review their application or assign @onajidavid87-web to this issue.

[Bilalishaq7]

@Bilalishaq7 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Gooday maintainer,I'd love to take on this task, I can fix this and i'll submit a PR shortly after Assignment

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Bilalishaq7 to this issue.

[peternnadi1999]

@peternnadi1999 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hi! I'd like to work on #720 – Add a notification bell in the nav bar showing unread count and a dropdown of recent notifications.

I have experience building React/Next.js applications with TypeScript and interactive UI components. I'll implement a notification bell with an unread count badge, a dropdown displaying the five most recent notifications (including message, time ago, and read/unread status), mark notifications as read on click while navigating to the relevant page, and include a "View all" link to the notifications page. I'll ensure the component is responsive, accessible, and well-tested before submitting the PR.

Looking forward to contributing!

ℹ️ Repo Maintainers: To accept this application, review their application or assign @peternnadi1999 to this issue.

[Marvelg256]

@Marvelg256 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hi maintainer, I will like to work on this issue.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Marvelg256 to this issue.

[Mona-i]

@Mona-i has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hey maintainer

I would love to work on this issue issue

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Mona-i to this issue.

[T-kesh]

@T-kesh has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

please assign me

ℹ️ Repo Maintainers: To accept this application, review their application or assign @T-kesh to this issue.

[chukwuebuka19]

@chukwuebuka19 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Hello, I am Johnpaul. I can work on this task and deliver promptly. Please can you assign it to me.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @chukwuebuka19 to this issue.

[mysterio123865]

@mysterio123865 has applied to work on this issue as part of the Stellar Wave Program's 7th wave.

Kindly assign

ℹ️ Repo Maintainers: To accept this application, review their application or assign @mysterio123865 to this issue.

[drips-wave]

Congratulations, @Mona-i! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on July 30, 2026.

🧑‍💻 @Mona-i: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊