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> ); };StreamVideo
The <StreamVideo /> provider makes the client and its state available to all child components and initializes internationalization
General usage
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.