import type { FC, PropsWithChildren } from 'react';

import { setLng } from '@/locales';
import { localStg } from '@/utils/storage';

import { LangContext } from './langContext';

const localeOptions = [
  {
    key: 'zh-CN',
    label: '中文'
  },
  {
    key: 'en-US',
    label: 'English'
  }
] satisfies App.I18n.LangOption[];

const LangProvider: FC<PropsWithChildren> = ({ children }) => {
  const [locale, setLocale] = useState<App.I18n.LangType>(localStg.get('lang') || 'zh-CN');

  function changeLocale(lang: App.I18n.LangType) {
    setLng(lang);

    setLocale(lang);

    localStg.set('lang', lang);
  }

  return <LangContext value={{ locale, localeOptions, setLocale: changeLocale }}>{children}</LangContext>;
};

export default LangProvider;