Add audio button with mic/mic-off toggle to Host panel header

[Copilot]

Adds a mic button to the Host panel header positioned to the right of the settings icon, as requested in issue #17. The button provides visual feedback for audio narration state and will be used for future audio streaming functionality.

Changes Made

Host Agent Store (lib/stores/host/hostAgentStore.ts)

• Added isMicActive: boolean state to track mic status
• Added toggleMic() action to toggle mic state with console logging

Host Component (app/dashboard/studio/host/Host.tsx)

• Imported Mic and MicOff icons from lucide-react
• Added mic button with consistent styling matching the Settings button
• Implemented toggle functionality with proper accessibility attributes
• Button shows Mic icon when active, MicOff icon when inactive

Implementation Details

The mic button follows the existing design patterns:

• Same styling as Settings button (p-1 hover:bg-[#2d2d2d] rounded transition-colors border text-muted-foreground cursor-pointer)
• Proper hover effects and transitions
• Accessible title attributes that update based on state
• 12px icon size matching other header icons

Visual Result

The mic button appears in the header next to the settings icon and correctly toggles between mic/mic-off states when clicked. The button is ready for future integration with audio streaming functionality.

Fixes #17.

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

• fonts.googleapis.com
  • Triggering command: /usr/local/bin/node /home/REDACTED/work/SMNB/SMNB/smnb/node_modules/next/dist/compiled/jest-worker/processChild.js (dns block)
  • Triggering command: next-server (v15.5.0) (dns block)
• https://api.github.com/repos/get-convex/convex-backend/releases
  • Triggering command: node /home/REDACTED/work/SMNB/SMNB/smnb/node_modules/.bin/convex dev (http block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to the custom allowlist in this repository's Copilot coding agent settings (admins only)

---

💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.