import { useEffect, type RefObject } from 'react'

type MenuRef = RefObject<HTMLElement | null>

type UseWorkspaceContextMenusOptions = {
  tabOpen: boolean
  tabRef: MenuRef
  closeTab: () => void
  moduleTabOpen: boolean
  moduleTabRef: MenuRef
  closeModuleTab: () => void
  treeOpen: boolean
  treeRef: MenuRef
  closeTree: () => void
  terminalOpen: boolean
  terminalRef: MenuRef
  closeTerminal: () => void
  gitFileOpen: boolean
  gitFileRef: MenuRef
  closeGitFile: () => void
}

function useCloseOnOutsideClick(open: boolean, ref: MenuRef, close: () => void): void {
  useEffect(() => {
    if (!open) return

    const closeOnOutsideClick = (event: MouseEvent): void => {
      if (!ref.current?.contains(event.target as Node)) {
        close()
      }
    }

    document.addEventListener('mousedown', closeOnOutsideClick)
    return () => document.removeEventListener('mousedown', closeOnOutsideClick)
  }, [open, ref, close])
}

export function useWorkspaceContextMenus({
  tabOpen,
  tabRef,
  closeTab,
  moduleTabOpen,
  moduleTabRef,
  closeModuleTab,
  treeOpen,
  treeRef,
  closeTree,
  terminalOpen,
  terminalRef,
  closeTerminal,
  gitFileOpen,
  gitFileRef,
  closeGitFile
}: UseWorkspaceContextMenusOptions): void {
  useCloseOnOutsideClick(tabOpen, tabRef, closeTab)
  useCloseOnOutsideClick(moduleTabOpen, moduleTabRef, closeModuleTab)
  useCloseOnOutsideClick(treeOpen, treeRef, closeTree)
  useCloseOnOutsideClick(terminalOpen, terminalRef, closeTerminal)
  useCloseOnOutsideClick(gitFileOpen, gitFileRef, closeGitFile)
}