24 lines
797 B
TypeScript
24 lines
797 B
TypeScript
|
/**
|
||
|
|
* SSEContext — provides SSE connection status throughout the component tree.
|
||
|
|
* Mount <SSEProvider> once inside QueryClientProvider.
|
||
|
|
*/
|
||
|
|
import { createContext, useContext, type ReactNode } from 'react'
|
||
|
|
import { useRealtimeSync } from '../hooks/useRealtimeSync'
|
||
|
|
import type { SSEStatus } from '../hooks/useSSE'
|
||
|
|
|
||
|
|
interface SSEContextValue {
|
||
|
|
sseStatus: SSEStatus
|
||
|
|
}
|
||
|
|
|
||
|
|
const SSEContext = createContext<SSEContextValue>({ sseStatus: 'connecting' })
|
||
|
|
|
||
|
|
export function SSEProvider({ children }: { children: ReactNode }) {
|
||
|
|
const { sseStatus } = useRealtimeSync()
|
||
|
|
return <SSEContext.Provider value={{ sseStatus }}>{children}</SSEContext.Provider>
|
||
|
|
}
|
||
|
|
|
||
|
|
/** Access the SSE connection status from any component. */
|
||
|
|
export function useSSEContext(): SSEContextValue {
|
||
|
|
return useContext(SSEContext)
|
||
|
|
}
|