// language support en-US / zh-CN / ja-JP / ko-KR / zh-TW / auto
  <UIKitProvider language={'en-US'}>...</UIKitProvider>

import { UIKitProvider, ConversationList } from '@tencentcloud/chat-uikit-react';

function App() {
  const [lang, setLang] = useState<'en-US' | 'zh-CN' | 'zh-TW' | 'ja-JP' | 'ko-KR'>('en-US');
  return (
    <div>
      <button onClick={() => setLang('zh-CN')}>Chinese</button>
      <button onClick={() => setLang('en-US')}>English</button>
      <div>{`Current language: ${lang}`}</div>
      <UIKitProvider
        language={lang}
        theme="light"
      >
        <ConversationList />
      </UIKitProvider>
    </div>
  );
}

import React from 'react';
import { useUIKit, UIKitProvider, ConversationList } from '@tencentcloud/chat-uikit-react';

function LanguageSwitch() {
  const { t, language, setLanguage } = useUIKit();
  return (
    <div>
      <div>Current language: ${language}</div>
      <div>{t('Search.Searching')}</div>
      <button onClick={() => setLanguage('en-US')}>English</button>
      <button onClick={() => setLanguage('zh-CN')}>Chinese</button>
    </div>
  );
}

function ChatApp() {
  return (
    <UIKitProvider language="en-US">
     <LanguageSwitch />
    </UIKitProvider>
  );
}

import React from 'react';
import { UIKitProvider, useUIKit } from '@tencentcloud/chat-uikit-react';

export default function App() {
  return (
    // init language
    <UIKitProvider language='en-US'>
      <Child />
    </UIKitProvider>
  );
}

function Child() {
    const { t } = useUIKit();
    return <div>{t('TUIChat.No More')}</div>
}