Обновлены компоненты интерфейса для работы с карточками товаров Wildberries: добавлены новые функции для загрузки и поиска карточек, улучшен интерфейс отображения товаров и их деталей. Исправлены проблемы с отображением текста и добавлены новые поля в GraphQL для работы с API ключами. Реализована логика обработки ошибок при взаимодействии с API.

src/components/supplies/create-supply-page.tsx

@@ -30,6 +30,7 @@ import {
 } from 'lucide-react'
 import { useRouter } from 'next/navigation'
 import Image from 'next/image'
+import { WBProductCards } from './wb-product-cards'
 
 interface WholesalerForCreation {
   id: string
@@ -72,6 +73,34 @@ interface SelectedProduct extends WholesalerProduct {
   wholesalerName: string
 }
 
+interface WildberriesCard {
+  nmID: number
+  vendorCode: string
+  title: string
+  description: string
+  brand: string
+  mediaFiles: string[]
+  sizes: Array<{
+    chrtID: number
+    techSize: string
+    wbSize: string
+    price: number
+    discountedPrice: number
+    quantity: number
+  }>
+}
+
+interface SelectedCard {
+  card: WildberriesCard
+  selectedQuantity: number
+  selectedMarket: string
+  selectedPlace: string
+  sellerName: string
+  sellerPhone: string
+  deliveryDate: string
+  selectedServices: string[]
+}
+
 // Моковые данные оптовиков
 const mockWholesalers: WholesalerForCreation[] = [
   {
@@ -229,6 +258,7 @@ export function CreateSupplyPage() {
   const [selectedVariant, setSelectedVariant] = useState<'cards' | 'wholesaler' | null>(null)
   const [selectedWholesaler, setSelectedWholesaler] = useState<WholesalerForCreation | null>(null)
   const [selectedProducts, setSelectedProducts] = useState<SelectedProduct[]>([])
+  const [selectedCards, setSelectedCards] = useState<SelectedCard[]>([])
   const [showSummary, setShowSummary] = useState(false)
   const [searchQuery, setSearchQuery] = useState('')
 
@@ -329,6 +359,13 @@ export function CreateSupplyPage() {
     return selectedProducts.reduce((sum, product) => sum + product.selectedQuantity, 0)
   }
 
+  const handleCardsComplete = (cards: SelectedCard[]) => {
+    setSelectedCards(cards)
+    console.log('Карточки товаров выбраны:', cards)
+    // TODO: Здесь будет создание поставки с данными карточек
+    router.push('/supplies')
+  }
+
   const handleCreateSupply = () => {
     if (selectedVariant === 'cards') {
       console.log('Создание поставки с карточками Wildberries')
@@ -706,6 +743,16 @@ export function CreateSupplyPage() {
     )
   }
 
+  // Рендер карточек Wildberries
+  if (selectedVariant === 'cards') {
+    return (
+      <WBProductCards 
+        onBack={() => setSelectedVariant(null)}
+        onComplete={handleCardsComplete}
+      />
+    )
+  }
+
   // Рендер выбора оптовиков
   if (selectedVariant === 'wholesaler') {
     return (