import { QueryParams } from 'constants/query'; import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder'; import { mapQueryDataFromApi } from 'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi'; import { createContext, useCallback, useContext, useMemo, useReducer, useState, } from 'react'; import { useLocation } from 'react-router-dom'; import { AlertTypes } from 'types/api/alerts/alertTypes'; import { AlertDef } from 'types/api/alerts/def'; import { INITIAL_ALERT_STATE } from './constants'; import { ICreateAlertContextProps, ICreateAlertProviderProps } from './types'; import { alertCreationReducer, buildInitialAlertDef, getInitialAlertTypeFromURL, } from './utils'; const CreateAlertContext = createContext(null); // Hook exposing context state for CreateAlert export const useCreateAlertState = (): ICreateAlertContextProps => { const context = useContext(CreateAlertContext); if (!context) { throw new Error( 'useCreateAlertState must be used within CreateAlertProvider', ); } return context; }; export function CreateAlertProvider( props: ICreateAlertProviderProps, ): JSX.Element { const { children } = props; const [alertState, setAlertState] = useReducer( alertCreationReducer, INITIAL_ALERT_STATE, ); const { currentQuery, redirectWithQueryBuilderData } = useQueryBuilder(); const location = useLocation(); const queryParams = new URLSearchParams(location.search); const [alertType, setAlertType] = useState(() => getInitialAlertTypeFromURL(queryParams, currentQuery), ); const [alertDef] = useState(buildInitialAlertDef(alertType)); const handleAlertTypeChange = useCallback( (value: AlertTypes): void => { const queryToRedirect = buildInitialAlertDef(value); const currentQueryToRedirect = mapQueryDataFromApi( queryToRedirect.condition.compositeQuery, ); redirectWithQueryBuilderData( currentQueryToRedirect, { [QueryParams.alertType]: value, }, undefined, true, ); setAlertType(value); }, [redirectWithQueryBuilderData], ); const contextValue: ICreateAlertContextProps = useMemo( () => ({ alertState, setAlertState, alertType, setAlertType: handleAlertTypeChange, alertDef, }), [alertState, alertType, handleAlertTypeChange, alertDef], ); return ( {children} ); }