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

const useSortSidebarVisibility = (componentName, defaultValue = false) => {
  const { userSettings, updateUserSettings } = useContext(ApiServerContext)
  const showSortSidebar =
    userSettings.sortSidebarVisibility[componentName] ?? defaultValue

  const setShowSortSidebar = useCallback(
    (nextValue) => {
      const value =
        typeof nextValue === 'function'
          ? nextValue(showSortSidebar)
          : nextValue
      updateUserSettings('sortSidebarVisibility', componentName, value)
    },
    [componentName, showSortSidebar, updateUserSettings]
  )

  return [showSortSidebar, setShowSortSidebar]
}

export default useSortSidebarVisibility
