import { useState } from 'react'

import type { SortCondition, PlayersTableProps } from '../types'
import { usePlayers } from './usePlayers'
import { useTable } from './useTable'

export const usePlayersTable = ({ teamId }: PlayersTableProps) => {
  const [sortCondition, setSortCondition] = useState<SortCondition>({ dir: 'asc', paramId: null })

  const {
    getFullName,
    getPlayerParams,
    players,
  } = usePlayers({ sortCondition, teamId })

  const {
    containerRef,
    firstColumnWidth,
    getDisplayedValue,
    handleScroll,
    handleSortClick,
    isExpanded,
    paramColumnWidth,
    params,
    showExpandButton,
    showLeftArrow,
    showRightArrow,
    slideLeft,
    slideRight,
    tableWrapperRef,
    toggleIsExpanded,
  } = useTable({
    setSortCondition,
    teamId,
  })

  return {
    containerRef,
    firstColumnWidth,
    getDisplayedValue,
    getFullName,
    getPlayerParams,
    handleScroll,
    handleSortClick,
    isExpanded,
    paramColumnWidth,
    params,
    players,
    showExpandButton,
    showLeftArrow,
    showRightArrow,
    slideLeft,
    slideRight,
    sortCondition,
    tableWrapperRef,
    toggleIsExpanded,
  }
}
