Fix validating required cells when applying template

inventory/src/components/product-import/steps/ValidationStepNew/components/UpcValidationTableAdapter.tsx

@@ -2,7 +2,7 @@ import React, { useMemo } from 'react'
 import ValidationTable from './ValidationTable'
 import { RowSelectionState } from '@tanstack/react-table'
 import { Fields } from '../../../types'
-import { Template } from '../hooks/useValidationState'
+import { Template } from '../hooks/validationTypes'
 
 interface UpcValidationTableAdapterProps<T extends string> {
   data: any[]

inventory/src/components/product-import/steps/ValidationStepNew/components/ValidationContainer.tsx

@@ -1,5 +1,6 @@
 import React, { useState, useEffect, useRef, useCallback, useMemo, useLayoutEffect } from 'react'
-import { useValidationState, Props } from '../hooks/useValidationState'
+import { useValidationState } from '../hooks/useValidationState'
+import { Props } from '../hooks/validationTypes'
 import { Button } from '@/components/ui/button'
 import { Loader2, X, Plus, Edit3, Sparkles, FileText } from 'lucide-react'
 import { toast } from 'sonner'

inventory/src/components/product-import/steps/ValidationStepNew/components/ValidationTable.tsx

@@ -7,7 +7,7 @@ import {
   ColumnDef
 } from '@tanstack/react-table'
 import { Fields, Field } from '../../../types'
-import { RowData, Template } from '../hooks/useValidationState'
+import { RowData, Template } from '../hooks/validationTypes'
 import ValidationCell, { CopyDownContext } from './ValidationCell'
 import { useRsi } from '../../../hooks/useRsi'
 import SearchableTemplateSelect from './SearchableTemplateSelect'
@@ -411,14 +411,6 @@ const ValidationTable = <T extends string>({
             disabled: false
           };
           
-          // Debug logging
-          console.log(`Field ${fieldKey} in ValidationTable (after deep clone):`, {
-            originalField: field,
-            modifiedField: fieldWithType,
-            options,
-            hasOptions: options && options.length > 0,
-            disabled: fieldWithType.disabled
-          });
         }
         
         // Get item number from UPC validation results if available

inventory/src/components/product-import/steps/ValidationStepNew/hooks/useTemplateManagement.tsx

@@ -11,7 +11,11 @@ export const useTemplateManagement = <T extends string>(
   setValidationErrors: React.Dispatch<React.SetStateAction<Map<number, Record<string, ValidationError[]>>>>,
   setRowValidationStatus: React.Dispatch<React.SetStateAction<Map<number, "pending" | "validating" | "validated" | "error">>>,
   validateRow: (rowIndex: number, specificField?: string) => void,
-  isApplyingTemplateRef: React.MutableRefObject<boolean>
+  isApplyingTemplateRef: React.MutableRefObject<boolean>,
+  upcValidation: { 
+    validateUpc: (rowIndex: number, supplierId: string, upcValue: string) => Promise<{success: boolean, itemNumber?: string}>,
+    applyItemNumbersToData: (onApplied?: (updatedRowIds: number[]) => void) => void
+  }
 ) => {
   // Template state
   const [templates, setTemplates] = useState<Template[]>([]);
@@ -269,12 +273,40 @@ export const useTemplateManagement = <T extends string>(
 
         // Schedule UPC validation for the next tick to allow UI to update first
         setTimeout(() => {
+          // Track successful validations
+          const validationPromises: Promise<{success: boolean, itemNumber?: string}>[] = [];
+          
           upcValidationRows.forEach((rowIndex) => {
             const row = newData[rowIndex];
             if (row && row.upc && row.supplier) {
-              validateRow(rowIndex);
+              // FIXED: Directly call validateUpc instead of validateRow
+              console.log(`Directly calling validateUpc for row ${rowIndex} with UPC ${row.upc} and supplier ${row.supplier}`);
+              const validationPromise = upcValidation.validateUpc(rowIndex, row.supplier.toString(), row.upc.toString());
+              validationPromises.push(validationPromise);
             }
           });
+          
+          // After all validations complete, apply item numbers
+          if (validationPromises.length > 0) {
+            Promise.all(validationPromises)
+              .then(results => {
+                const successCount = results.filter(r => r.success).length;
+                console.log(`${successCount}/${validationPromises.length} UPC validations succeeded`);
+                
+                // Apply item numbers to the data
+                upcValidation.applyItemNumbersToData(updatedRowIds => {
+                  console.log(`Applied item numbers to ${updatedRowIds.length} rows`);
+                  
+                  // After applying item numbers, trigger validation for those rows
+                  updatedRowIds.forEach(rowIndex => {
+                    validateRow(rowIndex, 'item_number');
+                  });
+                });
+              })
+              .catch(err => {
+                console.error("Error in UPC validation batch:", err);
+              });
+          }
         }, 100);
       }
 
@@ -288,6 +320,7 @@ export const useTemplateManagement = <T extends string>(
       setValidationErrors,
       setRowValidationStatus,
       validateRow,
+      upcValidation,
     ]
   );
 

inventory/src/components/product-import/steps/ValidationStepNew/hooks/useValidationState.tsx

@@ -10,6 +10,7 @@ import { useRowOperations } from "./useRowOperations";
 import { useTemplateManagement } from "./useTemplateManagement";
 import { useFilterManagement } from "./useFilterManagement";
 import { useUniqueItemNumbersValidation } from "./useUniqueItemNumbersValidation";
+import { useUpcValidation } from "./useUpcValidation";
 import { Props, RowData } from "./validationTypes";
 
 export const useValidationState = <T extends string>({
@@ -99,6 +100,9 @@ export const useValidationState = <T extends string>({
     validateFieldFromHook
   );
 
+  // Use UPC validation hook - MUST be initialized before template management
+  const upcValidation = useUpcValidation(data, setData);
+
   // Use unique item numbers validation hook
   const { validateUniqueItemNumbers } = useUniqueItemNumbersValidation<T>(
     data, 
@@ -114,7 +118,8 @@ export const useValidationState = <T extends string>({
     setValidationErrors,
     setRowValidationStatus,
     validateRow,
-    isApplyingTemplateRef
+    isApplyingTemplateRef,
+    upcValidation
   );
 
   // Use filter management hook