Dynamic Encounter

Pass and update patient and encounter identifiers on SukiAssistant to pre-populate ambient sessions in the React Web SDK

This example shows how to dynamically set the encounter data in the Suki React Web SDK. Encounter data contains patient and provider information. You pass it to the SukiAssistant component to pre-populate the React Web SDK.

Identifiers:

• patient.identifier is required and must be at most 36 characters (varchar(36)).
• encounter.identifier is optional. If you set it, use a UUID or non-UUID value, at most 36 characters (varchar(36)). From Web SDK v3.2.0, the SDK maps this value to emr_encounter_id for ambient interoperability and encounter note retrieval. Refer to Encounter type definition for more information.

Dynamic encounter:

You can update the encounter prop after the component loads. When you pass new encounter data, the Web SDK updates it automatically for note generation.

Code example

The example below demonstrates how to dynamically set the encounter data in the Suki React Web SDK.

React

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

function DynamicEncounterComponent() {
  const [currentEncounter, setCurrentEncounter] = useState(initialEncounter); // Replace with your initial encounter data

  const switchToNewPatient = () => {
    const newEncounter = {
      identifier: "6ec3920f-b0b1-499d-a4e9-889bf788e5ab", // max 36 characters
      patient: {
        identifier: "905c2521-25eb-4324-9978-724636df3436", // max 36 characters
        name: {
          use: "usual",
          family: "Wilson",
          given: ["Emma"],
          suffix: [],
        },
        birthDate: "1992-07-10",
        gender: "female",
      },
    };

    setCurrentEncounter(newEncounter);
  };

  return (
    <SukiProvider>
      <div>
        <button onClick={switchToNewPatient}>Switch to New Patient</button>

        <SukiAssistant
          encounter={currentEncounter}
          // rest of the props
        />
      </div>
    </SukiProvider>
  );
}

Next steps

Ambient events - How to track and manage ambient interactions in the web SDK.