diff --git a/src/Pages/Product/ProductList.jsx b/src/Pages/Product/ProductList.jsx
index cced5d0..67b24f8 100644
--- a/src/Pages/Product/ProductList.jsx
+++ b/src/Pages/Product/ProductList.jsx
@@ -100,10 +100,18 @@ import ScannedProductTable from '../../Components/PedalOCR/scannedProductTable.j
 import MultiCameraCropOCR from '../../Components/PedalOCR/MultiCameraCropOCR.jsx';
 import OCRLoader from '../../Components/PedalOCR/OCRLoader.jsx';
 import { GiHorizontalFlip, GiVerticalFlip } from 'react-icons/gi';
-import { FaPlus } from "react-icons/fa6";
+import { FaPlus } from 'react-icons/fa6';
 import { Tables } from '../../../ownLib/my-ui-lib.js';
+import StickerPrintModel from './StickerPrintModal.jsx';
+import StickerPrintTemplates from './StickerTemplates.jsx';
+import QRCodeCopiesModal from './QRCodeCopiesModal.jsx';
+import {
+  generateBarcode,
+  generateCodeImage,
+  generateQRCode,
+  generateQRCodeCopy,
+} from '../../Services/utils.js';
 
-const colorText = 'Color : Red';
 const ProductList = () => {
   const { SadminuserAccess } = useAuth();
   let SAAccessCommonMaster = SadminuserAccess?.find(
@@ -114,11 +122,7 @@ const ProductList = () => {
   const navigateTo = useNavigate();
   const dispatch = useDispatch();
   const location = useLocation();
-  const barCodeImage =
-    'https://cdn.pixabay.com/photo/2014/04/02/16/19/barcode-306926_1280.png';
-  const qrCodeImage =
-    'https://cdn.pixabay.com/photo/2015/03/21/09/34/qr-683354_640.png';
-  const previewText = 'Barcode Preview';
+
   const CompId = getSession('CompId');
   const BranchId = getSession('BranchId');
   const AppId = getSession('AppId');
@@ -154,7 +158,7 @@ const ProductList = () => {
     UomTypePreference?.some?.(
       (e) =>
         e?.PreferredSubCatName?.toLowerCase() ==
-        item?.ConfigName?.toLowerCase() && e?.PreferredStatus == 'Y'
+          item?.ConfigName?.toLowerCase() && e?.PreferredStatus == 'Y'
     )
   );
 
@@ -242,7 +246,6 @@ const ProductList = () => {
   const valueStyleColumn = {
     flexDirection: templateOptions.value === 'T' ? 'column' : 'column-reverse',
   };
-
   const [base64Image, setBase64Image] = useState(null);
   const [barcodeBase64Image, setBarcodeBase64Image] = useState(null);
   const [deleteProductPages, setDeleteProductPages] = useState([]);
@@ -263,7 +266,7 @@ const ProductList = () => {
   const [onlineImage, setOnlineImage] = useState(null);
   const [imageUrl, setImageUrl] = useState('');
   const [recordIndex, setRecordIndex] = useState(null);
-
+  const [printReady, setPrintReady] = useState(false);
 
   const [rangeFrom, setRangeFrom] = useState('');
   const [rangeTo, setRangeTo] = useState('');
@@ -272,7 +275,6 @@ const ProductList = () => {
   const [productWiseQrcode, setProductWiseQrcode] = useState(false);
   const lastRangeIdsRef = useRef([]);
 
-
   const subDirectory = import.meta.env.ENV_BASE_URL;
   // const [openTour, setOpenTour] = useState(false);
 
@@ -284,7 +286,7 @@ const ProductList = () => {
   //     placement: 'top',
   //   },
   // ];
-
+  console.log(QrandbarcodeDatas, 'QrandbarcodeDatas');
   const items = [
     {
       name: 'Home',
@@ -318,6 +320,10 @@ const ProductList = () => {
     setPopUp(true);
   };
 
+  const Datas = Array.from({ length: 5 }, (_, i) => i + 10);
+  const ModifiedData = Datas?.map((e) => ({ value: e }));
+  console.log(ModifiedData, 'Datas');
+
   useEffect(() => {
     if (deleteProductPages?.length > 0) {
       getForDeleteProduct(deleteProductPages);
@@ -327,12 +333,6 @@ const ProductList = () => {
     }
   }, [deleteProductPages]);
 
-  useEffect(() => {
-    if (coresdata?.length > 0 && open) {
-      CoresOnChange(coresdata?.[0].ConfigName);
-    }
-  }, [open]);
-
   useEffect(() => {
     if (!AllProdIds?.length) return;
     const cleaned = deleteInput?.replace(/\s+/g, '');
@@ -858,31 +858,7 @@ const ProductList = () => {
   //     onlineImage,
   //   ]
   // );
-  const formatDate = (dateStr) => {
-    const d = new Date(dateStr);
 
-    const day = String(d.getDate()).padStart(2, '0');
-
-    const months = [
-      'JAN',
-      'FEB',
-      'MAR',
-      'APR',
-      'MAY',
-      'JUN',
-      'JUL',
-      'AUG',
-      'SEP',
-      'OCT',
-      'NOV',
-      'DEC',
-    ];
-    const month = months[d.getMonth()];
-
-    const year = String(d.getFullYear()).slice(-2);
-
-    return `${day}-${month}-${year}`;
-  };
   const handleCheckboxChange = (record, checked) => {
     setSelectedRecords((prev) => {
       if (checked) {
@@ -892,8 +868,13 @@ const ProductList = () => {
       }
     });
   };
-  const CreateQrcode = async (isChecked, code, productName, StockAvailable, copiesCount = 0) => {
-
+  const CreateQrcode = async (
+    isChecked,
+    code,
+    productName,
+    StockAvailable,
+    copiesCount = 0
+  ) => {
     if (!code) return;
 
     if (isChecked) {
@@ -905,7 +886,7 @@ const ProductList = () => {
           url: data,
           productName: productName,
           copiesCount: copiesCount,
-          StockAvailable: StockAvailable
+          StockAvailable: StockAvailable,
         },
       ]);
     } else {
@@ -919,7 +900,15 @@ const ProductList = () => {
       for (let i = 0; i < products.length; i += batchSize) {
         const batch = products.slice(i, i + batchSize);
         await Promise.all(
-          batch.map((product) => CreateQrcode(true, product.QRCode, product.ProdName, product.StockAvailable, product.TotalBalanceQty))
+          batch.map((product) =>
+            CreateQrcode(
+              true,
+              product.QRCode,
+              product.ProdName,
+              product.StockAvailable,
+              product.TotalBalanceQty
+            )
+          )
         );
         // Small delay to prevent UI blocking
         if (i + batchSize < products.length) {
@@ -927,7 +916,15 @@ const ProductList = () => {
         }
       }
     } else {
-      products.forEach((product) => CreateQrcode(false, product.QRCode, product.ProdName, product.StockAvailable, product.TotalBalanceQty));
+      products.forEach((product) =>
+        CreateQrcode(
+          false,
+          product.QRCode,
+          product.ProdName,
+          product.StockAvailable,
+          product.TotalBalanceQty
+        )
+      );
     }
   };
 
@@ -968,19 +965,19 @@ const ProductList = () => {
       },
       ...(brandColumn && subCategory
         ? [
-          {
-            title: 'Brand',
-            dataIndex: 'BrandName',
-            key: 'BrandName',
-            columnKey: 'BrandName',
-            width: '100px',
-            render: (text) => <a style={{ color: 'black' }}>{text}</a>,
-            sorter: (a, b) => a?.BrandName?.localeCompare(b?.BrandName),
-            sortOrder:
-              sortedInfo.columnKey === 'BrandName' ? sortedInfo.order : null,
-            ellipsis: true,
-          },
-        ]
+            {
+              title: 'Brand',
+              dataIndex: 'BrandName',
+              key: 'BrandName',
+              columnKey: 'BrandName',
+              width: '100px',
+              render: (text) => <a style={{ color: 'black' }}>{text}</a>,
+              sorter: (a, b) => a?.BrandName?.localeCompare(b?.BrandName),
+              sortOrder:
+                sortedInfo.columnKey === 'BrandName' ? sortedInfo.order : null,
+              ellipsis: true,
+            },
+          ]
         : []),
 
       {
@@ -999,121 +996,127 @@ const ProductList = () => {
 
       ...(qrCodeColumn
         ? [
-          {
-            title: 'QRCode',
-            dataIndex: 'QRCode',
-            key: 'QRCode',
-            width: '100px',
-            align: 'center',
-            render: (text) => (
-              <a style={{ color: 'black' }}>{text ? text : '-'}</a>
-            ),
-            ellipsis: true,
-          },
-          {
-            title: (
-              <Tooltip title=" printing multiple QR codes">
-                <Space>
-                  {MultiCode && (
-                    <input
-                      type="checkbox"
-                      checked={
-                        selectedRecords.length > 0 &&
-                        productData
-                          .filter((p) => p?.QRCode)
-                          .every((p) =>
-                            selectedRecords.some((r) => r.ProdId === p.ProdId)
-                          )
-                      }
-                      onChange={(e) => {
-                        const productsWithQR = productData.filter(
-                          (p) => p?.QRCode
-                        );
-                        if (e.target.checked) {
-                          const newSelections = productsWithQR.filter(
-                            (p) =>
-                              !selectedRecords.some(
-                                (r) => r.ProdId === p.ProdId
-                              )
-                          );
-                          setSelectedRecords((prev) => [
-                            ...prev,
-                            ...newSelections,
-                          ]);
-                          // Create QR codes for newly selected products
-                          CreateQrcodesBatch(newSelections, true);
-                        } else {
-                          // Remove QR codes for deselected products
-                          CreateQrcodesBatch(productsWithQR, false);
-                          setSelectedRecords((prev) =>
-                            prev.filter(
-                              (r) =>
-                                !productsWithQR.some(
-                                  (p) => p.ProdId === r.ProdId
-                                )
-                            )
-                          );
-                        }
-                      }}
-                    />
-                  )}
-                  <span>Print QRCode</span>
-                  <CheckSquareOutlined
-                    style={{
-                      fontSize: '18px',
-                      cursor: 'pointer',
-                      color: MultiCode ? '#1890ff' : '#666',
-                    }}
-                    onClick={() => {
-                      setMultiCode((prev) => {
-                        const newValue = !prev;
-                        if (!newValue) {
-                          setSelectedRecords([]);
-                        }
-
-                        return newValue;
-                      });
-                    }}
-                  />
-                </Space>
-              </Tooltip>
-            ),
-            key: 'Print',
-            dataIndex: 'Print',
-            width: '100px',
-            align: 'center',
-            render: (_, record) =>
-              productData.length >= 1 ? (
-                <Space size="middle">
-                  {MultiCode ? (
-                    record?.QRCode ? (
+            {
+              title: 'QRCode',
+              dataIndex: 'QRCode',
+              key: 'QRCode',
+              width: '100px',
+              align: 'center',
+              render: (text) => (
+                <a style={{ color: 'black' }}>{text ? text : '-'}</a>
+              ),
+              ellipsis: true,
+            },
+            {
+              title: (
+                <Tooltip title=" printing multiple QR codes">
+                  <Space>
+                    {MultiCode && (
                       <input
                         type="checkbox"
-                        checked={selectedRecords.some(
-                          (r) => r.ProdId == record.ProdId
-                        )}
+                        checked={
+                          selectedRecords.length > 0 &&
+                          productData
+                            .filter((p) => p?.QRCode)
+                            .every((p) =>
+                              selectedRecords.some((r) => r.ProdId === p.ProdId)
+                            )
+                        }
                         onChange={(e) => {
-                          handleCheckboxChange(record, e.target.checked);
-                          CreateQrcode(e.target.checked, record.QRCode, record?.ProdName, record?.StockAvailable, record?.TotalBalanceQty);
+                          const productsWithQR = productData.filter(
+                            (p) => p?.QRCode
+                          );
+                          if (e.target.checked) {
+                            const newSelections = productsWithQR.filter(
+                              (p) =>
+                                !selectedRecords.some(
+                                  (r) => r.ProdId === p.ProdId
+                                )
+                            );
+                            setSelectedRecords((prev) => [
+                              ...prev,
+                              ...newSelections,
+                            ]);
+                            // Create QR codes for newly selected products
+                            CreateQrcodesBatch(newSelections, true);
+                          } else {
+                            // Remove QR codes for deselected products
+                            CreateQrcodesBatch(productsWithQR, false);
+                            setSelectedRecords((prev) =>
+                              prev.filter(
+                                (r) =>
+                                  !productsWithQR.some(
+                                    (p) => p.ProdId === r.ProdId
+                                  )
+                              )
+                            );
+                          }
                         }}
                       />
+                    )}
+                    <span>Print QRCode</span>
+                    <CheckSquareOutlined
+                      style={{
+                        fontSize: '18px',
+                        cursor: 'pointer',
+                        color: MultiCode ? '#1890ff' : '#666',
+                      }}
+                      onClick={() => {
+                        setMultiCode((prev) => {
+                          const newValue = !prev;
+                          if (!newValue) {
+                            setSelectedRecords([]);
+                          }
+
+                          return newValue;
+                        });
+                      }}
+                    />
+                  </Space>
+                </Tooltip>
+              ),
+              key: 'Print',
+              dataIndex: 'Print',
+              width: '100px',
+              align: 'center',
+              render: (_, record) =>
+                productData.length >= 1 ? (
+                  <Space size="middle">
+                    {MultiCode ? (
+                      record?.QRCode ? (
+                        <input
+                          type="checkbox"
+                          checked={selectedRecords.some(
+                            (r) => r.ProdId == record.ProdId
+                          )}
+                          onChange={(e) => {
+                            handleCheckboxChange(record, e.target.checked);
+                            CreateQrcode(
+                              e.target.checked,
+                              record.QRCode,
+                              record?.ProdName,
+                              record?.StockAvailable,
+                              record?.TotalBalanceQty
+                            );
+                          }}
+                        />
+                      ) : (
+                        '-'
+                      )
+                    ) : record?.QRCode ? (
+                      <a>
+                        <PrinterFilled
+                          style={{ fontSize: '20px' }}
+                          onClick={() => Qrcode(record)}
+                        />
+                      </a>
                     ) : (
                       '-'
-                    )
-                  ) : record?.QRCode ? (
-                    <a>
-                      <PrinterFilled
-                        style={{ fontSize: '20px' }}
-                        onClick={() => Qrcode(record)}
-                      />
-                    </a>
-                  ) : (
-                    '-'
-                  )}
-                </Space>
-              ) : null,
-          },
-        ]
+                    )}
+                  </Space>
+                ) : null,
+            },
+          ]
         : []),
 
       {
@@ -1131,11 +1134,11 @@ const ProductList = () => {
                     style={{ color: '#1292EE' }}
                     onClick={() =>
                       UserType === 'Super Admin' ||
-                        (UserType === 'Super Admin User' &&
-                          SAAccessCommonMaster?.UpdateAccess === 'Y') ||
-                        (UserType === 'Employee' &&
-                          empData?.UpdateAccess === 'Y') ||
-                        UserType === 'Admin'
+                      (UserType === 'Super Admin User' &&
+                        SAAccessCommonMaster?.UpdateAccess === 'Y') ||
+                      (UserType === 'Employee' &&
+                        empData?.UpdateAccess === 'Y') ||
+                      UserType === 'Admin'
                         ? actionsFormatter(record, index)
                         : null
                     }
@@ -1152,11 +1155,11 @@ const ProductList = () => {
                     }}
                     onClick={() =>
                       UserType === 'Super Admin' ||
-                        (UserType === 'Super Admin User' &&
-                          SAAccessCommonMaster?.DeleteAccess === 'Y') ||
-                        (UserType === 'Employee' &&
-                          empData?.DeleteAccess === 'Y') ||
-                        UserType === 'Admin'
+                      (UserType === 'Super Admin User' &&
+                        SAAccessCommonMaster?.DeleteAccess === 'Y') ||
+                      (UserType === 'Employee' &&
+                        empData?.DeleteAccess === 'Y') ||
+                      UserType === 'Admin'
                         ? statusFormatter(record)
                         : null
                     }
@@ -1168,11 +1171,11 @@ const ProductList = () => {
                     }}
                     onClick={() =>
                       UserType === 'Super Admin' ||
-                        (UserType === 'Super Admin User' &&
-                          SAAccessCommonMaster?.DeleteAccess === 'Y') ||
-                        (UserType === 'Employee' &&
-                          empData?.DeleteAccess === 'Y') ||
-                        UserType === 'Admin'
+                      (UserType === 'Super Admin User' &&
+                        SAAccessCommonMaster?.DeleteAccess === 'Y') ||
+                      (UserType === 'Employee' &&
+                        empData?.DeleteAccess === 'Y') ||
+                      UserType === 'Admin'
                         ? statusFormatter(record)
                         : null
                     }
@@ -1421,17 +1424,6 @@ const ProductList = () => {
     onlineImage,
   ]);
 
-  const handleImageTag = (w, h = '40px', barcodeOrQr) => {
-    return (
-      <img
-        src={barcodeOrQr ? barCodeImage : qrCodeImage}
-        alt={previewText}
-        width={w}
-        height={h}
-      />
-    );
-  };
-
   const updateImageUrl = (url) => {
     setImageUrl(url);
   };
@@ -1749,17 +1741,7 @@ const ProductList = () => {
       }
     }
   };
-  const generateQRCode = (code) => {
-    let Data = QrandbarcodeDatas?.find((e) => e?.key === code)?.url;
-    return Data
-  }
 
-  const generateQRCodeCopy = (code) => {
-    const found = QrandbarcodeDatas?.find((e) => e?.key === code);
-    const count = Number(found?.copiesCount);
-    return Number.isFinite(count) && count > 0 ? count : 0;
-
-  };
   const imageUrlToBase64 = async (url) => {
     try {
       const response = await fetch(url);
@@ -1948,70 +1930,79 @@ const ProductList = () => {
       });
     }
 
-    switch (dropdownValue) {
-      case '15X15 6cross': // COMPLETE
-        await printDiv(
-          templateAvailable ? 'label-15X156cross' : 'StickerPrints0',
-          (style + getPageStyle(92))
-        );
-        handleQRStickerPrinterModelCancel();
-        break;
-      case '22X35 3cross': // Need to check
-        await printDiv(
-          templateAvailable ? '22X353cross' : 'StickerPrints1',
-          style + getPageStyle(105)
-        );
-        handleQRStickerPrinterModelCancel();
-        break;
-      case '25X25 4cross': // COMPLETE
-        await printDiv(
-          templateAvailable ? '25X254cross' : 'StickerPrints2',
-          style + getPageStyle(100)
-        );
-        handleQRStickerPrinterModelCancel();
-        break;
-      case '25X50 2cross': //Need to check
-        await printDiv(
-          templateAvailable ? '25X502cross' : 'StickerPrints3',
-          style + getPageStyle(100)
-        );
-        handleQRStickerPrinterModelCancel();
-        break;
-      case '50X30 Single': // COMPLETE
-        await printDiv(
-          templateAvailable ? '50X30Single' : 'StickerPrints4',
-          style
-        );
-        handleQRStickerPrinterModelCancel();
-        break;
-      case '50X25 Single': // COMPLETE
-        await printDiv(
-          templateAvailable ? '50X25Single' : 'StickerPrints5',
-          style
-        );
-        handleQRStickerPrinterModelCancel();
-        break;
-      case '100X13 (55MM Printable)': //Need to check
-        await printDiv(
-          templateAvailable ? '100X13(55MMPrintable)' : 'StickerPrints6',
-          style
-        );
-        handleQRStickerPrinterModelCancel();
-        break;
-      case '100X15 (70MM Printable)': // COMPLETE
-        await printDiv(
-          templateAvailable ? '100X15(70MMPrintable)' : 'StickerPrints7',
-          style
-        );
-        handleQRStickerPrinterModelCancel();
-        break;
-      case '100X150': // COMPLETE
-        await printDiv(templateAvailable ? '100X150' : 'StickerPrints8', style);
-        handleQRStickerPrinterModelCancel();
-        break;
-      default:
-        alert('! Select correct cross ');
-    }
+    setPrintReady(true);
+
+    setTimeout(async () => {
+      switch (dropdownValue) {
+        case '15X15 6cross': // COMPLETE
+          await printDiv(
+            templateAvailable ? 'label-15X156cross' : 'StickerPrints0',
+            style + getPageStyle(92)
+          );
+          handleQRStickerPrinterModelCancel();
+          break;
+        case '22X35 3cross': // Need to check
+          await printDiv(
+            templateAvailable ? '22X353cross' : 'StickerPrints1',
+            style + getPageStyle(105)
+          );
+          handleQRStickerPrinterModelCancel();
+          break;
+        case '25X25 4cross': // COMPLETE
+          await printDiv(
+            templateAvailable ? '25X254cross' : 'StickerPrints2',
+            style + getPageStyle(100)
+          );
+          handleQRStickerPrinterModelCancel();
+          break;
+        case '25X50 2cross': //Need to check
+          await printDiv(
+            templateAvailable ? '25X502cross' : 'StickerPrints3',
+            style + getPageStyle(100)
+          );
+          handleQRStickerPrinterModelCancel();
+          break;
+        case '50X30 Single': // COMPLETE
+          await printDiv(
+            templateAvailable ? '50X30Single' : 'StickerPrints4',
+            style
+          );
+          handleQRStickerPrinterModelCancel();
+          break;
+        case '50X25 Single': // COMPLETE
+          await printDiv(
+            templateAvailable ? '50X25Single' : 'StickerPrints5',
+            style
+          );
+          handleQRStickerPrinterModelCancel();
+          break;
+        case '100X13 (55MM Printable)': //Need to check
+          await printDiv(
+            templateAvailable ? '100X13(55MMPrintable)' : 'StickerPrints6',
+            style
+          );
+          handleQRStickerPrinterModelCancel();
+          break;
+        case '100X15 (70MM Printable)': // COMPLETE
+          await printDiv(
+            templateAvailable ? '100X15(70MMPrintable)' : 'StickerPrints7',
+            style
+          );
+          handleQRStickerPrinterModelCancel();
+          break;
+        case '100X150': // COMPLETE
+          await printDiv(
+            templateAvailable ? '100X150' : 'StickerPrints8',
+            style
+          );
+          handleQRStickerPrinterModelCancel();
+          setPrintReady(false);
+          break;
+        default:
+          alert('! Select correct cross ');
+          setPrintReady(false);
+      }
+    }, 100);
   };
 
   useEffect(() => {
@@ -2052,7 +2043,7 @@ const ProductList = () => {
   };
 
   const handleSubmitbulk = (excelData) => {
-    setExceldatasubmit(excelData);
+    setExceldatasubmit(excelData?.filter((e) => e?.isModified));
   };
 
   const handleSubmit = async () => {
@@ -2136,6 +2127,7 @@ const ProductList = () => {
       handleResetExcelData();
       handleCancel();
     } else {
+      setBulkpost(false);
       setMessageType('error');
       setMessageData('No data to submit. Please upload an Excel file.');
     }
@@ -2224,7 +2216,6 @@ const ProductList = () => {
     }
   }, [ProdId]);
 
-
   const totalCopies = QrandbarcodeDatas?.reduce(
     (sum, item) => sum + Number(item?.copiesCount || 0),
     0
@@ -2263,65 +2254,36 @@ const ProductList = () => {
       console.error('Error fetching barcode session data:', error);
     }
   };
-  const imageTagBarcodeAndQR = (w = 'auto', fs = '6px', codeData = null) => {
-    const currentCode = codeData || ProdId;
-
-    console.log(currentCode, '1111111111', codeData);
-    return (
-      (templateOptions.barcode || templateOptions.qrcode) && (
-        <>
-          <img
-            style={{ width: w }}
-            src={
-              templateOptions.codeType === 'B'
-                ? !MultiCode
-                  ? barcodeBase64Image
-                  : generateBarcode(currentCode)
-                : !MultiCode
-                  ? base64Image
-                  : generateQRCode(currentCode)
-            }
-            alt="Barcode"
-          />
-          {templateOptions.codeType !== 'B' && (
-            <p style={{ margin: '0', padding: '0', fontSize: fs }}>
-              {currentCode}
-            </p>
-          )}
-        </>
-      )
-    );
-  };
-
-  const generateBarcode = (code) => {
-    try {
-      const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-      JsBarcode(svg, code, {
-        format: 'CODE128',
-        displayValue: false,
-        lineColor: '#030303',
-        width: 2,
-        height: 40,
-      });
-      const svgData = new XMLSerializer().serializeToString(svg);
-      return `data:image/svg+xml;base64,${btoa(svgData)}`;
-    } catch (error) {
-      return null;
-    }
-  };
-
-  // const generateQRCode = (code) => {
-
-  //   return base64Image;
-  // };
-
-  const generateCodeImage = (code, codeType = 'Q') => {
-    if (codeType === 'B') {
-      return generateBarcode(code);
-    } else {
-      return generateQRCode(code);
-    }
-  };
+  const imageTagBarcodeAndQR = useCallback(
+    (w = 'auto', fs = '6px', codeData = null) => {
+      const currentCode = codeData || ProdId;
+      return (
+        (templateOptions.barcode || templateOptions.qrcode) && (
+          <>
+            <img
+              style={{ width: w }}
+              src={
+                templateOptions.codeType === 'B'
+                  ? !MultiCode
+                    ? barcodeBase64Image
+                    : generateBarcode(currentCode)
+                  : !MultiCode
+                    ? base64Image
+                    : generateQRCode(QrandbarcodeDatas, code)
+              }
+              alt="Barcode"
+            />
+            {templateOptions.codeType !== 'B' && (
+              <p style={{ margin: '0', padding: '0', fontSize: fs }}>
+                {currentCode}
+              </p>
+            )}
+          </>
+        )
+      );
+    },
+    [templateOptions, MultiCode, barcodeBase64Image, base64Image, ProdId]
+  );
 
   const handleQRStickerPrinterModelCancel = () => {
     setDropdownValue();
@@ -2329,9 +2291,10 @@ const ProductList = () => {
     setOpen(false);
     formRef?.current?.resetFields();
     setSelectedRecords([]);
-    setQrandbarcodeDatas([])
+    setQrandbarcodeDatas([]);
     setMultiCode(false);
     setNickName(null);
+    setPrintReady(false);
   };
 
   const handleProcessMultipleOCR = async (formDataArray) => {
@@ -2632,3022 +2595,59 @@ const ProductList = () => {
         {/* </Tooltip> */}
         {/* </Popconfirm> */}
       </div>
-      <DefaultModal
-        width={1000}
+      <StickerPrintModel
         open={open}
-        title="Sticker Print"
         handleCancel={handleQRStickerPrinterModelCancel}
-        footer={false}
-        children={
-          <Form ref={formRef} onFinish={onFinish}>
-
-            {MultiCode && <div className="printtabs">
-              <div
-                className={`tab-item ${activeTab === 'stock' ? 'active' : ''}`}
-                onClick={() => setActiveTab('stock')}
-              >
-                Stock Wise <span className="count">({selectedRecords?.length})</span>
-                <div>
-
-                  <div className="AddStockMinatain" onClick={(e) => {
-                    e.stopPropagation();
-                    setstockWiseQrcode(true);
-                  }}
-                    style={{
-                      animation: activeTab === 'stock' ? 'blink 1s infinite' : 'none'
-                    }}>
-
-                    <FaPlus
-
-                    /> Add
-                  </div>
-                </div>
-              </div>
-
-              <div
-                className={`tab-item ${activeTab === 'product' ? 'active' : ''}`}
-                onClick={() => setActiveTab('product')}
-              >
-                Product Wise <span className="count">({selectedRecords?.length})</span>
-                <div className="AddStockMinatain" onClick={(e) => {
-                  e.stopPropagation();
-                  setProductWiseQrcode(true);
-                }} style={{
-                  animation: activeTab === 'product' ? 'blink 1s infinite' : 'none'
-                }}>
-
-                  <FaPlus
-
-
-                  /> Add
-                </div>
-              </div>
-
-            </div>}
-            <div style={{ display: 'flex', flexWrap: 'wrap', gap: '1rem' }}>
-              <Form.Item
-                name="Cross"
-                className="size-selection"
-                rules={[
-                  {
-                    required: true,
-                    message: 'Please Select Cross',
-                  },
-                ]}
-              >
-                <div>
-                  <label
-                    class="required"
-                    style={{ marginBottom: '8px', display: 'block' }}
-                  >
-                    Cross
-                  </label>
-                  <div className="barcode-qr-preview">
-                    <div className="radio-sidebar-container">
-                      {coresdata?.map((option) => (
-                        <div
-                          key={option.ConfigName}
-                          onClick={() => CoresOnChange(option.ConfigName)}
-                          className={`radio-sidebar-item ${dropdownValue === option.ConfigName ? 'selected' : ''}`}
-                        >
-                          <div className="radio-sidebar-title">
-                            {option.ConfigName}
-                          </div>
-                        </div>
-                      ))}
-                    </div>
-                    <div className="BarcodeTemplateSetup-Master">
-                      <div
-                        className={`CustomisedBSPS ${dropdownValue === '100X150' ? 'height-max' : ''}`}
-                      >
-                        <div className="headerPreview">PREVIEW</div>
-                        {(() => {
-                          const template = barcodeTemplateDetails?.find(
-                            (find) => find.SessionName === dropdownValue
-                          );
-                          const templateAvailable =
-                            template === undefined ? false : true;
-                          // Define constants using the lookup map
-                          const checkComponent = (name) =>
-                            template?.OptionDetails?.some(
-                              (some) => some.OptionName === name
-                            );
-
-                          const mrp = checkComponent('MRP');
-                          const qrcode = checkComponent('Qrcode');
-                          const barcode = checkComponent('Barcode');
-                          const color = checkComponent('Color');
-                          const eDate = checkComponent('E Date');
-                          const mDate = checkComponent('M Date');
-                          const sellingPrice = checkComponent('Selling Price');
-                          const productName = checkComponent('Product Name');
-                          const barcodeOrQr = template?.CodeType
-                            ? template?.CodeType === 'B'
-                            : true;
-                          // setPreviewTemplateOptions({
-                          //   mrp: mrp,
-                          //   barcode: barcode,
-                          //   color: color,
-                          //   eDate: eDate,
-                          //   mDate: mDate,
-                          //   sellingPrice: sellingPrice,
-                          //   productName: productName,
-                          //   value: template?.Position !== '' ? template?.Position : '',
-                          //   secondValue:
-                          //     template?.PositionString !== ''
-                          //       ? template?.PositionString
-                          //       : '',
-                          //   qrcode: qrcode,
-                          //   codeType: template?.CodeType,
-                          // });
-                          const templateValue =
-                            template?.Position !== '' ? template?.Position : '';
-                          switch (dropdownValue) {
-                            case '15X15 6cross':
-                              return templateAvailable ? (
-                                !(productName || barcode || qrcode || mrp) ? (
-                                  <Empty />
-                                ) : (
-                                  <>
-                                    <div className="SixCross15x">
-                                      {[...Array(6)].map((_, index) => (
-                                        <div className="BarQrprint5">
-                                          <div
-                                            key={index}
-                                            className="BarQrprint1details BarQrprint5Details alignCenterFlexDirectionColumn"
-                                          >
-                                            {(barcode || qrcode) &&
-                                              templateValue === 'T' &&
-                                              handleImageTag(
-                                                barcodeOrQr ? 50 : 20,
-                                                20,
-                                                barcodeOrQr
-                                              )}
-                                            {productName && (
-                                              <div
-                                                className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                              >
-                                                {nickName
-                                                  ? nickName
-                                                  : proName
-                                                    ? proName
-                                                    : 'Product Name'}
-                                              </div>
-                                            )}
-                                            {(barcode || qrcode) &&
-                                              templateValue === 'C' &&
-                                              handleImageTag(
-                                                barcodeOrQr ? 50 : 20,
-                                                20,
-                                                barcodeOrQr
-                                              )}
-                                            {mrp && (
-                                              <div className="MRPBQ">
-                                                {'₹:' +
-                                                  (detail?.MRP
-                                                    ? detail?.MRP
-                                                    : 0.0)}
-                                              </div>
-                                            )}
-                                            {(barcode || qrcode) &&
-                                              templateValue === 'B' &&
-                                              handleImageTag(
-                                                barcodeOrQr ? 50 : 20,
-                                                20,
-                                                barcodeOrQr
-                                              )}
-                                          </div>
-                                        </div>
-                                      ))}
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'15mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'15mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="default-15x15-6cross">
-                                    {Array.from({ length: 6 }).map(
-                                      (_, index) => (
-                                        <div
-                                          className="Sticker0"
-                                          key={`sticker0-${index}`}
-                                        >
-                                          <img
-                                            src={qrCodeImage}
-                                            alt={`QR Code ${index + 1}`}
-                                          />
-                                        </div>
-                                      )
-                                    )}
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'15mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'15mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            case '22X35 3cross':
-                              return templateAvailable ? (
-                                //"B","T"
-                                !(barcode || qrcode || mrp) ? (
-                                  <Empty />
-                                ) : (
-                                  <>
-                                    <div className="Cross32235">
-                                      {[...Array(3)].map((_, index) => (
-                                        <div
-                                          className="BarQrprint4"
-                                          key={index}
-                                        >
-                                          <div
-                                            className="BarQrprint1details"
-                                            style={{
-                                              alignItems: 'center',
-                                              flexDirection:
-                                                templateValue === 'T'
-                                                  ? 'column'
-                                                  : 'column-reverse',
-                                            }}
-                                          >
-                                            {(barcode || qrcode) &&
-                                              handleImageTag(
-                                                barcodeOrQr ? 100 : 35,
-                                                35,
-                                                barcodeOrQr
-                                              )}
-                                            {(productName || mrp) && (
-                                              <div
-                                                style={{
-                                                  textAlign: 'center',
-                                                  width: '100%',
-                                                  display: 'flex',
-                                                  alignItems: 'center',
-                                                  justifyContent: 'center',
-                                                  flexDirection: 'column',
-                                                }}
-                                              >
-                                                {productName && (
-                                                  <div
-                                                    className={`MRPBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                                  >
-                                                    {nickName
-                                                      ? nickName
-                                                      : (proName || 'Product Name')}
-                                                  </div>
-                                                )}
-                                                {mrp && (
-                                                  <div className="MRPBQ">
-                                                    {'₹:' +
-                                                      (detail?.MRP
-                                                        ? detail?.MRP
-                                                        : 10.0)}
-                                                  </div>
-                                                )}
-                                              </div>
-                                            )}
-                                          </div>
-                                        </div>
-                                      ))}
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'22mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'35mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="grid22x35_3cross">
-                                    {Array?.from({ length: 3 })?.map(
-                                      (_, index) => (
-                                        <div
-                                          className="Sticker1 bg-white"
-                                          key={`sticker1-${index}`}
-                                        >
-                                          <div style={{ width: '60%' }}>
-                                            <p
-                                              className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 8 ? 'text-ellipsis' : ''}`}
-                                            >
-                                              {proName || 'Product Name'} ({size || '1 PCS'})
-                                            </p>
-                                            <p>{ProdId || 'QR579890770'}</p>
-                                          </div>
-                                          <img
-                                            src={qrCodeImage}
-                                            style={{
-                                              width: '12mm',
-                                              height: '12mm',
-                                            }}
-                                          />
-                                        </div>
-                                      )
-                                    )}
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'22mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'35mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            case '25X25 4cross':
-                              return templateAvailable ? (
-                                !(
-                                  productName ||
-                                  mDate ||
-                                  eDate ||
-                                  barcode ||
-                                  qrcode ||
-                                  mrp
-                                ) ? (
-                                  <Empty />
-                                ) : (
-                                  // 4 Cross idhu 25 * 25 * 25 * 25 = 1 inch
-                                  <>
-                                    <div className="Cross4Print">
-                                      {[...Array(4)].map((_, index) => (
-                                        <div
-                                          key={index}
-                                          className="BarQrprint3"
-                                        >
-                                          <div className="BarQrprint1details alignCenterFlexDirectionColumn">
-                                            {(barcode || qrcode) &&
-                                              templateValue === 'T' &&
-                                              handleImageTag(
-                                                barcodeOrQr ? 60 : 35,
-                                                35,
-                                                barcodeOrQr
-                                              )}
-                                            {productName && (
-                                              <div
-                                                className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                              >
-                                                {nickName
-                                                  ? nickName
-                                                  : proName
-                                                    ? proName
-                                                    : 'Product Name'}
-                                              </div>
-                                            )}
-                                            {mrp && (
-                                              <div className="MRPBQ">
-                                                {'₹:' +
-                                                  (detail?.MRP
-                                                    ? detail?.MRP
-                                                    : 10.0)}
-                                              </div>
-                                            )}
-                                            {(barcode || qrcode) &&
-                                              templateValue === 'C' &&
-                                              handleImageTag(
-                                                barcodeOrQr ? 60 : 35,
-                                                35,
-                                                barcodeOrQr
-                                              )}
-                                            {mDate && (
-                                              <div className="MandateBQ"></div>
-                                            )}
-                                            {eDate && (
-                                              <div className="ExpdateBQ">
-                                                DD-MM-YYYY
-                                              </div>
-                                            )}
-                                            {(barcode || qrcode) &&
-                                              templateValue === 'B' &&
-                                              handleImageTag(
-                                                barcodeOrQr ? 60 : 35,
-                                                35,
-                                                barcodeOrQr
-                                              )}
-                                          </div>
-                                        </div>
-                                      ))}
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'25mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'25mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="grid25x25_4cross dummy4cross">
-                                    {Array.from({ length: 4 })?.map(
-                                      (_, index) => (
-                                        <div
-                                          className="sticker25x25 bg-white"
-                                          key={`sticker2-${index}`}
-                                        >
-                                          <p
-                                            className={`sticker25x25-name ${nickName ? '' : (proName + '(' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                                          >
-                                            <span
-                                              class={
-                                                (proName + '(' + size + ')')
-                                                  ?.length <= 14
-                                                  ? 'product-name2'
-                                                  : 'product-nameSmall2'
-                                              }
-                                            >
-                                              {nickName
-                                                ? nickName
-                                                : proName
-                                                  ? proName
-                                                  : 'Product Name'}
-                                            </span>
-                                            <span
-                                              class={
-                                                (proName + '(' + size + ')')
-                                                  ?.length <= 14
-                                                  ? 'product-size2'
-                                                  : 'product-sizeSmall2'
-                                              }
-                                            >
-                                              ({size || '1 PCS'})
-                                            </span>
-                                          </p>
-                                          <div
-                                            style={{
-                                              display: 'flex',
-                                              alignItems: 'center',
-                                              width: '100%',
-                                              flexDirection: 'column',
-                                              justifyContent: 'center',
-                                            }}
-                                          >
-                                            <img
-                                              src={qrCodeImage}
-                                              className="sticker25-img"
-                                              alt="barcode"
-                                            />
-                                            <p class="product-id2">{ProdId || 'QR8575956'}</p>
-                                          </div>
-                                        </div>
-                                      )
-                                    )}
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'25mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'25mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            case '25X50 2cross':
-                              return templateAvailable ? (
-                                //"B","T"
-                                !(productName || barcode || qrcode || mrp) ? (
-                                  <Empty />
-                                ) : (
-                                  <>
-                                    <div className="TwoCrosssmain">
-                                      {[...Array(2)].map((_, index) => (
-                                        <div className="BarQrprint8">
-                                          <div
-                                            key={index}
-                                            className="Barcodeimage"
-                                            style={valueStyleColumn}
-                                          >
-                                            {(barcode || qrcode) &&
-                                              handleImageTag(
-                                                barcodeOrQr ? 140 : 30,
-                                                30,
-                                                barcodeOrQr
-                                              )}
-                                            {productName && (
-                                              <div
-                                                className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                              >
-                                                {nickName
-                                                  ? nickName
-                                                  : proName
-                                                    ? proName
-                                                    : 'Product Name'}
-                                              </div>
-                                            )}
-                                            {mrp && (
-                                              <div className="MRPBQ">
-                                                {'₹:' +
-                                                  (detail?.MRP
-                                                    ? detail?.MRP
-                                                    : 10.0)}
-                                              </div>
-                                            )}
-                                          </div>
-                                        </div>
-                                      ))}
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'25mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'50mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="grid25x50_2cross">
-                                    {Array.from({ length: 2 })?.map(
-                                      (_, index) => (
-                                        <div
-                                          className="Sticker3 bg-white"
-                                          key={`sticker3-${index}`}
-                                        >
-                                          <div style={{ width: '60%' }}>
-                                            <p
-                                              className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                                            >
-                                              {proName || 'Product Name'} ({size || '1 PCS'})
-                                            </p>
-                                            <p>{ProdId || 'QR74478578'}</p>
-                                          </div>
-                                          <img
-                                            src={qrCodeImage}
-                                            style={{
-                                              width: '75px',
-                                              height: '75px',
-                                            }}
-                                          />
-                                        </div>
-                                      )
-                                    )}
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'25mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'50mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            case '50X30 Single':
-                              return templateAvailable ? (
-                                !(
-                                  productName ||
-                                  mDate ||
-                                  eDate ||
-                                  barcode ||
-                                  qrcode ||
-                                  mrp
-                                ) ? (
-                                  <Empty />
-                                ) : (
-                                  <>
-                                    <div
-                                      className="BarQrprint6"
-                                      style={secondValueStyle}
-                                    >
-                                      <div className="BarQrprint1details flexDirection">
-                                        {productName && (
-                                          <div
-                                            className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                          >
-                                            {nickName
-                                              ? nickName
-                                              : proName
-                                                ? proName
-                                                : 'Product Name'}
-                                          </div>
-                                        )}
-                                        {mDate &&
-                                          detail?.ProdVariantPriceDetails?.[0]
-                                            ?.ManufDate && (
-                                            <div className="MandateBQ">
-                                              {formatDate(
-                                                detail
-                                                  ?.ProdVariantPriceDetails?.[0]
-                                                  ?.ManufDate
-                                              )}
-                                            </div>
-                                          )}
-                                        {eDate &&
-                                          detail?.ProdVariantPriceDetails?.[0]
-                                            ?.ExpDate && (
-                                            <div className="ExpdateBQ">
-                                              {formatDate(
-                                                detail
-                                                  ?.ProdVariantPriceDetails?.[0]
-                                                  ?.ExpDate
-                                              )}
-                                            </div>
-                                          )}
-                                      </div>
-                                      <div
-                                        className="Barcodeimage flexDirection"
-                                        style={valueStyleColumn}
-                                      >
-                                        {(barcode || qrcode) &&
-                                          handleImageTag(
-                                            barcodeOrQr ? 70 : 35,
-                                            35,
-                                            barcodeOrQr
-                                          )}
-                                        {mrp && (
-                                          <div className="MRPBQ">
-                                            {'MRP : ' + (detail?.MRP || 10.0)}
-                                          </div>
-                                        )}
-                                      </div>
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'30mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'50mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="grid50x30_1cross">
-                                    <div className="Sticker4 bg-white">
-                                      <div className="Sticker4-name">
-                                        <p
-                                          className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                                        >
-                                          {proName || 'Product Name'} ({size || '1 PCS'})
-                                        </p>
-                                        <p>{ProdId || 'QR987968'}</p>
-                                      </div>
-                                      <img
-                                        src={qrCodeImage}
-                                        style={{
-                                          width: '15mm',
-                                          height: '15mm',
-                                        }}
-                                      />
-                                    </div>
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'30mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'50mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            case '50X25 Single':
-                              return templateAvailable ? (
-                                !(
-                                  productName ||
-                                  mDate ||
-                                  barcode ||
-                                  qrcode ||
-                                  mrp
-                                ) ? (
-                                  <Empty />
-                                ) : (
-                                  <>
-                                    <div
-                                      className="BarQrprint2"
-                                      style={secondValueStyle}
-                                    >
-                                      <div className="BarQrprint1details flexDirection">
-                                        {productName && (
-                                          <div
-                                            className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                          >
-                                            {nickName
-                                              ? nickName
-                                              : proName
-                                                ? proName
-                                                : 'Product Name'}
-                                          </div>
-                                        )}
-                                        {mDate &&
-                                          detail?.ProdVariantPriceDetails?.[0]
-                                            ?.ManufDate && (
-                                            <div className="MandateBQ">
-                                              {formatDate(
-                                                detail
-                                                  ?.ProdVariantPriceDetails?.[0]
-                                                  ?.ManufDate
-                                              )}
-                                            </div>
-                                          )}
-                                      </div>
-                                      <div
-                                        className="Barcodeimage"
-                                        style={valueStyleColumn}
-                                      >
-                                        {(barcode || qrcode) &&
-                                          handleImageTag(
-                                            barcodeOrQr ? 70 : 35,
-                                            35,
-                                            barcodeOrQr
-                                          )}
-                                        {mrp && (
-                                          <div className="MRPBQ">
-                                            {'MRP : ' + (detail?.MRP || '10.0')}
-                                          </div>
-                                        )}
-                                      </div>
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'25mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'50mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="grid50x25_1cross">
-                                    <div className="Sticker5 bg-white">
-                                      <div className="Sticker5-name">
-                                        <p
-                                          className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                                        >
-                                          {proName || 'Product Name'} ({size || '1 PCS'})
-                                        </p>
-                                        <p>{ProdId || 'QR8798639'}</p>
-                                      </div>
-                                      <img
-                                        src={qrCodeImage}
-                                        style={{
-                                          width: '13mm',
-                                          height: '13mm',
-                                        }}
-                                      />
-                                    </div>
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'25mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'50mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            case '100X13 (55MM Printable)':
-                              return templateAvailable ? (
-                                //"C", "T", "B"
-                                !(
-                                  productName ||
-                                  sellingPrice ||
-                                  barcode ||
-                                  qrcode
-                                ) ? (
-                                  <Empty />
-                                ) : (
-                                  <>
-                                    <div
-                                      className="BarQrprint9"
-                                      style={valueStyleRow}
-                                    >
-                                      {(barcode || qrcode) &&
-                                        handleImageTag(
-                                          barcodeOrQr ? 140 : 35,
-                                          35,
-                                          barcodeOrQr
-                                        )}
-                                      <div className="BarQrprint1details1">
-                                        {productName && (
-                                          <div
-                                            className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                          >
-                                            {nickName
-                                              ? nickName
-                                              : proName
-                                                ? proName
-                                                : 'Product Name'}
-                                          </div>
-                                        )}
-                                        {sellingPrice && (
-                                          <div className="SellingpriceBQ">
-                                            {`Selling Price : ` +
-                                              (detail?.SellPrice || '10.0')}
-                                          </div>
-                                        )}
-                                      </div>
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'13mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'100mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="grid100x13_1cross">
-                                    <div className="Sticker6 bg-white">
-                                      <div className={`text-section6`}>
-                                        <p
-                                          className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                                        >
-                                          {proName || 'Product Name'} ({size || '1 PCS'})
-                                        </p>
-                                        <p>{ProdId || 'QR0970970'}</p>
-                                      </div>
-                                      <img
-                                        src={qrCodeImage}
-                                        style={{
-                                          width: '11mm',
-                                          height: '11mm',
-                                        }}
-                                      />
-                                    </div>
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'13mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'100mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            case '100X15 (70MM Printable)':
-                              return templateAvailable ? (
-                                // "L","R"
-                                !(
-                                  productName ||
-                                  sellingPrice ||
-                                  barcode ||
-                                  qrcode ||
-                                  mrp
-                                ) ? (
-                                  <Empty />
-                                ) : (
-                                  <>
-                                    <div
-                                      className="BarQrprint1"
-                                      style={valueStyleRow}
-                                    >
-                                      <div className="BarQrprint1details flexDirection">
-                                        {productName && (
-                                          <div
-                                            style={{ textAlign: 'left' }}
-                                            className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                          >
-                                            {nickName
-                                              ? nickName
-                                              : proName
-                                                ? proName
-                                                : 'Product Name'}
-                                          </div>
-                                        )}
-                                        {mrp && (
-                                          <div className="MRPBQ">
-                                            {'MRP : ' + (detail?.MRP || '10.0')}
-                                          </div>
-                                        )}
-                                        {sellingPrice && (
-                                          <div className="SellingpriceBQ">
-                                            {`Selling Price : ` +
-                                              (detail?.SellPrice || '10.0')}
-                                          </div>
-                                        )}
-                                      </div>
-                                      <div className="Qrcodeimage">
-                                        {(barcode || qrcode) &&
-                                          handleImageTag(
-                                            barcodeOrQr ? 90 : 40,
-                                            null,
-                                            barcodeOrQr
-                                          )}
-                                      </div>
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'15mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'100mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="grid100x15_1cross">
-                                    <div className="Sticker7 bg-white">
-                                      <div className="text-section7">
-                                        <p
-                                          className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                                        >
-                                          {proName || 'Product Name'} ({size || '1 PCS'})
-                                        </p>
-                                        <p>{ProdId || 'QR858755'}</p>
-                                      </div>
-                                      <img
-                                        src={qrCodeImage}
-                                        style={{
-                                          width: '12mm',
-                                          height: '12mm',
-                                        }}
-                                      />
-                                    </div>
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'15mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'100mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            case '100X150':
-                              return templateAvailable ? (
-                                !(
-                                  productName ||
-                                  sellingPrice ||
-                                  mDate ||
-                                  eDate ||
-                                  color ||
-                                  barcode ||
-                                  qrcode ||
-                                  mrp
-                                ) ? (
-                                  <Empty />
-                                ) : (
-                                  <>
-                                    <div
-                                      className="BarQrprint7"
-                                      style={secondValueStyle}
-                                    >
-                                      <div className="BarQrprint1details1">
-                                        {productName && (
-                                          <div
-                                            className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                          >
-                                            {nickName
-                                              ? nickName
-                                              : proName
-                                                ? proName
-                                                : 'Product Name'}
-                                          </div>
-                                        )}
-                                        {sellingPrice && (
-                                          <div className="SellingpriceBQ">
-                                            {`Selling Price : ` +
-                                              detail?.SellPrice}
-                                          </div>
-                                        )}
-                                        {mDate &&
-                                          detail?.ProdVariantPriceDetails?.[0]
-                                            ?.ManufDate && (
-                                            <div className="MandateBQ">
-                                              {formatDate(
-                                                detail
-                                                  ?.ProdVariantPriceDetails?.[0]
-                                                  ?.ManufDate
-                                              )}
-                                            </div>
-                                          )}
-                                        {eDate &&
-                                          detail?.ProdVariantPriceDetails?.[0]
-                                            ?.ExpDate && (
-                                            <div className="ExpdateBQ">
-                                              {formatDate(
-                                                detail
-                                                  ?.ProdVariantPriceDetails?.[0]
-                                                  ?.ExpDate
-                                              )}
-                                            </div>
-                                          )}
-                                        {color && (
-                                          <div className="ColorBQ">
-                                            {colorText}
-                                          </div>
-                                        )}
-                                      </div>
-                                      <div
-                                        className="Barcodeimage"
-                                        style={valueStyleColumn}
-                                      >
-                                        {(barcode || qrcode) &&
-                                          handleImageTag(
-                                            barcodeOrQr ? 140 : 35,
-                                            35,
-                                            barcodeOrQr
-                                          )}
-                                        {mrp && (
-                                          <div className="MRPBQ">
-                                            {'MRP : ' + (detail?.MRP || '10.0')}
-                                          </div>
-                                        )}
-                                      </div>
-                                    </div>
-                                    <div className="showInfoCross4Print">
-                                      <p>
-                                        Vertical
-                                        <div>
-                                          <GiVerticalFlip size={25} />{' '}
-                                        </div>
-                                        - {'150mm'}
-                                      </p>
-                                      <p>
-                                        Horizontal
-                                        <div>
-                                          <GiHorizontalFlip size={30} />{' '}
-                                        </div>
-                                        - {'100mm'}
-                                      </p>
-                                    </div>
-                                  </>
-                                )
-                              ) : (
-                                <>
-                                  <div className="grid100x150_1cross  bg-white">
-                                    <div className="OverAllSticker8">
-                                      <div className="StikerBr8">
-                                        <p>{detail?.BrName}</p>
-                                      </div>
-                                      <div className="Sticker8">
-                                        <div className="text-section8">
-                                          <p>
-                                            Product Name:{' '}
-                                            <p
-                                              className={`field-value ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                                            >
-                                              {nickName
-                                                ? nickName
-                                                : proName
-                                                  ? proName
-                                                  : 'Product Name'}
-                                            </p>
-                                          </p>
-                                          <p>
-                                            SIZE:{' '}
-                                            <span className="field-value">
-                                              {size || '1 PCS'}
-                                            </span>
-                                          </p>
-                                          <p>
-                                            Id:{' '}
-                                            <span className="field-value">
-                                              {ProdId || 'QR86868'}
-                                            </span>
-                                          </p>
-                                          <p>
-                                            MRP:{' '}
-                                            <span className="field-value">
-                                              {'MRP : ' + (detail?.MRP || '10.0')}
-                                            </span>
-                                          </p>
-                                          <p>
-                                            Selling Price:{' '}
-                                            <span className="field-value">
-                                              {(detail?.SellPrice || '10.0')}
-                                            </span>
-                                          </p>
-                                        </div>
-                                        <img
-                                          src={qrCodeImage}
-                                          style={{
-                                            width: '50mm',
-                                            height: '50mm',
-                                          }}
-                                        />
-                                      </div>
-                                    </div>
-                                  </div>
-                                  <div className="showInfoCross4Print">
-                                    <p>
-                                      Vertical
-                                      <div>
-                                        <GiVerticalFlip size={25} />{' '}
-                                      </div>
-                                      - {'150mm'}
-                                    </p>
-                                    <p>
-                                      Horizontal
-                                      <div>
-                                        <GiHorizontalFlip size={30} />{' '}
-                                      </div>
-                                      - {'100mm'}
-                                    </p>
-                                  </div>
-                                </>
-                              );
-                            default:
-                              return <Empty />;
-                          }
-                        })()}
-                        <p>{dropdownValue}</p>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </Form.Item>
-              {!MultiCode && <Form.Item
-                name="Copies"
-                rules={[
-                  {
-                    required: true,
-                    pattern: /^[1-9]\d*(\.\d+)?$/,
-                    message: 'Please Enter Copies',
-                  },
-                  {
-                    validator: async (_, value) => {
-                      await validateSafeInput(value); // To block HTML tags & SQL keywords
-                      return Promise.resolve();
-                    },
-                  },
-                ]}
-              >
-                <InputField
-                  autoComplete="off"
-                  label={<label class="required">Copies</label>}
-                  isOnChange={false}
-                  onChange={(e) => {
-                    CopiesOnChange(e?.target?.value);
-                  }}
-                />
-              </Form.Item>}
-              {proName?.length > 12 && printProductName && !MultiCode && (
-                <>
-                  <div
-                    style={{
-                      width: '100%',
-                      fontSize: '12px',
-                      marginTop: '-10px',
-                      fontFamily: 'Poppins',
-                      fontStyle: 'italic',
-                      color: '#ff4d4f',
-                    }}
-                  >
-                    Note: Product name is very long. Please add a short/nick
-                    name to proceed print.
-                  </div>
-                  <Form.Item
-                    name="NickName"
-                    rules={[
-                      {
-                        // required: true,
-                        message: 'Please Enter Product Short / Nick Name',
-                      },
-                      {
-                        max: 12,
-                        message:
-                          'Product Short / Nick Name cannot be greater than 12 characters',
-                      },
-                    ]}
-                  >
-                    <InputField
-                      autoComplete="off"
-                      label={`Product Short / Nick Name`}
-                      onChange={(e) => {
-                        setNickName(e?.target?.value);
-                      }}
-                      maxLength={12}
-                    />
-                  </Form.Item>
-                </>
-              )}
-            </div>
-            <div
-              style={{
-                width: '100%',
-                display: 'flex',
-                justifyContent: 'flex-end',
-              }}
-            >
-              {(!MultiCode || totalCopies > 0) && (
-                <Buttons buttonText="Submit" color="901D77" />
-              )}
-              {MultiCode && totalCopies === 0 && (
-                <button
-                  type="button"
-                  className="product_primary_Button"
-                  onClick={() => setstockWiseQrcode(true)}
-                >
-                  Submit
-                </button>
-              )} </div>
-
-
-          </Form>
-        }
+        formRef={formRef}
+        onFinish={onFinish}
+        MultiCode={MultiCode}
+        activeTab={activeTab}
+        setActiveTab={setActiveTab}
+        selectedRecords={selectedRecords}
+        coresdata={coresdata}
+        dropdownValue={dropdownValue}
+        CoresOnChange={CoresOnChange}
+        barcodeTemplateDetails={barcodeTemplateDetails}
+        detail={detail}
+        proName={proName}
+        nickName={nickName}
+        ProdId={ProdId}
+        size={size}
+        // valueStyleColumn={valueStyleColumn}
+        // secondValueStyle={secondValueStyle}
+        // valueStyleRow={valueStyleRow}
+        CopiesOnChange={CopiesOnChange}
+        printProductName={printProductName}
+        totalCopies={totalCopies}
+        setstockWiseQrcode={setstockWiseQrcode}
+        setProductWiseQrcode={setProductWiseQrcode}
+        setNickName={setNickName}
+        templateOptions={templateOptions}
       />
-      < div style={{ display: 'none' }}>
-        <div id="StickerPrints0">
-          <div className="grid15x15_6cross">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                console.log(copyCount, "copyCountcopyCountcopyCount")
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="Sticker0"
-                    key={`sticker0-${recordIndex}-${copyIndex}`}
-                  >
-                    <img
-                      src={
-                        generateCodeImage(
-                          record?.QRCode || record?.ProdId,
-                          templateOptions?.codeType
-                        ) || base64Image
-                      }
-                      style={{ width: '52px', height: '52px' }}
-                    />
-                  </div>
-                ));
-              })
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="Sticker0" key={`sticker0-${index}`}>
-                  <img
-                    src={base64Image}
-                    style={{ width: '13mm', height: '13mm' }}
-                  />
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="StickerPrints1">
-          <div className="grid22x35_3cross">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                return Array?.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="label-wrapper-22x35"
-                    key={`sticker1-${recordIndex}-${copyIndex}`}
-                  >
-                    <div style={{ width: '60%' }}>
-                      <p
-                        className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 8 ? 'text-clamp-2' : ''}`}
-                      >
-                        {record.ProdName} ({record.Size}
-                        {record.UomName})
-                      </p>
-                      <p>{record.QRCode}</p>
-                    </div>
-                    <img
-                      src={
-                        generateCodeImage(
-                          record?.QRCode || record?.ProdId,
-                          templateOptions?.codeType
-                        ) || base64Image
-                      }
-                    />
-                  </div>
-                ))
-              }
-              )
-              : Array?.from({ length: copies })?.map((_, index) => (
-                <div className="label-wrapper-22x35" key={`sticker1-${index}`}>
-                  <div style={{ width: '19mm' }}>
-                    <p
-                      className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 8 ? 'text-ellipsis' : ''}`}
-                    >
-                      {proName} ({size})
-                    </p>
-                    <p>{ProdId}</p>
-                  </div>
-                  <img
-                    src={base64Image}
-                  />
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="StickerPrints2">
-          <div className="grid25x25_4cross">
-            {(selectedRecords?.length > 0)
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                console.log(copyCount, 'copyCount2')
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="sticker25x25"
-                    key={`sticker2-${recordIndex}-${copyIndex}`}
-                  >
-                    <p
-                      className={`sticker25x25-name ${nickName ? '' : (record?.ProdName + '(' + record?.Size + '' + record?.UomName + ')')?.length > 14 ? 'text-ellipsis' : ''}`}
-                    >
-                      <span
-                        class={
-                          (record?.NickName || record?.ProdName)?.length <= 14
-                            ? 'product-name2'
-                            : 'product-nameSmall2'
-                        }
-                      >
-                        {record?.NickName || record?.ProdName}
-                      </span>
-                      <span
-                        class={
-                          (record?.NickName || record?.ProdName)?.length <= 14
-                            ? 'product-size2'
-                            : 'product-sizeSmall2'
-                        }
-                      >
-                        ({record?.Size}
-                        {record?.UomName})
-                      </span>
-                    </p>
-                    <div
-                      style={{
-                        display: 'flex',
-                        alignItems: 'center',
-                        width: '100%',
-                        flexDirection: 'column',
-                        justifyContent: 'center',
-                      }}
-                    >
-                      <img
-                        src={
-                          generateCodeImage(
-                            record?.QRCode || record?.ProdId,
-                            templateOptions?.codeType
-                          ) || base64Image
-                        }
-                        className="sticker25-img"
-                        alt="barcode"
-                      />
-                      <p class="product-id2">
-                        {record?.QRCode || record?.ProdId}
-                      </p>
-                    </div>
-                  </div>
-                ))
-              }
 
+      {printReady && (
+        <StickerPrintTemplates
+          selectedRecords={selectedRecords}
+          copies={copies || totalCopies}
+          nickName={nickName}
+          proName={proName}
+          ProdId={ProdId}
+          size={size}
+          detail={detail}
+          templateOptions={templateOptions}
+          base64Image={base64Image}
+          QrandbarcodeDatas={QrandbarcodeDatas}
+          MultiCode={MultiCode}
+          generateQRCodeCopy={(code) =>
+            generateQRCodeCopy(QrandbarcodeDatas, code)
+          }
+          generateCodeImage={generateCodeImage}
+          imageTagBarcodeAndQR={imageTagBarcodeAndQR}
+          dropdownValue={dropdownValue}
+          barcodeTemplateDetails={barcodeTemplateDetails}
+        />
+      )}
 
-              )
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="sticker25x25" key={`sticker2-${index}`}>
-                  <p
-                    className={`sticker25x25-name ${nickName ? '' : (proName + '(' + size + ')')?.length > 14 ? 'text-ellipsis' : ''}`}
-                  >
-                    <span
-                      class={
-                        proName?.length <= 14
-                          ? 'product-name2'
-                          : 'product-nameSmall2'
-                      }
-                    >
-                      {nickName
-                        ? nickName
-                        : proName
-                          ? proName
-                          : 'Product Name'}
-                    </span>
-                    <span
-                      class={
-                        proName?.length <= 14
-                          ? 'product-size2'
-                          : 'product-sizeSmall2'
-                      }
-                    >
-                      ({size})
-                    </span>
-                  </p>
-                  <div
-                    style={{
-                      display: 'flex',
-                      alignItems: 'center',
-                      width: '100%',
-                      flexDirection: 'column',
-                      justifyContent: 'center',
-                    }}
-                  >
-                    <img
-                      src={base64Image}
-                      className="sticker25-img"
-                      alt="barcode"
-                    />
-                    <p class="product-id2">{ProdId}</p>
-                  </div>
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="StickerPrints3">
-          <div className="grid25x50_2cross">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                console.log(copyCount, 'copyCount3')
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="label-25x50-content"
-                    key={`sticker3-${recordIndex}-${copyIndex}`}
-                  >
-                    <div>
-                      <p
-                        className={`${nickName ? '' : ((record?.NickName || record?.ProdName) + ' (' + record?.Size + ')')?.length > 12 ? 'text-clamp-2' : ''}`}
-                      >
-                        {record?.NickName || record?.ProdName} ({record?.Size}
-                        {record?.UomName})
-                      </p>
-                      <p>{record?.QRCode || record?.ProdId}</p>
-                    </div>
-                    <img
-                      src={
-                        generateCodeImage(
-                          record?.QRCode || record?.ProdId,
-                          templateOptions?.codeType
-                        ) || base64Image
-                      }
-                      style={{ width: '75px', height: '75px' }}
-                    />
-                  </div>
-                ))
-              })
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="label-25x50-content" key={`sticker3-${index}`}>
-                  <div>
-                    <p
-                      className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-clamp-2' : ''}`}
-                    >
-                      {proName} ({size})
-                    </p>
-                    <p>{ProdId}</p>
-                  </div>
-                  <img
-                    src={base64Image}
-                  />
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="StickerPrints4">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                console.log(copyCount, 'copyCount4')
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="Sticker4"
-                    key={`sticker4-${recordIndex}-${copyIndex}`}
-                  >
-                    <div>
-                      <p
-                        className={`${nickName ? '' : (record?.ProdName + ' (' + record?.Size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {record?.NickName || record?.ProdName} ({record?.Size}
-                        {record?.UomName})
-                      </p>
-                      <p>{record?.QRCode || record?.ProdId}</p>
-                    </div>
-                    <img
-                      src={
-                        generateCodeImage(
-                          record?.QRCode || record?.ProdId,
-                          templateOptions?.codeType
-                        ) || base64Image
-                      }
-                      style={{ width: '75px', height: '75px' }}
-                    />
-                  </div>
-                ))
-              })
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="Sticker4" key={`sticker4-${index}`}>
-                  <div>
-                    <p
-                      className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                    >
-                      {proName} ({size})
-                    </p>
-                    <p>{ProdId}</p>
-                  </div>
-                  <img
-                    src={base64Image}
-                    style={{ width: '75px', height: '75px' }}
-                  />
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="StickerPrints5">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                console.log(copyCount, 'copyCount5')
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="Sticker5"
-                    key={`sticker5-${recordIndex}-${copyIndex}`}
-                  >
-                    <div>
-                      <p
-                        className={`${nickName ? '' : (record?.ProdName + ' (' + record?.Size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {record?.NickName || record?.ProdName} ({record?.Size}
-                        {record?.UomName})
-                      </p>
-                      <p>{record?.QRCode || record?.ProdId}</p>
-                    </div>
-                    <img
-                      src={
-                        generateCodeImage(
-                          record?.QRCode || record?.ProdId,
-                          templateOptions?.codeType
-                        ) || base64Image
-                      }
-                      style={{ width: '72px', height: '72px' }}
-                    />
-                  </div>
-                ))
-              })
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="Sticker5" key={`sticker5-${index}`}>
-                  <div>
-                    <p
-                      className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                    >
-                      {proName} ({size})
-                    </p>
-                    <p>{ProdId}</p>
-                  </div>
-                  <img
-                    src={base64Image}
-                    style={{ width: '72px', height: '72px' }}
-                  />
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="StickerPrints6">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                console.log(copyCount, 'copyCount6')
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="Sticker6"
-                    key={`sticker6-${recordIndex}-${copyIndex}`}
-                  >
-                    <div className="text-section6">
-                      <p
-                        className={`${nickName ? '' : (record?.ProdName + ' (' + record?.Size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {record?.NickName || record?.ProdName} ({record?.Size}
-                        {record?.UomName})
-                      </p>
-                      <p>{record?.QRCode || record?.ProdId}</p>
-                    </div>
-                    <img
-                      src={
-                        generateCodeImage(
-                          record?.QRCode || record?.ProdId,
-                          templateOptions?.codeType
-                        ) || base64Image
-                      }
-                      style={{ width: '11mm', height: '11mm' }}
-                    />
-                  </div>
-                ))
-              })
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="Sticker6" key={`sticker6-${index}`}>
-                  <div className="text-section6">
-                    <p
-                      className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                    >
-                      {proName} ({size})
-                    </p>
-                    <p>{ProdId}</p>
-                  </div>
-                  <img
-                    src={base64Image}
-                    style={{ width: '11mm', height: '11mm' }}
-                  />
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="StickerPrints7">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                console.log(copyCount, 'copyCount7')
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="Sticker7"
-                    key={`sticker7-${recordIndex}-${copyIndex}`}
-                  >
-                    <div className="text-section7">
-                      <p
-                        className={`${nickName ? '' : (record?.ProdName + ' (' + record?.Size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {record?.NickName || record?.ProdName} ({record?.Size}
-                        {record?.UomName})
-                      </p>
-                      <p>{record?.QRCode || record?.ProdId}</p>
-                    </div>
-                    <img
-                      src={
-                        generateCodeImage(
-                          record?.QRCode || record?.ProdId,
-                          templateOptions?.codeType
-                        ) || base64Image
-                      }
-                      style={{ width: '12mm', height: '12mm' }}
-                    />
-                  </div>
-                ))
-              })
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="Sticker7" key={`sticker7-${index}`}>
-                  <div className="text-section7">
-                    <p
-                      className={`${nickName ? '' : (proName + ' (' + size + ')')?.length > 12 ? 'text-ellipsis' : ''}`}
-                    >
-                      {proName} ({size})
-                    </p>
-                    <p>{ProdId}</p>
-                  </div>
-                  <img
-                    src={base64Image}
-                    style={{ width: '12mm', height: '12mm' }}
-                  />
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="StickerPrints8">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                console.log(copyCount, 'copyCount8')
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="OverAllSticker8"
-                    key={`sticker8-${recordIndex}-${copyIndex}`}
-                  >
-                    <div className="StikerBr8">
-                      <p>{record?.BrName || detail?.BrName}</p>
-                    </div>
-                    <div className="Sticker8">
-                      <div className="text-section8">
-                        <p>
-                          Product Name:{' '}
-                          <p
-                            className={`field-value ${nickName ? '' : record?.ProdName?.length > 12 ? 'text-ellipsis' : ''}`}
-                          >
-                            {record?.NickName || record?.ProdName}
-                          </p>
-                        </p>
-                        <p>
-                          SIZE:{' '}
-                          <span className="field-value">
-                            {record?.Size}
-                            {record?.UomName}
-                          </span>
-                        </p>
-                        <p>
-                          Id:{' '}
-                          <span className="field-value">
-                            {record?.QRCode || record?.ProdId}
-                          </span>
-                        </p>
-                        <p>
-                          MRP:{' '}
-                          <span className="field-value">
-                            {'MRP : ' + record?.MRP}
-                          </span>
-                        </p>
-                        <p>
-                          Selling Price:{' '}
-                          <span className="field-value">
-                            {record?.SellPrice}
-                          </span>
-                        </p>
-                      </div>
-                      <img
-                        src={
-                          generateCodeImage(
-                            record?.QRCode || record?.ProdId,
-                            templateOptions?.codeType
-                          ) || base64Image
-                        }
-                        style={{ width: '50mm', height: '50mm' }}
-                      />
-                    </div>
-                  </div>
-                ))
-              })
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="OverAllSticker8">
-                  <div className="StikerBr8">
-                    <p>{detail?.BrName}</p>
-                  </div>
-                  <div className="Sticker8" key={`sticker8-${index}`}>
-                    <div className="text-section8">
-                      <p>
-                        Product Name:{' '}
-                        <p
-                          className={`field-value ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                        >
-                          {proName}
-                        </p>
-                      </p>
-                      <p>
-                        SIZE: <span className="field-value">{size}</span>
-                      </p>
-                      <p>
-                        Id: <span className="field-value">{ProdId}</span>
-                      </p>
-                      <p>
-                        MRP:{' '}
-                        <span className="field-value">
-                          {'MRP : ' + detail?.MRP}
-                        </span>
-                      </p>
-                      <p>
-                        Selling Price:{' '}
-                        <span className="field-value">
-                          {detail?.SellPrice}
-                        </span>
-                      </p>
-                    </div>
-                    <img
-                      src={base64Image}
-                      style={{ width: '50mm', height: '50mm' }}
-                    />
-                  </div>
-                </div>
-              ))}
-          </div>
-        </div>
-        <div id="25X254cross">
-          <div className="grid25x25_4cross">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => {
-                  const hasProductName = !!templateOptions.productName;
-                  const hasMrp = !!templateOptions.mrp;
-
-                  const hasMDate = templateOptions.mDate && record?.ManufDate;
-
-                  const hasEDate = templateOptions.eDate && record?.ExpDate;
-
-                  // IMAGE SIZE LOGIC
-                  let imageSize = 50;
-                  if (!hasMDate && !hasEDate) {
-                    imageSize = 52;
-                  }
-
-                  if (!hasProductName || !hasMrp) {
-                    imageSize = 60;
-                  }
-
-                  if (!hasProductName && !hasMrp) {
-                    imageSize = 80;
-                  }
-
-                  // FLEX DIRECTION LOGIC
-                  const forceColumnLayout =
-                    !hasProductName || !hasMrp || (!hasMDate && !hasEDate);
-                  return (
-                    <div
-                      className="barcode-wrapper-25x25"
-                      key={`Barcode1-${recordIndex}-${copyIndex}`}
-                    >
-                      <div className="barcode-container-25x25">
-                        {templateOptions.value === 'T' && (
-                          <div
-                            style={{
-                              width: '100%',
-                              display: 'flex',
-                              alignItems: 'center',
-                              justifyContent: 'center',
-                              flexDirection: forceColumnLayout
-                                ? 'column'
-                                : 'row',
-                            }}
-                          >
-                            {imageTagBarcodeAndQR(
-                              templateOptions.codeType === 'B'
-                                ? '90%'
-                                : `${imageSize}%`,
-                              '7px',
-                              record?.QRCode || record?.ProdId
-                            )}
-                          </div>
-                        )}
-                        {hasProductName && (
-                          <div
-                            style={{
-                              fontSize: '9px',
-                              textAlign: 'center',
-                              width: '100%',
-                            }}
-                            className={`productNameBQ ${nickName ? '' : record?.ProdName?.length > 12 ? 'text-ellipsis' : ''}`}
-                          >
-                            {record?.NickName || record?.ProdName}
-                          </div>
-                        )}
-                        {hasMrp && (
-                          <div
-                            style={{
-                              fontSize: '9px',
-                              textAlign: 'center',
-                              width: '100%',
-                            }}
-                            className="MRPBQ"
-                          >
-                            {'₹' + record?.MRP}
-                          </div>
-                        )}
-                        {templateOptions.value === 'C' && (
-                          <div
-                            style={{
-                              width: '100%',
-                              display: 'flex',
-                              alignItems: 'center',
-                              justifyContent: 'center',
-                              flexDirection: forceColumnLayout
-                                ? 'column'
-                                : 'row',
-                            }}
-                          >
-                            {imageTagBarcodeAndQR(
-                              templateOptions.codeType === 'B'
-                                ? '90%'
-                                : `${imageSize}%`,
-                              '7px',
-                              record?.QRCode || record?.ProdId
-                            )}
-                          </div>
-                        )}
-                        {(hasMDate || hasEDate) && (
-                          <div
-                            style={{
-                              display: 'flex',
-                              alignItems: 'center',
-                              justifyContent: 'center',
-                              gap: '3px',
-                            }}
-                          >
-                            {hasMDate && (
-                              <div
-                                style={{
-                                  fontSize: '8px',
-                                  whiteSpace: 'nowrap',
-                                  textAlign: 'center',
-                                  width: '100%',
-                                }}
-                                className="MandateBQ"
-                              >
-                                {hasMDate && !hasEDate ? 'MFG: ' : ''}
-                                {formatDate(record?.ManufDate)}
-                              </div>
-                            )}
-                            {hasMDate && hasEDate && (
-                              <span style={{ fontSize: '8px' }}>|</span>
-                            )}
-                            {hasEDate && (
-                              <div
-                                style={{
-                                  fontSize: '8px',
-                                  whiteSpace: 'nowrap',
-                                  textAlign: 'center',
-                                  width: '100%',
-                                }}
-                                className="ExpdateBQ"
-                              >
-                                {!hasMDate && hasEDate ? 'EXP: ' : ''}
-                                {formatDate(record?.ExpDate)}
-                              </div>
-                            )}
-                          </div>
-                        )}
-                        {templateOptions.value === 'B' && (
-                          <div
-                            style={{
-                              width: '100%',
-                              display: 'flex',
-                              alignItems: 'center',
-                              justifyContent: 'center',
-                              flexDirection: forceColumnLayout
-                                ? 'column'
-                                : 'row',
-                            }}
-                          >
-                            {imageTagBarcodeAndQR(
-                              templateOptions.codeType === 'B'
-                                ? '25mm'
-                                : `${imageSize}%`,
-                              '7px',
-                              record?.QRCode || record?.ProdId
-                            )}
-                          </div>
-                        )}
-                      </div>
-                    </div>
-                  );
-                })
-              }
-
-              )
-              : Array.from({ length: copies })?.map((_, index) => {
-                const hasProductName = !!templateOptions.productName;
-                const hasMrp = !!templateOptions.mrp;
-
-                const hasMDate =
-                  templateOptions.mDate &&
-                  detail?.ProdVariantPriceDetails?.[0]?.ManufDate;
-
-                const hasEDate =
-                  templateOptions.eDate &&
-                  detail?.ProdVariantPriceDetails?.[0]?.ExpDate;
-
-                // IMAGE SIZE LOGIC
-                let imageSize = 50;
-                if (!hasMDate && !hasEDate) {
-                  imageSize = 52;
-                }
-
-                if (!hasProductName || !hasMrp) {
-                  imageSize = 60;
-                }
-
-                if (!hasProductName && !hasMrp) {
-                  imageSize = 80;
-                }
-
-                // FLEX DIRECTION LOGIC
-                const forceColumnLayout =
-                  !hasProductName || !hasMrp || (!hasMDate && !hasEDate);
-                return (
-                  <div
-                    className="barcode-wrapper-25x25"
-                    key={`Barcode1-${index}`}
-                  >
-                    <div className="barcode-container-25x25">
-                      {templateOptions.value === 'T' && (
-                        <div
-                          style={{
-                            width: '100%',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            flexDirection: forceColumnLayout
-                              ? 'column'
-                              : 'row',
-                          }}
-                        >
-                          {imageTagBarcodeAndQR(
-                            templateOptions.codeType === 'B'
-                              ? '90%'
-                              : `${imageSize}%`,
-                            '7px'
-                          )}
-                        </div>
-                      )}
-                      {hasProductName && (
-                        <div
-                          style={{
-                            fontSize: '9px',
-                            textAlign: 'center',
-                            width: '100%',
-                          }}
-                          className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                        >
-                          {nickName
-                            ? nickName
-                            : proName
-                              ? proName
-                              : 'Product Name'}
-                        </div>
-                      )}
-                      {hasMrp && (
-                        <div
-                          style={{
-                            fontSize: '9px',
-                            textAlign: 'center',
-                            width: '100%',
-                          }}
-                          className="MRPBQ"
-                        >
-                          {'₹' + detail?.MRP}
-                        </div>
-                      )}
-                      {templateOptions.value === 'C' && (
-                        <div
-                          style={{
-                            width: '100%',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            flexDirection: forceColumnLayout
-                              ? 'column'
-                              : 'row',
-                          }}
-                        >
-                          {imageTagBarcodeAndQR(
-                            templateOptions.codeType === 'B'
-                              ? '90%'
-                              : `${imageSize}%`,
-                            '7px'
-                          )}
-                        </div>
-                      )}
-                      {(hasMDate || hasEDate) && (
-                        <div
-                          style={{
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            gap: '3px',
-                          }}
-                        >
-                          {hasMDate && (
-                            <div
-                              style={{
-                                fontSize: '8px',
-                                whiteSpace: 'nowrap',
-                                textAlign: 'center',
-                                width: '100%',
-                              }}
-                              className="MandateBQ"
-                            >
-                              {hasMDate && !hasEDate ? 'MFG: ' : ''}
-                              {formatDate(
-                                detail?.ProdVariantPriceDetails?.[0]
-                                  ?.ManufDate
-                              )}
-                            </div>
-                          )}
-                          {hasMDate && hasEDate && (
-                            <span style={{ fontSize: '8px' }}>|</span>
-                          )}
-                          {hasEDate && (
-                            <div
-                              style={{
-                                fontSize: '8px',
-                                whiteSpace: 'nowrap',
-                                textAlign: 'center',
-                                width: '100%',
-                              }}
-                              className="ExpdateBQ"
-                            >
-                              {!hasMDate && hasEDate ? 'EXP: ' : ''}
-                              {formatDate(
-                                detail?.ProdVariantPriceDetails?.[0]?.ExpDate
-                              )}
-                            </div>
-                          )}
-                        </div>
-                      )}
-                      {templateOptions.value === 'B' && (
-                        <div
-                          style={{
-                            width: '100%',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            flexDirection: forceColumnLayout
-                              ? 'column'
-                              : 'row',
-                          }}
-                        >
-                          {imageTagBarcodeAndQR(
-                            templateOptions.codeType === 'B'
-                              ? '25mm'
-                              : `${imageSize}%`,
-                            '7px'
-                          )}
-                        </div>
-                      )}
-                    </div>
-                  </div>
-                );
-              })}
-          </div>
-        </div>
-
-        <div id="25X502cross">
-          <div className="grid25x50_2cross">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="label25x50-wrapper"
-                    key={`Barcode2-${recordIndex}-${copyIndex}`}
-                  >
-                    <div className="label25x50-container" style={valueStyleColumn}>
-                      {imageTagBarcodeAndQR(
-                        templateOptions.codeType === 'B' ? '45mm' : '16mm',
-                        '6px',
-                        record?.QRCode || record?.ProdId
-                      )}
-                      {templateOptions.productName && (
-                        <div
-                          className={`label25x50-name ${record?.NickName ? '' : record?.ProdName?.length > 12 ? 'text-ellipsis' : ''}`}
-                        >
-                          {record?.NickName || record?.ProdName}
-                        </div>
-                      )}
-                      {templateOptions.mrp && (
-                        <div className="label25x50-mrp">{'MRP : ' + record?.MRP}</div>
-                      )}
-                    </div>
-                  </div>
-                ))
-              }
-
-              )
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div
-                  className="label25x50-wrapper"
-                  key={`Barcode2-${index}`}
-                >
-                  <div className="label25x50-container" style={valueStyleColumn}>
-                    {imageTagBarcodeAndQR(
-                      templateOptions.codeType === 'B' ? '45mm' : '16mm'
-                    )}
-                    {templateOptions.productName && (
-                      <div
-                        className={`label25x50-name ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {proName}
-                      </div>
-                    )}
-                    {templateOptions.mrp && (
-                      <div className="label25x50-mrp">{'MRP : ' + detail?.MRP}</div>
-                    )}
-                  </div>
-                </div>
-              ))}
-          </div>
-        </div>
-
-        <div id="50X30Single">
-          {selectedRecords?.length > 0
-            ? selectedRecords?.map((record, recordIndex) => {
-              const copyCount = generateQRCodeCopy(record?.QRCode);
-
-              return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-
-                <div
-                  className="BarQrprint6"
-                  style={secondValueStyle}
-                  key={`Barcode3-${recordIndex}-${copyIndex}`}
-                >
-                  <div className="BarQrprint1details flexDirection">
-                    {templateOptions.productName && (
-                      <div
-                        className={`productNameBQ ${record?.NickName ? '' : record?.ProdName?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {record?.NickName || record?.ProdName}
-                      </div>
-                    )}
-                    {templateOptions.mDate && record?.ManufDate && (
-                      <div
-                        style={{ fontSize: '8px', whiteSpace: 'nowrap' }}
-                        className="MandateBQ"
-                      >
-                        {record?.ManufDate}
-                      </div>
-                    )}
-                    {templateOptions.eDate && record?.ExpDate && (
-                      <div
-                        style={{ fontSize: '8px', whiteSpace: 'nowrap' }}
-                        className="ExpdateBQ"
-                      >
-                        {record?.ExpDate}
-                      </div>
-                    )}
-                  </div>
-                  <div
-                    className="Barcodeimage flexDirection"
-                    style={valueStyleColumn}
-                  >
-                    {imageTagBarcodeAndQR(
-                      '70%',
-                      '6px',
-                      record?.QRCode || record?.ProdId
-                    )}
-                    {templateOptions.mrp && (
-                      <div className="MRPBQ">{'MRP : ' + record?.MRP}</div>
-                    )}
-                  </div>
-                </div>
-              ))
-            }
-
-            )
-            : Array.from({ length: copies })?.map((_, index) => (
-              <div
-                className="BarQrprint6"
-                style={secondValueStyle}
-                key={`Barcode3-${index}`}
-              >
-                <div className="BarQrprint1details flexDirection">
-                  {templateOptions.productName && (
-                    <div
-                      className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                    >
-                      {nickName
-                        ? nickName
-                        : proName
-                          ? proName
-                          : 'Product Name'}
-                    </div>
-                  )}
-                  {templateOptions.mDate &&
-                    detail?.ProdVariantPriceDetails?.[0]?.ManufDate && (
-                      <div
-                        style={{ fontSize: '8px', whiteSpace: 'nowrap' }}
-                        className="MandateBQ"
-                      >
-                        {detail?.ProdVariantPriceDetails?.[0]?.ManufDate}
-                      </div>
-                    )}
-                  {templateOptions.eDate &&
-                    detail?.ProdVariantPriceDetails?.[0]?.ExpDate && (
-                      <div
-                        style={{ fontSize: '8px', whiteSpace: 'nowrap' }}
-                        className="ExpdateBQ"
-                      >
-                        {detail?.ProdVariantPriceDetails?.[0]?.ExpDate}
-                      </div>
-                    )}
-                </div>
-                <div
-                  className="Barcodeimage flexDirection"
-                  style={valueStyleColumn}
-                >
-                  {imageTagBarcodeAndQR('70%')}
-                  {templateOptions.mrp && (
-                    <div className="MRPBQ">{'MRP : ' + detail?.MRP}</div>
-                  )}
-                </div>
-              </div>
-            ))}
-        </div>
-
-        <div id="50X25Single">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="BarQrprint2"
-                    style={secondValueStyle}
-                    key={`Barcode4-${recordIndex}-${copyIndex}`}
-                  >
-                    <div
-                      className="BarQrprint1details flexDirection"
-                      style={{ width: '80%' }}
-                    >
-                      {templateOptions.productName && (
-                        <div
-                          className={`productNameBQ ${nickName ? '' : record?.ProdName?.length > 12 ? 'text-ellipsis' : ''}`}
-                        >
-                          {record?.NickName || record?.ProdName}
-                        </div>
-                      )}
-                      {templateOptions.mDate && record?.ManufDate && (
-                        <div
-                          style={{ fontSize: '10px' }}
-                          className="MandateBQ"
-                        >
-                          {record?.ManufDate}
-                        </div>
-                      )}
-                      {templateOptions.eDate && record?.ExpDate && (
-                        <div
-                          style={{ fontSize: '10px' }}
-                          className="ExpdateBQ"
-                        >
-                          {record?.ExpDate}
-                        </div>
-                      )}
-                    </div>
-                    <div
-                      className="Barcodeimage"
-                      style={{
-                        valueStyleColumn,
-                        width: '60%',
-                        flexDirection: 'column',
-                      }}
-                    >
-                      {imageTagBarcodeAndQR(
-                        '90%',
-                        '6px',
-                        record?.QRCode || record?.ProdId
-                      )}
-                      {templateOptions.mrp && (
-                        <div className="MRPBQ">{'MRP : ' + record?.MRP}</div>
-                      )}
-                    </div>
-                  </div>
-                ))
-              }
-
-              )
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div
-                  className="BarQrprint2"
-                  style={secondValueStyle}
-                  key={`Barcode4-${index}`}
-                >
-                  <div
-                    className="BarQrprint1details flexDirection"
-                    style={{ width: '80%' }}
-                  >
-                    {templateOptions.productName && (
-                      <div
-                        className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {nickName
-                          ? nickName
-                          : proName
-                            ? proName
-                            : 'Product Name'}
-                      </div>
-                    )}
-                    {templateOptions.mDate &&
-                      detail?.ProdVariantPriceDetails?.[0]?.ManufDate && (
-                        <div
-                          style={{ fontSize: '10px' }}
-                          className="MandateBQ"
-                        >
-                          {detail?.ProdVariantPriceDetails?.[0]?.ManufDate}
-                        </div>
-                      )}
-                    {templateOptions.eDate &&
-                      detail?.ProdVariantPriceDetails?.[0]?.ExpDate && (
-                        <div
-                          style={{ fontSize: '10px' }}
-                          className="ExpdateBQ"
-                        >
-                          {detail?.ProdVariantPriceDetails?.[0]?.ExpDate}
-                        </div>
-                      )}
-                  </div>
-                  <div
-                    className="Barcodeimage"
-                    style={{
-                      valueStyleColumn,
-                      width: '60%',
-                      flexDirection: 'column',
-                    }}
-                  >
-                    {imageTagBarcodeAndQR('90%')}
-                    {templateOptions.mrp && (
-                      <div className="MRPBQ">{'MRP : ' + detail?.MRP}</div>
-                    )}
-                  </div>
-                </div>
-              ))}
-          </div>
-        </div>
-
-        <div id="100X13(55MMPrintable)">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="BarQrprint9"
-                    key={`Barcode5-${recordIndex}-${copyIndex}`}
-                    style={valueStyleRow}
-                  >
-                    {imageTagBarcodeAndQR(
-                      'auto',
-                      '6px',
-                      record?.QRCode || record?.ProdId
-                    )}
-                    <div className="BarQrprint1details1">
-                      {templateOptions.productName && (
-                        <div style={{ fontSize: '8px' }}>
-                          {'Product Name :' +
-                            (record?.NickName || record?.ProdName)}
-                        </div>
-                      )}
-                      {templateOptions.sellingPrice && (
-                        <div style={{ fontSize: '8px' }}>
-                          {'Selling Price :' + record?.SellPrice}
-                        </div>
-                      )}
-                    </div>
-                  </div>
-                ))
-              }
-
-              )
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div
-                  className="BarQrprint9"
-                  key={`Barcode5-${index}`}
-                  style={valueStyleRow}
-                >
-                  {imageTagBarcodeAndQR()}
-                  <div className="BarQrprint1details1">
-                    {templateOptions.productName && (
-                      <div style={{ fontSize: '8px' }}>
-                        {'Product Name :' + proName}
-                      </div>
-                    )}
-                    {templateOptions.sellingPrice && (
-                      <div style={{ fontSize: '8px' }}>
-                        {'Selling Price :' + detail?.SellPrice}
-                      </div>
-                    )}
-                  </div>
-                </div>
-              ))}
-          </div>
-        </div>
-
-        <div id="100X15(70MMPrintable)">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="BarQrprint1"
-                    style={valueStyleRow}
-                    key={`Barcode6-${recordIndex}-${copyIndex}`}
-                  >
-                    <div className="BarQrprint1details flexDirection">
-                      {templateOptions.productName && (
-                        <div
-                          className={`productNameBQ ${nickName ? '' : record?.ProdName?.length > 12 ? 'text-ellipsis' : ''}`}
-                        >
-                          {'Product Name: ' +
-                            (record?.NickName || record?.ProdName)}
-                        </div>
-                      )}
-                      {templateOptions.mrp && (
-                        <div className="MRPBQ">{'MRP : ' + record?.MRP}</div>
-                      )}
-                      {templateOptions.sellingPrice && (
-                        <div className="SellingpriceBQ">
-                          {'Selling Price :' + record?.SellPrice}
-                        </div>
-                      )}
-                    </div>
-                    <div className="Qrcodeimage" style={{ width: '50%' }}>
-                      {imageTagBarcodeAndQR(
-                        'auto',
-                        '6px',
-                        record?.QRCode || record?.ProdId
-                      )}
-                    </div>
-                  </div>
-                ))
-              }
-
-              )
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div
-                  className="BarQrprint1"
-                  style={valueStyleRow}
-                  key={`Barcode6-${index}`}
-                >
-                  <div className="BarQrprint1details flexDirection">
-                    {templateOptions.productName && (
-                      <div
-                        className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {'Product Name' + proName}
-                      </div>
-                    )}
-                    {templateOptions.mrp && (
-                      <div className="MRPBQ">{'MRP : ' + detail?.MRP}</div>
-                    )}
-                    {templateOptions.sellingPrice && (
-                      <div className="SellingpriceBQ">
-                        {'Selling Price :' + detail?.SellPrice}
-                      </div>
-                    )}
-                  </div>
-                  <div className="Qrcodeimage" style={{ width: '50%' }}>
-                    {imageTagBarcodeAndQR()}
-                  </div>
-                </div>
-              ))}
-          </div>
-        </div>
-
-        <div id="100X150">
-          <div className="container">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="BarQrprint7"
-                    style={secondValueStyle}
-                    key={`Barcode7-${recordIndex}-${copyIndex}`}
-                  >
-                    <div
-                      className="BarQrprint1details1"
-                      style={{ gap: '10px' }}
-                    >
-                      {templateOptions.productName && (
-                        <div
-                          className={`productNameBQ ${nickName ? '' : record?.ProdName?.length > 12 ? 'text-ellipsis' : ''}`}
-                        >
-                          {'Product Name: ' +
-                            (record?.NickName || record?.ProdName)}
-                        </div>
-                      )}
-                      {templateOptions.sellingPrice && (
-                        <div className="SellingpriceBQ">
-                          {'Selling Price :' + record?.SellPrice}
-                        </div>
-                      )}
-                      {templateOptions.mDate && record?.ManufDate && (
-                        <div className="MandateBQ">{record?.ManufDate}</div>
-                      )}
-                      {templateOptions.eDate && record?.ExpDate && (
-                        <div className="ExpdateBQ">{record?.ExpDate}</div>
-                      )}
-                      {templateOptions.color && (
-                        <div className="ColorBQ">
-                          {record?.Color || colorText}
-                        </div>
-                      )}
-                    </div>
-                    <div
-                      className="Barcodeimage"
-                      style={{
-                        valueStyleColumn,
-                        width: '50%',
-                        flexDirection: 'column',
-                      }}
-                    >
-                      {
-                        <div>
-                          {imageTagBarcodeAndQR(
-                            '70%',
-                            '6px',
-                            record?.QRCode || record?.ProdId
-                          )}
-                        </div>
-                      }
-                      {templateOptions.mrp && (
-                        <div className="MRPBQ">{'MRP : ' + record?.MRP}</div>
-                      )}
-                    </div>
-                  </div>
-                ))
-              }
-
-              )
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div
-                  className="BarQrprint7"
-                  style={secondValueStyle}
-                  key={`Barcode7-${index}`}
-                >
-                  <div
-                    className="BarQrprint1details1"
-                    style={{ gap: '10px' }}
-                  >
-                    {templateOptions.productName && (
-                      <div
-                        className={`productNameBQ ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {'Product Name' + (nickName ? nickName : proName)}
-                      </div>
-                    )}
-                    {templateOptions.sellingPrice && (
-                      <div className="SellingpriceBQ">
-                        {'Selling Price :' + detail?.SellPrice}
-                      </div>
-                    )}
-                    {templateOptions.mDate &&
-                      detail?.ProdVariantPriceDetails?.[0]?.ManufDate && (
-                        <div className="MandateBQ">
-                          {detail?.ProdVariantPriceDetails?.[0]?.ManufDate}
-                        </div>
-                      )}
-                    {templateOptions.eDate &&
-                      detail?.ProdVariantPriceDetails?.[0]?.ExpDate && (
-                        <div className="ExpdateBQ">
-                          {detail?.ProdVariantPriceDetails?.[0]?.ExpDate}
-                        </div>
-                      )}
-                    {templateOptions.color && (
-                      <div className="ColorBQ">{colorText}</div>
-                    )}
-                  </div>
-                  <div
-                    className="Barcodeimage"
-                    style={{
-                      valueStyleColumn,
-                      width: '50%',
-                      flexDirection: 'column',
-                    }}
-                  >
-                    {<div>{imageTagBarcodeAndQR('70%')}</div>}
-                    {templateOptions.mrp && (
-                      <div className="MRPBQ">{'MRP : ' + detail?.MRP}</div>
-                    )}
-                  </div>
-                </div>
-              ))}
-          </div>
-        </div>
-
-        <div id="label-15X156cross">
-          <div
-            className="label-15x15-container"
-          >
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div className="label-15x15-content" key={`Barcode8-${recordIndex}-${copyIndex}`}>
-                    {templateOptions.value === 'T' &&
-                      imageTagBarcodeAndQR(
-                        templateOptions.codeType === 'B' ? '100%' : '6mm',
-                        '6px',
-                        record?.QRCode || record?.ProdId
-                      )}
-                    {templateOptions.productName && (
-                      <div
-                        className={`label-15x15-name ${record?.NickName ? '' : (record?.ProdName)?.length > 12 ? 'text-ellipsis' : ''}`}
-                      >
-                        {record?.NickName
-                          ? record?.NickName
-                          : record?.ProdName}
-                      </div>
-                    )}
-                    {templateOptions.value === 'C' &&
-                      imageTagBarcodeAndQR(
-                        templateOptions.codeType === 'B'
-                          ? '80%'
-                          : !templateOptions.productName &&
-                            !templateOptions.mrp
-                            ? '80%'
-                            : '35%',
-                        '6px',
-                        record?.QRCode || record?.ProdId
-                      )}
-                    {templateOptions.mrp && (
-                      <div
-                        style={{
-                          width: '100%',
-                          textAlign: 'center',
-                          fontSize: '6px',
-                        }}
-                        className="MRPBQ"
-                      >
-                        {'₹:' + record?.MRP}
-                      </div>
-                    )}
-                    {templateOptions.value === 'B' &&
-                      imageTagBarcodeAndQR(
-                        templateOptions.codeType === 'B' ? '100%' : '50%',
-                        '6px',
-                        record?.QRCode || record?.ProdId
-                      )}
-                  </div>))
-              })
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div className="label-15x15-content" key={`Barcode8-${index}`}>
-                  {templateOptions.value === 'T' &&
-                    imageTagBarcodeAndQR(
-                      templateOptions.codeType === 'B' ? '100%' : '6mm'
-                    )}
-                  {templateOptions.productName && (
-                    <div
-                      className={`label-15x15-name ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                    >
-                      {nickName
-                        ? nickName
-                        : proName
-                          ? proName
-                          : 'Product Name'}
-                    </div>
-                  )}
-                  {templateOptions.value === 'C' &&
-                    imageTagBarcodeAndQR(
-                      (templateOptions.codeType === 'B'
-                        ? '80%'
-                        : (!templateOptions.productName &&
-                          !templateOptions.mrp)
-                          ? '80%'
-                          : '7.5mm'), '5px'
-                    )}
-                  {templateOptions.mrp && (
-                    <div
-                      className="label-15x15-mrp"
-                    >
-                      {'₹:' + (detail?.MRP ? detail?.MRP : 10.0)}
-                    </div>
-                  )}
-                  {templateOptions.value === 'B' &&
-                    imageTagBarcodeAndQR(
-                      templateOptions.codeType === 'B' ? '100%' : '7.5mm'
-                    )}
-                </div>
-              ))}
-          </div>
-        </div>
-        {/* //Qrcode */}
-        <div id="22X353cross">
-          <div className="grid22x35_3cross">
-            {selectedRecords?.length > 0
-              ? selectedRecords?.map((record, recordIndex) => {
-                const copyCount = generateQRCodeCopy(record?.QRCode);
-
-                return Array.from({ length: copyCount })?.map((_, copyIndex) => (
-                  <div
-                    className="barcode-wrapper-22x35"
-                    key={`Barcode9-${recordIndex}-${copyIndex}`}
-                  >
-                    <div
-                      className="barcode-container-22x35"
-                      style={{
-                        alignItems: 'center',
-                        flexDirection:
-                          templateOptions.value === 'T'
-                            ? 'column'
-                            : 'column-reverse',
-                      }}
-                    >
-                      {imageTagBarcodeAndQR(
-                        templateOptions.codeType === 'B'
-                          ? '100%'
-                          : !templateOptions.mrp &&
-                            !templateOptions.productName
-                            ? '60%'
-                            : '40%',
-                        '8px',
-                        record?.QRCode || record?.ProdId
-                      )}
-                      {(templateOptions.productName ||
-                        templateOptions.mrp) && (
-                          <div
-                            style={{
-                              display: 'flex',
-                              flexDirection: 'column',
-                              alignItems: 'center',
-                              justifyContent: 'center',
-                            }}
-                          >
-                            {templateOptions.productName && (
-                              <div
-                                className={`productNameBQ ${templateOptions.codeType === 'B' ? '' : 'productNameBQSmall'} ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                              >
-                                {record?.NickName
-                                  ? record?.NickName
-                                  : record?.ProdName}
-                              </div>
-                            )}
-                            {templateOptions.mrp && (
-                              <div
-                                className={`MRPBQ ${templateOptions.codeType === 'B' ? '' : 'productNameBQSmall'}`}
-                              >
-                                {'MRP : ' + record?.MRP}
-                              </div>
-                            )}
-                          </div>
-                        )}
-                    </div>
-                  </div>
-                ))
-              }
-              )
-              : Array.from({ length: copies })?.map((_, index) => (
-                <div
-                  className="barcode-wrapper-22x35"
-                  key={`Barcode9-${index}`}
-                >
-                  <div
-                    className="barcode-container-22x35"
-                    style={{
-                      alignItems: 'center',
-                      flexDirection:
-                        templateOptions.value === 'T'
-                          ? 'column'
-                          : 'column-reverse',
-                    }}
-                  >
-                    {imageTagBarcodeAndQR(
-                      templateOptions.codeType === 'B'
-                        ? '100%'
-                        : !templateOptions.mrp && !templateOptions.productName
-                          ? '60%'
-                          : '40%',
-                      '8px'
-                    )}
-                    {(templateOptions.productName || templateOptions.mrp) && (
-                      <div
-                        style={{
-                          display: 'flex',
-                          flexDirection: 'column',
-                          alignItems: 'center',
-                          justifyContent: 'center',
-                        }}
-                      >
-                        {templateOptions.productName && (
-                          <div
-                            className={`productNameBQ ${templateOptions.codeType === 'B' ? '' : 'productNameBQSmall'} ${nickName ? '' : proName?.length > 12 ? 'text-ellipsis' : ''}`}
-                          >
-                            {nickName
-                              ? nickName
-                              : proName
-                                ? proName
-                                : 'Product Name'}
-                          </div>
-                        )}
-                        {templateOptions.mrp && (
-                          <div
-                            className={`MRPBQ ${templateOptions.codeType === 'B' ? '' : 'productNameBQSmall'}`}
-                          >
-                            {'MRP : ' + detail?.MRP}
-                          </div>
-                        )}
-                      </div>
-                    )}
-                  </div>
-                </div>
-              ))}
-          </div>
-        </div>
-      </div>
       <DefaultModal
         open={openExcel}
         title="Bulk Upload"
@@ -5747,7 +2747,7 @@ const ProductList = () => {
               }}
               onlineImage={onlineImage}
               ImageLink={rowRecord?.ProdLogo || null}
-              updateImageUrl={imageModalRowIndex ? updateImageUrl : () => { }}
+              updateImageUrl={imageModalRowIndex ? updateImageUrl : () => {}}
               handleClose={handleImageModalClose}
             />
             <button
@@ -5864,126 +2864,24 @@ const ProductList = () => {
           </>
         }
       />
-      <DefaultModal
+      <QRCodeCopiesModal
         open={stockWiseQrcode}
-        title="Stock Wise Qrcode"
-        handleCancel={() => setstockWiseQrcode(false)}
-        handleSubmit={() => {
-          if (totalCopies == 0) {
-            message.error("Please enter copies count")
-            return;
-          }
-          else {
-            setstockWiseQrcode(false)
-            onFinish();
-          }
-        }}
-        footer={true}
-        children={
-          <>
-            <div className='ProductList-pwiseQrcode'>
-              <Table
-                columns={[
-                  { title: 'Product Name', dataIndex: 'productName', key: 'productName' },
-                  {
-                    title: 'Copies Count',
-                    dataIndex: 'copiesCount',
-                    key: 'copiesCount',
-                    render: (text, record) => (
-                      <input
-                        className='inputpwiseQR'
-                        type="number"
-                        min="1"
-                        value={record.copiesCount}
-                        onChange={(e) => {
-                          const newValue = parseInt(e.target.value);
-                          setQrandbarcodeDatas(prev =>
-                            prev.map(item =>
-                              item.key === record.key
-                                ? { ...item, copiesCount: newValue }
-                                : item
-                            )
-                          );
-                        }}
-                        style={{ width: '80px' }}
-                      />
-                    )
-                  }
-                ]}
-                dataSource={QrandbarcodeDatas}
-                rowKey="ProdId"
-                pagination={false}
-                size="small"
-                rowClassName={(record) =>
-                  record.StockAvailable === "N" ? 'row-red' : ''
-                }
-              />
-            </div>
-            <div className='indicationInfo'>
-              <p></p>
-              <span>Stock is not Maintained</span>
-            </div>
-          </>
-        }
+        onClose={() => setstockWiseQrcode(false)}
+        type="stock"
+        totalCopies={totalCopies}
+        onFinish={onFinish}
+        QrandbarcodeDatas={QrandbarcodeDatas}
+        setQrandbarcodeDatas={setQrandbarcodeDatas}
       />
-      <DefaultModal
+
+      <QRCodeCopiesModal
         open={productWiseQrcode}
-        title="Product Wise Qrcode"
-        handleCancel={() => setProductWiseQrcode(false)}
-        handleSubmit={() => {
-          if (totalCopies == 0) {
-            message.error("Please enter copies count")
-            return;
-          }
-          else {
-            setProductWiseQrcode(false)
-            onFinish();
-          }
-
-        }} footer={true}
-
-        children={
-          <>
-            <div className='ProductList-pwiseQrcode'>
-              <Table
-                columns={[
-                  { title: 'Product Name', dataIndex: 'productName', key: 'productName' },
-                  // { title: 'Stock Count', dataIndex: 'StockAvailable', key: 'StockAvailable' },
-                  {
-                    title: 'Copies Count',
-                    dataIndex: 'copiesCount',
-                    key: 'copiesCount',
-                    render: (text, record, index) => (
-                      <input
-                        type="number"
-                        className='inputpwiseQR'
-                        min="1"
-                        value={record.copiesCount}
-                        onChange={(e) => {
-                          const newValue = parseInt(e.target.value) || 1;
-                          setQrandbarcodeDatas(prev =>
-                            prev.map(item =>
-                              item.key === record.key
-                                ? { ...item, copiesCount: newValue }
-                                : item
-                            )
-                          );
-                        }}
-                        style={{ width: '80px' }}
-                      />
-                    )
-                  }
-                ]}
-                dataSource={QrandbarcodeDatas}
-                rowKey="ProdId"
-                pagination={false}
-                size="small"
-              />
-            </div>
-
-
-          </>
-        }
+        onClose={() => setProductWiseQrcode(false)}
+        type="product"
+        totalCopies={totalCopies}
+        onFinish={onFinish}
+        QrandbarcodeDatas={QrandbarcodeDatas}
+        setQrandbarcodeDatas={setQrandbarcodeDatas}
       />
 
       <OCRLoader