'use client'

import React from 'react'

import { CancelConfirmDialog } from './blocks/CancelConfirmDialog'
import { ContextMenu } from './blocks/ContextMenu'
import { SupplyRowBlock } from './blocks/SupplyRowBlock'
import { Table, TableBody } from './blocks/TableComponents'
import { TableHeaderBlock } from './blocks/TableHeaderBlock'
import { useContextMenu } from './hooks/useContextMenu'
import { useExpansionState } from './hooks/useExpansionState'
import { useInputManagement } from './hooks/useInputManagement'
import type { MultiLevelSuppliesTableProps } from './types'

// ========== МОДУЛЬНАЯ ВЕРСИЯ MULTILEVEL SUPPLIES TABLE ==========
// Основной компонент многоуровневой таблицы поставок V1 (legacy)
// Модуляризован согласно паттерну MODULAR_ARCHITECTURE_PATTERN.md

export function MultiLevelSuppliesTable({
  supplies = [],
  loading: _loading = false,
  userRole = 'SELLER',
  activeTab,
  onSupplyAction,
  onVolumeChange,
  onPackagesChange,
  onUpdateComplete,
}: MultiLevelSuppliesTableProps) {
  // 🔄 ДЕТЕКЦИЯ ВЕРСИИ: Автоматическое определение V1 vs V2 данных
  const isV2Data = supplies.length > 0 && supplies[0] && 'seller' in supplies[0]
  
  // 🚀 DYNAMIC IMPORT: Подключаем V2 компонент если нужно
  const [V2Component, setV2Component] = React.useState<any>(null)
  
  React.useEffect(() => {
    if (isV2Data && !V2Component) {
      import('./v2-index').then(module => {
        setV2Component(() => module.MultiLevelSuppliesTableV2)
      })
    }
  }, [isV2Data, V2Component])

  // 🎯 V2 ROUTE: Если данные V2 и компонент загружен
  if (isV2Data && V2Component) {
    return (
      <V2Component
        supplies={supplies}
        loading={_loading}
        userRole={userRole}
        activeTab={activeTab}
        onSupplyAction={onSupplyAction}
        onVolumeChange={onVolumeChange}
        onPackagesChange={onPackagesChange}
        onUpdateComplete={onUpdateComplete}
      />
    )
  }

  // 📦 V1 LEGACY: Обычная V1 логика для старых данных
  const expansionState = useExpansionState()
  const inputManagement = useInputManagement(supplies, onVolumeChange, onPackagesChange, onUpdateComplete)
  const contextMenu = useContextMenu(onSupplyAction)

  return (
    <>
      <div className="relative">
        {/* V1 Таблица поставок (legacy) */}
        <Table>
          <TableHeaderBlock userRole={userRole} />
          
          <TableBody>
            {supplies.length > 0 &&
              supplies.map((supply, index) => {
                // Защита от неполных данных V1
                if (!supply.partner) {
                  console.warn('⚠️ V1 Supply without partner:', supply.id)
                  return null
                }

                const isSupplyExpanded = expansionState.expandedSupplies.has(supply.id)
                const inputValues = inputManagement.inputValues[supply.id] || { volume: '', packages: '' }

                return (
                  <React.Fragment key={supply.id}>
                    {/* УРОВЕНЬ 1: Основная строка V1 поставки */}
                    <SupplyRowBlock
                      supply={supply}
                      index={index}
                      userRole={userRole}
                      isExpanded={isSupplyExpanded}
                      inputValues={inputValues}
                      pendingUpdates={inputManagement.pendingUpdates}
                      onToggleExpansion={expansionState.toggleSupplyExpansion}
                      onVolumeChange={(value) => inputManagement.handleVolumeChange(supply.id, value)}
                      onPackagesChange={(value) => inputManagement.handlePackagesChange(supply.id, value)}
                      onVolumeBlur={() => inputManagement.handleVolumeBlur(supply.id)}
                      onPackagesBlur={() => inputManagement.handlePackagesBlur(supply.id)}
                      onSupplyAction={onSupplyAction}
                      onRightClick={contextMenu.handleRightClick}
                    />

                    {/* TODO: V1 УРОВЕНЬ 2-5 будут добавлены в следующих итерациях */}
                    {/* Пока что показываем только основной уровень поставок */}
                  </React.Fragment>
                )
              })}
          </TableBody>
        </Table>
      </div>

      {/* Контекстное меню (общее для V1 и V2) */}
      <ContextMenu
        isOpen={contextMenu.contextMenu.isOpen}
        position={contextMenu.contextMenu.position}
        onClose={contextMenu.handleCloseContextMenu}
        onCancel={contextMenu.handleCancelFromContextMenu}
      />

      <CancelConfirmDialog
        isOpen={contextMenu.cancelDialogOpen}
        onClose={() => contextMenu.setCancelDialogOpen(false)}
        onConfirm={contextMenu.handleConfirmCancel}
        supplyId={contextMenu.contextMenu.supplyId}
      />
    </>
  )
}