'use client'

import { Package } from 'lucide-react'
import React from 'react'

import { Card } from '@/components/ui/card'
import { useAuth } from '@/hooks/useAuth'

import { GoodsSuppliesTable } from '../goods-supplies-table'

interface AllSuppliesTabProps {
  pendingSupplyOrders?: number
  goodsSupplies?: any[] // Данные поставок товаров из обоих источников
  loading?: boolean
}

export function AllSuppliesTab({ pendingSupplyOrders = 0, goodsSupplies = [], loading = false }: AllSuppliesTabProps) {
  const { user } = useAuth()

  // ✅ ЕДИНАЯ ТАБЛИЦА ПОСТАВОК ТОВАРОВ согласно rules2.md 9.5.3
  return (
    <div className="h-full">
      {goodsSupplies.length === 0 && !loading ? (
        <Card className="bg-white/10 backdrop-blur border-white/20 p-8">
          <div className="text-center">
            <Package className="h-16 w-16 mx-auto mb-4 text-white/30" />
            <h3 className="text-xl font-semibold text-white mb-2">Поставки товаров</h3>
            <p className="text-white/60 mb-4">
              Здесь отображаются все поставки товаров, созданные через карточки и у поставщиков
            </p>
            <div className="text-sm text-white/50">
              <p>• Карточки - импорт через WB API</p>
              <p>• Поставщики - прямой заказ с рецептурой</p>
            </div>
          </div>
        </Card>
      ) : (
        <GoodsSuppliesTable supplies={goodsSupplies} loading={loading} />
      )}
    </div>
  )
}
