packages/components/containers/api/ApiProvider.tsx

   1 import { type ReactNode } from 'react';
   2 import { useEffect, useReducer, useState } from 'react';
   3
   4 import useAuthentication from '@proton/components/hooks/useAuthentication';
   5 import useConfig from '@proton/components/hooks/useConfig';
   6 import useNotifications from '@proton/components/hooks/useNotifications';
   7 import type { ApiListenerCallback, ApiWithListener } from '@proton/shared/lib/api/createApi';
   8 import { handleInvalidSession } from '@proton/shared/lib/authentication/logout';
   9 import isDeepEqual from '@proton/shared/lib/helpers/isDeepEqual';
  10
  11 import ApiModals from './ApiModals';
  12 import ApiContext from './apiContext';
  13 import ApiServerTimeContext from './apiServerTimeContext';
  14 import ApiStatusContext, { defaultApiStatus } from './apiStatusContext';
  15
  16 const reducer = (oldState: typeof defaultApiStatus, diff: Partial<typeof defaultApiStatus>) => {
  17     const newState = {
  18         ...oldState,
  19         ...diff,
  20     };
  21     if (isDeepEqual(oldState, newState)) {
  22         return oldState;
  23     }
  24     return newState;
  25 };
  26
  27 const ApiProvider = ({ api, children }: { api: ApiWithListener; children: ReactNode }) => {
  28     const { APP_NAME } = useConfig();
  29     const { createNotification } = useNotifications();
  30     const authentication = useAuthentication();
  31     const [apiStatus, setApiStatus] = useReducer(reducer, defaultApiStatus);
  32     const [apiServerTime, setApiServerTime] = useState<Date | undefined>(undefined);
  33
  34     useEffect(() => {
  35         setApiStatus(defaultApiStatus);
  36
  37         const handleEvent: ApiListenerCallback = (event) => {
  38             if (event.type === 'notification') {
  39                 createNotification(event.payload);
  40                 return true;
  41             }
  42
  43             if (event.type === 'server-time') {
  44                 setApiServerTime(event.payload);
  45                 return true;
  46             }
  47
  48             if (event.type === 'status') {
  49                 setApiStatus(event.payload);
  50                 return true;
  51             }
  52
  53             if (event.type === 'logout') {
  54                 handleInvalidSession({ appName: APP_NAME, authentication });
  55                 return true;
  56             }
  57
  58             return false;
  59         };
  60         api.addEventListener(handleEvent);
  61         return () => {
  62             api.removeEventListener(handleEvent);
  63         };
  64     }, [api]);
  65
  66     return (
  67         <ApiContext.Provider value={api}>
  68             <ApiStatusContext.Provider value={apiStatus}>
  69                 <ApiServerTimeContext.Provider value={apiServerTime}>
  70                     {children}
  71                     <ApiModals api={api} />
  72                 </ApiServerTimeContext.Provider>
  73             </ApiStatusContext.Provider>
  74         </ApiContext.Provider>
  75     );
  76 };
  77
  78 export default ApiProvider;