StreamVideo

The <StreamVideo /> provider makes the client and its state available to all child components and initializes internationalization

General usage

import { useEffect, useState } from "react";
import { StreamVideo, StreamVideoClient } from "@stream-io/video-react-sdk";

export const App = () => {
  const [client, setClient] = useState<StreamVideoClient>();
  useEffect(() => {
    const myClient = new StreamVideoClient({ apiKey, user, tokenProvider });
    setClient(myClient);
    return () => {
      myClient.disconnectUser();
      setClient(undefined);
    };
  }, [apiKey, user, tokenProvider]);

  return (
    <StreamVideo client={client}>
      <MyUI />
    </StreamVideo>
  );
};

Props

client

StreamVideoClient instance propagated to the component’s children as a part of StreamVideoContext. Children can access it with useStreamVideoClient() hook.

i18nInstance

The StreamI18n instance to use, if undefined is provided, a new instance will be created. For more information, see our Internationalization guide.

language

The language to translate UI labels. For more information, see our Internationalization guide.

translationsOverrides

Custom translations that will be merged with the defaults provided by the library. For more information, see our Internationalization guide.