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

Type
StreamVideoClient

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

i18nInstance

Type
StreamI18n | undefined

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

language

Type	Default
string | undefined	en

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

translationsOverrides

Type
TranslationsMap | undefined

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