Ambient Events

Listen for ambient session events in the React Web SDK and react to state changes during capture and note generation

This example shows how to listen for ambient events in the Suki React Web SDK. The Web SDK emits events when the ambient session state changes. Listen for these events to track the state of the ambient session and handle responses accordingly.

For more information, refer to the Emitter-events-type section.

Code example

The example below demonstrates how to listen for ambient events in the web SDK.

React

import { SukiAssistant, SukiProvider, useSuki } from "@suki-sdk/react";

function MyComponent() {
  const { on, activeAmbientId } = useSuki();

  useEffect(() => {
    const handleAmbientUpdate = (event) => {
      console.log("Ambient event received:", event);
    };

    // Subscribe to ambient update events
    const unsubscribe = on("ambient-update", handleAmbientUpdate);

    // Cleanup subscription on unmount
    return () => {
      unsubscribe();
    };
  }, [on]);

  return (
    <>
      Active Ambient ID: {activeAmbientId}
      <SukiAssistant
      // props
      />
    </>
  );
}

Next steps

Refer to the Test mode example to learn how to use the test mode in the web SDK.