applications/drive/src/app/UrlsApp.tsx

   1 import { useState } from 'react';
   2 import { BrowserRouter } from 'react-router-dom';
   3
   4 import * as bootstrap from '@proton/account/bootstrap';
   5 import {
   6     ApiProvider,
   7     AuthenticationProvider,
   8     ErrorBoundary,
   9     LoaderPage,
  10     ModalsChildren,
  11     NotificationsChildren,
  12     ProtonApp,
  13     StandardErrorPage,
  14     StandardLoadErrorPage,
  15 } from '@proton/components';
  16 import useEffectOnce from '@proton/hooks/useEffectOnce';
  17 import { ProtonStoreProvider } from '@proton/redux-shared-store';
  18 import createApi from '@proton/shared/lib/api/createApi';
  19 import { getClientID } from '@proton/shared/lib/apps/helper';
  20 import { getNonEmptyErrorMessage } from '@proton/shared/lib/helpers/error';
  21 import noop from '@proton/utils/noop';
  22
  23 import * as config from './config';
  24 import PublicSharedLinkContainer from './containers/PublicSharedLinkContainer';
  25 import locales from './locales';
  26 import type { DriveStore } from './redux-store/store';
  27 import { extendStore, setupStore } from './redux-store/store';
  28 import { extraThunkArguments } from './redux-store/thunk';
  29 import { userSuccessMetrics } from './utils/metrics/userSuccessMetrics';
  30 import { logPerformanceMarker } from './utils/performance';
  31
  32 const bootstrapApp = async () => {
  33     const authentication = bootstrap.createAuthentication({ initialAuth: false });
  34     bootstrap.init({ config, locales, authentication });
  35
  36     await userSuccessMetrics.init();
  37     await userSuccessMetrics.setVersionHeaders(getClientID(config.APP_NAME), config.APP_VERSION);
  38
  39     const store = setupStore();
  40     const api = createApi({ config });
  41     extendStore({ config, api, authentication });
  42
  43     const searchParams = new URLSearchParams(location.search);
  44     await bootstrap.publicApp({ app: config.APP_NAME, locales, searchParams, pathLocale: '' });
  45
  46     return { store };
  47 };
  48
  49 const UrlsApp = () => {
  50     const [state, setState] = useState<{ error?: string; store?: DriveStore }>({});
  51
  52     useEffectOnce(() => {
  53         (async () => {
  54             try {
  55                 const { store } = await bootstrapApp();
  56                 setState({ store });
  57                 logPerformanceMarker('drive_performance_clicktobootstrapped_histogram');
  58             } catch (error: any) {
  59                 setState({
  60                     error: getNonEmptyErrorMessage(error),
  61                 });
  62             }
  63         })().catch(noop);
  64     });
  65
  66     return (
  67         <ProtonApp config={config}>
  68             {(() => {
  69                 if (state.error) {
  70                     return <StandardLoadErrorPage errorMessage={state.error} />;
  71                 }
  72                 if (!state.store) {
  73                     return <LoaderPage />;
  74                 }
  75                 return (
  76                     <ProtonStoreProvider store={state.store}>
  77                         <BrowserRouter>
  78                             <AuthenticationProvider store={extraThunkArguments.authentication}>
  79                                 <ApiProvider api={extraThunkArguments.api}>
  80                                     <ErrorBoundary big component={<StandardErrorPage big />}>
  81                                         <div className="h-full">
  82                                             <NotificationsChildren />
  83                                             <ModalsChildren />
  84                                             <PublicSharedLinkContainer />
  85                                         </div>
  86                                     </ErrorBoundary>
  87                                 </ApiProvider>
  88                             </AuthenticationProvider>
  89                         </BrowserRouter>
  90                     </ProtonStoreProvider>
  91                 );
  92             })()}
  93         </ProtonApp>
  94     );
  95 };
  96
  97 export default UrlsApp;