Add the locale switcher to the toolbar

import { LocalizationContext, LocalizationMap, Viewer } from '@react-pdf-viewer/core';
import { localeSwitcherPlugin } from '@react-pdf-viewer/locale-switcher';

// The localization data for Vietnamese
import vi_VN from './vi_VN.json';

// Your render function
const localeSwitcherPluginInstance = localeSwitcherPlugin();
const { LocalePopover } = localeSwitcherPluginInstance;

const [locale, setLocale] = React.useState('en_US');
const [l10n, setL10n] = React.useState<LocalizationMap>();
const localizationContext = { l10n, setL10n };

const localizations = {
    en_US: null,
    vi_VN: (vi_VN as any) as LocalizationMap,
};

const switchToLocalization = (loc: string) => {
    setL10n(localizations[loc]);
    setLocale(loc);
};

return (
    <LocalizationContext.Provider value={localizationContext}>
        <LocalePopover
            initialLocale={locale}
            locales={{
                en_US: 'English',
                vi_VN: 'Tiếng Việt',
            }}
            localizations={localizations}
            onUpdateLocalization={switchToLocalization}
        />

        <Viewer
            fileUrl='...'
            plugins={[
                localeSwitcherPluginInstance,
            ]}
        />
    </LocalizationContext.Provider>
);