overleaf/services/web/frontend/js/features/ide-react/context/global-alerts-context.tsx
Alf Eaton eb3e5037f8 Merge pull request #16335 from overleaf/ae-real-time-down
[ide-react] Improve handling of lost connection

GitOrigin-RevId: 89b641b2beca4f9de65551e6873b3c8c11bb1695
2024-01-04 09:03:05 +00:00

36 lines
950 B
TypeScript

import { createContext, FC, useCallback, useContext, useState } from 'react'
const GlobalAlertsContext = createContext<HTMLDivElement | null | undefined>(
undefined
)
export const GlobalAlertsProvider: FC = ({ children }) => {
const [globalAlertsContainer, setGlobalAlertsContainer] =
useState<HTMLDivElement | null>(null)
const handleGlobalAlertsContainer = useCallback(
(node: HTMLDivElement | null) => {
setGlobalAlertsContainer(node)
},
[]
)
return (
<GlobalAlertsContext.Provider value={globalAlertsContainer}>
<div className="global-alerts" ref={handleGlobalAlertsContainer} />
{children}
</GlobalAlertsContext.Provider>
)
}
export const useGlobalAlertsContainer = () => {
const context = useContext(GlobalAlertsContext)
if (context === undefined) {
throw new Error(
'useGlobalAlertsContainer is only available inside GlobalAlertsProvider'
)
}
return context
}