Agent Audio Visualizer – Grid

'use client';

import { useSession, useVoiceAssistant } from '@livekit/components-react';
import { AgentSessionProvider } from '@/components/agents-ui/agent-session-provider';
import { AgentAudioVisualizerGrid } from '@/components/agents-ui/agent-audio-visualizer-grid';

const TOKEN_SOURCE = TokenSource.sandboxTokenServer(
  process.env.MY_LK_SANDBOX_TOKEN_SERVER_ID
);

export funnction Demo() {
  const { audioTrack, state } = useVoiceAssistant();

  return (
    <AgentAudioVisualizerGrid
      size="lg"
      state={state}
      radius={3}
      interval={100}
      rowCount={15}
      columnCount={15}
      audioTrack={audioTrack}
    />
  );
}

export default function DemoWrapper({ session }) {
  const session = useSession(TOKEN_SOURCE);

  return (
    <AgentSessionProvider session={session}>
      <Demo />
    </AgentSessionProvider>
  );
}