fix: GameHeader nav buttons have no onClick or aria-label

[Mkalbani]

File: src/components/gameplay/GameHeader.tsx (also affects src/components/Navbar.tsx mobile menu)

Problem
"Store", "Game mode", and "Setting" are bare <button> elements — no handler, no aria-label, no routing. The bell, door, and avatar imgs in the right-side utility cluster are wrapped in <button> with no handler either. The mobile menu in Navbar.tsx repeats this with the Coins/Call/50-50/Audience cards.

Expected

• Either wire the buttons to their routes / lifeline actions, or convert them to non-interactive <div>s with a comment that they're display-only.
• Add aria-label="..." to every interactive element containing only an icon.
• For lifelines: dispatch a Redux action and show a notification when used.

Acceptance

• Every interactive element is reachable by keyboard and announced by screen readers.
• Lifelines decrement their counter and show a toast on use.

[jesutobaadedejidev]

I want to work on this issue. Do assign it to me.

[Labi-Joy]

Hi, Please I'd like to take on this issue.

I'll audit src/components/gameplay/GameHeader.tsx and src/components/Navbar.tsx for bare buttons and interactive icons lacking handlers and accessibility attributes. For "Store", "Game mode", and "Setting" buttons, I'll wire them to their respective routes using Next.js routing or Redux navigation actions. For the bell, door, and avatar icons, I'll determine if they're interactive (notifications, logout, profile) and wire them accordingly, or convert them to display-only divs with comments explaining why.

Every interactive element containing only an icon will receive an aria-label with descriptive text (e.g., "aria-label='Open settings'", "aria-label='View notifications'"). For lifelines in the mobile menu (Coins, Call, 50-50, Audience), I'll dispatch Redux actions that decrement their counter and emit notifications or toasts confirming the lifeline was used.

I'll test keyboard navigation with Tab and Enter keys to verify all interactive elements are reachable. Screen reader testing will confirm aria-labels are announced correctly. Lifelines will visually decrement their counter and show a toast notification on use.

I work with React accessibility patterns and Redux regularly. I can deliver very quickly.

[gloskull]

Hello, I have 4 years of experience delivering solutions for projects like this, covering backend, frontend, and smart contract development. After carefully reviewing your requirements, I have a clear understanding of the task and am confident in my ability to deliver a clean, efficient, and thoroughly tested solution on time. I prioritize code quality, maintainability, and industry best practices throughout the development process. My PR will be submitted in under 10hours.

[Lanhubs]

I’d love to take this on! I have strong experience implementing these exact patterns and can deliver a clean, production-ready solution that hits all acceptance criteria.

My approach will focus on writing modular, well-documented code with comprehensive test coverage for both success paths and edge cases.

I'm ready to get started immediately. Could you please assign this to me?

[grantfox-oss]

🦊 GrantFox — @Lanhubs has been assigned to this issue!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #115)
2. Your PR will be reviewed by the MindFlowInteractive maintainers

Good luck! Track your progress on GrantFox.