import type { Column } from '../Table/index.js'

type TOGGLE = {
  payload: {
    column: string
  }
  type: 'toggle'
}

type SET = {
  payload: {
    columns: Column[]
  }
  type: 'set'
}

type MOVE = {
  payload: {
    fromIndex: number
    toIndex: number
  }
  type: 'move'
}

export type Action = MOVE | SET | TOGGLE

export const columnReducer = (state: Column[], action: Action): Column[] => {
  let newState = [...state]

  switch (action.type) {
    case 'toggle': {
      const { column } = action.payload

      const withToggledColumn = state.map((col) => {
        if (col?.name === column) {
          return {
            ...col,
            active: !col.active,
          }
        }

        return col
      })

      newState = withToggledColumn
      break
    }
    case 'move': {
      const { fromIndex, toIndex } = action.payload
      const withMovedColumn = [...state]
      const [columnToMove] = withMovedColumn.splice(fromIndex, 1)
      withMovedColumn.splice(toIndex, 0, columnToMove)
      newState = withMovedColumn
      break
    }
    case 'set': {
      const { columns } = action.payload
      newState = columns
      break
    }
    default:
      break
  }

  const firstActiveColumnIndex = newState.findIndex((column, index) => {
    if (column.active && column.accessor !== '_select') {
      return index
    }
  })

  const withFirstLink = newState.map((column, index) => {
    const isFirstActiveColumn = column.active && firstActiveColumnIndex === index

    return {
      ...column,
      cellProps: {
        ...column.cellProps,
        link: isFirstActiveColumn,
      },
    }
  }, [])

  return withFirstLink
}
