import './styles.css';

import { createI18n, pickLocale } from '@pipu/i18n';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { I18nextProvider } from 'react-i18next';

import { App } from './App';

const LOCALE_KEY = 'pipu.locale';

function storedLocale(): string[] {
  try {
    const v = localStorage.getItem(LOCALE_KEY);
    return v ? [v] : [];
  } catch {
    return [];
  }
}

const i18n = await createI18n(pickLocale([...storedLocale(), ...navigator.languages]));
document.documentElement.lang = i18n.language;
i18n.on('languageChanged', (l) => {
  try {
    localStorage.setItem(LOCALE_KEY, l);
  } catch {
    // недоступное хранилище не мешает работе
  }
});

const queryClient = new QueryClient({ defaultOptions: { queries: { retry: 1, refetchOnWindowFocus: false } } });

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <I18nextProvider i18n={i18n}>
      <QueryClientProvider client={queryClient}>
        <App />
      </QueryClientProvider>
    </I18nextProvider>
  </StrictMode>,
);