import React, { useMemo } from 'react'
import { SubNavigationContext } from './context'
import type { SubNavigationContextType } from './types'

/* Used specifically when rendering outside of the grid-cell component */
export const EmptySubNavigationContext = ({
    children,
}: {
    children: React.ReactNode
}) => {
    const value = useMemo<SubNavigationContextType>(
        () => ({
            currentSubFocusIndex: 0,
            hasFocus: false,
            registerIndexes: () => {},
            registeredIndexes: 0,
            setRendererWantsToDisplayFocusStyles: () => {},
            setCurrentSubFocusIndex: () => {},
        }),
        []
    )
    return (
        <SubNavigationContext.Provider value={value}>
            {children}
        </SubNavigationContext.Provider>
    )
}