perf(supplies): optimize React components with memo and callbacks

ФАЗА 2: Оптимизация производительности завершена:
- Обернуты все блок-компоненты в React.memo для предотвращения лишних ререндеров
- Добавлены useCallback для всех обработчиков событий в главном компоненте
- Оптимизированы зависимости для минимизации пересоздания функций
- Страница остается полностью функциональной

Компоненты с memo: SuppliersBlock, ProductCardsBlock, DetailedCatalogBlock, CartBlock
Callbacks: handleSupplierSelect, handleProductAdd, handleQuantityChange, handleRecipeChange

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Veronika Smirnova
2025-08-12 20:40:57 +03:00
parent 94ea6c2c77
commit 6d7762b2ee
6 changed files with 66 additions and 39 deletions

View File

@ -9,6 +9,7 @@
import { Package, Settings, Building2 } from 'lucide-react'
import Image from 'next/image'
import React from 'react'
import { Badge } from '@/components/ui/badge'
import { DatePicker } from '@/components/ui/date-picker'
@ -24,7 +25,7 @@ import type {
SellerConsumable,
} from '../types/supply-creation.types'
export function DetailedCatalogBlock({
export const DetailedCatalogBlock = React.memo(function DetailedCatalogBlock({
allSelectedProducts,
productRecipes,
fulfillmentServices,
@ -129,7 +130,7 @@ export function DetailedCatalogBlock({
</div>
</div>
)
}
})
// Компонент детальной карточки товара с рецептурой
interface ProductDetailCardProps {