import { useCallback, useContext } from 'react'
import { ApiServerContext } from '../context/ApiServerContext'

const useFilterSidebarVisibility = (componentName, defaultValue = false) => {
  const { userSettings, updateUserSettings } = useContext(ApiServerContext)
  const showFilterSidebar =
    userSettings.filterSidebarVisibility[componentName] ?? defaultValue

  const setShowFilterSidebar = useCallback(
    (nextValue) => {
      const value =
        typeof nextValue === 'function'
          ? nextValue(showFilterSidebar)
          : nextValue
      updateUserSettings('filterSidebarVisibility', componentName, value)
    },
    [componentName, showFilterSidebar, updateUserSettings]
  )

  return [showFilterSidebar, setShowFilterSidebar]
}

export default useFilterSidebarVisibility
