1import {useEffect} from 'react';
 2import 'leaflet/dist/leaflet.css';
 3import '../public/leaflet_reset.css';
 4import CssBaseline from '@mui/material/CssBaseline';
 5import {ThemeProvider, Theme} from '@mui/material/styles';
 6import {AppProps} from 'next/app';
 7import {I18nextProvider} from 'react-i18next';
 8import {ApolloProvider} from '@apollo/client';
 9import {LocalizationProvider} from '@mui/x-date-pickers/LocalizationProvider';
10import {AdapterMoment} from '@mui/x-date-pickers/AdapterMoment';
11import {SessionProvider} from 'next-auth/react';
12import moment from 'moment';
13import Metas from '../containers/Metas';
14import Toasts from '../components/Toasts';
15import theme from '../theme';
16import useLocale from '../hooks/useLocale';
17import i18n, {initI18Next} from '../lib/i18n';
18import {useApollo} from '../lib/apolloClient';
19
20declare module '@mui/styles/defaultTheme' {
21  // eslint-disable-next-line @typescript-eslint/no-empty-interface
22  interface DefaultTheme extends Theme {}
23}
24
25const App = function (props: AppProps) {
26  const {Component, pageProps} = props;
27  const apolloClient = useApollo(pageProps);
28  const {locale} = useLocale();
29
30  useEffect(() => {
31    // Remove the server-side injected CSS.
32    const jssStyles = document.querySelector('#jss-server-side');
33    if (jssStyles) {
34      jssStyles.parentElement!.removeChild(jssStyles);
35    }
36  }, []);
37
38  initI18Next(locale);
39
40  return (
41    <I18nextProvider i18n={i18n}>
42      <ApolloProvider client={apolloClient}>
43        <Metas metas={pageProps.metas} />
44        <ThemeProvider theme={theme}>
45          <LocalizationProvider
46            dateAdapter={AdapterMoment}
47            dateLibInstance={moment}
48            adapterLocale={locale === 'fr' ? 'fr-ch' : 'en'}
49          >
50            <CssBaseline />
51            <Component {...pageProps} />
52            <Toasts />
53          </LocalizationProvider>
54        </ThemeProvider>
55      </ApolloProvider>
56    </I18nextProvider>
57  );
58};
59
60const AppWrapper = (props: AppProps) => (
61  <SessionProvider session={props?.pageProps.session} basePath="/api/nauth">
62    <App {...props} />
63  </SessionProvider>
64);
65
66export default AppWrapper;