chore(shadcn): cleanup microphoneTrack

[thomasyuill-livekit]

Summary

• Replace useMicrophone with useSessionContext across Agent stories
• Update useInputControls/AgentControlBar to use useSessionContext to retrieve microphoneTrack
• Tweak Tailwind selector syntax for radial visualizer + track control styles

Summary by CodeRabbit

• Refactor

  • Microphone data now comes from the shared session context across audio components and stories, consolidating how microphone input is sourced.
  • Updated input control hook return shape (internal API adjusted) to align with the session-based microphone handling.

• Style

  • Audio visualizer styling selectors simplified for more consistent rendering across variants.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[changeset-bot]

⚠️ No Changeset found

Latest commit: 0a78249

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[coderabbitai]

📝 Walkthrough

Walkthrough

Migrates microphone track sourcing from individual useMicrophone hooks to the centralized session context (useSessionContext), removing local microphone logic in the AgentSessionProvider and updating stories, hooks, and components to consume local.microphoneTrack.

Changes

Cohort / File(s)	Change Summary
Session Provider docs/storybook/.storybook/lk-decorators/AgentSessionProvider.tsx	Removed useMicrophone usage and TrackReference-based return; component now relies solely on SessionProvider and StoryFn.
Stories (Visualizer) docs/storybook/stories/agents-ui/AgentAudioVisualizerBar.stories.tsx, docs/storybook/stories/agents-ui/AgentAudioVisualizerGrid.stories.tsx, docs/storybook/stories/agents-ui/AgentAudioVisualizerRadial.stories.tsx	Replaced useMicrophone with useSessionContext to obtain local.microphoneTrack and pass it as audioTrack; updated imports and story args where applicable.
Stories (Controls) docs/storybook/stories/agents-ui/AgentControlBar.stories.tsx, docs/storybook/stories/agents-ui/AgentTrackControl.stories.tsx	Removed direct useMicrophone calls; AgentTrackControl stories now derive pressed state via useTrackToggle and obtain microphoneTrack from useSessionContext.
Hook API packages/shadcn/hooks/agents-ui/use-agent-control-bar.ts	Public API changed: micTrackRef?: TrackReferenceOrPlaceholder → microphoneTrack?: TrackReference; migrated retrieval to useSessionContext; removed useLocalParticipant/useMemo usage.
Components (internal rename & styling) packages/shadcn/components/agents-ui/agent-control-bar.tsx, packages/shadcn/components/agents-ui/agent-track-control.tsx	Renamed internal micTrackRef → microphoneTrack; adjusted Tailwind classes for inline SVG text color modifier placement.
Visualizer CSS packages/shadcn/components/agents-ui/agent-audio-visualizer-radial.tsx	Replaced nested per-item selectors with generalized :data-lk-index attribute selectors across variants for styling targeting.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Suggested reviewers

• 1egoman
• lukasIO

Poem

🐰 Microphone Shuffle

I hopped from hook to center stage,
A session's song begins a new page,
Tracks align and stories sing,
Centralized notes on every string,
Hooray — the rabbit claps and grins! 🎤✨

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'chore(shadcn): cleanup microphoneTrack' clearly and concisely describes the main objective of the PR: refactoring to clean up how microphoneTrack is retrieved and used throughout the codebase.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

size-limit report 📦

Path	Size
LiveKitRoom only	6 KB (0%)
LiveKitRoom with VideoConference	32.46 KB (0%)
All exports	43.37 KB (0%)

[coderabbitai]

Actionable comments posted: 0

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (2)

docs/storybook/stories/agents-ui/AgentAudioVisualizerGrid.stories.tsx (1)

17-24: Typo: default should be size.

Line 18 uses default: 'lg' which is not a valid prop for AgentAudioVisualizerGrid. Based on the argTypes configuration and the component's props interface, this should be size: 'lg'.

   args: {
-    default: 'lg',
+    size: 'lg',
     state: 'connecting',
     radius: 5,
     interval: 100,
     rowCount: 10,
     columnCount: 10,
   },

docs/storybook/stories/agents-ui/AgentTrackControl.stories.tsx (1)

101-107: Bug: Microphone control won't receive audioTrack due to incorrect condition.

Line 106 checks args.source === Track.Source.Microphone, but args.source is undefined (no source in the story's args), while line 104 hardcodes source={Track.Source.Microphone}. This means the condition will always be false and audioTrack will be undefined.

This is inconsistent with the Default story (line 65) which correctly passes audioTrack={microphoneTrack} unconditionally for the Microphone control.

         <AgentTrackControl
           {...args}
           kind="audioinput"
           source={Track.Source.Microphone}
           pressed={isMicrophonePressed}
-          audioTrack={args.source === Track.Source.Microphone ? microphoneTrack : undefined}
+          audioTrack={microphoneTrack}
           onPressedChange={(pressed: boolean) => setIsMicrophonePressed(pressed)}
         />

🧹 Nitpick comments (1)

docs/storybook/.storybook/lk-decorators/AgentSessionProvider.tsx (1)

13-16: Missing session in useEffect dependency array.

The session object is used inside the effect but not listed in the dependency array. This will trigger an ESLint exhaustive-deps warning. If session is guaranteed to be stable across renders (memoized by useSession), the current pattern is functionally correct but consider adding session to the array or suppressing the lint rule with a comment explaining the intentional omission.

   useEffect(() => {
     session.start();
     return () => session.end();
-  }, []);
+  }, [session]);

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 2dd163e and 0a78249.

📒 Files selected for processing (10)

• docs/storybook/.storybook/lk-decorators/AgentSessionProvider.tsx
• docs/storybook/stories/agents-ui/AgentAudioVisualizerBar.stories.tsx
• docs/storybook/stories/agents-ui/AgentAudioVisualizerGrid.stories.tsx
• docs/storybook/stories/agents-ui/AgentAudioVisualizerRadial.stories.tsx
• docs/storybook/stories/agents-ui/AgentControlBar.stories.tsx
• docs/storybook/stories/agents-ui/AgentTrackControl.stories.tsx
• packages/shadcn/components/agents-ui/agent-audio-visualizer-radial.tsx
• packages/shadcn/components/agents-ui/agent-control-bar.tsx
• packages/shadcn/components/agents-ui/agent-track-control.tsx
• packages/shadcn/hooks/agents-ui/use-agent-control-bar.ts

🚧 Files skipped from review as they are similar to previous changes (5)

• docs/storybook/stories/agents-ui/AgentAudioVisualizerRadial.stories.tsx
• packages/shadcn/components/agents-ui/agent-control-bar.tsx
• packages/shadcn/hooks/agents-ui/use-agent-control-bar.ts
• packages/shadcn/components/agents-ui/agent-track-control.tsx
• docs/storybook/stories/agents-ui/AgentControlBar.stories.tsx

🧰 Additional context used

🧬 Code graph analysis (3)

docs/storybook/stories/agents-ui/AgentAudioVisualizerGrid.stories.tsx (2)

packages/shadcn/components/agents-ui/agent-audio-visualizer-grid.tsx (2)

• AgentAudioVisualizerGrid (239-290)
• AgentAudioVisualizerGridProps (195-219)

docs/storybook/.storybook/lk-decorators/AgentSessionProvider.tsx (1)

• AgentSessionProvider (10-23)

docs/storybook/stories/agents-ui/AgentTrackControl.stories.tsx (3)

packages/shadcn/components/agents-ui/agent-track-control.tsx (2)

• AgentTrackControl (259-324)
• AgentTrackControlProps (199-240)

docs/storybook/.storybook/lk-decorators/AgentSessionProvider.tsx (1)

• AgentSessionProvider (10-23)

packages/shadcn/components/agents-ui/agent-session-provider.tsx (1)

• AgentSessionProvider (50-61)

docs/storybook/stories/agents-ui/AgentAudioVisualizerBar.stories.tsx (2)

packages/shadcn/components/agents-ui/agent-audio-visualizer-bar.tsx (2)

• AgentAudioVisualizerBar (118-196)
• AgentAudioVisualizerBarProps (71-100)

docs/storybook/.storybook/lk-decorators/AgentSessionProvider.tsx (1)

• AgentSessionProvider (10-23)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: test

🔇 Additional comments (4)

docs/storybook/stories/agents-ui/AgentAudioVisualizerBar.stories.tsx (1)

10-15: LGTM!

The migration from useMicrophone to useSessionContext is clean. The destructuring of local.microphoneTrack and passing it as audioTrack prop aligns with the PR objectives and matches the expected prop types.

docs/storybook/stories/agents-ui/AgentAudioVisualizerGrid.stories.tsx (1)

10-15: LGTM!

The migration to useSessionContext follows the same clean pattern as the other stories.

docs/storybook/stories/agents-ui/AgentTrackControl.stories.tsx (1)

11-26: LGTM!

The default render function cleanly integrates useSessionContext for microphoneTrack and useTrackToggle for toggle state management. The conditional audioTrack prop based on source type is appropriate here since the source can vary via args.

packages/shadcn/components/agents-ui/agent-audio-visualizer-radial.tsx (1)

17-22: Tailwind v4 natively supports these selectors — no issue.

The project uses Tailwind CSS v4, which has built-in support for both the **: descendant combinator variant and data-*: attribute variants. The selectors **:data-lk-index:... and has-data-[lk-state=...]:**:data-lk-index:... are valid Tailwind v4 syntax and will not be stripped. Other components in the codebase (tooltip, select, alert, etc.) already use data-[...] variants successfully. No custom variant configuration or fallback syntax is needed.

Likely an incorrect or invalid review comment.

_{✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.}