Ambient Events - Suki

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

Test mode - Example to learn how to use the test mode in the web SDK.

Last modified on October 22, 2026