@bjsdistribution/dms-client-return 0.0.73 → 0.0.75

package/dist/dms-client-return.cjs.development.js

@@ -58,6 +58,9 @@ function _extends() {
     return n;
   }, _extends.apply(null, arguments);
 }
+function _objectDestructuringEmpty(t) {
+  if (null == t) throw new TypeError("Cannot destructure " + t);
+}
 function _objectWithoutPropertiesLoose(r, e) {
   if (null == r) return {};
   var t = {};
@@ -583,11 +586,6 @@ var PrintOptionTOggle = /*#__PURE__*/jotai.atom(null);
 var usePrintOptionTOggle = function usePrintOptionTOggle() {
   return jotai.useAtom(PrintOptionTOggle);
 };
-// Overview Table
-var atomRoutesTable = /*#__PURE__*/jotai.atom([]);
-var useRoutesTable = function useRoutesTable() {
-  return jotai.useAtom(atomRoutesTable);
-};
 //this
 var loading = /*#__PURE__*/jotai.atom(false);
 var useStatsLoading = function useStatsLoading() {
@@ -644,10 +642,6 @@ var atomItemsPerOverviewPage = /*#__PURE__*/jotai.atom(50);
 var useItemsPerOverviewPage = function useItemsPerOverviewPage() {
   return jotai.useAtom(atomItemsPerOverviewPage);
 };
-var countStatus = /*#__PURE__*/jotai.atom([]);
-var useCountData = function useCountData() {
-  return jotai.useAtom(countStatus);
-};
 //
 // ROUTE DETAILS PAGE STATES ->
 // const orderId = atom<number | undefined>(undefined);
@@ -1575,9 +1569,9 @@ var optionsForReturnPrint = [{
 var _templateObject$4, _templateObject2$2;
 var options = optionsForReturnPrint;
 var PrintDropDownReturn = function PrintDropDownReturn(_ref) {
-  var legacyProductId = _ref.legacyProductId;
+  _objectDestructuringEmpty(_ref);
   var downloadFiles = function downloadFiles() {
-    var url = "https://us.toolbox.bjshomedelivery.com/offload/return_label?gsit_products_id=" + legacyProductId;
+    var url = "";
     window.open(url, '_blank'); // Opens the URL in a new tab
   };
   return React__default.createElement(OptionsList, null, options == null ? void 0 : options.map(function (item, index) {
@@ -4041,10 +4035,11 @@ function Latitude() {
     placeholder: "Latitude",
     onKeyDown: handleKeyDown,
     value: (orderRecipient == null ? void 0 : orderRecipient.latitude) || '',
-    onChange: onChange
+    onChange: onChange,
+    readOnly: true
   }));
 }
-var CustomInput = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 25px;\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n"])));
+var CustomInput = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n  opacity: 0.8;\n  background-color: #f4f4f4;\n  pointer-events: none;\n"])));
 var Container$a = /*#__PURE__*/styled__default.div(_templateObject2$h || (_templateObject2$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
 
 var _templateObject$o, _templateObject2$i;
@@ -4075,10 +4070,11 @@ function Longitude() {
     placeholder: "Longitude",
     onKeyDown: handleKeyDown,
     value: (orderRecipient == null ? void 0 : orderRecipient.longitude) || '',
-    onChange: onChange
+    onChange: onChange,
+    readOnly: true
   }));
 }
-var CustomInput$1 = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 25px;\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n"])));
+var CustomInput$1 = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n  opacity: 0.8;\n  background-color: #f4f4f4;\n  pointer-events: none;\n"])));
 var Container$b = /*#__PURE__*/styled__default.div(_templateObject2$i || (_templateObject2$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
 
 var _templateObject$p, _templateObject2$j, _templateObject3$7, _templateObject4$4, _templateObject5$3;
@@ -4106,12 +4102,20 @@ function What3words() {
     });
   };
   var validateInput = function validateInput(value) {
-    var isValid = w3wRegex.test(value);
-    setErrors(function (prev) {
-      return _extends({}, prev, {
-        w3wError: isValid ? '' : 'Please enter a valid input (word.word.word)'
+    if (value.trim()) {
+      var isValid = w3wRegex.test(value);
+      setErrors(function (prev) {
+        return _extends({}, prev, {
+          w3wError: isValid ? '' : 'Please enter a valid input (word.word.word)'
+        });
       });
-    });
+    } else {
+      setErrors(function (prev) {
+        return _extends({}, prev, {
+          w3wError: ''
+        });
+      });
+    }
   };
   return React__default.createElement(Container$c, null, React__default.createElement(dmsComponentLibrary.Label, {
     label: "What3Words Address",
@@ -4138,18 +4142,18 @@ var RightColumn$1 = /*#__PURE__*/styled__default.div(_templateObject$q || (_temp
 var Right = /*#__PURE__*/styled__default.div(_templateObject2$k || (_templateObject2$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 10px;\n"])));
 var Container$d = /*#__PURE__*/styled__default.div(_templateObject3$8 || (_templateObject3$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n"])));
 
-var _templateObject$r, _templateObject2$l, _templateObject3$9, _templateObject4$5;
-// import CallCustomer from './CallCustomer';
+var _templateObject$r, _templateObject2$l, _templateObject3$9, _templateObject4$5, _templateObject5$4;
 // const LANDLINE_REGEX = /^\(?(?:(?:0(?:0|11)\)?[\s-]?\(?|\+)44\)?[\s-]?\(?(?:0\)?[\s-]?\(?)?|0)(?:\d{2}\)?[\s-]?\d{4}[\s-]?\d{4}|\d{3}\)?[\s-]?\d{3}[\\s-]?\d{3,4}|\d{4}\)?[\s-]?(?:\d{5}|\d{3}[\s-]?\d{3})|\d{5}\)?[\s-]?\d{4,5}|8(?:00[\s-]?11[\s-]?11|45[\s-]?46[\s-]?4\d))(?:(?:[\s-]?(?:x|ext\.?\s?|\#)\d+)?)$/;
 function ContactHome() {
-  var _orderRecipient$conta;
+  var _useAtom = jotai.useAtom(errorAtom),
+    errors = _useAtom[0],
+    setErrors = _useAtom[1];
   // Show call icons only if number is valid
   // show copy icon if there is input value
   var _useOrderDetails = useOrderDetails(),
     orderDetails = _useOrderDetails[0],
     setOrderDetails = _useOrderDetails[1];
   var orderRecipient = orderDetails == null ? void 0 : orderDetails.order_recipient;
-  var showCopyIcon = (orderRecipient == null ? void 0 : orderRecipient.contact_home) !== undefined && (orderRecipient == null ? void 0 : orderRecipient.contact_home) !== null && (orderRecipient == null || (_orderRecipient$conta = orderRecipient.contact_home) == null ? void 0 : _orderRecipient$conta.length) > 0;
   var onChange = function onChange(e) {
     var val = e.target.value;
     var updatedOrderRecipient = _extends({}, orderRecipient === null ? {
@@ -4162,37 +4166,63 @@ function ContactHome() {
         order_recipient: updatedOrderRecipient
       });
     });
+    if (val) {
+      if (val.length < 10) {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            homeContactError: 'Phone number must be at least 10 digits.'
+          });
+        });
+      } else if (val.length > 11) {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            homeContactError: 'Phone number must not exceed 11 digits.'
+          });
+        });
+      } else {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            homeContactError: ''
+          });
+        });
+      }
+    } else {
+      setErrors(function (prevErrors) {
+        return _extends({}, prevErrors, {
+          homeContactError: ''
+        });
+      });
+    }
   };
   return React__default.createElement(MainContainer$1, null, React__default.createElement(Wrapper$7, null, React__default.createElement(dmsComponentLibrary.Label, {
     label: "Contact Home",
     htmlFor: "contact-home"
-  }), showCopyIcon && React__default.createElement(CopyText, {
-    text: orderRecipient == null ? void 0 : orderRecipient.contact_home
   })), React__default.createElement(InputContainer, null, React__default.createElement(CustomInput$3, {
     name: "contact-home",
     type: "text",
     placeholder: "Home Number",
     onKeyDown: handleKeyDown,
+    minLength: 10,
+    maxLength: 10,
     value: (orderRecipient == null ? void 0 : orderRecipient.contact_home) || '',
     onChange: onChange
-  })));
+  })), errors.homeContactError && React__default.createElement(ErrorText$1, null, errors.homeContactError));
 }
 var Wrapper$7 = /*#__PURE__*/styled__default.div(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 5px;\n"])));
-var CustomInput$3 = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject2$l || (_templateObject2$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 80%;\n  border-radius: 25px;\n  // @media (max-width: 1024px) {\n  //   width: 80%;\n  // }\n\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n"])));
+var CustomInput$3 = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject2$l || (_templateObject2$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 80%;\n  // @media (max-width: 1024px) {\n  //   width: 80%;\n  // }\n\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n"])));
 var InputContainer = /*#__PURE__*/styled__default.div(_templateObject3$9 || (_templateObject3$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 7px;\n  align-items: center;\n"])));
 var MainContainer$1 = /*#__PURE__*/styled__default.div(_templateObject4$5 || (_templateObject4$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
+var ErrorText$1 = /*#__PURE__*/styled__default.span(_templateObject5$4 || (_templateObject5$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 
-var _templateObject$s, _templateObject2$m, _templateObject3$a, _templateObject4$6;
-// import CallCustomer from './CallCustomer';
+var _templateObject$s, _templateObject2$m, _templateObject3$a, _templateObject4$6, _templateObject5$5;
 function ContactWork() {
-  var _orderRecipient$conta;
-  // Show call icons only if number is valid
-  // show copy icon if there is input value
+  var _useAtom = jotai.useAtom(errorAtom),
+    errors = _useAtom[0],
+    setErrors = _useAtom[1];
   var _useOrderDetails = useOrderDetails(),
     orderDetails = _useOrderDetails[0],
     setOrderDetails = _useOrderDetails[1];
   var orderRecipient = orderDetails == null ? void 0 : orderDetails.order_recipient;
-  var showCopyIcon = (orderRecipient == null ? void 0 : orderRecipient.contact_work) !== undefined && (orderRecipient == null ? void 0 : orderRecipient.contact_work) !== null && (orderRecipient == null || (_orderRecipient$conta = orderRecipient.contact_work) == null ? void 0 : _orderRecipient$conta.length) > 0;
   var onChange = function onChange(e) {
     var val = e.target.value;
     var updatedOrderRecipient = _extends({}, orderRecipient === null ? {
@@ -4205,25 +4235,54 @@ function ContactWork() {
         order_recipient: updatedOrderRecipient
       });
     });
+    // Validate only if there is a value entered
+    if (val) {
+      if (val.length < 10) {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            workCOntanctError: 'Phone number must be at least 10 digits.'
+          });
+        });
+      } else if (val.length > 10) {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            workCOntanctError: 'Phone number must not exceed 10 digits.'
+          });
+        });
+      } else {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            workCOntanctError: ''
+          });
+        });
+      }
+    } else {
+      setErrors(function (prevErrors) {
+        return _extends({}, prevErrors, {
+          workCOntanctError: ''
+        });
+      });
+    }
   };
   return React__default.createElement(Container$e, null, React__default.createElement(Wrapper$8, null, React__default.createElement(dmsComponentLibrary.Label, {
     label: "Contact Work",
     htmlFor: "contact-work"
-  }), showCopyIcon && React__default.createElement(CopyText, {
-    text: orderRecipient == null ? void 0 : orderRecipient.contact_work
   })), React__default.createElement(InputContainer$1, null, React__default.createElement(CustomInput$4, {
     name: "contact-work",
     type: "text",
     placeholder: "Work Number",
     onKeyDown: handleKeyDown,
     value: (orderRecipient == null ? void 0 : orderRecipient.contact_work) || '',
-    onChange: onChange
-  })));
+    onChange: onChange,
+    minLength: 10,
+    maxLength: 10
+  })), errors.workCOntanctError && React__default.createElement(ErrorText$2, null, errors.workCOntanctError));
 }
 var InputContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 7px;\n  align-items: center;\n"])));
 var Wrapper$8 = /*#__PURE__*/styled__default.div(_templateObject2$m || (_templateObject2$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 5px;\n"])));
-var CustomInput$4 = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject3$a || (_templateObject3$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 25px;\n  width: 100%;\n\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n"])));
+var CustomInput$4 = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject3$a || (_templateObject3$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n"])));
 var Container$e = /*#__PURE__*/styled__default.div(_templateObject4$6 || (_templateObject4$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
+var ErrorText$2 = /*#__PURE__*/styled__default.span(_templateObject5$5 || (_templateObject5$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 
 var _templateObject$t;
 function CallCustomer() {
@@ -4231,10 +4290,13 @@ function CallCustomer() {
 }
 var Container$f = /*#__PURE__*/styled__default.div(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 7px;\n"])));
 
-var _templateObject$u, _templateObject2$n, _templateObject3$b, _templateObject4$7;
+var _templateObject$u, _templateObject2$n, _templateObject3$b, _templateObject4$7, _templateObject5$6;
 // const MOBILE_REGEX = /^(\+44\s?7\d{3}|\(?07\d{3}\)?)\s?\d{3}\s?\d{3}$/;
 function ContactMobile() {
   var _orderRecipient$conta;
+  var _useAtom = jotai.useAtom(errorAtom),
+    errors = _useAtom[0],
+    setErrors = _useAtom[1];
   // Show call icons only if number is valid
   // show copy icon if there is input value
   var _useOrderDetails = useOrderDetails(),
@@ -4254,6 +4316,33 @@ function ContactMobile() {
         order_recipient: updatedOrderRecipient
       });
     });
+    if (val) {
+      if (val.length < 10) {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            mobileError: 'Phone number must be at least 10 digits.'
+          });
+        });
+      } else if (val.length > 11) {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            mobileError: 'Phone number must not exceed 11 digits.'
+          });
+        });
+      } else {
+        setErrors(function (prevErrors) {
+          return _extends({}, prevErrors, {
+            mobileError: ''
+          });
+        });
+      }
+    } else {
+      setErrors(function (prevErrors) {
+        return _extends({}, prevErrors, {
+          mobileError: ''
+        });
+      });
+    }
   };
   return React__default.createElement(Container$g, null, React__default.createElement(Wrapper$9, null, React__default.createElement(dmsComponentLibrary.Label, {
     label: "Contact Mobile",
@@ -4262,21 +4351,23 @@ function ContactMobile() {
     text: orderRecipient == null ? void 0 : orderRecipient.contact_mobile
   })), React__default.createElement(InputContainer$2, null, React__default.createElement(CustomInput$5, {
     name: "contact-work",
+    minLength: 10,
+    maxLength: 10,
     type: "text",
     placeholder: "Mobile Number",
     onKeyDown: handleKeyDown,
     value: (orderRecipient == null ? void 0 : orderRecipient.contact_mobile) || '',
     onChange: onChange
-  }), React__default.createElement(CallCustomer, null)));
+  }), React__default.createElement(CallCustomer, null)), errors.mobileError && React__default.createElement(ErrorText$3, null, errors.mobileError));
 }
 var InputContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 7px;\n  align-items: center;\n"])));
 var Wrapper$9 = /*#__PURE__*/styled__default.div(_templateObject2$n || (_templateObject2$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 5px;\n"])));
-var CustomInput$5 = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject3$b || (_templateObject3$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 80%;\n  border-radius: 25px;\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n"])));
+var CustomInput$5 = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject3$b || (_templateObject3$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 80%;\n\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n    margin: 0;\n  }\n  &:focus-visible {\n    outline: none;\n  }\n"])));
 var Container$g = /*#__PURE__*/styled__default.div(_templateObject4$7 || (_templateObject4$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
+var ErrorText$3 = /*#__PURE__*/styled__default.span(_templateObject5$6 || (_templateObject5$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 
 var _templateObject$v, _templateObject2$o, _templateObject3$c;
 function ContactEmail() {
-  var _orderRecipient$conta;
   var emailRegex = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i;
   var _useOrderDetails = useOrderDetails(),
     orderDetails = _useOrderDetails[0],
@@ -4285,7 +4376,6 @@ function ContactEmail() {
     errors = _useAtom[0],
     setErrors = _useAtom[1];
   var orderRecipient = orderDetails == null ? void 0 : orderDetails.order_recipient;
-  var showCopyIcon = (orderRecipient == null ? void 0 : orderRecipient.contact_email) !== undefined && (orderRecipient == null ? void 0 : orderRecipient.contact_email) !== null && (orderRecipient == null || (_orderRecipient$conta = orderRecipient.contact_email) == null ? void 0 : _orderRecipient$conta.length) > 0;
   var onChange = function onChange(e) {
     var val = e.target.value;
     validateInput(val);
@@ -4304,29 +4394,24 @@ function ContactEmail() {
     var isValid = emailRegex.test(value);
     setErrors(function (prev) {
       return _extends({}, prev, {
-        emailError: isValid ? '' : 'Please enter a valid Email Address'
+        emailError: value && !isValid ? 'Please enter a valid Email Address' : ''
       });
     });
   };
   return React__default.createElement(Container$h, null, React__default.createElement(Wrapper$a, null, React__default.createElement(dmsComponentLibrary.Label, {
     label: "Email",
     htmlFor: "email-id"
-  }), showCopyIcon && React__default.createElement(CopyText, {
-    text: orderRecipient == null ? void 0 : orderRecipient.contact_email
   })), React__default.createElement(dmsComponentLibrary.Input, {
     name: "email-id",
     type: "email",
     placeholder: "Email",
     value: (orderRecipient == null ? void 0 : orderRecipient.contact_email) || '',
-    onChange: onChange,
-    style: {
-      borderRadius: '25px'
-    }
-  }), errors.emailError && React__default.createElement(ErrorText$1, null, errors.emailError));
+    onChange: onChange
+  }), errors.emailError && React__default.createElement(ErrorText$4, null, errors.emailError));
 }
 var Wrapper$a = /*#__PURE__*/styled__default.div(_templateObject$v || (_templateObject$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 5px;\n"])));
 var Container$h = /*#__PURE__*/styled__default.div(_templateObject2$o || (_templateObject2$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
-var ErrorText$1 = /*#__PURE__*/styled__default.span(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
+var ErrorText$4 = /*#__PURE__*/styled__default.span(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 
 var _templateObject$w, _templateObject2$p;
 function ContactDetails() {
@@ -4458,11 +4543,15 @@ var Container$l = /*#__PURE__*/styled__default.div(_templateObject2$t || (_templ
 
 var _templateObject$C;
 function DeliveryDate() {
+  var _orderStatus$;
   var _useOrderDetails = useOrderDetails(),
     orderDetails = _useOrderDetails[0],
     setOrderDetails = _useOrderDetails[1];
   var _usePrevOrderDetails = usePrevOrderDetails(),
     prevOrderDetails = _usePrevOrderDetails[0];
+  var _useStatusDetails = useStatusDetails(),
+    orderStatus = _useStatusDetails[0];
+  var routedStatus = orderStatus == null || (_orderStatus$ = orderStatus[0]) == null ? void 0 : _orderStatus$.routed;
   var actionDate = orderDetails != null && orderDetails.action_date ? new Date(orderDetails == null ? void 0 : orderDetails.action_date) : null;
   var onChange = function onChange(date, _dateString) {
     var selectedDate = date == null ? void 0 : date.format('YYYY-MM-DDTHH:mm:ss');
@@ -4497,7 +4586,8 @@ function DeliveryDate() {
     style: {
       borderRadius: '25px'
     },
-    allowClear: false
+    allowClear: false,
+    disabled: routedStatus
   }));
 }
 var MainContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
@@ -4766,6 +4856,13 @@ function TimedServiceDropdown() {
     label: "Timed Service",
     htmlFor: "timedServiceDropdown"
   }), React__default.createElement(StyledSelectDropdown, {
+    styles: _extends({}, dmsComponentLibrary.dropdownStyles, {
+      control: function control(styles) {
+        return _extends({}, styles, {
+          width: 'max-content'
+        });
+      }
+    }),
     placeholder: "Select Timed Service",
     options: timedServicesOptions || [],
     value: timedServicesOptions == null ? void 0 : timedServicesOptions.filter(function (f) {
@@ -5208,7 +5305,7 @@ var Container$x = /*#__PURE__*/styled__default.div(_templateObject$S || (_templa
   return disabled && "\n    pointer-events: none;\n\n    > * {\n    pointer-events: none;\n    }\n  ";
 });
 
-var _templateObject$T, _templateObject2$F, _templateObject3$g, _templateObject4$8, _templateObject5$4;
+var _templateObject$T, _templateObject2$F, _templateObject3$g, _templateObject4$8, _templateObject5$7;
 function ServicesSection() {
   return React__default.createElement(CustomFormSection$3, null, React__default.createElement(Header, {
     label: "Services"
@@ -5218,7 +5315,7 @@ var Top = /*#__PURE__*/styled__default.div(_templateObject$T || (_templateObject
 var DropDownContainer = /*#__PURE__*/styled__default.div(_templateObject2$F || (_templateObject2$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: contents;\n  @media screen and (max-width: 1280px) {\n    display: flex;\n    gap: 15px;\n  }\n"])));
 var RadioContainer = /*#__PURE__*/styled__default.div(_templateObject3$g || (_templateObject3$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: contents;\n  @media screen and (max-width: 1280px) {\n    display: flex;\n    gap: 15px;\n  }\n"])));
 var Bottom = /*#__PURE__*/styled__default.div(_templateObject4$8 || (_templateObject4$8 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var CustomFormSection$3 = /*#__PURE__*/styled__default(dmsComponentLibrary.FormSection)(_templateObject5$4 || (_templateObject5$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 1;\n  flex-direction: column;\n  gap: 10px;\n  border-radius: 8px;\n  background: #f8fafc;\n  box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1);\n  label,\n  input,\n  span {\n    cursor: default !important;\n  }\n"])));
+var CustomFormSection$3 = /*#__PURE__*/styled__default(dmsComponentLibrary.FormSection)(_templateObject5$7 || (_templateObject5$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 1;\n  flex-direction: column;\n  gap: 10px;\n  border-radius: 8px;\n  background: #f8fafc;\n  box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1);\n  label,\n  input,\n  span {\n    cursor: default !important;\n  }\n"])));
 
 var _templateObject$U, _templateObject2$G, _templateObject3$h;
 function AllowTracking() {
@@ -5319,12 +5416,10 @@ function OrderDetailsFooter() {
   var updateOrder = useUpdateOrder();
   var _useAtom = jotai.useAtom(errorAtom),
     errorState = _useAtom[0];
-  // const [, setLogsCallAPi] = useLogsCallAPi();
   var _useUpdateApiCall = useUpdateApiCall(),
     setCallApi = _useUpdateApiCall[1]; //single detail
-  // const [, setNoteLoadingStore] = UseNotesLoading();
   var errorFound = function errorFound() {
-    var isError = errorState.w3wError.length > 0 || errorState.emailError.length > 0 || errorState.homeContactError.length > 0 || errorState.workCOntanctError.length > 0 || errorState.mobileError.length > 0 || errorState.postCodeError.length > 0;
+    var isError = (errorState == null ? void 0 : errorState.w3wError.length) > 0 || (errorState == null ? void 0 : errorState.emailError.length) > 0 || (errorState == null ? void 0 : errorState.homeContactError.length) > 0 || (errorState == null ? void 0 : errorState.workCOntanctError.length) > 0 || (errorState == null ? void 0 : errorState.mobileError.length) > 0 || (errorState == null ? void 0 : errorState.postCodeError.length) > 0;
     return isError;
   };
   var isDifferent = function isDifferent() {
@@ -5391,7 +5486,7 @@ function OrderDetailsFooter() {
     disabled: !isDifferent() || errorFound()
   }, "Save Details"));
 }
-var Container$z = /*#__PURE__*/styled__default.div(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  padding: 10px 15px;\n  align-items: flex-start;\n  border: 1px solid #edebe8;\n  background: #f8fafc;\n  margin: 0px;\n  border-radius: 0px 0px 8px 8px;\n  align-items: center;\n"])));
+var Container$z = /*#__PURE__*/styled__default.div(_templateObject$V || (_templateObject$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  padding: 10px 15px;\n  align-items: flex-start;\n  border-top: 1px solid #edebe8;\n  background: #f8fafc;\n  margin: 0px -15px -15px -15px;\n  border-radius: 0px 0px 8px 8px;\n"])));
 
 var _templateObject$W, _templateObject2$H, _templateObject3$i;
 function ExpandedContent() {
@@ -5588,7 +5683,7 @@ var Th = /*#__PURE__*/styled__default.th(_templateObject3$k || (_templateObject3
 var Td = /*#__PURE__*/styled__default.td(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: normal;\n  padding: 6px 15px;\n  background: #fff;\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  border-right: none;\n  border-left: none;\n"])));
 var IconCover = /*#__PURE__*/styled__default.div(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  span {\n    margin-top: 4px;\n  }\n"])));
 
-var _templateObject$Y, _templateObject2$K, _templateObject3$l, _templateObject4$a, _templateObject5$5, _templateObject6$2, _templateObject7$4, _templateObject8$2, _templateObject9$1;
+var _templateObject$Y, _templateObject2$K, _templateObject3$l, _templateObject4$a, _templateObject5$8, _templateObject6$2, _templateObject7$4, _templateObject8$2, _templateObject9$1;
 var GenericAuditLogsTable = function GenericAuditLogsTable() {
   var _getNotes$data, _getNotes$data2;
   var tableHeadData = NotesTableData[0].tableHead; // Assuming NotesTableData contains table header information
@@ -5621,14 +5716,13 @@ var AuditTableWrapper = /*#__PURE__*/styled__default.div(_templateObject$Y || (_
 var DateTd = /*#__PURE__*/styled__default(Td)(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6d6d6d;\n"])));
 var NoDataFound = /*#__PURE__*/styled__default(Td)(_templateObject3$l || (_templateObject3$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: center;\n  padding: 16px;\n  font-size: 16px;\n  color: #999;\n"])));
 var StyledTable$2 = /*#__PURE__*/styled__default(Table)(_templateObject4$a || (_templateObject4$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  table-layout: fixed;\n  td.noBoder {\n    background: none !important;\n    border: none !important;\n    padding: 0;\n  }\n"])));
-var StyledTr = /*#__PURE__*/styled__default.tr(_templateObject5$5 || (_templateObject5$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  &:nth-child(even) {\n    background-color: #f3fbff;\n  }\n"])));
+var StyledTr = /*#__PURE__*/styled__default.tr(_templateObject5$8 || (_templateObject5$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  &:nth-child(even) {\n    background-color: #f3fbff;\n  }\n"])));
 var StyledTd = /*#__PURE__*/styled__default(Td)(_templateObject6$2 || (_templateObject6$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 10px;\n"])));
 var CreatedBy$1 = /*#__PURE__*/styled__default.div(_templateObject7$4 || (_templateObject7$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-weight: bold;\n"])));
 var ScrollableTableWrapper = /*#__PURE__*/styled__default.div(_templateObject8$2 || (_templateObject8$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 250px;\n  min-height: 200px;\n  overflow: auto;\n"])));
 var StickyHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject9$1 || (_templateObject9$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: sticky;\n  top: 0;\n  z-index: 1;\n  background-color: #fff;\n"])));
 
 var _templateObject$Z;
-// import CustomScrollBar from '../../../../common/scrollbar';
 function AuditLogs() {
   return React__default.createElement(Container$C, null, React__default.createElement(GenericAuditLogsTable, null));
 }
@@ -5694,11 +5788,16 @@ function Notes() {
       setShouldPerformAction(true);
     }
     if (!NotesLoading && NotesData != null && NotesData.data) {
-      var updatedData = NotesData == null ? void 0 : NotesData.data.filter(function (item) {
-        return item['ORDER-NOTE'] || item['ORDER'];
+      // const updatedData = NotesData?.data
+      // .filter((item: any) => item['ORDER-NOTE'] || item['ORDER'])
+      // .map((item: any) => [item['ORDER-NOTE'], item['ORDER']])
+      // .flat()
+      // .filter(Boolean);
+      var updatedData = NotesData.data.filter(function (item) {
+        return item['ORDER-NOTE'] || item['ORDER'] || item['ORDER-RETURN'];
       }).map(function (item) {
-        return [item['ORDER-NOTE'], item['ORDER']];
-      }).flat().filter(Boolean);
+        return [item['ORDER-NOTE'], item['ORDER'], item['ORDER-RETURN']];
+      });
       // const orderData = NotesData?.data[0]?.ORDER || [];
       // const orderNotesData = NotesData?.data[1]?.['ORDER-NOTE'] || [];
       // const allNotes = [...orderData, ...orderNotesData];
@@ -5740,7 +5839,7 @@ function ChevronUp(props) {
   }));
 }
 
-var _templateObject$10, _templateObject2$M, _templateObject3$n, _templateObject4$b, _templateObject5$6, _templateObject6$3, _templateObject7$5, _templateObject8$3;
+var _templateObject$10, _templateObject2$M, _templateObject3$n, _templateObject4$b, _templateObject5$9, _templateObject6$3, _templateObject7$5, _templateObject8$3;
 function CollapsableForm(props) {
   var _useState = React.useState(true),
     isExpanded = _useState[0],
@@ -5764,7 +5863,7 @@ var CustomizedFormSection$1 = /*#__PURE__*/styled__default.div(_templateObject$1
 var CardHeader$1 = /*#__PURE__*/styled__default.div(_templateObject2$M || (_templateObject2$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px solid #f0f2f2;\n  background-color: #f8fafc;\n  color: #3a3630;\n  font-size: 16px;\n  padding: 10px;\n  border-bottom: 1px solid #ddd;\n  border-top-left-radius: 8px;\n  border-top-right-radius: 8px;\n  font-family: 'Roboto', sans-serif;\n  font-weight: 600;\n"])));
 var Text$3 = /*#__PURE__*/styled__default.span(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: 14px;\n  color: #3a3630;\n  font-weight: 500;\n  font-family: 'lato', sans-serif;\n  cursor: pointer;\n"])));
 var Container$E = /*#__PURE__*/styled__default.div(_templateObject4$b || (_templateObject4$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 10px;\n  align-items: center;\n"])));
-var MainContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$6 || (_templateObject5$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: 0;\n"])));
+var MainContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: 0;\n"])));
 var IconContainer$1 = /*#__PURE__*/styled__default.div(_templateObject6$3 || (_templateObject6$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  width: 25px;\n  height: 25px;\n  padding: 2px;\n  border-radius: 3px;\n  background: #ffffff;\n  box-shadow: 0px 1px 2px 0px #1018280d;\n  &:hover {\n    background: rgba(58, 54, 57, 0.05);\n  }\n  svg {\n    transform: rotate(", ");\n  }\n"])), function (props) {
   return props.isExpanded ? '360deg' : '180deg';
 });
@@ -5793,7 +5892,7 @@ var ThumbVertical = /*#__PURE__*/styled__default.div(_templateObject$11 || (_tem
 var View = /*#__PURE__*/styled__default.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-x: hidden;\n"])));
 var TrackHorizontal = /*#__PURE__*/styled__default.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n"])));
 
-var _templateObject$12, _templateObject2$O, _templateObject3$p, _templateObject4$c, _templateObject5$7, _templateObject6$4, _templateObject7$6, _templateObject8$4, _templateObject9$2;
+var _templateObject$12, _templateObject2$O, _templateObject3$p, _templateObject4$c, _templateObject5$a, _templateObject6$4, _templateObject7$6, _templateObject8$4, _templateObject9$2;
 function DynamicTable(_ref) {
   var columns = _ref.columns,
     data = _ref.data;
@@ -5843,7 +5942,7 @@ var Container$F = /*#__PURE__*/styled__default.div(_templateObject$12 || (_templ
 var TableWrapper = /*#__PURE__*/styled__default.div(_templateObject2$O || (_templateObject2$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 100%;\n  overflow-x: auto;\n  scrollbar-width: thin;\n  border-top-left-radius: 15px;\n  border-top-right-radius: 15px;\n"])));
 var TableHeadData = /*#__PURE__*/styled__default.th(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 20px;\n  font-family: 'Roboto', sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 24px;\n  letter-spacing: 0px;\n"])));
 var TableData = /*#__PURE__*/styled__default.td(_templateObject4$c || (_templateObject4$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-spacing: 0px;\n  padding: 13px;\n  font-family: 'Lato', sans-serif;\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 16px;\n  letter-spacing: 0px;\n"])));
-var TableRow = /*#__PURE__*/styled__default.tr(_templateObject5$7 || (_templateObject5$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: stretch;\n  width: 100%;\n  border-bottom: 1px solid rgb(215, 214, 213);\n  font-weight: 300;\n"])));
+var TableRow = /*#__PURE__*/styled__default.tr(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: stretch;\n  width: 100%;\n  border-bottom: 1px solid rgb(215, 214, 213);\n  font-weight: 300;\n"])));
 var TableBody = /*#__PURE__*/styled__default.tbody(_templateObject6$4 || (_templateObject6$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-bottom-right-radius: 10px;\n  background: rgb(255, 255, 255);\n  height: 96%;\n  overflow: auto;\n  width: 100%;\n"])));
 var TableHead = /*#__PURE__*/styled__default.thead(_templateObject7$6 || (_templateObject7$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: sticky;\n  top: 0px;\n  z-index: 1;\n  background: #f8f8f8;\n  white-space: nowrap;\n"])));
 var Table$1 = /*#__PURE__*/styled__default.table(_templateObject8$4 || (_templateObject8$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  height: 50%;\n  background: rgb(255, 255, 255);\n  box-shadow: 0px 4px 30px 0px #2e2d740d;\n"])));
@@ -6861,7 +6960,7 @@ function UploadIcon(props) {
   })));
 }
 
-var _templateObject$1k, _templateObject2$$, _templateObject3$u, _templateObject4$g, _templateObject5$8, _templateObject6$5, _templateObject7$7;
+var _templateObject$1k, _templateObject2$$, _templateObject3$u, _templateObject4$g, _templateObject5$b, _templateObject6$5, _templateObject7$7;
 var Dragger = antd.Upload.Dragger;
 var props = {
   name: 'file',
@@ -6892,7 +6991,7 @@ var MainContainer$8 = /*#__PURE__*/styled__default.div(_templateObject$1k || (_t
 var Text2 = /*#__PURE__*/styled__default.p(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #BCBAB7;\n  text-align: center;\n  font-family: 'Roboto', sans-serif;\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n  text-transform: lowercase;\n  padding: 0;\n  margin: 0;\n"])));
 var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n\n"])));
 var Text1 = /*#__PURE__*/styled__default.p(_templateObject4$g || (_templateObject4$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #AEA9A1;\n  text-align: left;\n  font-family: 'Roboto', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n  text-transform: lowercase;\n  padding: 0;\n  margin: 0;\n"])));
-var IconContainer$3 = /*#__PURE__*/styled__default.div(_templateObject5$8 || (_templateObject5$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px dashed #0465AC;\n  padding: 5px;\n  display: flex;\n  align-items: center;\n"])));
+var IconContainer$3 = /*#__PURE__*/styled__default.div(_templateObject5$b || (_templateObject5$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px dashed #0465AC;\n  padding: 5px;\n  display: flex;\n  align-items: center;\n"])));
 var UploadButton = /*#__PURE__*/styled__default(dmsComponentLibrary.Button)(_templateObject6$5 || (_templateObject6$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 16px;\n  font-size: 14px;\n  padding: 7px 20px;\n"])));
 var Container$Q = /*#__PURE__*/styled__default.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 8px;\n  padding: 6px;\n  align-items: center;\n  align-self: stretch;\n  border-radius: 30px;\n  border: 1px solid #E0E2E7;\n  background: #FFF;\n\n  \n"])));
 
@@ -7237,7 +7336,7 @@ var Input = /*#__PURE__*/styled__default.input(_templateObject2$12 || (_template
 });
 var RadioContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$x || (_templateObject3$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 5px;\n  align-items: center;\n"])));
 
-var _templateObject$1p, _templateObject2$13, _templateObject3$y, _templateObject4$i, _templateObject5$9, _templateObject6$6, _templateObject7$8;
+var _templateObject$1p, _templateObject2$13, _templateObject3$y, _templateObject4$i, _templateObject5$c, _templateObject6$6, _templateObject7$8;
 function RadioButtonGroup(props) {
   var heading = props.heading,
     _props$direction = props.direction,
@@ -7278,7 +7377,7 @@ var RequiredText = /*#__PURE__*/styled__default.span(_templateObject3$y || (_tem
   return !props.$required && 'visibility: hidden;';
 }, labelStyles);
 var LegendContainer = /*#__PURE__*/styled__default.div(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  margin-bottom: 7px;\n"])));
-var Legend = /*#__PURE__*/styled__default.legend(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-size: 14px;\n  font-weight: 400;\n  font-family: ", ";\n  line-height: 20px;\n"])), fonts.secondary);
+var Legend = /*#__PURE__*/styled__default.legend(_templateObject5$c || (_templateObject5$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-size: 14px;\n  font-weight: 400;\n  font-family: ", ";\n  line-height: 20px;\n"])), fonts.secondary);
 var Fieldset = /*#__PURE__*/styled__default.fieldset(_templateObject6$6 || (_templateObject6$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: none;\n  padding: 0px;\n"])));
 var Wrapper$g = /*#__PURE__*/styled__default.div(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: ", ";\n  gap: 32px;\n  padding: 0px 10px;\n  border-radius: 15px;\n  border: 1px solid #e0e2e7;\n  background: #fff;\n  height: 30px;\n  justify-content: space-evenly;\n"])), function (props) {
   return props.$direction === 'horizontal' ? 'row' : 'column';
@@ -7317,7 +7416,7 @@ function DeliveryPoint() {
 }
 var Container$R = /*#__PURE__*/styled__default.div(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  /* height: 30px; */\n  padding: 1px;\n  align-items: flex-start;\n  align-self: stretch;\n"])));
 
-var _templateObject$1r, _templateObject2$14, _templateObject3$z, _templateObject4$j, _templateObject5$a, _templateObject6$7, _templateObject7$9, _templateObject8$5;
+var _templateObject$1r, _templateObject2$14, _templateObject3$z, _templateObject4$j, _templateObject5$d, _templateObject6$7, _templateObject7$9, _templateObject8$5;
 var _excluded$5 = ["imageSrc", "label", "checked"];
 function Checkbox(props) {
   var imageSrc = props.imageSrc,
@@ -7348,7 +7447,7 @@ var Circle = /*#__PURE__*/styled__default.span(_templateObject3$z || (_templateO
 var Text$6 = /*#__PURE__*/styled__default.span(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: ", ";\n  font-family: 'lato', sans-serif;\n  font-size: 12px;\n  font-style: normal;\n  font-weight: 600;\n"])), function (props) {
   return props.$checked ? '#3a3630' : 'rgba(58, 54, 48, 0.50)';
 });
-var InformationContainer = /*#__PURE__*/styled__default.div(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  align-items: center;\n"])));
+var InformationContainer = /*#__PURE__*/styled__default.div(_templateObject5$d || (_templateObject5$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  align-items: center;\n"])));
 var CheckboxContainer = /*#__PURE__*/styled__default.div(_templateObject6$7 || (_templateObject6$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n"])));
 var HiddenCheckbox = /*#__PURE__*/styled__default.input(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 0;\n  height: 100%;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 100%;\n  opacity: 0;\n  cursor: pointer;\n  top: 0;\n  left: 0;\n"])));
 var MainContainer$9 = /*#__PURE__*/styled__default.div(_templateObject8$5 || (_templateObject8$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  width: 130px;\n  height: 93px;\n  gap: 10px;\n  border-radius: 15px;\n  border: 1px solid ", ";\n  align-items: center;\n  justify-content: center;\n  position: relative;\n\n  &:hover {\n    border: 1px solid #cbc8c2;\n    .checkbox-img {\n      filter: grayscale(0);\n    }\n  }\n"])), function (props) {
@@ -7467,7 +7566,7 @@ function ReturnReason() {
   });
 }
 
-var _templateObject$1v, _templateObject2$17, _templateObject3$B, _templateObject4$k, _templateObject5$b, _templateObject6$8, _templateObject7$a;
+var _templateObject$1v, _templateObject2$17, _templateObject3$B, _templateObject4$k, _templateObject5$e, _templateObject6$8, _templateObject7$a;
 function CancelOrder() {
   var _orderStaticData$canc;
   var _useOrderId = useOrderId(),
@@ -7582,7 +7681,7 @@ var Label$5 = /*#__PURE__*/styled__default.label(_templateObject$1v || (_templat
 var Container$U = /*#__PURE__*/styled__default.div(_templateObject2$17 || (_templateObject2$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
 var Wrapper$h = /*#__PURE__*/styled__default.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n  width: 100%;\n  > div {\n    width: 50%;\n  }\n"])));
 var TopLeft = /*#__PURE__*/styled__default.div(_templateObject4$k || (_templateObject4$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 15px;\n  width: 50%;\n"])));
-var TopRight = /*#__PURE__*/styled__default.div(_templateObject5$b || (_templateObject5$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 50%;\n"])));
+var TopRight = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 50%;\n"])));
 var Top$2 = /*#__PURE__*/styled__default.div(_templateObject6$8 || (_templateObject6$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 30px;\n  width: 100%;\n"])));
 // const Bottom = styled.div``;
 var ContentContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 0px 15px;\n  align-items: flex-start;\n  gap: 10px;\n  flex-direction: column;\n"])));
@@ -7626,11 +7725,11 @@ function EmailAddress() {
     type: "text",
     value: (orderRecipient == null ? void 0 : orderRecipient.contact_email) || '',
     onChange: onChange
-  }), errors.emailError && React__default.createElement(ErrorText$2, null, errors.emailError));
+  }), errors.emailError && React__default.createElement(ErrorText$5, null, errors.emailError));
 }
 var Label$6 = /*#__PURE__*/styled__default.label(_templateObject$1w || (_templateObject$1w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-family: 'Lato', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n"])));
 var Container$V = /*#__PURE__*/styled__default.div(_templateObject2$18 || (_templateObject2$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
-var ErrorText$2 = /*#__PURE__*/styled__default.span(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
+var ErrorText$5 = /*#__PURE__*/styled__default.span(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 
 var _templateObject$1x, _templateObject2$19, _templateObject3$D;
 function ContactPhone() {
@@ -7691,11 +7790,11 @@ function ContactPhone() {
     },
     value: (orderRecipient == null ? void 0 : orderRecipient.contact_home) || '',
     onChange: onChange
-  }), errors.homeContactError && React__default.createElement(ErrorText$3, null, errors.homeContactError));
+  }), errors.homeContactError && React__default.createElement(ErrorText$6, null, errors.homeContactError));
 }
 var Label$7 = /*#__PURE__*/styled__default.label(_templateObject$1x || (_templateObject$1x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-family: 'Lato', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n"])));
 var Container$W = /*#__PURE__*/styled__default.div(_templateObject2$19 || (_templateObject2$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
-var ErrorText$3 = /*#__PURE__*/styled__default.span(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
+var ErrorText$6 = /*#__PURE__*/styled__default.span(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 
 var _templateObject$1y, _templateObject2$1a, _templateObject3$E;
 function ContactWork$1() {
@@ -7756,11 +7855,11 @@ function ContactWork$1() {
     },
     value: (orderRecipient == null ? void 0 : orderRecipient.contact_work) || '',
     onChange: onChange
-  }), errors.workContactError && React__default.createElement(ErrorText$4, null, errors.workContactError));
+  }), errors.workContactError && React__default.createElement(ErrorText$7, null, errors.workContactError));
 }
 var Label$8 = /*#__PURE__*/styled__default.label(_templateObject$1y || (_templateObject$1y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-family: 'Lato', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n"])));
 var Container$X = /*#__PURE__*/styled__default.div(_templateObject2$1a || (_templateObject2$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
-var ErrorText$4 = /*#__PURE__*/styled__default.span(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
+var ErrorText$7 = /*#__PURE__*/styled__default.span(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 
 var _templateObject$1z, _templateObject2$1b, _templateObject3$F;
 function ContactMobile$1() {
@@ -7821,11 +7920,11 @@ function ContactMobile$1() {
     value: (orderRecipient == null ? void 0 : orderRecipient.contact_mobile) || '',
     onKeyDown: handleKeyDown,
     onChange: onChange
-  }), errors.mobileError && React__default.createElement(ErrorText$5, null, errors.mobileError));
+  }), errors.mobileError && React__default.createElement(ErrorText$8, null, errors.mobileError));
 }
 var Label$9 = /*#__PURE__*/styled__default.label(_templateObject$1z || (_templateObject$1z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-family: 'Lato', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n"])));
 var Container$Y = /*#__PURE__*/styled__default.div(_templateObject2$1b || (_templateObject2$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
-var ErrorText$5 = /*#__PURE__*/styled__default.span(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
+var ErrorText$8 = /*#__PURE__*/styled__default.span(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 
 function ContactTypeDropdown() {
   var _useOrderStaticData = useOrderStaticData(),
@@ -8339,11 +8438,11 @@ function ConfirmOrder() {
 var Wrapper$j = /*#__PURE__*/styled__default.div(_templateObject$1I || (_templateObject$1I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 10px;\n"])));
 var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$1k || (_templateObject2$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* display: flex; */\n  padding: 15px 12px;\n  flex: 1 0 0;\n  border-radius: 15px;\n  background: white;\n  display: flex;\n  flex-direction: column;\n  gap: 15px;\n  overflow: auto;\n  min-height: 500px;\n  overflow-x: hidden;\n  max-height: 500px;\n  scrollbar-width: thin;\n"])));
 
-var _templateObject2$1l, _templateObject3$I, _templateObject4$n, _templateObject5$c, _templateObject6$9, _templateObject7$b, _templateObject8$6, _templateObject9$3, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13, _templateObject14$1, _templateObject15, _templateObject18, _templateObject19$1, _templateObject26;
+var _templateObject2$1l, _templateObject3$I, _templateObject4$n, _templateObject5$f, _templateObject6$9, _templateObject7$b, _templateObject8$6, _templateObject9$3, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13, _templateObject14$1, _templateObject15, _templateObject18, _templateObject19$1, _templateObject26;
 var StyledInput = /*#__PURE__*/styled__default(dmsComponentLibrary.Input)(_templateObject2$1l || (_templateObject2$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 66px;\n  min-width: 700px;\n"])));
 var StyledTextArea$1 = /*#__PURE__*/styled__default(dmsComponentLibrary.TextArea)(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 12px;\n  align-items: flex-start;\n  gap: 4px;\n  flex: 1 0 0;\n  align-self: stretch;\n  border-radius: 10px;\n  border: 1px solid #e0e2e7;\n  background: #fff;\n  resize: none;\n  min-height: 200px;\n"])));
 var StyledTextAreas = /*#__PURE__*/styled__default(dmsComponentLibrary.TextArea)(_templateObject4$n || (_templateObject4$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 12px;\n  align-items: flex-start;\n  gap: 4px;\n  flex: 1 0 0;\n  align-self: stretch;\n  border-radius: 10px;\n  border: 1px solid #e0e2e7;\n  background: #fff;\n  resize: none;\n  min-height: 50px;\n"])));
-var SplitLayout = /*#__PURE__*/styled__default.div(_templateObject5$c || (_templateObject5$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  gap: 10px;\n"])));
+var SplitLayout = /*#__PURE__*/styled__default.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  gap: 10px;\n"])));
 var SplitText = /*#__PURE__*/styled__default.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  gap: 10px;\n  flex-direction: column;\n  margin-bottom: 4px;\n"])));
 var Row$4 = /*#__PURE__*/styled__default.div(_templateObject7$b || (_templateObject7$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 1 0 0;\n  display: grid;\n  gap: 5px;\n  justify-content: center;\n"])));
 var HoldRow = /*#__PURE__*/styled__default.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 1 0 0;\n  display: grid;\n  gap: 5px;\n  justify-content: center;\n  /* margin-bottom: 25px; */\n"])));
@@ -8432,6 +8531,9 @@ var optionsMenu = [{
 }, {
   label: 'Cancel',
   value: 'cancel-order'
+}, {
+  label: 'Un Hold',
+  value: 'unhold-order'
 }];
 var PrintMenu = [{
   label: 'Return Notes',
@@ -9350,7 +9452,7 @@ function useFetchReminders() {
   return perform;
 }
 
-var _templateObject$1N, _templateObject2$1p, _templateObject3$L, _templateObject4$q, _templateObject5$d, _templateObject6$a, _templateObject7$c;
+var _templateObject$1N, _templateObject2$1p, _templateObject3$L, _templateObject4$q, _templateObject5$g, _templateObject6$a, _templateObject7$c;
 var ViewReminderModal = function ViewReminderModal() {
   var _reminderData$reminde, _reminderData$order_d, _reminderData$order_d2, _reminderData$reminde2, _reminderData$reminde3, _reminderData$reminde4, _reminderData$reminde5;
   var _useCurrentAction = useCurrentAction(),
@@ -9510,15 +9612,15 @@ var StyledWrapper = /*#__PURE__*/styled__default.div(_templateObject$1N || (_tem
 var StyledLabel$1 = /*#__PURE__*/styled__default.label(_templateObject2$1p || (_templateObject2$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  display: flex;\n"])));
 var StyledSpan = /*#__PURE__*/styled__default.span(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #131313;\n  font-family: 'Lato', sans-serif;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 17px;\n  white-space: nowrap;\n"])));
 var StyledCheckbox = /*#__PURE__*/styled__default.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  input[type='checkbox'] {\n    display: none;\n  }\n\n  input[type='checkbox'] + span:before {\n    width: 14px;\n    height: 14px;\n    border: 1.5px solid #3a3630;\n    content: '';\n    display: inline-block;\n    margin: 0 8px 0 0;\n    padding: 0;\n    border-radius: 50%;\n  }\n\n  input[type='checkbox']:checked + span:before {\n    background: #feba30;\n    border: 1.5px solid #3a3630;\n    box-shadow: inset 0px 0px 0px 1px #fff;\n    color: #333;\n    content: '';\n    text-align: center;\n    border-radius: 50%;\n    display: flex;\n    width: 14px;\n    height: 14px;\n  }\n\n  input[type='checkbox']:focus + span::before {\n    outline: 0;\n  }\n"])));
-var OuterDiv = /*#__PURE__*/styled__default.div(_templateObject5$d || (_templateObject5$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-left: 33%;\n"])));
+var OuterDiv = /*#__PURE__*/styled__default.div(_templateObject5$g || (_templateObject5$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-left: 33%;\n"])));
 var RoundCheckbox = /*#__PURE__*/styled__default.span(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var LabelText = /*#__PURE__*/styled__default.span(_templateObject7$c || (_templateObject7$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--primary-dark-brown, #3a3630);\n  font-family: Lato;\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 16px;\n"])));
 
-var _templateObject$1O, _templateObject3$M, _templateObject5$e, _templateObject7$d, _templateObject8$8, _templateObject9$4;
+var _templateObject$1O, _templateObject3$M, _templateObject5$h, _templateObject7$d, _templateObject8$8, _templateObject9$4;
 // Shared styles and components
 var Wrapper$k = /*#__PURE__*/styled__default.div(_templateObject$1O || (_templateObject$1O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n"])));
 var SplitContainer = /*#__PURE__*/styled__default.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* width: 95%; */\n  min-width: 25vw;\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n"])));
-var Label$f = /*#__PURE__*/styled__default.label(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-family: 'Lato', sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n"])));
+var Label$f = /*#__PURE__*/styled__default.label(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-family: 'Lato', sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n"])));
 var ContentContainer$6 = /*#__PURE__*/styled__default.div(_templateObject7$d || (_templateObject7$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 12px 12px;\n  margin: 5px 14px;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n  gap: 15px;\n  background: #f8fafc;\n  border-radius: 15px;\n"])));
 var Row$6 = /*#__PURE__*/styled__default.div(_templateObject8$8 || (_templateObject8$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n"])));
 var DoubleDropdownContainer = /*#__PURE__*/styled__default.div(_templateObject9$4 || (_templateObject9$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 10px;\n  width: 100%;\n"])));
@@ -9535,7 +9637,7 @@ var FormRow = function FormRow(_ref) {
   }, " * ")), children);
 };
 
-var _templateObject$1P, _templateObject2$1q, _templateObject3$N, _templateObject4$r, _templateObject5$f;
+var _templateObject$1P, _templateObject2$1q, _templateObject3$N, _templateObject4$r, _templateObject5$i;
 dayjs.extend(utc);
 dayjs.extend(dateFns.isValid);
 function CreateReminderModal() {
@@ -9762,7 +9864,7 @@ var StyleContainer = /*#__PURE__*/styled__default.div(_templateObject$1P || (_te
 var Label$g = /*#__PURE__*/styled__default.label(_templateObject2$1q || (_templateObject2$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-family: 'Lato', sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n"])));
 var StyledAntSelect$4 = /*#__PURE__*/styled__default(antd.Select)(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .ant-select-selector {\n    width: 20vw;\n    border-radius: 22px;\n  }\n"])));
 var StyledTextArea$2 = /*#__PURE__*/styled__default(dmsComponentLibrary.TextArea)(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 12px;\n  align-items: flex-start;\n  gap: 4px;\n  align-self: stretch;\n  border-radius: 10px;\n  border: 1px solid var(--Neutral-Gray-Gray-100, #e0e2e7);\n  background: var(--Flowkit-White, #fff);\n  resize: none;\n  height: 100px;\n"])));
-var StyledLink = /*#__PURE__*/styled__default.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--contextual-blue, #6396e5);\n  font-family: Lato;\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 16px;\n  cursor: pointer;\n"])));
+var StyledLink = /*#__PURE__*/styled__default.div(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--contextual-blue, #6396e5);\n  font-family: Lato;\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 16px;\n  cursor: pointer;\n"])));
 
 function useCreateReminder() {
   var ssoToken = getCookie('id_token');
@@ -10157,7 +10259,7 @@ function useUpdateFlag() {
   return create;
 }
 
-var _templateObject$1S, _templateObject2$1s, _templateObject3$O, _templateObject4$s, _templateObject5$g, _templateObject6$b;
+var _templateObject$1S, _templateObject2$1s, _templateObject3$O, _templateObject4$s, _templateObject5$j, _templateObject6$b;
 function HeaderSection() {
   var _useSingleFlagData = useSingleFlagData(),
     dataArray = _useSingleFlagData[0];
@@ -10231,7 +10333,7 @@ var Header$1 = /*#__PURE__*/styled__default.div(_templateObject$1S || (_template
 var CustomCancelAndCompleteAction$2 = /*#__PURE__*/styled__default(dmsComponentLibrary.CancelAndCompleteAction)(_templateObject2$1s || (_templateObject2$1s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n"])));
 var ResolveButton = /*#__PURE__*/styled__default.button(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-size: 14px;\n  font-weight: 600;\n  background: transparent;\n  border: none;\n  cursor: pointer;\n"])));
 var Title$7 = /*#__PURE__*/styled__default.span(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: 'Roboto', sans-serif;\n  font-size: 20px;\n  font-weight: 900;\n  line-height: 32px;\n  text-transform: uppercase;\n  color: #3a3630;\n"])));
-var StyledOverlay = /*#__PURE__*/styled__default.div(_templateObject5$g || (_templateObject5$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: rgba(0, 0, 0, 0.4);\n  backdrop-filter: blur(2px);\n  z-index: 1000;\n"])));
+var StyledOverlay = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: rgba(0, 0, 0, 0.4);\n  backdrop-filter: blur(2px);\n  z-index: 1000;\n"])));
 var CrossWrapper = /*#__PURE__*/styled__default.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n"])));
 
 var _templateObject$1T, _templateObject2$1t;
@@ -10349,7 +10451,7 @@ function ButtonsSection() {
 var Buttons = /*#__PURE__*/styled__default.div(_templateObject$1U || (_templateObject$1U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 25px;\n"])));
 var Flex = /*#__PURE__*/styled__default.div(_templateObject2$1u || (_templateObject2$1u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 20px;\n"])));
 
-var _templateObject$1V, _templateObject2$1v, _templateObject3$P, _templateObject4$t, _templateObject5$h, _templateObject6$c;
+var _templateObject$1V, _templateObject2$1v, _templateObject3$P, _templateObject4$t, _templateObject5$k, _templateObject6$c;
 function ActionSection() {
   var _useCurrentAction = useCurrentAction(),
     setCurrentAction = _useCurrentAction[1];
@@ -10439,10 +10541,10 @@ var ButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject$1V || (_tem
 var SaveButton = /*#__PURE__*/styled__default(dmsComponentLibrary.Button)(_templateObject2$1v || (_templateObject2$1v = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var CancelButton = /*#__PURE__*/styled__default(dmsComponentLibrary.Button)(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var DropDowns = /*#__PURE__*/styled__default.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 25px;\n"])));
-var TooltipContent = /*#__PURE__*/styled__default.div(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: #333;\n  color: #fff;\n  padding: 5px 10px;\n  border-radius: 5px;\n"])));
+var TooltipContent = /*#__PURE__*/styled__default.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: #333;\n  color: #fff;\n  padding: 5px 10px;\n  border-radius: 5px;\n"])));
 var Wrapper$l = /*#__PURE__*/styled__default.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 
-var _templateObject$1W, _templateObject2$1w, _templateObject3$Q, _templateObject4$u, _templateObject5$i;
+var _templateObject$1W, _templateObject2$1w, _templateObject3$Q, _templateObject4$u, _templateObject5$l;
 function DetailSection() {
   var _dataArray$order_data, _dataArray$order_data2;
   var _useSingleFlagData = useSingleFlagData(),
@@ -10458,7 +10560,7 @@ var Detail = /*#__PURE__*/styled__default.div(_templateObject$1W || (_templateOb
 var Flex$1 = /*#__PURE__*/styled__default.div(_templateObject2$1w || (_templateObject2$1w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 20px;\n"])));
 var Ref = /*#__PURE__*/styled__default.div(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #7b7874;\n  font-family: 'Lato', sans-serif;\n"])));
 var Order = /*#__PURE__*/styled__default.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #7b7874;\n  text-decoration: underline;\n  font-family: 'Lato', sans-serif;\n"])));
-var StyledLabel$2 = /*#__PURE__*/styled__default(dmsComponentLibrary.Label)(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 10px;\n  font-weight: bold;\n"])));
+var StyledLabel$2 = /*#__PURE__*/styled__default(dmsComponentLibrary.Label)(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 10px;\n  font-weight: bold;\n"])));
 
 function useFetchSingleFlagsData() {
   var _useFlagRefId = useFlagRefId(),
@@ -11196,6 +11298,7 @@ function OrderView() {
       }
     } else {
       var paths = location.pathname.split('/');
+      console.log(paths[paths.length - 1], 'paths');
       setOrderId(paths[paths.length - 1]);
     }
   }, [location.search, loadingExternal]);
@@ -11417,6 +11520,7 @@ function OrderView() {
       setGsitOrderId(undefined);
     };
   }, [gsitId]);
+  console.log(orderId, 'orderId');
   return React__default.createElement(MainContainer$b, null, React__default.createElement(GeneralHeader, null), React__default.createElement(DetailsFilters, null), React__default.createElement(OrderDetails$1, null), React__default.createElement(ProductsInfo, null), React__default.createElement(SplitLayout$1, null, React__default.createElement(NotesContainer, null, React__default.createElement(Notes, null)), React__default.createElement(TablesContainer, null, React__default.createElement(SystemLogs, null))), React__default.createElement(OrderActions, null));
 }
 var MainContainer$b = /*#__PURE__*/styled__default.div(_templateObject$24 || (_templateObject$24 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  padding-bottom: 30px;\n"])));
@@ -11472,45 +11576,53 @@ var BulkFilter = function BulkFilter() {
   );
 };
 
-var _excluded$6 = ["count"];
+// import { TableRowType } from '../shared/interface';
+// import { filtersReducerAtom } from '../header-filters/filterStore';
+// import { useApiHook } from '@bjsdistribution/dms-component-library';
+// import {
+//   UsePaginationData,
+//   useCountData,
+//   useRoutesTable,
+// } from '../store/store';
+// import { notification } from 'antd';
 // import { useAtom } from 'jotai';
 var Filters = function Filters() {
-  var _useRoutesTable = useRoutesTable(),
-    setData = _useRoutesTable[1];
+  // const [, setData] = useRoutesTable();
   // const [state] = useAtom(filtersReducerAtom);
-  var _UsePaginationData = UsePaginationData(),
-    setPaginationObject = _UsePaginationData[1];
-  var _useCountData = useCountData(),
-    setCount = _useCountData[1];
+  // const [, setPaginationObject] = UsePaginationData();
+  // const [, setCount] = useCountData();
   // Hooks
   // const { 'x-filters': filters, 'x-pagination': pagination } = state;
-  var _useApiHook = dmsComponentLibrary.useApiHook({
-      endpoint: 'orders/',
-      method: 'GET'
-    }),
-    fetchedData = _useApiHook.data,
-    apiLoading = _useApiHook.loading,
-    paginationData = _useApiHook.paginationData;
-  React.useEffect(function () {
-    if (fetchedData && fetchedData.data) {
-      var data = fetchedData.data;
-      setData(data);
-      if (paginationData !== null) {
-        var _JSON$parse = JSON.parse(paginationData),
-          count = _JSON$parse.count,
-          rest = _objectWithoutPropertiesLoose(_JSON$parse, _excluded$6);
-        setPaginationObject(rest);
-        setCount(count);
-      } else {
-        // console.error('Pagination data is null');
-        antd.notification.error({
-          message: 'Error',
-          description: 'Pagination data is null'
-        });
-      }
-    }
-  }, [apiLoading]);
-  var _useState = React.useState(true);
+  // const {
+  //   data: fetchedData,
+  //   loading: apiLoading,
+  //   paginationData,
+  // } = useApiHook<{
+  //   data: TableRowType[];
+  // }>({
+  //   endpoint: 'orders/',
+  //   method: 'GET',
+  //   // pagination: pagination,
+  //   // filters: filters,
+  // });
+  // useEffect(() => {
+  //   if (fetchedData && fetchedData.data) {
+  //     const data = fetchedData.data;
+  //     setData(data);
+  //     if (paginationData !== null) {
+  //       const { count, ...rest } = JSON.parse(paginationData);
+  //       setPaginationObject(rest);
+  //       setCount(count);
+  //     } else {
+  //       // console.error('Pagination data is null');
+  //       notification.error({
+  //         message: 'Error',
+  //         description: 'Pagination data is null',
+  //       });
+  //     }
+  //   }
+  // }, [apiLoading]);
+  // const [] = useState(true);
   // const ToggleView = () => {
   //   setDataView(!DataView);
   // };
@@ -11783,7 +11895,7 @@ var overviewfiltersReducerAtom = /*#__PURE__*/jotai.atom(function (get) {
 });
 
 var _templateObject$26, _templateObject2$1C, _templateObject3$T;
-var _excluded$7 = ["count"];
+var _excluded$6 = ["count"];
 function ReturnMainTable() {
   var _useAtom = jotai.useAtom(overviewfiltersReducerAtom),
     state = _useAtom[0];
@@ -11832,7 +11944,7 @@ function ReturnMainTable() {
         try {
           var _JSON$parse = JSON.parse(paginationData),
             count = _JSON$parse.count,
-            rest = _objectWithoutPropertiesLoose(_JSON$parse, _excluded$7);
+            rest = _objectWithoutPropertiesLoose(_JSON$parse, _excluded$6);
           setPaginationObject(rest);
         } catch (error) {
           console.error('Error parsing paginationData:', error);