optimized code

src/Pages/Product/ProductList.jsx

@@ -2029,125 +2029,190 @@ const ProductList = () => {
     formRef?.current?.resetFields();
   };
 
-  const handleCancel = () => {
+
+
+
+  const handleResetExcelData = useCallback(() => {
+    dispatch(emptyExcelData());
+  }, []);
+
+  const handleCancel = useCallback(() => {
     setOpenExcel(false);
     handleResetExcelData();
-  };
+  }, [handleResetExcelData]);
 
-  const openModal = () => {
+  const openModal = useCallback(() => {
     setOpenExcel(true);
-  };
+  }, []);
-
+  const handleSubmitbulk = useCallback((excelData) => {
-  const handleResetExcelData = () => {
-    dispatch(emptyExcelData());
-  };
-
-  const handleSubmitbulk = (excelData) => {
     setExceldatasubmit(excelData?.filter((e) => e?.isModified));
-  };
+  }, []);
 
-  const handleSubmit = async () => {
+  const handleSubmit = useCallback(async () => {
     setBulkpost(true);
-    let FilterData = Exceldatasubmit?.filter((a) => a['ProductName'] != '');
 
-    if (FilterData && FilterData.length > 0) {
+    const FilterData = Exceldatasubmit?.filter(
-      const formattedData = FilterData?.map((data) => ({
+      a => a.ProductName !== ''
-        AppId: getSession('AppId'),
+    );
-        CompId: getSession('CompId'),
-        BranchId: getSession('BranchId'),
-        CreatedBy: getSession('UserId'),
 
-        ProdName: data?.ProductName,
+    if (!FilterData || FilterData.length === 0) {
-        ProdVariantName: data?.ProductVariantName,
-        Size: data?.Quantity,
-        UOM: data?.UOM,
-        MRP: data?.MRP,
-        WhSalePrice: data?.WhSalePrice,
-        SellPrice: data?.SellPrice,
-        ProdCat: data?.Category ? data?.Category : 'General',
-        ProdSubCat: data?.SubCategory,
-        Brand: data?.Brand ? data?.Brand : '',
-        AutoGenerateQr: data?.AutoGenerateQrcode
-          ? data?.AutoGenerateQrcode
-          : 'No',
-        QRCode: data?.AddQrCode,
-        StockAvailable: data?.StockAvailable ? data?.StockAvailable : 'No',
-        TaxId: data?.Tax ? data?.Tax : 'NIL - 0%',
-        Cess: data?.Cess,
-        HSNCode: data?.HSN,
-        PartNumber: data?.PartNumber,
-        Rack: data?.Rack,
-        ManufDate: moment(data?.ManufactureDate, ['M/D/YY']).format(
-          'YYYY-MM-DDTHH:mm:ss'
-        ),
-        ExpDate: moment(data?.ExpireDate, ['M/D/YY']).format(
-          'YYYY-MM-DDTHH:mm:ss'
-        ),
-        AvailableFrom: data?.AvailableFrom
-          ? moment(data?.AvailableFrom, ['M/D/YY']).format('HH:mm:ss')
-          : '',
-        AvailableTo: data?.AvailableTo
-          ? moment(data?.AvailableTo, ['M/D/YY']).format('HH:mm:ss')
-          : '',
-        OnePcsAvailable: data?.Amountperpiece ? data?.Amountperpiece : 'No',
-        OnePcsPrice: data?.AmountperpiecePrice,
-        // NoOfPcs:data?.NumberOfPieceInside,
-        AutoGenerateSingleQr: data?.AutoGenerateOnePieceQrcode
-          ? data?.AutoGenerateOnePieceQrcode
-          : 'No',
-        OnePcQR: data?.AutoGenerateOnePieceQrcodeNumber,
-        // ProductType:data?.ProductType,
-        TokenAvailable: data?.TokenAvailable ? data?.TokenAvailable : 'No',
-        ProdLogo: data?.Productimage,
-      }));
-
-      let postDatas = { prodDetails: formattedData };
-
-      let response = await dispatch(bulkpostdata(postDatas)).unwrap();
-      if (response?.data?.statusCode == 1) {
-        setMessageType('success');
-        setMessageData(response?.data?.response);
-        setBulkpost(false);
-        setpage(1);
-
-        var responseData = await dispatch(
-          getProductDataPageNo({ CompId, BranchId, AppId, PageNumber: 1 })
-        ).unwrap();
-        setCurrentPage(1);
-
-        if (responseData?.data?.statusCode === 1) {
-          setCachedData({ [currentPage]: responseData?.data?.data });
-          setproductData(responseData?.data?.data);
-        }
-      } else {
-        setMessageType('error');
-        setMessageData(responseData?.data?.response);
-      }
-
-      handleResetExcelData();
-      handleCancel();
-    } else {
       setBulkpost(false);
       setMessageType('error');
       setMessageData('No data to submit. Please upload an Excel file.');
+      return;
     }
-  };
 
-  const Unit = UomPreference?.map((e) => e.ConfigName);
+    const formattedData = FilterData.map(data => ({
-  const CategoryId = ProdCatData?.map((e) => e.ConfigId);
+      AppId: getSession('AppId'),
-  const CategoryNames = ProdCatData?.map((e) => e.ConfigName);
+      CompId: getSession('CompId'),
-  const CatconfigId = ProdCatData?.map((e) => e.ConfigId);
+      BranchId: getSession('BranchId'),
-  const Subcatnames = subCatData?.map((e) => e.ConfigName);
+      CreatedBy: getSession('UserId'),
-  const SubcatId = subCatData?.map((e) => e.ConfigId);
+
-  const SubcatNumFId = subCatData?.map((e) => e.NumFId);
+      ProdName: data.ProductName,
-  const BrandNumFId = allBrandData?.map((e) => e.NumFId);
+      ProdVariantName: data.ProductVariantName,
-  const BrandId = allBrandData?.map((e) => e.ConfigId);
+      Size: data.Quantity,
-  const BrandName = allBrandData?.map((e) => e.ConfigName);
+      UOM: data.UOM,
-  const SuplierNames = SupplierData?.map((e) => e.SuppName);
+      MRP: data.MRP,
-  const TaxDatas = TaxData?.map((e) => e.TaxIdName);
+      WhSalePrice: data.WhSalePrice,
-  const TaxData1 = TaxData?.map((e) => e.TaxPercentage);
+      SellPrice: data.SellPrice,
-  const combinedTaxData = TaxDatas?.map(
+      ProdCat: data.Category || 'General',
-    (taxIdName, index) => `${taxIdName} - ${TaxData1[index]}%`
+      ProdSubCat: data.SubCategory,
+      Brand: data.Brand || '',
+      AutoGenerateQr: data.AutoGenerateQrcode || 'No',
+      QRCode: data.AddQrCode,
+      StockAvailable: data.StockAvailable || 'No',
+      TaxId: data.Tax || 'NIL - 0%',
+      Cess: data.Cess,
+      HSNCode: data.HSN,
+      PartNumber: data.PartNumber,
+      Rack: data.Rack,
+      ManufDate: moment(data.ManufactureDate, ['M/D/YY']).format(
+        'YYYY-MM-DDTHH:mm:ss'
+      ),
+      ExpDate: moment(data.ExpireDate, ['M/D/YY']).format(
+        'YYYY-MM-DDTHH:mm:ss'
+      ),
+      AvailableFrom: data.AvailableFrom
+        ? moment(data.AvailableFrom, ['M/D/YY']).format('HH:mm:ss')
+        : '',
+      AvailableTo: data.AvailableTo
+        ? moment(data.AvailableTo, ['M/D/YY']).format('HH:mm:ss')
+        : '',
+      OnePcsAvailable: data.Amountperpiece || 'No',
+      OnePcsPrice: data.AmountperpiecePrice,
+      AutoGenerateSingleQr: data.AutoGenerateOnePieceQrcode || 'No',
+      OnePcQR: data.AutoGenerateOnePieceQrcodeNumber,
+      TokenAvailable: data.TokenAvailable || 'No',
+      ProdLogo: data.Productimage,
+    }));
+
+    const postDatas = { prodDetails: formattedData };
+
+    const response = await dispatch(bulkpostdata(postDatas)).unwrap();
+
+    if (response?.data?.statusCode === 1) {
+      setMessageType('success');
+      setMessageData(response.data.response);
+      setpage(1);
+
+      const responseData = await dispatch(
+        getProductDataPageNo({ CompId, BranchId, AppId, PageNumber: 1 })
+      ).unwrap();
+
+      if (responseData?.data?.statusCode === 1) {
+        setCachedData({ 1: responseData.data.data });
+        setproductData(responseData.data.data);
+        setCurrentPage(1);
+      }
+    } else {
+      setMessageType('error');
+      setMessageData(response?.data?.response);
+    }
+
+    setBulkpost(false);
+    handleResetExcelData();
+    handleCancel();
+  }, [
+    Exceldatasubmit,
+
+    CompId,
+    BranchId,
+    AppId,
+    handleResetExcelData,
+    handleCancel
+  ]);
+
+  const Unit = useMemo(
+    () => UomPreference?.map((e) => e.ConfigName),
+    [UomPreference]
+  );
+
+  const CategoryId = useMemo(
+    () => ProdCatData?.map((e) => e.ConfigId),
+    [ProdCatData]
+  );
+
+  const CategoryNames = useMemo(
+    () => ProdCatData?.map((e) => e.ConfigName),
+    [ProdCatData]
+  );
+
+  const CatconfigId = useMemo(
+    () => ProdCatData?.map((e) => e.ConfigId),
+    [ProdCatData]
+  );
+
+  const Subcatnames = useMemo(
+    () => subCatData?.map((e) => e.ConfigName),
+    [subCatData]
+  );
+
+  const SubcatId = useMemo(
+    () => subCatData?.map((e) => e.ConfigId),
+    [subCatData]
+  );
+
+  const SubcatNumFId = useMemo(
+    () => subCatData?.map((e) => e.NumFId),
+    [subCatData]
+  );
+
+  const BrandNumFId = useMemo(
+    () => allBrandData?.map((e) => e.NumFId),
+    [allBrandData]
+  );
+
+  const BrandId = useMemo(
+    () => allBrandData?.map((e) => e.ConfigId),
+    [allBrandData]
+  );
+
+  const BrandName = useMemo(
+    () => allBrandData?.map((e) => e.ConfigName),
+    [allBrandData]
+  );
+
+  const SuplierNames = useMemo(
+    () => SupplierData?.map((e) => e.SuppName),
+    [SupplierData]
+  );
+
+  const TaxDatas = useMemo(
+    () => TaxData?.map((e) => e.TaxIdName),
+    [TaxData]
+  );
+
+  const TaxData1 = useMemo(
+    () => TaxData?.map((e) => e.TaxPercentage),
+    [TaxData]
+  );
+
+  const combinedTaxData = useMemo(
+    () =>
+      TaxDatas?.map(
+        (taxIdName, index) => `${taxIdName} - ${TaxData1[index]}%`
+      ),
+    [TaxDatas, TaxData1]
   );
   const Deletebulk = async () => {
     let data = {
@@ -2641,7 +2706,7 @@ const ProductList = () => {
           generateQRCodeCopy={(code) =>
             generateQRCodeCopy(QrandbarcodeDatas, code)
           }
-          generateCodeImage={(code, codeType = 'Q') =>  generateCodeImage(code, codeType, QrandbarcodeDatas) }
+          generateCodeImage={(code, codeType = 'Q') => generateCodeImage(code, codeType, QrandbarcodeDatas)}
           imageTagBarcodeAndQR={imageTagBarcodeAndQR}
           dropdownValue={dropdownValue}
           barcodeTemplateDetails={barcodeTemplateDetails}

src/Pages/StockPriceUpdate/StockPriceUpdate.scss

@@ -0,0 +1,76 @@
+.viewerExcelupload {
+  .ant-table-tbody {
+    .old-row {
+      background-color: #97441d !important;
+
+      td {
+        background-color: #ffe1fb !important;
+      }
+
+      &:hover {
+        background-color: #ffe1fb !important;
+
+        > td {
+          background-color: #ffe1fb !important;
+        }
+      }
+    }
+
+    .modified-row {
+      background-color: #cdffd5 !important;
+
+      td {
+        background-color: #cdffd5 !important;
+      }
+
+      &:hover {
+        background-color: #cdffd5 !important;
+
+        > td {
+          background-color: #cdffd5 !important;
+        }
+      }
+    }
+  }
+
+  .ant-table-tbody > tr.old-row:hover > td {
+    background-color: #ff9595 !important;
+  }
+
+  .ant-table-tbody > tr.modified-row:hover > td {
+    background-color: #aeffbb !important;
+  }
+
+  .legend-container {
+    margin-bottom: 10px;
+    display: flex;
+    gap: 15px;
+    align-items: center;
+  }
+
+  .legend-item {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+  }
+
+  .legend-box {
+    width: 20px;
+    height: 20px;
+    border-radius: 3px;
+  }
+
+  .old-box {
+    background: #ffe1fb;
+    border: 1px solid #ff43e6;
+  }
+
+  .modified-box {
+    background: #cdffd5;
+    border: 1px solid #72e018;
+  }
+
+  .legend-text {
+    font-size: 13px;
+  }
+}

src/Services/findrerender.js

@@ -0,0 +1,26 @@
+import { useEffect, useRef } from 'react';
+
+function useWhyDidYouUpdate(componentName, props) {
+  const prevProps = useRef(props);
+
+  useEffect(() => {
+    const allKeys = Object.keys({ ...prevProps.current, ...props });
+    const changes = {};
+
+    allKeys.forEach((key) => {
+      if (prevProps.current[key] !== props[key]) {
+        changes[key] = {
+          from: prevProps.current[key],
+          to: props[key],
+        };
+      }
+    });
+
+    if (Object.keys(changes).length > 0) {
+      console.log(`🔍 ${componentName} re-rendered due to:`, changes);
+    }
+
+    prevProps.current = props;
+  });
+}
+export default useWhyDidYouUpdate

src/Styles/Product/excel.scss

@@ -107,7 +107,6 @@
   }
 
   .ant-table-cell {
-
     .ant-form-item {
       margin-bottom: unset;
 
@@ -116,4 +115,38 @@
       }
     }
   }
+}
+
+.SheetIndiacte {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+
+  div {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+  }
+
+  .mdsheet {
+    width: 25px;
+    height: 25px;
+    border: 1px solid #5bff73;
+    background-color: #b3ffbf;
+    border-radius: 4px;
+  }
+  .mdsheet2 {
+    width: 25px;
+    border-radius: 4px;
+    height: 25px;
+    background-color: #ffc7f8;
+    border: 1px solid #ff74ec;
+  }
+
+  span {
+    color: #333;
+    font-family: "Poppins";
+    font-size: 14px;
+    font-weight: 500;
+  }
 }