Dynamic Encounter

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 ().
encounter.identifier is optional; if you set it, use the same 36-character limit ().

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.

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

Refer to Ambient events to learn more about how to track and manage ambient interactions in the web SDK.

Get Started

Concepts & Feature Guides

API Reference

Resources

Dynamic Encounter

Code example

Next steps

​Code example

​Next steps

Code example

Next steps