Function SensorPreviewPanel

app/src/components/AgentCard/SensorPreviewPanel.tsx:881–1078

({
  agentId,
  streams,
  systemPrompt,
})

}

const SensorPreviewPanel: React.FC<SensorPreviewPanelProps> = ({
  agentId,
  streams,
  systemPrompt,
}) => {
  const audioStreamsToDisplay = useMemo(() => getActiveAudioStreamsForDisplay(streams), [streams]);

  // Loading states for start buttons
  const [isStartingScreen, setIsStartingScreen] = useState(false);
  const [isStartingCamera, setIsStartingCamera] = useState(false);
  const [isStartingMicrophone, setIsStartingMicrophone] = useState(false);
  const [isStartingScreenAudio, setIsStartingScreenAudio] = useState(false);
  const [isStartingAllAudio, setIsStartingAllAudio] = useState(false);

  // Detect which sensors this agent actually uses
  const hasScreenSensor = useMemo(() => agentHasScreenSensor(systemPrompt), [systemPrompt]);
  const hasCameraSensor = useMemo(() => agentHasCameraSensor(systemPrompt), [systemPrompt]);
  const hasMemorySensor = useMemo(() => agentHasSensor(systemPrompt, 'MEMORY'), [systemPrompt]);
  const hasImageMemorySensor = useMemo(() => agentHasSensor(systemPrompt, 'IMEMORY') || agentHasSensor(systemPrompt, 'IMEMORY_OCR'), [systemPrompt]);
  const hasClipboardSensor = useMemo(() => agentHasSensor(systemPrompt, 'CLIPBOARD'), [systemPrompt]);
  const hasMicrophoneSensor = useMemo(() => agentHasSensor(systemPrompt, 'MICROPHONE'), [systemPrompt]);
  const hasScreenAudioSensor = useMemo(() => agentHasSensor(systemPrompt, 'SCREEN_AUDIO'), [systemPrompt]);
  const hasAllAudioSensor = useMemo(() => agentHasSensor(systemPrompt, 'ALL_AUDIO'), [systemPrompt]);

  // Check if we have any sensors configured (not necessarily active)
  const hasAnySensorsConfigured = hasScreenSensor || hasCameraSensor || hasMemorySensor || hasImageMemorySensor || hasClipboardSensor || hasMicrophoneSensor || hasScreenAudioSensor || hasAllAudioSensor;

  // Start handler functions
  const handleStartScreen = async () => {
    setIsStartingScreen(true);
    try {
      await StreamManager.requestStreamsForAgent(agentId, ['screenVideo']);
    } catch (error) {
      console.error('Failed to start screen share:', error);
    } finally {
      setIsStartingScreen(false);
    }
  };

  const handleStartCamera = async () => {
    setIsStartingCamera(true);
    try {
      await StreamManager.requestStreamsForAgent(agentId, ['camera']);
    } catch (error) {
      console.error('Failed to start camera:', error);
    } finally {
      setIsStartingCamera(false);
    }
  };

  const handleStartMicrophone = async () => {
    setIsStartingMicrophone(true);
    try {
      await StreamManager.requestStreamsForAgent(agentId, ['microphone']);
    } catch (error) {
      console.error('Failed to start microphone:', error);
    } finally {
      setIsStartingMicrophone(false);