'use client'

import { useState, useCallback, useMemo } from 'react'
import { DropResult } from '@hello-pangea/dnd'
import { ColumnConfig } from '../types'

interface UseColumnReorderOptions<TData> {
  columns: ColumnConfig<TData>[]
  initialOrder?: string[] | null
  enabled?: boolean
  onOrderChange?: (order: string[]) => void
}

interface UseColumnReorderReturn<TData> {
  orderedColumns: ColumnConfig<TData>[]
  columnOrder: string[]
  handleDragEnd: (result: DropResult) => void
  resetOrder: () => void
}

export function useColumnReorder<TData>({
  columns,
  initialOrder = null,
  enabled = true,
  onOrderChange,
}: UseColumnReorderOptions<TData>): UseColumnReorderReturn<TData> {
  // Initialize order from provided order or default to column IDs
  const defaultOrder = useMemo(() => columns.map(c => c.id), [columns])

  const [columnOrder, setColumnOrder] = useState<string[]>(() => {
    if (initialOrder && initialOrder.length > 0) {
      // Validate that all columns exist and add any new ones
      const validOrder = initialOrder.filter(id => columns.some(c => c.id === id))
      const newColumns = columns.filter(c => !initialOrder.includes(c.id)).map(c => c.id)
      return [...validOrder, ...newColumns]
    }
    return defaultOrder
  })

  // Reorder columns based on current order
  const orderedColumns = useMemo(() => {
    if (!enabled) return columns

    const columnMap = new Map(columns.map(c => [c.id, c]))
    const ordered: ColumnConfig<TData>[] = []

    // Add columns in order
    for (const id of columnOrder) {
      const column = columnMap.get(id)
      if (column) {
        ordered.push(column)
      }
    }

    // Add any columns not in the order (new columns)
    for (const column of columns) {
      if (!columnOrder.includes(column.id)) {
        ordered.push(column)
      }
    }

    return ordered
  }, [columns, columnOrder, enabled])

  // Handle drag end
  const handleDragEnd = useCallback((result: DropResult) => {
    if (!result.destination) return
    if (result.source.index === result.destination.index) return

    const newOrder = Array.from(columnOrder)
    const [removed] = newOrder.splice(result.source.index, 1)
    newOrder.splice(result.destination.index, 0, removed)

    setColumnOrder(newOrder)
    onOrderChange?.(newOrder)
  }, [columnOrder, onOrderChange])

  // Reset to default order
  const resetOrder = useCallback(() => {
    setColumnOrder(defaultOrder)
    onOrderChange?.(defaultOrder)
  }, [defaultOrder, onOrderChange])

  return {
    orderedColumns,
    columnOrder,
    handleDragEnd,
    resetOrder,
  }
}