npm - @bjsdistribution/dms-client-return - Versions diffs - 0.0.76 → 0.0.77 - Mend

@bjsdistribution/dms-client-return 0.0.76 → 0.0.77

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (17) hide show

package/dist/dms-client-return.esm.js CHANGED Viewed

@@ -50,9 +50,6 @@ 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 = {};
@@ -401,6 +398,7 @@ var postLoading = /*#__PURE__*/atom(false);
 var _final = /*#__PURE__*/atom([]);
 var clearState = /*#__PURE__*/atom(false);
 var assignData = /*#__PURE__*/atom([]);
+var visibilityData = /*#__PURE__*/atom([]);
 var assignPayload = /*#__PURE__*/atom(AssignUpdateInitial);
 var callAPIAgain = /*#__PURE__*/atom(true);
 var actionTypeOptions = /*#__PURE__*/atom([]);
@@ -453,6 +451,9 @@ function useClearState() {
 function useAssignData() {
   return useAtom(assignData);
 }
+function useVisibilityData() {
+  return useAtom(visibilityData);
+}
 function useAssignPayload() {
   return useAtom(assignPayload);
 }
@@ -465,6 +466,10 @@ function useActionTypeOptions() {
 function useSelectedProducts() {
   return useAtom(selectedProductsMove);
 }
+var selectedAssignee = /*#__PURE__*/atom('');
+function useSelectedData() {
+  return useAtom(selectedAssignee);
+}
 // let todayDate = new Date();
 var initialState = {
@@ -1561,21 +1566,37 @@ var optionsForReturnPrint = [{
 var _templateObject$4, _templateObject2$2;
 var options = optionsForReturnPrint;
 var PrintDropDownReturn = function PrintDropDownReturn(_ref) {
-  _objectDestructuringEmpty(_ref);
+  var legacyURL = _ref.legacyURL,
+    legacyProductID = _ref.legacyProductID;
   var downloadFiles = function downloadFiles() {
-    var url = "";
-    window.open(url, '_blank'); // Opens the URL in a new tab
+    if (!legacyURL) return;
+    var url = "" + legacyURL + legacyProductID;
+    window.open(url, '_blank');
   };
   return React.createElement(OptionsList, null, options == null ? void 0 : options.map(function (item, index) {
     var IconComponent = PrintIconMap[item.icon];
+    var isDisabled = !legacyURL || !legacyProductID;
     return React.createElement(OptionsListLi, {
       key: index,
-      onClick: downloadFiles
+      onClick: !isDisabled ? downloadFiles : undefined,
+      disabled: isDisabled
     }, IconComponent && React.createElement(IconComponent, null), " ", item.label);
   }));
 };
 var OptionsList = /*#__PURE__*/styled.ul(_templateObject$4 || (_templateObject$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding: 0;\n  list-style: none;\n  box-sizing: border-box;\n  border-radius: 6px;\n  border: 1px solid rgba(224, 226, 231, 0.5);\n  background: #fff;\n  box-shadow: 0px 4px 30px 0px rgba(46, 45, 116, 0.05);\n  width: 177px;\n  padding: 5px 1px 3px 1px;\n  position: absolute;\n  top: 26px;\n  right: 0;\n  z-index: 99;\n  min-width: 194px;\n"])));
-var OptionsListLi = /*#__PURE__*/styled.li(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-bottom: 1px solid #f0f2f2;\n  padding: 8px 10px;\n  display: flex;\n  gap: 12px;\n  align-items: center;\n  font-size: 13px;\n  cursor: pointer;\n  &:last-child {\n    border: none;\n  }\n"])));
+var OptionsListLi = /*#__PURE__*/styled.li(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-bottom: 1px solid #f0f2f2;\n  padding: 8px 10px;\n  display: flex;\n  gap: 12px;\n  align-items: center;\n  font-size: 13px;\n  cursor: ", ";\n  color: ", ";\n  pointer-events: ", ";\n  background-color: ", ";\n\n  &:last-child {\n    border: none;\n  }\n"])), function (_ref2) {
+  var disabled = _ref2.disabled;
+  return disabled ? 'not-allowed' : 'pointer';
+}, function (_ref3) {
+  var disabled = _ref3.disabled;
+  return disabled ? '#ccc' : 'inherit';
+}, function (_ref4) {
+  var disabled = _ref4.disabled;
+  return disabled ? 'none' : 'auto';
+}, function (_ref5) {
+  var disabled = _ref5.disabled;
+  return disabled ? '#f5f5f5' : 'transparent';
+});
 var _templateObject$5, _templateObject2$3, _templateObject3$2, _templateObject4$2, _templateObject5$2, _templateObject6, _templateObject7$2;
 function Loader(props) {
@@ -1983,10 +2004,11 @@ var ReturnOrderTable = function ReturnOrderTable() {
       onClick: function onClick() {
         return OpenDropDown(index);
       }
-    }, React.createElement(PrinterIcon, null), React.createElement(DownIcon, null), printToogle == index && React.createElement("div", {
+    }, React.createElement(PrinterIcon, null), React.createElement(DownIcon, null), printToogle === index && React.createElement("div", {
       ref: dropdownRef
     }, React.createElement(PrintDropDownReturn, {
-      legacyProductId: item == null ? void 0 : item.legacy_product_id
+      legacyURL: item == null ? void 0 : item.return_order_product_label,
+      legacyProductID: item == null ? void 0 : item.legacy_product_id
     })))))));
   })))));
 };
@@ -5531,7 +5553,38 @@ function OrderDetails$1() {
   return React.createElement(React.Fragment, null, React.createElement(ExpandedContent, null));
 }
-var _templateObject$X, _templateObject2$I, _templateObject3$j;
+var _templateObject$X;
+function NoteType() {
+  var _useVisibilityData = useVisibilityData(),
+    visibilityData = _useVisibilityData[0];
+  var _useSelectedData = useSelectedData(),
+    selected = _useSelectedData[0],
+    setSelected = _useSelectedData[1];
+  var handleRadioButtonChange = function handleRadioButtonChange(event) {
+    var selectedValue = event.target.value;
+    var selectedOption = visibilityData == null ? void 0 : visibilityData.find(function (option) {
+      return option.value === selectedValue;
+    });
+    if (selectedOption) {
+      setSelected(selectedOption.value);
+    }
+  };
+  return React.createElement(Container$B, null, React.createElement(RadioButtonGroup$1, {
+    selectedValue: selected,
+    heading: "",
+    options: visibilityData == null ? void 0 : visibilityData.map(function (client) {
+      return {
+        label: client.type,
+        value: client.value
+      };
+    }),
+    onChange: handleRadioButtonChange,
+    required: false
+  }));
+}
+var Container$B = /*#__PURE__*/styled.div(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
+var _templateObject$Y, _templateObject2$I, _templateObject3$j;
 function AddNote() {
   var _useState = useState(''),
     noteText = _useState[0],
@@ -5546,6 +5599,8 @@ function AddNote() {
     moduleIds = _usemoduleIds[0];
   var _useGlobalStateHitAud = useGlobalStateHitAuditLog(),
     setRecallAuditLog = _useGlobalStateHitAud[1];
+  var _useSelectedData = useSelectedData(),
+    selected = _useSelectedData[0];
   // Save New Note
   var _useState2 = useState(null),
     notificationData = _useState2[0],
@@ -5573,7 +5628,8 @@ function AddNote() {
                 action: 'create',
                 description: noteText,
                 data_dump: '{}',
-                manual: 1
+                manual: 1,
+                is_private: selected
               }]
             };
             _context.prev = 5;
@@ -5638,7 +5694,7 @@ function AddNote() {
       top: 80
     });
   }, [notificationData]);
-  return React.createElement(Container$B, null, React.createElement(Label$h, {
+  return React.createElement(Container$C, null, React.createElement(Label$h, {
     label: "Add New Note"
   }), React.createElement(StyledTextArea, {
     name: "description",
@@ -5650,9 +5706,9 @@ function AddNote() {
   }), React.createElement(SaveNoteContainer, null, React.createElement(Button, {
     disabled: !noteText,
     onClick: saveNote
-  }, "SAVE NOTE")));
+  }, "SAVE NOTE"), React.createElement(NoteType, null)));
 }
-var Container$B = /*#__PURE__*/styled.div(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
+var Container$C = /*#__PURE__*/styled.div(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n"])));
 var SaveNoteContainer = /*#__PURE__*/styled.div(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  gap: 10px;\n  .disabled button {\n    opacity: 0.5;\n    cursor: default;\n  }\n"])));
 var StyledTextArea = /*#__PURE__*/styled.textarea(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 57px;\n  border-radius: 12px;\n  background: #fff;\n  resize: none;\n  border-radius: 8px;\n  border: 1px solid var(--Neutral-Gray-Gray-100, #e0e2e7);\n  background: var(--Flowkit-White, #fff);\n  padding: 8px 12px;\n"])));
@@ -5675,7 +5731,7 @@ var Th = /*#__PURE__*/styled.th(_templateObject3$k || (_templateObject3$k = /*#_
 var Td = /*#__PURE__*/styled.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.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$8, _templateObject6$2, _templateObject7$4, _templateObject8$2, _templateObject9$1;
+var _templateObject$Z, _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
@@ -5704,7 +5760,7 @@ var GenericAuditLogsTable = function GenericAuditLogsTable() {
     colSpan: tableHeadData == null ? void 0 : tableHeadData.length
   }, "No data found"))))));
 };
-var AuditTableWrapper = /*#__PURE__*/styled.div(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 250px;\n  min-height: 200px;\n  /* overflow: auto; */\n\n  table {\n    border-spacing: 0;\n    width: 100%;\n    text-align: left;\n\n    thead {\n      th {\n        border-bottom: 1px solid rgba(58, 54, 48, 0.25);\n        background: #faf9f9;\n        padding: 14px 12px;\n        color: #3a3630;\n        font-size: 14px;\n        font-weight: 600;\n        line-height: 24px;\n      }\n    }\n    tbody {\n      td {\n        color: #667085;\n        font-family: Lato;\n        font-size: 13px;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 16px;\n        padding: 10px;\n        .bold {\n          font-weight: 500;\n          font-size: 14px;\n        }\n      }\n    }\n  }\n"])));
+var AuditTableWrapper = /*#__PURE__*/styled.div(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 250px;\n  min-height: 200px;\n  /* overflow: auto; */\n\n  table {\n    border-spacing: 0;\n    width: 100%;\n    text-align: left;\n\n    thead {\n      th {\n        border-bottom: 1px solid rgba(58, 54, 48, 0.25);\n        background: #faf9f9;\n        padding: 14px 12px;\n        color: #3a3630;\n        font-size: 14px;\n        font-weight: 600;\n        line-height: 24px;\n      }\n    }\n    tbody {\n      td {\n        color: #667085;\n        font-family: Lato;\n        font-size: 13px;\n        font-style: normal;\n        font-weight: 400;\n        line-height: 16px;\n        padding: 10px;\n        .bold {\n          font-weight: 500;\n          font-size: 14px;\n        }\n      }\n    }\n  }\n"])));
 var DateTd = /*#__PURE__*/styled(Td)(_templateObject2$K || (_templateObject2$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6d6d6d;\n"])));
 var NoDataFound = /*#__PURE__*/styled(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(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"])));
@@ -5714,13 +5770,13 @@ var CreatedBy$1 = /*#__PURE__*/styled.div(_templateObject7$4 || (_templateObject
 var ScrollableTableWrapper = /*#__PURE__*/styled.div(_templateObject8$2 || (_templateObject8$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 250px;\n  min-height: 200px;\n  overflow: auto;\n"])));
 var StickyHeaderWrapper = /*#__PURE__*/styled.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;
+var _templateObject$_;
 function AuditLogs() {
-  return React.createElement(Container$C, null, React.createElement(GenericAuditLogsTable, null));
+  return React.createElement(Container$D, null, React.createElement(GenericAuditLogsTable, null));
 }
-var Container$C = /*#__PURE__*/styled.div(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 295px; /* Set height to limit container size */\n  overflow: auto; /* Enable scrolling */\n  scrollbar-width: thin;\n"])));
+var Container$D = /*#__PURE__*/styled.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 295px; /* Set height to limit container size */\n  overflow: auto; /* Enable scrolling */\n  scrollbar-width: thin;\n"])));
-var _templateObject$_, _templateObject2$L, _templateObject3$m;
+var _templateObject$$, _templateObject2$L, _templateObject3$m;
 // import { useLocation } from 'react-router-dom';
 function Notes() {
   var _usemoduleIds = usemoduleIds(),
@@ -5802,18 +5858,18 @@ function Notes() {
     }
     setAuditLogLoading(NotesLoading);
   }, [moduleIds, orderId, NotesLoading, recallAuditLog]);
-  return React.createElement(Container$D, null, React.createElement(CardHeader, null, "NOTES"), React.createElement(CustomizedFormSection, null, React.createElement(AddNote, null), React.createElement(AuditLogs, null)));
+  return React.createElement(Container$E, null, React.createElement(CardHeader, null, "NOTES"), React.createElement(CustomizedFormSection, null, React.createElement(AddNote, null), React.createElement(AuditLogs, null)));
 }
-var Container$D = /*#__PURE__*/styled.div(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 5px;\n"])));
+var Container$E = /*#__PURE__*/styled.div(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 5px;\n"])));
 var CardHeader = /*#__PURE__*/styled.div(_templateObject2$L || (_templateObject2$L = /*#__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  text-transform: uppercase;\n  font-family: 'Roboto', sans-serif;\n  font-weight: 600;\n"])));
 var CustomizedFormSection = /*#__PURE__*/styled.div(_templateObject3$m || (_templateObject3$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  background: #ffffff;\n  padding: 10px;\n  flex-direction: column;\n  gap: 14px;\n  border: 1px solid #f0f2f2;\n  border-bottom-right-radius: 8px;\n  border-bottom-left-radius: 8px;\n  box-shadow: 0px 4px 30px 0px rgba(46, 45, 116, 0.05);\n"])));
-var _templateObject$$;
+var _templateObject$10;
 // import styled from 'styled-components';
 function SystemCollapsedContent() {
   return React.createElement(Font, null, "SYSTEM EVENT LOGS");
 }
-var Font = /*#__PURE__*/styled.div(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 20px; /* 150% */\n"])));
+var Font = /*#__PURE__*/styled.div(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 20px; /* 150% */\n"])));
 function ChevronUp(props) {
   return React.createElement("svg", Object.assign({
@@ -5831,12 +5887,12 @@ function ChevronUp(props) {
   }));
 }
-var _templateObject$10, _templateObject2$M, _templateObject3$n, _templateObject4$b, _templateObject5$9, _templateObject6$3, _templateObject7$5, _templateObject8$3;
+var _templateObject$11, _templateObject2$M, _templateObject3$n, _templateObject4$b, _templateObject5$9, _templateObject6$3, _templateObject7$5, _templateObject8$3;
 function CollapsableForm(props) {
   var _useState = useState(true),
     isExpanded = _useState[0],
     setIsExpanded = _useState[1];
-  return React.createElement(MainContainer$5, null, React.createElement(CardHeader$1, null, React.createElement(CollapsedContent, null, props.collapsedContent, React.createElement(Container$E, null, React.createElement(Text$3, {
+  return React.createElement(MainContainer$5, null, React.createElement(CardHeader$1, null, React.createElement(CollapsedContent, null, props.collapsedContent, React.createElement(Container$F, null, React.createElement(Text$3, {
     onClick: function onClick() {
       return setIsExpanded(function (prev) {
         return !prev;
@@ -5851,10 +5907,10 @@ function CollapsableForm(props) {
     isExpanded: isExpanded
   }, React.createElement(ChevronUp, null))))), isExpanded && React.createElement(CustomizedFormSection$1, null, React.createElement(ExpandedContent$1, null, props.children)));
 }
-var CustomizedFormSection$1 = /*#__PURE__*/styled.div(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  background: #ffffff;\n  padding: 12px;\n  flex-direction: column;\n  gap: 14px;\n  border: 1px solid #f0f2f2;\n  border-bottom-right-radius: 8px;\n  border-bottom-left-radius: 8px;\n  box-shadow: 0px 4px 30px 0px rgba(46, 45, 116, 0.05);\n"])));
+var CustomizedFormSection$1 = /*#__PURE__*/styled.div(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  background: #ffffff;\n  padding: 12px;\n  flex-direction: column;\n  gap: 14px;\n  border: 1px solid #f0f2f2;\n  border-bottom-right-radius: 8px;\n  border-bottom-left-radius: 8px;\n  box-shadow: 0px 4px 30px 0px rgba(46, 45, 116, 0.05);\n"])));
 var CardHeader$1 = /*#__PURE__*/styled.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.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.div(_templateObject4$b || (_templateObject4$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 10px;\n  align-items: center;\n"])));
+var Container$F = /*#__PURE__*/styled.div(_templateObject4$b || (_templateObject4$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 10px;\n  align-items: center;\n"])));
 var MainContainer$5 = /*#__PURE__*/styled.div(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: 0;\n"])));
 var IconContainer$1 = /*#__PURE__*/styled.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';
@@ -5862,7 +5918,7 @@ var IconContainer$1 = /*#__PURE__*/styled.div(_templateObject6$3 || (_templateOb
 var ExpandedContent$1 = /*#__PURE__*/styled.div(_templateObject7$5 || (_templateObject7$5 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var CollapsedContent = /*#__PURE__*/styled.div(_templateObject8$3 || (_templateObject8$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n"])));
-var _templateObject$11, _templateObject2$N, _templateObject3$o;
+var _templateObject$12, _templateObject2$N, _templateObject3$o;
 function CustomScrollBar(props) {
   var children = props.children,
     _props$thumbHeight = props.thumbHeight,
@@ -5880,11 +5936,11 @@ function CustomScrollBar(props) {
     }
   }, children);
 }
-var ThumbVertical = /*#__PURE__*/styled.div(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: #586164;\n  border-radius: 66px;\n  width: 2px !important; // to overide styles\n  margin-top: 60px;\n"])));
+var ThumbVertical = /*#__PURE__*/styled.div(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: #586164;\n  border-radius: 66px;\n  width: 2px !important; // to overide styles\n  margin-top: 60px;\n"])));
 var View = /*#__PURE__*/styled.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-x: hidden;\n"])));
 var TrackHorizontal = /*#__PURE__*/styled.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n"])));
-var _templateObject$12, _templateObject2$O, _templateObject3$p, _templateObject4$c, _templateObject5$a, _templateObject6$4, _templateObject7$6, _templateObject8$4, _templateObject9$2;
+var _templateObject$13, _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;
@@ -5905,7 +5961,7 @@ function DynamicTable(_ref) {
   var smallColumns = ['types', 'sources', 'event', 'code', 'type', 'route', 'category', 'action'];
   var mediumColumns = ['date'];
   var largeColumns = ['reference', 'notes', 'details', 'datetime'];
-  return React.createElement(MainContainer$6, null, React.createElement(Container$F, null, React.createElement(TableWrapper, null, React.createElement(CustomScrollBar, null, React.createElement(Table$1, null, React.createElement(TableHead, null, headerGroups.map(function (headerGroup) {
+  return React.createElement(MainContainer$6, null, React.createElement(Container$G, null, React.createElement(TableWrapper, null, React.createElement(CustomScrollBar, null, React.createElement(Table$1, null, React.createElement(TableHead, null, headerGroups.map(function (headerGroup) {
     return React.createElement(TableRow, {
       key: headerGroup.id
     }, headerGroup.headers.map(function (header) {
@@ -5930,7 +5986,7 @@ function DynamicTable(_ref) {
 //   transform: rotate(180deg);
 //   cursor: pointer;
 // `;
-var Container$F = /*#__PURE__*/styled.div(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 30vh;\n  pointer-events: initial;\n  @media (max-width: 1024px) {\n    height: 40vh;\n  }\n"])));
+var Container$G = /*#__PURE__*/styled.div(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 30vh;\n  pointer-events: initial;\n  @media (max-width: 1024px) {\n    height: 40vh;\n  }\n"])));
 var TableWrapper = /*#__PURE__*/styled.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.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.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"])));
@@ -5940,7 +5996,7 @@ var TableHead = /*#__PURE__*/styled.thead(_templateObject7$6 || (_templateObject
 var Table$1 = /*#__PURE__*/styled.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"])));
 var MainContainer$6 = /*#__PURE__*/styled.div(_templateObject9$2 || (_templateObject9$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  // width: 40%;\n  .col {\n    flex: 2;\n    // padding: 0 0 0 10px;\n    word-break: break-all;\n    display: flex;\n    color: #3a3630;\n    align-items: center;\n    // width: 160px;\n  }\n\n  .col.sm {\n    flex: 1.5;\n    // width: 115px;\n  }\n  .col.md {\n    flex: 2.5;\n    // width: 175px;\n  }\n  .col.lg {\n    flex: 10;\n    // width: 240px;\n    // padding-right: 10px;\n  }\n"])));
-var _templateObject$13, _templateObject2$P;
+var _templateObject$14, _templateObject2$P;
 function Event(props) {
   var _props$row;
   var data = props == null || (_props$row = props.row) == null ? void 0 : _props$row.original.event_information_id;
@@ -5955,7 +6011,7 @@ function Event(props) {
   };
   return React.createElement(RowContainer, null, React.createElement(Row, null, getDescription(data)));
 }
-var RowContainer = /*#__PURE__*/styled.div(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var RowContainer = /*#__PURE__*/styled.div(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var Row = /*#__PURE__*/styled.div(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 //to change data into options
@@ -6003,25 +6059,25 @@ var priorityData = [{
   color: '#E95252'
 }];
-var _templateObject$14, _templateObject2$Q;
+var _templateObject$15, _templateObject2$Q;
 function Date$1(props) {
   var _props$row;
   var data = props == null || (_props$row = props.row) == null ? void 0 : _props$row.original.created_at;
   return React.createElement(RowContainer$1, null, React.createElement(Row$1, null, formatDate$1(data)));
 }
-var RowContainer$1 = /*#__PURE__*/styled.div(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var RowContainer$1 = /*#__PURE__*/styled.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var Row$1 = /*#__PURE__*/styled.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var _templateObject$15, _templateObject2$R;
+var _templateObject$16, _templateObject2$R;
 function Code(props) {
   var _props$row;
   var data = props == null || (_props$row = props.row) == null ? void 0 : _props$row.original.event_code;
   return React.createElement(RowContainer$2, null, React.createElement(Row$2, null, data));
 }
-var RowContainer$2 = /*#__PURE__*/styled.div(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var RowContainer$2 = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var Row$2 = /*#__PURE__*/styled.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var _templateObject$16, _templateObject2$S;
+var _templateObject$17, _templateObject2$S;
 function Note(props) {
   var _props$row;
   var data = props == null || (_props$row = props.row) == null || (_props$row = _props$row.original) == null ? void 0 : _props$row.event_notes;
@@ -6029,7 +6085,7 @@ function Note(props) {
     title: data
   }, React.createElement(Row$3, null, data));
 }
-var RowContainer$3 = /*#__PURE__*/styled.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-block;\n  max-width: 200px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])));
+var RowContainer$3 = /*#__PURE__*/styled.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-block;\n  max-width: 200px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])));
 var Row$3 = /*#__PURE__*/styled.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var tableColumns = [{
@@ -6133,7 +6189,7 @@ function useGetEventNotes() {
   return perform;
 }
-var _templateObject$17;
+var _templateObject$18;
 function SystemLogs() {
   var _useOrderProductSyste = useOrderProductSystemLogs(),
     systemLogs = _useOrderProductSyste[0];
@@ -6185,7 +6241,7 @@ function SystemLogs() {
     data: systemLogs
   })));
 }
-var Table$2 = /*#__PURE__*/styled.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
+var Table$2 = /*#__PURE__*/styled.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
 var StatusOptions = [{
   label: 'Released',
@@ -6342,11 +6398,11 @@ function ConfirmedIcon() {
   }))));
 }
-var _templateObject$18, _templateObject2$T, _templateObject3$q, _templateObject4$d;
+var _templateObject$19, _templateObject2$T, _templateObject3$q, _templateObject4$d;
 function Status() {
   var _useStatusDetails = useStatusDetails(),
     orderStatus = _useStatusDetails[0];
-  return React.createElement(Container$G, null, React.createElement(BoxContainer, null, StatusOptions.map(function (option, index) {
+  return React.createElement(Container$H, null, React.createElement(BoxContainer, null, StatusOptions.map(function (option, index) {
     return React.createElement(React.Fragment, {
       key: index
     }, React.createElement(TextContainer$1, null, renderIcon(option.value, orderStatus), React.createElement(Heading, null, option.label)), index < StatusOptions.length - 1 && React.createElement(Divider, null));
@@ -6388,17 +6444,17 @@ var renderIcon = function renderIcon(value, orderStatus) {
       return null;
   }
 };
-var BoxContainer = /*#__PURE__*/styled.div(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px solid #e3e3e3;\n  display: flex;\n  justify-content: space-evenly;\n  border-radius: 8px;\n  background: #f8fafc;\n  align-items: center;\n  height: 5%;\n"])));
+var BoxContainer = /*#__PURE__*/styled.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px solid #e3e3e3;\n  display: flex;\n  justify-content: space-evenly;\n  border-radius: 8px;\n  background: #f8fafc;\n  align-items: center;\n  height: 5%;\n"])));
 var Heading = /*#__PURE__*/styled.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: 'lato', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 18px;\n  text-transform: uppercase;\n"])));
-var Container$G = /*#__PURE__*/styled.div(_templateObject3$q || (_templateObject3$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 15px;\n  margin-top: 25px;\n"])));
+var Container$H = /*#__PURE__*/styled.div(_templateObject3$q || (_templateObject3$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 15px;\n  margin-top: 25px;\n"])));
 var TextContainer$1 = /*#__PURE__*/styled.div(_templateObject4$d || (_templateObject4$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: 10px;\n  display: flex;\n  align-items: center;\n"])));
-var _templateObject$19;
+var _templateObject$1a;
 // import DropDownOptions from './dropdowns';
 function GeneralHeader() {
   return React.createElement(Section, null, React.createElement(Status, null));
 }
-var Section = /*#__PURE__*/styled.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var Section = /*#__PURE__*/styled.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var ActionIcon = function ActionIcon() {
   return React.createElement("svg", {
@@ -6540,13 +6596,13 @@ var ReturnProductTable = function ReturnProductTable() {
   }, "No records found"))))));
 };
-var _templateObject$1a;
+var _templateObject$1b;
 var ProductTable = function ProductTable() {
-  return React.createElement(Container$H, null, React.createElement(ReturnProductTable, null));
+  return React.createElement(Container$I, null, React.createElement(ReturnProductTable, null));
 };
-var Container$H = /*#__PURE__*/styled.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* height: 230px;  */\n  overflow: auto; /* Enable scrolling */\n  scrollbar-width: thin;\n"])));
+var Container$I = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* height: 230px;  */\n  overflow: auto; /* Enable scrolling */\n  scrollbar-width: thin;\n"])));
-var _templateObject$1b, _templateObject2$U;
+var _templateObject$1c, _templateObject2$U;
 var payloadAtom = /*#__PURE__*/atom(null);
 var NewReturnDropdown = function NewReturnDropdown() {
   var defaultSelectStyle = {
@@ -6643,7 +6699,7 @@ var NewReturnDropdown = function NewReturnDropdown() {
       value: order.id
     };
   });
-  return React.createElement(Container$I, null, React.createElement(Text$4, null, "New Return Order:"), React.createElement(Select, {
+  return React.createElement(Container$J, null, React.createElement(Text$4, null, "New Return Order:"), React.createElement(Select, {
     options: dropdownOptions,
     placeholder: "Select",
     onChange: handleDropdownChange,
@@ -6656,10 +6712,10 @@ var NewReturnDropdown = function NewReturnDropdown() {
     popupClassName: defaultPopupClassName
   }));
 };
-var Container$I = /*#__PURE__*/styled.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  align-self: stretch;\n  white-space: nowrap;\n"])));
+var Container$J = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  align-self: stretch;\n  white-space: nowrap;\n"])));
 var Text$4 = /*#__PURE__*/styled.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #000;\n  font-family: 'Lato';\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 16px;\n"])));
-var _templateObject$1c, _templateObject2$V, _templateObject3$r;
+var _templateObject$1d, _templateObject2$V, _templateObject3$r;
 function ExpandedContent$2() {
   var _response$data, _response$data2;
   var _useAtom = useAtom(payloadAtom),
@@ -6728,7 +6784,7 @@ function ExpandedContent$2() {
       setSelectedProducts([]);
     }
   }, [response, newId, navigate, setSelectedProducts]);
-  return React.createElement(Container$J, null, React.createElement(ProductTable, null), React.createElement(MidContainer, null, React.createElement(SaveNoteContainer$1, null, React.createElement(Button, {
+  return React.createElement(Container$K, null, React.createElement(ProductTable, null), React.createElement(MidContainer, null, React.createElement(SaveNoteContainer$1, null, React.createElement(Button, {
     style: {
       borderRadius: '20px'
     },
@@ -6736,18 +6792,18 @@ function ExpandedContent$2() {
     disabled: isButtonDisabled
   }, "Move Products"), React.createElement(NewReturnDropdown, null))));
 }
-var MidContainer = /*#__PURE__*/styled.div(_templateObject$1c || (_templateObject$1c = /*#__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  margin-bottom: 22px;\n"])));
+var MidContainer = /*#__PURE__*/styled.div(_templateObject$1d || (_templateObject$1d = /*#__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  margin-bottom: 22px;\n"])));
 var SaveNoteContainer$1 = /*#__PURE__*/styled.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  gap: 10px;\n"])));
-var Container$J = /*#__PURE__*/styled.div(_templateObject3$r || (_templateObject3$r = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var Container$K = /*#__PURE__*/styled.div(_templateObject3$r || (_templateObject3$r = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var _templateObject$1d, _templateObject2$W;
+var _templateObject$1e, _templateObject2$W;
 function CollapsedContent$1() {
-  return React.createElement(Container$K, null, React.createElement(SectionHeader, {
+  return React.createElement(Container$L, null, React.createElement(SectionHeader, {
     label: "Products"
   }), React.createElement(Dimensions, null, "Products to be Returned"));
 }
-var Dimensions = /*#__PURE__*/styled.span(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 24px; /* 171.429% */\n"])));
-var Container$K = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  /* justify-content: space-between; */\n  width: 100%;\n  gap: 30px;\n"])));
+var Dimensions = /*#__PURE__*/styled.span(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 24px; /* 171.429% */\n"])));
+var Container$L = /*#__PURE__*/styled.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  /* justify-content: space-between; */\n  width: 100%;\n  gap: 30px;\n"])));
 function ProductsInfo() {
   var _useOrderDetails = useOrderDetails(),
@@ -6787,22 +6843,22 @@ function ProductsInfo() {
   }, React.createElement(ExpandedContent$2, null));
 }
-var _templateObject$1e;
+var _templateObject$1f;
 function BackgroundModal(props) {
-  return createPortal(React.createElement(Container$L, Object.assign({}, props), props.children), document.body);
+  return createPortal(React.createElement(Container$M, Object.assign({}, props), props.children), document.body);
 }
-var Container$L = /*#__PURE__*/styled.div(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;  \n  z-index: 1000;\n  background: rgba(0, 0, 0, 0.8);\n  box-shadow: 0px 3px 10px #00000029;\n"])));
+var Container$M = /*#__PURE__*/styled.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;  \n  z-index: 1000;\n  background: rgba(0, 0, 0, 0.8);\n  box-shadow: 0px 3px 10px #00000029;\n"])));
-var _templateObject$1f, _templateObject2$X, _templateObject3$s, _templateObject4$e;
+var _templateObject$1g, _templateObject2$X, _templateObject3$s, _templateObject4$e;
 function AdditionalInformation(props) {
-  return React.createElement(Container$M, null, React.createElement(Rect, null), React.createElement(AdditionalInfo, null, React.createElement(Text$5, null, props.info)));
+  return React.createElement(Container$N, null, React.createElement(Rect, null), React.createElement(AdditionalInfo, null, React.createElement(Text$5, null, props.info)));
 }
-var Text$5 = /*#__PURE__*/styled.p(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #ffffff;\n  font-family: 'Lato', sans-serif;\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 600;\n  margin: 0;\n  padding: 0;\n"])));
-var Container$M = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n"])));
+var Text$5 = /*#__PURE__*/styled.p(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #ffffff;\n  font-family: 'Lato', sans-serif;\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 600;\n  margin: 0;\n  padding: 0;\n"])));
+var Container$N = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n"])));
 var Rect = /*#__PURE__*/styled.div(_templateObject3$s || (_templateObject3$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 9px;\n  height: 45px;\n  background: #3a3630;\n"])));
 var AdditionalInfo = /*#__PURE__*/styled.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 3px 10px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 20px;\n  border-radius: 0px 15px 15px 0px;\n  background: rgba(63, 151, 188, 0.6);\n  box-shadow: 2px 0px 2px 0px rgba(0, 0, 0, 0.25) inset;\n"])));
-var _templateObject$1g, _templateObject2$Y, _templateObject3$t, _templateObject4$f;
+var _templateObject$1h, _templateObject2$Y, _templateObject3$t, _templateObject4$f;
 function OrderActionHeader(props) {
   var title = props.title,
     actions = props.actions,
@@ -6811,31 +6867,31 @@ function OrderActionHeader(props) {
     _props$infoText = props.infoText,
     infoText = _props$infoText === void 0 ? ' ' : _props$infoText,
     onClose = props.onClose;
-  return React.createElement(Container$N, null, React.createElement(Wrapper$f, null, React.createElement(Title$2, null, title), showInformation && React.createElement(AdditionalInformation, {
+  return React.createElement(Container$O, null, React.createElement(Wrapper$f, null, React.createElement(Title$2, null, title), showInformation && React.createElement(AdditionalInformation, {
     info: infoText
   }), actions), React.createElement(IconContainer$2, {
     onClick: onClose
   }, React.createElement(CrossIcon, null)));
 }
-var Wrapper$f = /*#__PURE__*/styled.div(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 6px;\n  align-items: center;\n  width: 90%;\n  margin-left: 20px;\n"])));
+var Wrapper$f = /*#__PURE__*/styled.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 6px;\n  align-items: center;\n  width: 90%;\n  margin-left: 20px;\n"])));
 var IconContainer$2 = /*#__PURE__*/styled.div(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  svg > path {\n    fill: #ffffff;\n  }\n  cursor: pointer;\n"])));
 var Title$2 = /*#__PURE__*/styled.h3(_templateObject3$t || (_templateObject3$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding: 0;\n  color: #edebe8;\n  text-transform: uppercase;\n  font-size: 20px;\n  font-family: 'Roboto', sans-serif;\n  font-style: normal;\n  font-weight: 900;\n  text-wrap: nowrap;\n"])));
-var Container$N = /*#__PURE__*/styled.div(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 100%;\n  background: #3a3630;\n  border-radius: 12px 12px 0px 0px;\n  padding: 10px 15px 10px 15px;\n  position: sticky;\n  top: 0;\n  z-index: 9;\n"])));
+var Container$O = /*#__PURE__*/styled.div(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 100%;\n  background: #3a3630;\n  border-radius: 12px 12px 0px 0px;\n  padding: 10px 15px 10px 15px;\n  position: sticky;\n  top: 0;\n  z-index: 9;\n"])));
-var _templateObject$1h, _templateObject2$Z;
+var _templateObject$1i, _templateObject2$Z;
 function OrderActionFooter(props) {
   var isSubmitDisabled = props.isSubmitDisabled;
-  return React.createElement(Container$O, null, React.createElement(SubmitButton, {
+  return React.createElement(Container$P, null, React.createElement(SubmitButton, {
     shape: "rounded",
     colors: "primary",
     onClick: props.onSubmit,
     disabled: isSubmitDisabled
   }, props.submitButtonTitle || 'submit'), props.actions);
 }
-var SubmitButton = /*#__PURE__*/styled(Button)(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var Container$O = /*#__PURE__*/styled.div(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  /* justify-content: space-between; */\n  gap: 15px;\n  align-items: center;\n  width: 100%;\n  background: #f8fafc;\n  border-radius: 0px 0px 6px 6px;\n  padding: 10px 15px 10px 15px;\n  border-top: 1px solid #edebe8;\n  margin-left: 25px;\n"])));
+var SubmitButton = /*#__PURE__*/styled(Button)(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var Container$P = /*#__PURE__*/styled.div(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  /* justify-content: space-between; */\n  gap: 15px;\n  align-items: center;\n  width: 100%;\n  background: #f8fafc;\n  border-radius: 0px 0px 6px 6px;\n  padding: 10px 15px 10px 15px;\n  border-top: 1px solid #edebe8;\n  margin-left: 25px;\n"])));
-var _templateObject$1i;
+var _templateObject$1j;
 function OrderActionModal(props) {
   return React.createElement(BackgroundModal, null, React.createElement(MainContainer$7, null, React.createElement(OrderActionHeader, {
     title: props.headerTitle,
@@ -6850,11 +6906,11 @@ function OrderActionModal(props) {
     isSubmitDisabled: props.isSubmitDisabled
   })));
 }
-var MainContainer$7 = /*#__PURE__*/styled.div(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  min-height: 30vh;\n  max-height: 80vh;\n  /* overflow: auto; */\n  border-radius: 12px;\n  background: #fff;\n  box-shadow: 0px 20px 24px -4px #10182814;\n  display: flex;\n  flex-direction: column;\n  /* gap: 15px; */\n  align-items: center;\n  justify-content: space-between;\n  overflow-x: hidden;\n  max-width: 75vw;\n  min-width: 30vw;\n"])));
+var MainContainer$7 = /*#__PURE__*/styled.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  min-height: 30vh;\n  max-height: 80vh;\n  /* overflow: auto; */\n  border-radius: 12px;\n  background: #fff;\n  box-shadow: 0px 20px 24px -4px #10182814;\n  display: flex;\n  flex-direction: column;\n  /* gap: 15px; */\n  align-items: center;\n  justify-content: space-between;\n  overflow-x: hidden;\n  max-width: 75vw;\n  min-width: 30vw;\n"])));
-var _templateObject$1j, _templateObject2$_;
+var _templateObject$1k, _templateObject2$_;
 function OrderActionsDropdown(props) {
-  return React.createElement(Container$P, {
+  return React.createElement(Container$Q, {
     className: props.className
   }, React.createElement(Label$1, null, props.label), React.createElement(AntSelect, {
     options: props.options,
@@ -6871,8 +6927,8 @@ function OrderActionsDropdown(props) {
     defaultValue: props.value
   }));
 }
-var Label$1 = /*#__PURE__*/styled.label(_templateObject$1j || (_templateObject$1j = /*#__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$P = /*#__PURE__*/styled.div(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$1 = /*#__PURE__*/styled.label(_templateObject$1k || (_templateObject$1k = /*#__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$Q = /*#__PURE__*/styled.div(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
 function DocumentTypeDropdown() {
   var onSelect = function onSelect() {};
@@ -6952,7 +7008,7 @@ function UploadIcon(props) {
   })));
 }
-var _templateObject$1k, _templateObject2$$, _templateObject3$u, _templateObject4$g, _templateObject5$b, _templateObject6$5, _templateObject7$7;
+var _templateObject$1l, _templateObject2$$, _templateObject3$u, _templateObject4$g, _templateObject5$b, _templateObject6$5, _templateObject7$7;
 var Dragger = Upload.Dragger;
 var props = {
   name: 'file',
@@ -6974,20 +7030,20 @@ var props = {
   }
 };
 function DocFileUpload() {
-  return React.createElement(MainContainer$8, null, React.createElement(Dragger, Object.assign({}, props), React.createElement(Container$Q, null, React.createElement(UploadButton, {
+  return React.createElement(MainContainer$8, null, React.createElement(Dragger, Object.assign({}, props), React.createElement(Container$R, null, React.createElement(UploadButton, {
     colors: 'secondary',
     shape: 'rounded'
   }, "Upload Button"), React.createElement(IconContainer$3, null, React.createElement(UploadIcon, null)), React.createElement(TextContainer$2, null, React.createElement(Text1, null, "or drag and drop your file "), React.createElement(Text2, null, "Excel (.xls / .xlsx) or CSV (.csv) Only")))));
 }
-var MainContainer$8 = /*#__PURE__*/styled.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  .ant-upload-wrapper .ant-upload-drag .ant-upload {\n    padding: 0;\n  }\n  .ant-upload-wrapper, .ant-upload-drag, .ant-upload  {\n    border: none;\n    background: transparent;\n  }\n"])));
+var MainContainer$8 = /*#__PURE__*/styled.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  .ant-upload-wrapper .ant-upload-drag .ant-upload {\n    padding: 0;\n  }\n  .ant-upload-wrapper, .ant-upload-drag, .ant-upload  {\n    border: none;\n    background: transparent;\n  }\n"])));
 var Text2 = /*#__PURE__*/styled.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.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n\n"])));
 var Text1 = /*#__PURE__*/styled.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.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(Button)(_templateObject6$5 || (_templateObject6$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 16px;\n  font-size: 14px;\n  padding: 7px 20px;\n"])));
-var Container$Q = /*#__PURE__*/styled.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"])));
+var Container$R = /*#__PURE__*/styled.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"])));
-var _templateObject$1l, _templateObject2$10, _templateObject3$v, _templateObject4$h;
+var _templateObject$1m, _templateObject2$10, _templateObject3$v, _templateObject4$h;
 // import DocFileUpload from './DocFileUpload';
 function AddResources() {
   var _useCurrentAction = useCurrentAction(),
@@ -7003,7 +7059,7 @@ function AddResources() {
     onSubmit: function onSubmit() {}
   }, React.createElement(ContentContainer, null, React.createElement(Top$1, null, React.createElement(DocumentTypeDropdown, null), React.createElement(CategoryDropdown, null), React.createElement(VisibilityRadioButtons, null)), React.createElement(Bottom$1, null, React.createElement(Label$2, null, "File"), React.createElement(DocFileUpload, null))));
 }
-var Label$2 = /*#__PURE__*/styled.label(_templateObject$1l || (_templateObject$1l = /*#__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 Label$2 = /*#__PURE__*/styled.label(_templateObject$1m || (_templateObject$1m = /*#__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 Bottom$1 = /*#__PURE__*/styled.div(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
 var Top$1 = /*#__PURE__*/styled.div(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n  > div {\n    min-width: 240px;\n  }\n"])));
 var ContentContainer = /*#__PURE__*/styled.div(_templateObject4$h || (_templateObject4$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* display: flex; */\n  padding: 15px 12px;\n  flex: 1 0 0;\n  border-radius: 15px;\n  background: #f8fafc;\n  margin: 0px 20px 0 20px;\n"])));
@@ -7144,9 +7200,9 @@ function useUpdateReminderData() {
   return useAtom(reminderUpdatePayload);
 }
-var _templateObject$1m, _templateObject2$11, _templateObject3$w;
+var _templateObject$1n, _templateObject2$11, _templateObject3$w;
 // Styled components
-var StyledTableWrapper$2 = /*#__PURE__*/styled.div(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-x: auto;\n  max-height: calc(100vh - 290px);\n  scrollbar-width: none;\n  /* box-shadow: 0px 0px 30px 6px rgba(46, 45, 116, 0.05); */\n  &::-webkit-scrollbar {\n    width: 5px;\n    border-radius: 100px;\n    height: 5px;\n  }\n\n  &::-webkit-scrollbar-track {\n    background: #777;\n    border-radius: 100px;\n  }\n\n  &::-webkit-scrollbar-thumb {\n    background: #7b61ff;\n    border-radius: 100px;\n  }\n\n  &::-webkit-scrollbar-thumb:hover {\n    background: #7b61ff;\n  }\n"])));
+var StyledTableWrapper$2 = /*#__PURE__*/styled.div(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-x: auto;\n  max-height: calc(100vh - 290px);\n  scrollbar-width: none;\n  /* box-shadow: 0px 0px 30px 6px rgba(46, 45, 116, 0.05); */\n  &::-webkit-scrollbar {\n    width: 5px;\n    border-radius: 100px;\n    height: 5px;\n  }\n\n  &::-webkit-scrollbar-track {\n    background: #777;\n    border-radius: 100px;\n  }\n\n  &::-webkit-scrollbar-thumb {\n    background: #7b61ff;\n    border-radius: 100px;\n  }\n\n  &::-webkit-scrollbar-thumb:hover {\n    background: #7b61ff;\n  }\n"])));
 var StyledTable$3 = /*#__PURE__*/styled.table(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-spacing: 0 10px;\n  width: 100%;\n  padding: 10px;\n  thead {\n    tr {\n      border-radius: 40px;\n      border-spacing: 0 10px;\n      th {\n        color: #3a3630;\n        font-size: 14px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: normal;\n        padding: 5px 15px;\n        background: #f0f2f2;\n        border-right: none;\n        border-left: none;\n        text-align: left;\n        border: 1px solid rgba(0, 0, 0, 0.08);\n        border-width: 1px 0;\n        text-transform: capitalize;\n        &:first-child {\n          border-radius: 100px 0 0 100px;\n          border-left: 1px solid rgba(0, 0, 0, 0.08);\n        }\n        &:last-child {\n          border-radius: 0px 100px 100px 0;\n          border-right: 1px solid rgba(0, 0, 0, 0.08);\n        }\n      }\n    }\n  }\n  tbody {\n    tr {\n      td {\n        color: #3a3630;\n        font-size: 13px;\n        font-style: normal;\n        font-weight: 400;\n        line-height: normal;\n        padding: 12px 15px;\n        background: #fff;\n        border: 1px solid rgba(0, 0, 0, 0.08);\n        border-right: none;\n        border-left: none;\n      }\n      .link {\n        color: #09f;\n        font-family: Roboto;\n        font-weight: 400;\n        cursor: pointer;\n      }\n      td {\n        .flex {\n          display: flex;\n          gap: 4px;\n          align-items: center;\n        }\n        .overDue {\n          border-radius: 20px;\n          border: 1px solid #edebe8;\n          background: #fff;\n          padding: 4px 8px;\n          color: #e95252;\n          font-size: 12px;\n          font-style: normal;\n          font-weight: 600;\n          line-height: 16px;\n        }\n      }\n      &:nth-child(even) td {\n        background: #f6fbff;\n      }\n      td:first-child {\n        border-radius: 100px 0 0 100px;\n        border-left: 1px solid rgba(0, 0, 0, 0.08);\n      }\n      td:last-child {\n        border-radius: 0px 100px 100px 0;\n        border-right: 1px solid rgba(0, 0, 0, 0.08);\n      }\n      .emptyTd {\n        border-radius: 100px !important;\n      }\n      .flex {\n        display: flex;\n        flex-direction: row;\n        gap: 5px;\n        height: 29px;\n        align-items: center;\n      }\n\n      &.insideTable {\n        td {\n          border-radius: 0;\n          border: none;\n          &:last-child {\n            border-radius: 0;\n            border-right: none;\n          }\n        }\n        table {\n          border-spacing: 0;\n          width: 100%;\n          border-radius: 5px;\n          border: 1px solid rgba(0, 0, 0, 0.08);\n          overflow: hidden;\n          border-top-left-radius: 15px;\n          border-top-right-radius: 15px;\n          thead {\n            tr {\n              border-bottom: none;\n              th {\n                padding: 14px 20px;\n                text-align: left;\n                border-top: 0;\n                border-right: 0;\n                border-left: 0;\n                background: #f8fafc;\n                &:first-child {\n                  border-radius: 0;\n                  border-left: 1px solid rgba(0, 0, 0, 0.08);\n                  border-top-left-radius: 15px;\n                }\n                &:last-child {\n                  border-radius: 0;\n                }\n              }\n            }\n          }\n          tbody {\n            tr {\n              td {\n                padding: 14px 20px;\n                text-align: left;\n                border-bottom: 1px solid rgba(58, 54, 48, 0.15);\n                background: #fff;\n                > svg {\n                  transform: scale(1.5);\n                  background-color: #edebe8;\n                  border-radius: 20px;\n                  padding: 5px;\n                }\n                &:last-child {\n                  border-radius: 0;\n                  border-right: none;\n                }\n              }\n            }\n          }\n        }\n      }\n    }\n  }\n  .actions {\n    display: flex;\n    align-items: center;\n    gap: 20px;\n    > svg {\n      transform: scale(1.5);\n      background-color: #edebe8;\n      border-radius: 20px;\n      padding: 5px;\n    }\n\n    .close-icon {\n      transform: scale(1.3);\n      background-color: transparent;\n      border-radius: 0;\n      padding: 0;\n    }\n  }\n"])));
 var EmptyDataContainer$1 = /*#__PURE__*/styled.div(_templateObject3$w || (_templateObject3$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: center;\n"])));
@@ -7230,7 +7286,7 @@ function SplitOrderTable() {
   }))));
 }
-var _templateObject$1n;
+var _templateObject$1o;
 function SplitOrder() {
   var _useCurrentAction = useCurrentAction(),
     setCurrentAction = _useCurrentAction[1];
@@ -7278,7 +7334,7 @@ function SplitOrder() {
     isSubmitDisabled: isSubmitDisabled()
   }, React.createElement(ContentContainer$1, null, React.createElement(SplitOrderTable, null)));
 }
-var ContentContainer$1 = /*#__PURE__*/styled.div(_templateObject$1n || (_templateObject$1n = /*#__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 ContentContainer$1 = /*#__PURE__*/styled.div(_templateObject$1o || (_templateObject$1o = /*#__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"])));
 function RadioButtonCheckIcon(props) {
   return React.createElement("svg", Object.assign({
@@ -7309,7 +7365,7 @@ var fonts = {
   secondary: "'Lato', sans-serif"
 };
-var _templateObject$1o, _templateObject2$12, _templateObject3$x;
+var _templateObject$1p, _templateObject2$12, _templateObject3$x;
 function RadioButton(props) {
   return React.createElement(RadioContainer$1, null, props.checked && React.createElement(RadioButtonCheckIcon, {
     color: props.color
@@ -7320,7 +7376,7 @@ function RadioButton(props) {
     htmlFor: props.id
   }, props.label));
 }
-var Label$3 = /*#__PURE__*/styled.label(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  font-size: 14px;\n  font-weight: 400;\n  font-family: ", ";\n  color: #aea9a1;\n  white-space: nowrap;\n"])), fonts.secondary);
+var Label$3 = /*#__PURE__*/styled.label(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  font-size: 14px;\n  font-weight: 400;\n  font-family: ", ";\n  color: #aea9a1;\n  white-space: nowrap;\n"])), fonts.secondary);
 var Input = /*#__PURE__*/styled.input(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  appearance: none;\n  margin: 0;\n  width: 16px;\n  height: 16px;\n  border: 1px solid #aea9a1;\n  border-radius: 14px;\n  cursor: pointer;\n\n  &:checked {\n    & + ", " {\n      color: ", ";\n    }\n    display: none;\n  }\n\n  &::after {\n    content: '';\n    display: block;\n    border-radius: 14px;\n    width: 12px;\n    height: 12px;\n    margin: 2px;\n  }\n\n  &:checked::after {\n    background-color: ", ";\n  }\n"])), Label$3, function (props) {
   return props.color || '#6396e5';
 }, function (props) {
@@ -7328,7 +7384,7 @@ var Input = /*#__PURE__*/styled.input(_templateObject2$12 || (_templateObject2$1
 });
 var RadioContainer$1 = /*#__PURE__*/styled.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$c, _templateObject6$6, _templateObject7$8;
+var _templateObject$1q, _templateObject2$13, _templateObject3$y, _templateObject4$i, _templateObject5$c, _templateObject6$6, _templateObject7$8;
 function RadioButtonGroup(props) {
   var heading = props.heading,
     _props$direction = props.direction,
@@ -7363,7 +7419,7 @@ function RadioButtonGroup(props) {
     className: "custom-wrapper"
   }, renderOptions()));
 }
-var Separator = /*#__PURE__*/styled.div(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 1px;\n  background: #e0e2e7;\n"])));
+var Separator = /*#__PURE__*/styled.div(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 1px;\n  background: #e0e2e7;\n"])));
 var labelStyles = /*#__PURE__*/css(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #6a7378;\n  font-size: 14px;\n  font-weight: 400;\n  font-family: ", ";\n  line-height: 20px;\n"])), fonts.secondary);
 var RequiredText = /*#__PURE__*/styled.span(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  ", "\n"])), function (props) {
   return !props.$required && 'visibility: hidden;';
@@ -7375,7 +7431,7 @@ var Wrapper$g = /*#__PURE__*/styled.div(_templateObject7$8 || (_templateObject7$
   return props.$direction === 'horizontal' ? 'row' : 'column';
 });
-var _templateObject$1q;
+var _templateObject$1r;
 var deliveryPoints = [{
   label: 'Hallway',
   value: 'hallway'
@@ -7397,7 +7453,7 @@ function DeliveryPoint() {
   var _React$useState = React.useState(deliveryPoints[0].value),
     selectedValue = _React$useState[0],
     setSelectedValue = _React$useState[1];
-  return React.createElement(Container$R, null, React.createElement(RadioButtonGroup, {
+  return React.createElement(Container$S, null, React.createElement(RadioButtonGroup, {
     heading: "Delivery Point",
     options: deliveryPoints || [],
     onChange: radioGroupHandler,
@@ -7406,9 +7462,9 @@ function DeliveryPoint() {
     required: false
   }));
 }
-var Container$R = /*#__PURE__*/styled.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 Container$S = /*#__PURE__*/styled.div(_templateObject$1r || (_templateObject$1r = /*#__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$d, _templateObject6$7, _templateObject7$9, _templateObject8$5;
+var _templateObject$1s, _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,
@@ -7429,7 +7485,7 @@ function Checkbox(props) {
     "$checked": checked
   }, label)));
 }
-var Image = /*#__PURE__*/styled.img(_templateObject$1r || (_templateObject$1r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 28px;\n  width: 20px;\n  filter: ", ";\n"])), function (props) {
+var Image = /*#__PURE__*/styled.img(_templateObject$1s || (_templateObject$1s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 28px;\n  width: 20px;\n  filter: ", ";\n"])), function (props) {
   return props.$checked ? 'grayscale(0)' : 'grayscale(1)';
 });
 var CircleContainer = /*#__PURE__*/styled.span(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 20px;\n  width: 20px;\n  border: 1px solid #e0e2e7;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  top: 8px;\n  left: 8px;\n"])));
@@ -7469,10 +7525,10 @@ var getIcon$1 = function getIcon(input) {
   return "" + baseURL$1 + subPath;
 };
-var _templateObject$1s;
+var _templateObject$1t;
 function OrderServices$1() {
   // TO DO -> get services from static data
-  return React.createElement(Container$S, null, React.createElement(Checkbox, {
+  return React.createElement(Container$T, null, React.createElement(Checkbox, {
     checked: false,
     label: "Assemble",
     imageSrc: getIcon$1(1)
@@ -7494,23 +7550,23 @@ function OrderServices$1() {
     imageSrc: getIcon$1(4)
   }));
 }
-var Container$S = /*#__PURE__*/styled.div(_templateObject$1s || (_templateObject$1s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n  flex-wrap: wrap;\n"])));
+var Container$T = /*#__PURE__*/styled.div(_templateObject$1t || (_templateObject$1t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n  flex-wrap: wrap;\n"])));
-var _templateObject$1t, _templateObject2$15;
+var _templateObject$1u, _templateObject2$15;
 function Notes$1(_ref) {
   var onNotesChange = _ref.onNotesChange;
   var handleTextChange = function handleTextChange(event) {
     onNotesChange(event.target.value);
   };
-  return React.createElement(Container$T, null, React.createElement(Label$4, null, "Notes"), React.createElement(TextArea, {
+  return React.createElement(Container$U, null, React.createElement(Label$4, null, "Notes"), React.createElement(TextArea, {
     rows: 15,
     onChange: handleTextChange
   }));
 }
-var Label$4 = /*#__PURE__*/styled.span(_templateObject$1t || (_templateObject$1t = /*#__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$T = /*#__PURE__*/styled.div(_templateObject2$15 || (_templateObject2$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 5px;\n  flex-direction: column;\n  width: 100%;\n"])));
+var Label$4 = /*#__PURE__*/styled.span(_templateObject$1u || (_templateObject$1u = /*#__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$U = /*#__PURE__*/styled.div(_templateObject2$15 || (_templateObject2$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 5px;\n  flex-direction: column;\n  width: 100%;\n"])));
-var _templateObject$1u, _templateObject2$16, _templateObject3$A;
+var _templateObject$1v, _templateObject2$16, _templateObject3$A;
 function LogServiceRefusal() {
   var _useCurrentAction = useCurrentAction(),
     setCurrentAction = _useCurrentAction[1];
@@ -7530,7 +7586,7 @@ function LogServiceRefusal() {
     }
   }))));
 }
-var ContentContainer$2 = /*#__PURE__*/styled.div(_templateObject$1u || (_templateObject$1u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 0px 15px;\n  align-items: flex-start;\n  gap: 10px;\n  align-self: stretch;\n"])));
+var ContentContainer$2 = /*#__PURE__*/styled.div(_templateObject$1v || (_templateObject$1v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 0px 15px;\n  align-items: flex-start;\n  gap: 10px;\n  align-self: stretch;\n"])));
 var Left = /*#__PURE__*/styled.div(_templateObject2$16 || (_templateObject2$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 15px 12px;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n  gap: 15px;\n  flex: 1 0 0;\n  border-radius: 15px;\n  background: #f8fafc;\n"])));
 var Right$1 = /*#__PURE__*/styled(Left)(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
@@ -7558,7 +7614,7 @@ function ReturnReason() {
   });
 }
-var _templateObject$1v, _templateObject2$17, _templateObject3$B, _templateObject4$k, _templateObject5$e, _templateObject6$8, _templateObject7$a;
+var _templateObject$1w, _templateObject2$17, _templateObject3$B, _templateObject4$k, _templateObject5$e, _templateObject6$8, _templateObject7$a;
 function CancelOrder() {
   var _orderStaticData$canc;
   var _useOrderId = useOrderId(),
@@ -7662,15 +7718,15 @@ function CancelOrder() {
     options: cancelReasonOptions || [],
     onSelect: onSelectCancelReason,
     value: cancelReason
-  }), React.createElement(Wrapper$h, null, React.createElement(ReturnAction, null), React.createElement(ReturnReason, null))), React.createElement(TopRight, null, React.createElement(Container$U, null, React.createElement(Label$5, null, "Cancelation Note"), React.createElement(TextArea, {
+  }), React.createElement(Wrapper$h, null, React.createElement(ReturnAction, null), React.createElement(ReturnReason, null))), React.createElement(TopRight, null, React.createElement(Container$V, null, React.createElement(Label$5, null, "Cancelation Note"), React.createElement(TextArea, {
     rows: 5,
     onChange: onChangeNotes,
     value: cancelNotes,
     placeholder: "Reason for Cancel  Order"
   }))))));
 }
-var Label$5 = /*#__PURE__*/styled.label(_templateObject$1v || (_templateObject$1v = /*#__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$U = /*#__PURE__*/styled.div(_templateObject2$17 || (_templateObject2$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$5 = /*#__PURE__*/styled.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.div(_templateObject2$17 || (_templateObject2$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
 var Wrapper$h = /*#__PURE__*/styled.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.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.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 50%;\n"])));
@@ -7678,7 +7734,7 @@ var Top$2 = /*#__PURE__*/styled.div(_templateObject6$8 || (_templateObject6$8 =
 // const Bottom = styled.div``;
 var ContentContainer$3 = /*#__PURE__*/styled.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"])));
-var _templateObject$1w, _templateObject2$18, _templateObject3$C;
+var _templateObject$1x, _templateObject2$18, _templateObject3$C;
 function EmailAddress() {
   var emailRegex = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i;
   var _useOrderDetailsConfi = useOrderDetailsConfirmOrder(),
@@ -7710,7 +7766,7 @@ function EmailAddress() {
       });
     });
   };
-  return React.createElement(Container$V, null, React.createElement(Label$6, null, "Email Address"), React.createElement(Input$2, {
+  return React.createElement(Container$W, null, React.createElement(Label$6, null, "Email Address"), React.createElement(Input$2, {
     style: {
       borderRadius: '15px'
     },
@@ -7719,11 +7775,11 @@ function EmailAddress() {
     onChange: onChange
   }), errors.emailError && React.createElement(ErrorText$5, null, errors.emailError));
 }
-var Label$6 = /*#__PURE__*/styled.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.div(_templateObject2$18 || (_templateObject2$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$6 = /*#__PURE__*/styled.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.div(_templateObject2$18 || (_templateObject2$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
 var ErrorText$5 = /*#__PURE__*/styled.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;
+var _templateObject$1y, _templateObject2$19, _templateObject3$D;
 function ContactPhone() {
   var _useOrderDetailsConfi = useOrderDetailsConfirmOrder(),
     orderDetails = _useOrderDetailsConfi[0],
@@ -7772,7 +7828,7 @@ function ContactPhone() {
       });
     }
   };
-  return React.createElement(Container$W, null, React.createElement(Label$7, null, "Contact Phone"), React.createElement(Input$2, {
+  return React.createElement(Container$X, null, React.createElement(Label$7, null, "Contact Phone"), React.createElement(Input$2, {
     name: "contact-home",
     type: "text",
     placeholder: "Home Number",
@@ -7784,11 +7840,11 @@ function ContactPhone() {
     onChange: onChange
   }), errors.homeContactError && React.createElement(ErrorText$6, null, errors.homeContactError));
 }
-var Label$7 = /*#__PURE__*/styled.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.div(_templateObject2$19 || (_templateObject2$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$7 = /*#__PURE__*/styled.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.div(_templateObject2$19 || (_templateObject2$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
 var ErrorText$6 = /*#__PURE__*/styled.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;
+var _templateObject$1z, _templateObject2$1a, _templateObject3$E;
 function ContactWork$1() {
   var _useOrderDetailsConfi = useOrderDetailsConfirmOrder(),
     orderDetails = _useOrderDetailsConfi[0],
@@ -7837,7 +7893,7 @@ function ContactWork$1() {
       });
     }
   };
-  return React.createElement(Container$X, null, React.createElement(Label$8, null, "Contact Work"), React.createElement(Input$2, {
+  return React.createElement(Container$Y, null, React.createElement(Label$8, null, "Contact Work"), React.createElement(Input$2, {
     name: "contact-work",
     type: "text",
     placeholder: "Work Number",
@@ -7849,11 +7905,11 @@ function ContactWork$1() {
     onChange: onChange
   }), errors.workContactError && React.createElement(ErrorText$7, null, errors.workContactError));
 }
-var Label$8 = /*#__PURE__*/styled.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.div(_templateObject2$1a || (_templateObject2$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$8 = /*#__PURE__*/styled.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.div(_templateObject2$1a || (_templateObject2$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
 var ErrorText$7 = /*#__PURE__*/styled.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;
+var _templateObject$1A, _templateObject2$1b, _templateObject3$F;
 function ContactMobile$1() {
   var _useOrderDetailsConfi = useOrderDetailsConfirmOrder(),
     orderDetails = _useOrderDetailsConfi[0],
@@ -7902,7 +7958,7 @@ function ContactMobile$1() {
       });
     }
   };
-  return React.createElement(Container$Y, null, React.createElement(Label$9, null, "Contact Mobile"), React.createElement(Input$2, {
+  return React.createElement(Container$Z, null, React.createElement(Label$9, null, "Contact Mobile"), React.createElement(Input$2, {
     name: "contact-work",
     type: "text",
     placeholder: "Mobile Number",
@@ -7914,8 +7970,8 @@ function ContactMobile$1() {
     onChange: onChange
   }), errors.mobileError && React.createElement(ErrorText$8, null, errors.mobileError));
 }
-var Label$9 = /*#__PURE__*/styled.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.div(_templateObject2$1b || (_templateObject2$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$9 = /*#__PURE__*/styled.label(_templateObject$1A || (_templateObject$1A = /*#__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$Z = /*#__PURE__*/styled.div(_templateObject2$1b || (_templateObject2$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
 var ErrorText$8 = /*#__PURE__*/styled.span(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: red;\n  font-size: 0.85rem;\n  margin-top: 4px;\n"])));
 function ContactTypeDropdown() {
@@ -7982,7 +8038,7 @@ function ActionDropdown() {
   });
 }
-var _templateObject$1A, _templateObject2$1c;
+var _templateObject$1B, _templateObject2$1c;
 function DeliveryDate$1() {
   var _useOrderDetailsConfi = useOrderDetailsConfirmOrder(),
     orderDetails = _useOrderDetailsConfi[0];
@@ -8007,7 +8063,7 @@ function DeliveryDate$1() {
   var tomorrow = new Date(today);
   tomorrow.setDate(today.getDate() + 1);
   //confirm popouop
-  return React.createElement(Container$Z, null, React.createElement(Label$a, null, "Delivery Date"), React.createElement(DatePicker, {
+  return React.createElement(Container$_, null, React.createElement(Label$a, null, "Delivery Date"), React.createElement(DatePicker, {
     onChange: handleDateChange,
     format: "DD/MM/YYYY",
     value: deliveryDate ? dayjs(deliveryDate) : null,
@@ -8018,8 +8074,8 @@ function DeliveryDate$1() {
     allowClear: false
   }));
 }
-var Label$a = /*#__PURE__*/styled.label(_templateObject$1A || (_templateObject$1A = /*#__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$Z = /*#__PURE__*/styled.div(_templateObject2$1c || (_templateObject2$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n  white-space: nowrap;\n"])));
+var Label$a = /*#__PURE__*/styled.label(_templateObject$1B || (_templateObject$1B = /*#__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$_ = /*#__PURE__*/styled.div(_templateObject2$1c || (_templateObject2$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n  white-space: nowrap;\n"])));
 function convertTo12HourFormat$1(time24) {
   var _time24$split, _minutes$toString;
@@ -8068,19 +8124,19 @@ function TimedServiceDropdown$1() {
   });
 }
-var _templateObject$1B, _templateObject2$1d, _templateObject3$G, _templateObject4$l;
+var _templateObject$1C, _templateObject2$1d, _templateObject3$G, _templateObject4$l;
 function CustomerInformation() {
   var _orderDetails$order_r;
   var _useOrderDetailsConfi = useOrderDetailsConfirmOrder(),
     orderDetails = _useOrderDetailsConfi[0];
-  return React.createElement(Container$_, null, React.createElement(Title$3, null, "Address"), React.createElement(AddressField, null, orderDetails == null || (_orderDetails$order_r = orderDetails.order_recipient) == null ? void 0 : _orderDetails$order_r.address), React.createElement(Wrapper$i, null, React.createElement(EmailAddress, null), React.createElement(ContactPhone, null)), React.createElement(Wrapper$i, null, React.createElement(ContactWork$1, null), React.createElement(ContactMobile$1, null)), React.createElement(Wrapper$i, null, React.createElement(ContactTypeDropdown, null), React.createElement(ActionDropdown, null)), React.createElement(Wrapper$i, null, React.createElement(DeliveryDate$1, null), React.createElement(TimedServiceDropdown$1, null)));
+  return React.createElement(Container$$, null, React.createElement(Title$3, null, "Address"), React.createElement(AddressField, null, orderDetails == null || (_orderDetails$order_r = orderDetails.order_recipient) == null ? void 0 : _orderDetails$order_r.address), React.createElement(Wrapper$i, null, React.createElement(EmailAddress, null), React.createElement(ContactPhone, null)), React.createElement(Wrapper$i, null, React.createElement(ContactWork$1, null), React.createElement(ContactMobile$1, null)), React.createElement(Wrapper$i, null, React.createElement(ContactTypeDropdown, null), React.createElement(ActionDropdown, null)), React.createElement(Wrapper$i, null, React.createElement(DeliveryDate$1, null), React.createElement(TimedServiceDropdown$1, null)));
 }
-var Wrapper$i = /*#__PURE__*/styled.div(_templateObject$1B || (_templateObject$1B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n  width: 100%;\n  .contact-type-dropdown,\n  .action-dropdown {\n    flex: 1;\n  }\n"])));
+var Wrapper$i = /*#__PURE__*/styled.div(_templateObject$1C || (_templateObject$1C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n  width: 100%;\n  .contact-type-dropdown,\n  .action-dropdown {\n    flex: 1;\n  }\n"])));
 var AddressField = /*#__PURE__*/styled.p(_templateObject2$1d || (_templateObject2$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Open Sans';\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n  padding: 0;\n  margin: 0;\n"])));
 var Title$3 = /*#__PURE__*/styled.span(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Roboto', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 600;\n"])));
-var Container$_ = /*#__PURE__*/styled.div(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 15px 12px;\n  flex: 1 0 0;\n  border-radius: 15px;\n  background: #f8fafc;\n  display: flex;\n  flex-direction: column;\n  gap: 15px;\n"])));
+var Container$$ = /*#__PURE__*/styled.div(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 15px 12px;\n  flex: 1 0 0;\n  border-radius: 15px;\n  background: #f8fafc;\n  display: flex;\n  flex-direction: column;\n  gap: 15px;\n"])));
-var _templateObject$1C, _templateObject2$1e;
+var _templateObject$1D, _templateObject2$1e;
 function ProductTable$1() {
   var _useProductDetails = useProductDetails(),
     orderProductDetails = _useProductDetails[0];
@@ -8089,7 +8145,7 @@ function ProductTable$1() {
   if (!orderProductDetails) {
     return null;
   }
-  return React.createElement(Container$$, null, React.createElement(Title$4, null, "Products (", orderProductDetails == null ? void 0 : orderProductDetails.length, ")"), React.createElement(StyledTableWrapper$2, null, React.createElement(StyledTable$3, {
+  return React.createElement(Container$10, null, React.createElement(Title$4, null, "Products (", orderProductDetails == null ? void 0 : orderProductDetails.length, ")"), React.createElement(StyledTableWrapper$2, null, React.createElement(StyledTable$3, {
     className: "scrollClass"
   }, React.createElement("thead", null, React.createElement("tr", null, React.createElement("th", null, "Action"), React.createElement("th", null, "Code"), React.createElement("th", null, "Description"), React.createElement("th", null, "Parts"))), React.createElement("tbody", null, loading ? React.createElement("tr", null, React.createElement("td", {
     colSpan: 6
@@ -8107,10 +8163,10 @@ function ProductTable$1() {
     }, React.createElement("td", null, order == null || (_order$order_product_ = order.order_product_type) == null ? void 0 : _order$order_product_.type), React.createElement("td", null, order == null ? void 0 : order.code), React.createElement("td", null, order == null ? void 0 : order.description), React.createElement("td", null, order == null ? void 0 : order.sku));
   })))));
 }
-var Title$4 = /*#__PURE__*/styled.h2(_templateObject$1C || (_templateObject$1C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 500;\n  text-transform: uppercase;\n  padding: 0;\n  margin: 0;\n"])));
-var Container$$ = /*#__PURE__*/styled.div(_templateObject2$1e || (_templateObject2$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  > div {\n    min-height: 165px;\n  }\n"])));
+var Title$4 = /*#__PURE__*/styled.h2(_templateObject$1D || (_templateObject$1D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 500;\n  text-transform: uppercase;\n  padding: 0;\n  margin: 0;\n"])));
+var Container$10 = /*#__PURE__*/styled.div(_templateObject2$1e || (_templateObject2$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  > div {\n    min-height: 165px;\n  }\n"])));
-var _templateObject$1D, _templateObject2$1f;
+var _templateObject$1E, _templateObject2$1f;
 function NotesTable() {
   var _useState = useState(null),
     moduleIds = _useState[0],
@@ -8178,7 +8234,7 @@ function NotesTable() {
   if ((notes == null ? void 0 : notes.length) === 0) {
     return null;
   }
-  return React.createElement(Container$10, null, React.createElement(Title$5, null, "Notes (", notes == null ? void 0 : notes.length, ")"), React.createElement(StyledTableWrapper$2, null, React.createElement(StyledTable$3, {
+  return React.createElement(Container$11, null, React.createElement(Title$5, null, "Notes (", notes == null ? void 0 : notes.length, ")"), React.createElement(StyledTableWrapper$2, null, React.createElement(StyledTable$3, {
     className: "scrollClass"
   }, React.createElement("thead", null, React.createElement("tr", null, React.createElement("th", null, "Created"), React.createElement("th", null, "Notes"))), React.createElement("tbody", null, loading ? React.createElement("tr", null, React.createElement("td", {
     colSpan: 6
@@ -8204,53 +8260,53 @@ function NotesTable() {
     }));
   })))));
 }
-var Title$5 = /*#__PURE__*/styled.h2(_templateObject$1D || (_templateObject$1D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 500;\n  text-transform: uppercase;\n  padding: 0;\n  margin: 0;\n"])));
-var Container$10 = /*#__PURE__*/styled.div(_templateObject2$1f || (_templateObject2$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  > div {\n    min-height: 165px;\n  }\n"])));
+var Title$5 = /*#__PURE__*/styled.h2(_templateObject$1E || (_templateObject$1E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Roboto', sans-serif;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 500;\n  text-transform: uppercase;\n  padding: 0;\n  margin: 0;\n"])));
+var Container$11 = /*#__PURE__*/styled.div(_templateObject2$1f || (_templateObject2$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  > div {\n    min-height: 165px;\n  }\n"])));
-var _templateObject$1E, _templateObject2$1g;
+var _templateObject$1F, _templateObject2$1g;
 function ConfirmationNotes() {
-  return React.createElement(Container$11, null, React.createElement(Label$b, null, "Notes"), React.createElement(TextArea, {
+  return React.createElement(Container$12, null, React.createElement(Label$b, null, "Notes"), React.createElement(TextArea, {
     rows: 5,
     placeholder: "Enter Notes"
   }));
 }
-var Label$b = /*#__PURE__*/styled.label(_templateObject$1E || (_templateObject$1E = /*#__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$11 = /*#__PURE__*/styled.div(_templateObject2$1g || (_templateObject2$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$b = /*#__PURE__*/styled.label(_templateObject$1F || (_templateObject$1F = /*#__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$12 = /*#__PURE__*/styled.div(_templateObject2$1g || (_templateObject2$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
-var _templateObject$1F, _templateObject2$1h;
+var _templateObject$1G, _templateObject2$1h;
 function DeliveryInstructions$1() {
-  return React.createElement(Container$12, null, React.createElement(Label$c, null, "Delivery Instructions"), React.createElement(TextArea, {
+  return React.createElement(Container$13, null, React.createElement(Label$c, null, "Delivery Instructions"), React.createElement(TextArea, {
     rows: 5,
     placeholder: "Enter Delivery Instructions"
   }));
 }
-var Label$c = /*#__PURE__*/styled.label(_templateObject$1F || (_templateObject$1F = /*#__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$12 = /*#__PURE__*/styled.div(_templateObject2$1h || (_templateObject2$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$c = /*#__PURE__*/styled.label(_templateObject$1G || (_templateObject$1G = /*#__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$13 = /*#__PURE__*/styled.div(_templateObject2$1h || (_templateObject2$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
-var _templateObject$1G, _templateObject2$1i;
+var _templateObject$1H, _templateObject2$1i;
 function ContactWith() {
-  return React.createElement(Container$13, null, React.createElement(Label$d, null, "Contact With"), React.createElement(Input$2, {
+  return React.createElement(Container$14, null, React.createElement(Label$d, null, "Contact With"), React.createElement(Input$2, {
     style: {
       borderRadius: '15px'
     }
   }));
 }
-var Label$d = /*#__PURE__*/styled.label(_templateObject$1G || (_templateObject$1G = /*#__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$13 = /*#__PURE__*/styled.div(_templateObject2$1i || (_templateObject2$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
+var Label$d = /*#__PURE__*/styled.label(_templateObject$1H || (_templateObject$1H = /*#__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$14 = /*#__PURE__*/styled.div(_templateObject2$1i || (_templateObject2$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n"])));
-var _templateObject$1H, _templateObject2$1j, _templateObject3$H, _templateObject4$m;
+var _templateObject$1I, _templateObject2$1j, _templateObject3$H, _templateObject4$m;
 function SlotAndInstructions() {
   var _orderDetails$order_r;
   var _useOrderDetailsConfi = useOrderDetailsConfirmOrder(),
     orderDetails = _useOrderDetailsConfi[0];
-  return React.createElement(Container$14, null, React.createElement(Slot, null, React.createElement(Title$6, null, "Slot"), React.createElement(Value, null, orderDetails == null || (_orderDetails$order_r = orderDetails.order_routes) == null ? void 0 : _orderDetails$order_r.slot)), React.createElement(ContactWith, null), React.createElement(DeliveryInstructions$1, null), React.createElement(ConfirmationNotes, null));
+  return React.createElement(Container$15, null, React.createElement(Slot, null, React.createElement(Title$6, null, "Slot"), React.createElement(Value, null, orderDetails == null || (_orderDetails$order_r = orderDetails.order_routes) == null ? void 0 : _orderDetails$order_r.slot)), React.createElement(ContactWith, null), React.createElement(DeliveryInstructions$1, null), React.createElement(ConfirmationNotes, null));
 }
-var Value = /*#__PURE__*/styled.span(_templateObject$1H || (_templateObject$1H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Lato', 'Open Sans';\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n"])));
+var Value = /*#__PURE__*/styled.span(_templateObject$1I || (_templateObject$1I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Lato', 'Open Sans';\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 400;\n"])));
 var Slot = /*#__PURE__*/styled.div(_templateObject2$1j || (_templateObject2$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 5px;\n"])));
 var Title$6 = /*#__PURE__*/styled.span(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'Lato', 'Open Sans';\n  font-size: 13px;\n  font-style: normal;\n  font-weight: 700;\n"])));
-var Container$14 = /*#__PURE__*/styled.div(_templateObject4$m || (_templateObject4$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 15px 12px;\n  flex: 1 0 0;\n  border-radius: 15px;\n  background: #f8fafc;\n  display: flex;\n  flex-direction: column;\n  gap: 15px;\n"])));
+var Container$15 = /*#__PURE__*/styled.div(_templateObject4$m || (_templateObject4$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 15px 12px;\n  flex: 1 0 0;\n  border-radius: 15px;\n  background: #f8fafc;\n  display: flex;\n  flex-direction: column;\n  gap: 15px;\n"])));
-var _templateObject$1I, _templateObject2$1k;
+var _templateObject$1J, _templateObject2$1k;
 // import { filterObject } from '../../../utils';
 function ConfirmOrder() {
   var _useCurrentAction = useCurrentAction(),
@@ -8427,7 +8483,7 @@ function ConfirmOrder() {
     isSubmitDisabled: errorFound()
   }, React.createElement(ContentContainer$4, null, React.createElement(Wrapper$j, null, React.createElement(CustomerInformation, null), React.createElement(SlotAndInstructions, null)), React.createElement(ProductTable$1, null), React.createElement(NotesTable, null)));
 }
-var Wrapper$j = /*#__PURE__*/styled.div(_templateObject$1I || (_templateObject$1I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 10px;\n"])));
+var Wrapper$j = /*#__PURE__*/styled.div(_templateObject$1J || (_templateObject$1J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 10px;\n"])));
 var ContentContainer$4 = /*#__PURE__*/styled.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$f, _templateObject6$9, _templateObject7$b, _templateObject8$6, _templateObject9$3, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13, _templateObject14$1, _templateObject15, _templateObject18, _templateObject19$1, _templateObject26;
@@ -8441,7 +8497,7 @@ var HoldRow = /*#__PURE__*/styled.div(_templateObject8$6 || (_templateObject8$6
 var Label$e = /*#__PURE__*/styled.label(_templateObject9$3 || (_templateObject9$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #758588;\n  font-family: 'Lato', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n"])));
 var ContentContainer$5 = /*#__PURE__*/styled.div(_templateObject10$1 || (_templateObject10$1 = /*#__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  flex: 1 0 0;\n  border-radius: 15px;\n  background: #f8fafc;\n"])));
 var HoldContentContainer = /*#__PURE__*/styled.div(_templateObject11$1 || (_templateObject11$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 20px 20px;\n  margin: 5px 14px;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n  gap: 15px;\n  flex: 1 0 0;\n  border-radius: 15px;\n"])));
-var Container$15 = /*#__PURE__*/styled.div(_templateObject12$1 || (_templateObject12$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 15px;\n  border: 1px solid #e0e2e7;\n  background: #fff;\n  display: flex;\n  padding: 15px;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n  gap: 15px;\n  flex: 1 0 0;\n  width: 450px;\n"])));
+var Container$16 = /*#__PURE__*/styled.div(_templateObject12$1 || (_templateObject12$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 15px;\n  border: 1px solid #e0e2e7;\n  background: #fff;\n  display: flex;\n  padding: 15px;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n  gap: 15px;\n  flex: 1 0 0;\n  width: 450px;\n"])));
 var StaticText = /*#__PURE__*/styled.div(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #3a3630;\n  font-family: 'lato', sans-serif;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 18px; /* 128.571% */\n  flex: 1 0 0;\n"])));
 var ImageCircle = /*#__PURE__*/styled.div(_templateObject14$1 || (_templateObject14$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 10px;\n  justify-content: center;\n  align-items: center;\n  gap: 10px;\n  border-radius: 50px;\n  background: #f2f4f6;\n"])));
 var ImageRow = /*#__PURE__*/styled.div(_templateObject15 || (_templateObject15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  gap: 15px;\n  align-self: stretch;\n"])));
@@ -8614,8 +8670,9 @@ function HoldOrderModal() {
       value: item == null ? void 0 : item.reason
     };
   });
+  var dynamicUrl = selectedDate ? "orders/" + orderId + "/hold/?hold_reason=" + holdReason + "&hold_until=" + selectedDate : "orders/" + orderId + "/hold/?hold_reason=" + holdReason + "\n";
   var _useApiHook = useApiHook({
-      endpoint: "orders/" + orderId + "/hold/?hold_reason=" + holdReason + "&hold_until=" + selectedDate,
+      endpoint: dynamicUrl,
       method: 'POST',
       performAction: false
     }),
@@ -8677,7 +8734,7 @@ function HoldOrderModal() {
       setPerformAction(true);
     }
   };
-  var showSubmitBtn = holdReason !== undefined && selectedDate !== null;
+  var showSubmitBtn = holdReason !== undefined;
   return React.createElement(OrderActionModal, {
     headerTitle: "Hold order",
     onCloseHeader: onClose,
@@ -8687,8 +8744,7 @@ function HoldOrderModal() {
     submitBtnTitle: "Save Details",
     isSubmitDisabled: !showSubmitBtn
   }, React.createElement(HoldContentContainer, null, React.createElement(SplitText, null, React.createElement(HoldRow, null, React.createElement(Label$h, {
-    label: "Delivery Date",
-    required: true
+    label: "Hold Until (leave blank for indefinite)"
   }), React.createElement(HoldDatePickerWrap, null, React.createElement(DatePicker, {
     needConfirm: true,
     format: 'MMMM D, YYYY',
@@ -8856,7 +8912,7 @@ var GrowthImg = function GrowthImg() {
 var FeedbackItem = function FeedbackItem(_ref) {
   var Icon = _ref.icon,
     question = _ref.question;
-  return React.createElement(Row$4, null, React.createElement(Container$15, null, React.createElement(ImageRow, null, React.createElement(ImageCircle, null, React.createElement(Icon, null)), React.createElement(StaticText, null, question)), React.createElement(CustomRating, {
+  return React.createElement(Row$4, null, React.createElement(Container$16, null, React.createElement(ImageRow, null, React.createElement(ImageCircle, null, React.createElement(Icon, null)), React.createElement(StaticText, null, question)), React.createElement(CustomRating, {
     showText: true
   })));
 };
@@ -8889,7 +8945,7 @@ function LogFeedback() {
   })), React.createElement(SplitLayout, null, React.createElement(FeedbackItem, {
     icon: GrowthImg,
     question: 'How would you rate the overall performance during the delivery process?'
-  }), React.createElement(Row$4, null, React.createElement(Container$15, null, React.createElement(StaticText, null, "Anything below 3 needs to be investigated"), React.createElement(StyledTextAreas, {
+  }), React.createElement(Row$4, null, React.createElement(Container$16, null, React.createElement(StaticText, null, "Anything below 3 needs to be investigated"), React.createElement(StyledTextAreas, {
     name: "note",
     placeholder: "Write here..."
   }))))));
@@ -9051,7 +9107,7 @@ function ChargeLog() {
   })));
 }
-var _templateObject$1J;
+var _templateObject$1K;
 var UnholdOrder = function UnholdOrder() {
   var _useOrderId = useOrderId(),
     orderId = _useOrderId[0];
@@ -9126,9 +9182,9 @@ var UnholdOrder = function UnholdOrder() {
     })
   });
 };
-var CustomCancelAndCompleteAction = /*#__PURE__*/styled(CancelAndCompleteAction)(_templateObject$1J || (_templateObject$1J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n"])));
+var CustomCancelAndCompleteAction = /*#__PURE__*/styled(CancelAndCompleteAction)(_templateObject$1K || (_templateObject$1K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n"])));
-var _templateObject$1K, _templateObject2$1m;
+var _templateObject$1L, _templateObject2$1m;
 function AssigneeDropdown() {
   var handleSelectChange = function handleSelectChange() {
     // alert('hello');
@@ -9150,7 +9206,7 @@ function AssigneeDropdown() {
     }
   }));
 }
-var FormContainer$2 = /*#__PURE__*/styled.div(_templateObject$1K || (_templateObject$1K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n  width: 285px;\n"])));
+var FormContainer$2 = /*#__PURE__*/styled.div(_templateObject$1L || (_templateObject$1L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  flex: 1;\n  width: 285px;\n"])));
 var StyledAntSelect$3 = /*#__PURE__*/styled(AntSelect)(_templateObject2$1m || (_templateObject2$1m = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var DatePickerIcon = function DatePickerIcon() {
@@ -9169,8 +9225,8 @@ var DatePickerIcon = function DatePickerIcon() {
   }));
 };
-var _templateObject$1L, _templateObject2$1n, _templateObject3$J, _templateObject4$o, _templateObject8$7, _templateObject10$2, _templateObject11$2, _templateObject13$1, _templateObject14$2, _templateObject15$1, _templateObject16, _templateObject17, _templateObject19$2, _templateObject20$1;
-var ReferenceContainer = /*#__PURE__*/styled.div(_templateObject$1L || (_templateObject$1L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 52px;\n  width: 740px;\n  padding: 10px 15px;\n  align-items: center;\n  flex: 1 0 0;\n  border-radius: 40px;\n  border: 1px solid rgba(0, 0, 0, 0.1);\n  background: #fff;\n"])));
+var _templateObject$1M, _templateObject2$1n, _templateObject3$J, _templateObject4$o, _templateObject8$7, _templateObject10$2, _templateObject11$2, _templateObject13$1, _templateObject14$2, _templateObject15$1, _templateObject16, _templateObject17, _templateObject19$2, _templateObject20$1;
+var ReferenceContainer = /*#__PURE__*/styled.div(_templateObject$1M || (_templateObject$1M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 52px;\n  width: 740px;\n  padding: 10px 15px;\n  align-items: center;\n  flex: 1 0 0;\n  border-radius: 40px;\n  border: 1px solid rgba(0, 0, 0, 0.1);\n  background: #fff;\n"])));
 var InnerContainer = /*#__PURE__*/styled.div(_templateObject2$1n || (_templateObject2$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 52px;\n  padding: 10px 15px;\n  align-items: center;\n  gap: 20px;\n  flex: 1 0 0;\n"])));
 var MiniContainer = /*#__PURE__*/styled.div(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n  flex: 1;\n"])));
 var StyledText$1 = /*#__PURE__*/styled(TextArea)(_templateObject4$o || (_templateObject4$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 96px;\n  padding: 8px 12px;\n  align-items: flex-start;\n  gap: 4px;\n  align-self: stretch;\n  border-radius: 22px;\n  resize: none;\n"])));
@@ -9264,10 +9320,10 @@ function useFetchSingleReminderData() {
   return res;
 }
-var _templateObject$1M, _templateObject2$1o, _templateObject3$K, _templateObject4$p;
+var _templateObject$1N, _templateObject2$1o, _templateObject3$K, _templateObject4$p;
 function StatusIndicator(props) {
   var statusColor = getStatusColor(props.status);
-  return React.createElement(Container$16, null, React.createElement(StatusCircleContainer, {
+  return React.createElement(Container$17, null, React.createElement(StatusCircleContainer, {
     status: props.status
   }, React.createElement(StatusCircle, {
     color: statusColor
@@ -9275,13 +9331,13 @@ function StatusIndicator(props) {
     status: props.status
   }, props.text));
 }
-var StatusCircleContainer = /*#__PURE__*/styled.span(_templateObject$1M || (_templateObject$1M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 20px;\n  width: 20px;\n  border: 1px solid\n    ", ";\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])), function (props) {
+var StatusCircleContainer = /*#__PURE__*/styled.span(_templateObject$1N || (_templateObject$1N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 20px;\n  width: 20px;\n  border: 1px solid\n    ", ";\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"])), function (props) {
   return props.status === 'SD' ? '#30fe43' : props.status === 'AD' ? '#E95252' : 'transparent';
 });
 var StatusCircle = /*#__PURE__*/styled.span(_templateObject2$1o || (_templateObject2$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 10px;\n  width: 10px;\n  background: ", ";\n  border-radius: 50%;\n  display: inline-block;\n  transition: 0.2s ease all;\n"])), function (props) {
   return props.color;
 });
-var Container$16 = /*#__PURE__*/styled.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  height: 22px;\n"])));
+var Container$17 = /*#__PURE__*/styled.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  height: 22px;\n"])));
 var Text$7 = /*#__PURE__*/styled.span(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: 13px;\n  font-weight: normal;\n  text-transform: capitalize;\n  font-weight: 500;\n  color: ", ";\n"])), function (props) {
   return props.status === 'SD' ? '#57DB7A' : props.status === 'AD' ? '#E95252' : 'transparent';
 });
@@ -9444,7 +9500,7 @@ function useFetchReminders() {
   return perform;
 }
-var _templateObject$1N, _templateObject2$1p, _templateObject3$L, _templateObject4$q, _templateObject5$g, _templateObject6$a, _templateObject7$c;
+var _templateObject$1O, _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(),
@@ -9600,7 +9656,7 @@ var ViewReminderModal = function ViewReminderModal() {
     onChange: onChangeDetails
   }))))));
 };
-var StyledWrapper = /*#__PURE__*/styled.div(_templateObject$1N || (_templateObject$1N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 6px 10px;\n  align-items: center;\n  gap: 5px;\n  border-radius: 30px;\n  background: #fff;\n"])));
+var StyledWrapper = /*#__PURE__*/styled.div(_templateObject$1O || (_templateObject$1O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 6px 10px;\n  align-items: center;\n  gap: 5px;\n  border-radius: 30px;\n  background: #fff;\n"])));
 var StyledLabel$1 = /*#__PURE__*/styled.label(_templateObject2$1p || (_templateObject2$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  display: flex;\n"])));
 var StyledSpan = /*#__PURE__*/styled.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.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"])));
@@ -9608,9 +9664,9 @@ var OuterDiv = /*#__PURE__*/styled.div(_templateObject5$g || (_templateObject5$g
 var RoundCheckbox = /*#__PURE__*/styled.span(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var LabelText = /*#__PURE__*/styled.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$h, _templateObject7$d, _templateObject8$8, _templateObject9$4;
+var _templateObject$1P, _templateObject3$M, _templateObject5$h, _templateObject7$d, _templateObject8$8, _templateObject9$4;
 // Shared styles and components
-var Wrapper$k = /*#__PURE__*/styled.div(_templateObject$1O || (_templateObject$1O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n"])));
+var Wrapper$k = /*#__PURE__*/styled.div(_templateObject$1P || (_templateObject$1P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n"])));
 var SplitContainer = /*#__PURE__*/styled.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.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.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"])));
@@ -9629,7 +9685,7 @@ var FormRow = function FormRow(_ref) {
   }, " * ")), children);
 };
-var _templateObject$1P, _templateObject2$1q, _templateObject3$N, _templateObject4$r, _templateObject5$i;
+var _templateObject$1Q, _templateObject2$1q, _templateObject3$N, _templateObject4$r, _templateObject5$i;
 dayjs.extend(utc);
 dayjs.extend(isValid);
 function CreateReminderModal() {
@@ -9852,7 +9908,7 @@ function CreateReminderModal() {
     onChange: handleChange
   })));
 }
-var StyleContainer = /*#__PURE__*/styled.div(_templateObject$1P || (_templateObject$1P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 20px;\n  background: var(--Flowkit-White, #fff);\n"])));
+var StyleContainer = /*#__PURE__*/styled.div(_templateObject$1Q || (_templateObject$1Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 20px;\n  background: var(--Flowkit-White, #fff);\n"])));
 var Label$g = /*#__PURE__*/styled.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(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(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"])));
@@ -10026,7 +10082,7 @@ function useFetchUnresolvedTasks() {
   return perform;
 }
-var _templateObject$1Q;
+var _templateObject$1R;
 function TaskReminderModal() {
   var createReminderAPI = useCreateReminder();
   var _useCurrentAction = useCurrentAction(),
@@ -10125,9 +10181,9 @@ function TaskReminderModal() {
     isSubmitDisabled: isSubmitDisabled()
   }, React.createElement(ContentContainer$6, null, React.createElement(CreateReminderModal, null))));
 }
-var OrderModal = /*#__PURE__*/styled(OrderActionModal)(_templateObject$1Q || (_templateObject$1Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 70%;\n"])));
+var OrderModal = /*#__PURE__*/styled(OrderActionModal)(_templateObject$1R || (_templateObject$1R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 70%;\n"])));
-var _templateObject$1R, _templateObject2$1r;
+var _templateObject$1S, _templateObject2$1r;
 function OrderLock() {
   var _useCurrentAction = useCurrentAction(),
     setCurrentAction = _useCurrentAction[1];
@@ -10180,7 +10236,7 @@ function OrderLock() {
     })
   });
 }
-var CustomCancelationModal = /*#__PURE__*/styled(CancelationModal)(_templateObject$1R || (_templateObject$1R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background: rgba(0, 0, 0, 0.8);\n"])));
+var CustomCancelationModal = /*#__PURE__*/styled(CancelationModal)(_templateObject$1S || (_templateObject$1S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background: rgba(0, 0, 0, 0.8);\n"])));
 var CustomCancelAndCompleteAction$1 = /*#__PURE__*/styled(CancelAndCompleteAction)(_templateObject2$1r || (_templateObject2$1r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n"])));
 function useUpdateFlag() {
@@ -10251,7 +10307,7 @@ function useUpdateFlag() {
   return create;
 }
-var _templateObject$1S, _templateObject2$1s, _templateObject3$O, _templateObject4$s, _templateObject5$j, _templateObject6$b;
+var _templateObject$1T, _templateObject2$1s, _templateObject3$O, _templateObject4$s, _templateObject5$j, _templateObject6$b;
 function HeaderSection() {
   var _useSingleFlagData = useSingleFlagData(),
     dataArray = _useSingleFlagData[0];
@@ -10321,14 +10377,14 @@ function HeaderSection() {
     })
   })));
 }
-var Header$1 = /*#__PURE__*/styled.div(_templateObject$1S || (_templateObject$1S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n"])));
+var Header$1 = /*#__PURE__*/styled.div(_templateObject$1T || (_templateObject$1T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n"])));
 var CustomCancelAndCompleteAction$2 = /*#__PURE__*/styled(CancelAndCompleteAction)(_templateObject2$1s || (_templateObject2$1s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n"])));
 var ResolveButton = /*#__PURE__*/styled.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.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.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.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n"])));
-var _templateObject$1T, _templateObject2$1t;
+var _templateObject$1U, _templateObject2$1t;
 function TextSection() {
   var _useSinglePayload = useSinglePayload(),
     payload = _useSinglePayload[0],
@@ -10346,10 +10402,10 @@ function TextSection() {
     onChange: onChangeDetails
   }));
 }
-var TextField = /*#__PURE__*/styled(TextArea)(_templateObject$1T || (_templateObject$1T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 97% !important;\n"])));
+var TextField = /*#__PURE__*/styled(TextArea)(_templateObject$1U || (_templateObject$1U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 97% !important;\n"])));
 var Text$8 = /*#__PURE__*/styled.div(_templateObject2$1t || (_templateObject2$1t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: grid;\n  margin-top: 2%;\n"])));
-var _templateObject$1U, _templateObject2$1u;
+var _templateObject$1V, _templateObject2$1u;
 function ButtonsSection() {
   var _useSinglePayload = useSinglePayload(),
     payload = _useSinglePayload[0],
@@ -10440,10 +10496,10 @@ function ButtonsSection() {
     status: "SD"
   }))));
 }
-var Buttons = /*#__PURE__*/styled.div(_templateObject$1U || (_templateObject$1U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 25px;\n"])));
+var Buttons = /*#__PURE__*/styled.div(_templateObject$1V || (_templateObject$1V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 25px;\n"])));
 var Flex = /*#__PURE__*/styled.div(_templateObject2$1u || (_templateObject2$1u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 20px;\n"])));
-var _templateObject$1V, _templateObject2$1v, _templateObject3$P, _templateObject4$t, _templateObject5$k, _templateObject6$c;
+var _templateObject$1W, _templateObject2$1v, _templateObject3$P, _templateObject4$t, _templateObject5$k, _templateObject6$c;
 function ActionSection() {
   var _useCurrentAction = useCurrentAction(),
     setCurrentAction = _useCurrentAction[1];
@@ -10529,14 +10585,14 @@ function RadioButtonsSection() {
     required: false
   }));
 }
-var ButtonWrapper = /*#__PURE__*/styled.div(_templateObject$1V || (_templateObject$1V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n"])));
+var ButtonWrapper = /*#__PURE__*/styled.div(_templateObject$1W || (_templateObject$1W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n"])));
 var SaveButton = /*#__PURE__*/styled(Button)(_templateObject2$1v || (_templateObject2$1v = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var CancelButton = /*#__PURE__*/styled(Button)(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var DropDowns = /*#__PURE__*/styled.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 25px;\n"])));
 var TooltipContent = /*#__PURE__*/styled.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.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var _templateObject$1W, _templateObject2$1w, _templateObject3$Q, _templateObject4$u, _templateObject5$l;
+var _templateObject$1X, _templateObject2$1w, _templateObject3$Q, _templateObject4$u, _templateObject5$l;
 function DetailSection() {
   var _dataArray$order_data, _dataArray$order_data2;
   var _useSingleFlagData = useSingleFlagData(),
@@ -10548,7 +10604,7 @@ function DetailSection() {
     label: "Order"
   }), React.createElement(Order, null, orderColumnData)));
 }
-var Detail = /*#__PURE__*/styled.div(_templateObject$1W || (_templateObject$1W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 40%;\n  flex-wrap: wrap;\n"])));
+var Detail = /*#__PURE__*/styled.div(_templateObject$1X || (_templateObject$1X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 40%;\n  flex-wrap: wrap;\n"])));
 var Flex$1 = /*#__PURE__*/styled.div(_templateObject2$1w || (_templateObject2$1w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 20px;\n"])));
 var Ref = /*#__PURE__*/styled.div(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #7b7874;\n  font-family: 'Lato', sans-serif;\n"])));
 var Order = /*#__PURE__*/styled.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #7b7874;\n  text-decoration: underline;\n  font-family: 'Lato', sans-serif;\n"])));
@@ -10634,7 +10690,7 @@ function useFetchSingleFlagsData() {
   return res;
 }
-var _templateObject$1X, _templateObject2$1x, _templateObject3$R;
+var _templateObject$1Y, _templateObject2$1x, _templateObject3$R;
 function ViewFlag() {
   var _useSingleFlagData = useSingleFlagData(),
     dataArray = _useSingleFlagData[0],
@@ -10731,11 +10787,11 @@ function ViewFlag() {
   }, [dataArray]);
   return React.createElement(React.Fragment, null, React.createElement(BackgroundModals, null, dataArray && loading && React.createElement(Loader, null), React.createElement(MainContainer$a, null, React.createElement(HeaderSection, null), React.createElement(DetailSection, null), React.createElement(TextSection, null), React.createElement(ButtonsSection, null), React.createElement(SectionsContainer, null, React.createElement(ActionSection, null), React.createElement(RadioButtonsSection, null)))));
 }
-var SectionsContainer = /*#__PURE__*/styled.div(_templateObject$1X || (_templateObject$1X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-top: 6%;\n"])));
+var SectionsContainer = /*#__PURE__*/styled.div(_templateObject$1Y || (_templateObject$1Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-top: 6%;\n"])));
 var BackgroundModals = /*#__PURE__*/styled(BackgroundModal$1)(_templateObject2$1x || (_templateObject2$1x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: rgba(0, 0, 0, 0.5);\n  backdrop-filter: blur(1px);\n"])));
 var MainContainer$a = /*#__PURE__*/styled.div(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 24px;\n  border-radius: 12px;\n  background: #ffffff;\n  box-shadow: 0px 20px 24px -4px #10182814;\n  width: 80%;\n  max-width: 50%;\n  margin: 0 auto;\n  @media (max-width: 1024px) {\n    max-width: 80%;\n  }\n"])));
-var _templateObject$1Y;
+var _templateObject$1Z;
 function ReleaseOrder() {
   var _useOrderId = useOrderId(),
     orderId = _useOrderId[0];
@@ -10814,9 +10870,9 @@ function ReleaseOrder() {
 //   position: absolute;
 //   transform: translate3d(57px, 308px, 0px) scaleX(1);
 // `;
-var CustomCancelAndCompleteAction$3 = /*#__PURE__*/styled(CancelAndCompleteAction)(_templateObject$1Y || (_templateObject$1Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n"])));
+var CustomCancelAndCompleteAction$3 = /*#__PURE__*/styled(CancelAndCompleteAction)(_templateObject$1Z || (_templateObject$1Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n"])));
-var _templateObject$1Z;
+var _templateObject$1_;
 function OrderActions() {
   var _useCurrentAction = useCurrentAction(),
     currentAction = _useCurrentAction[0];
@@ -10866,9 +10922,9 @@ function OrderActions() {
         return null;
     }
   };
-  return React.createElement(Container$17, null, renderContent());
+  return React.createElement(Container$18, null, renderContent());
 }
-var Container$17 = /*#__PURE__*/styled.div(_templateObject$1Z || (_templateObject$1Z = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var Container$18 = /*#__PURE__*/styled.div(_templateObject$1_ || (_templateObject$1_ = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 function useSystemLogs() {
   var ssoToken = getCookie('id_token');
@@ -10960,7 +11016,7 @@ function useSystemLogs() {
   return perform;
 }
-var _templateObject$1_, _templateObject2$1y;
+var _templateObject$1$, _templateObject2$1y;
 var Details = function Details() {
   // const [orderDetails] = useOrderDetails();
   var _useCustomerInfo = useCustomerInfo(),
@@ -10969,10 +11025,10 @@ var Details = function Details() {
   var postcodeShow = (customerInfo == null ? void 0 : customerInfo.postcode) || '';
   return React.createElement(DetailsContainer, null, React.createElement(Typo, null, "CUSTOMER RETURN - ", recipient, " , ", postcodeShow));
 };
-var DetailsContainer = /*#__PURE__*/styled.div(_templateObject$1_ || (_templateObject$1_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  > svg {\n    transform: scale(0.6);\n  }\n"])));
+var DetailsContainer = /*#__PURE__*/styled.div(_templateObject$1$ || (_templateObject$1$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  > svg {\n    transform: scale(0.6);\n  }\n"])));
 var Typo = /*#__PURE__*/styled.div(_templateObject2$1y || (_templateObject2$1y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: 20px;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 32px; /* 160% */\n  text-transform: uppercase;\n  margin: 0;\n  padding: 0;\n\n  @media screen and (max-width: 1220px) {\n    font-size: 14px;\n  }\n"])));
-var _templateObject$1$;
+var _templateObject$20;
 function Options() {
   var _useCurrentAction = useCurrentAction(),
     setCurrentAction = _useCurrentAction[1];
@@ -11038,7 +11094,7 @@ function Options() {
     value: "OPTIONS"
   }));
 }
-var Option = /*#__PURE__*/styled.div(_templateObject$1$ || (_templateObject$1$ = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var Option = /*#__PURE__*/styled.div(_templateObject$20 || (_templateObject$20 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 function BjsMenu() {
   var _orderStatus$;
@@ -11095,7 +11151,7 @@ function BjsMenu() {
   });
 }
-var _templateObject$20;
+var _templateObject$21;
 function Print() {
   var _useOrderDetails = useOrderDetails(),
     orderDetails = _useOrderDetails[0];
@@ -11144,7 +11200,7 @@ function Print() {
       window.open(url, '_blank');
     }
   };
-  return React.createElement(Container$18, null, React.createElement(SelectDropdown, {
+  return React.createElement(Container$19, null, React.createElement(SelectDropdown, {
     placeholder: "PRINT",
     options: PrintMenu,
     value: "PRINT",
@@ -11180,29 +11236,29 @@ function Print() {
     })
   }));
 }
-var Container$18 = /*#__PURE__*/styled.div(_templateObject$20 || (_templateObject$20 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var Container$19 = /*#__PURE__*/styled.div(_templateObject$21 || (_templateObject$21 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var _templateObject$21;
+var _templateObject$22;
 // components
 function DropDowns$1() {
   return React.createElement(React.Fragment, null, React.createElement(DashBoardWrapper$2, null, React.createElement(BjsMenu, null), React.createElement(Options, null), React.createElement(Print, null)));
 }
-var DashBoardWrapper$2 = /*#__PURE__*/styled.section(_templateObject$21 || (_templateObject$21 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0 5px;\n  display: flex;\n  align-self: center;\n  gap: 10px;\n"])));
+var DashBoardWrapper$2 = /*#__PURE__*/styled.section(_templateObject$22 || (_templateObject$22 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0 5px;\n  display: flex;\n  align-self: center;\n  gap: 10px;\n"])));
-var _templateObject$22;
+var _templateObject$23;
 // import Actions from './actions/Actions';
 var ActionsMenu = function ActionsMenu() {
   return React.createElement(Flex$2, null, React.createElement(DropDowns$1, null));
 };
-var Flex$2 = /*#__PURE__*/styled.div(_templateObject$22 || (_templateObject$22 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n  display: flex;\n  height: 34px;\n  padding: 1px;\n  align-items: flex-start;\n  border-radius: 20px;\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  background: #f0f2f2;\n  cursor: pointer;\n"])));
+var Flex$2 = /*#__PURE__*/styled.div(_templateObject$23 || (_templateObject$23 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n  display: flex;\n  height: 34px;\n  padding: 1px;\n  align-items: flex-start;\n  border-radius: 20px;\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  background: #f0f2f2;\n  cursor: pointer;\n"])));
-var _templateObject$23;
+var _templateObject$24;
 var DetailsFilters = function DetailsFilters() {
   return React.createElement(Flex$3, null, React.createElement(Details, null), React.createElement(ActionsMenu, null));
 };
-var Flex$3 = /*#__PURE__*/styled.div(_templateObject$23 || (_templateObject$23 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 40px;\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  background: linear-gradient(180deg, #fff 0%, #f9fcff 100%);\n\n  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n  /* z-index: 9999; */\n  display: flex;\n  padding: 10px;\n  flex-direction: row;\n  gap: 10px;\n  align-self: stretch;\n  position: relative;\n  margin-bottom: -71px;\n  width: 97%;\n  margin-left: 21px;\n  top: -132px;\n  justify-content: space-between;\n"])));
+var Flex$3 = /*#__PURE__*/styled.div(_templateObject$24 || (_templateObject$24 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 40px;\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  background: linear-gradient(180deg, #fff 0%, #f9fcff 100%);\n\n  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n  /* z-index: 9999; */\n  display: flex;\n  padding: 10px;\n  flex-direction: row;\n  gap: 10px;\n  align-self: stretch;\n  position: relative;\n  margin-bottom: -71px;\n  width: 97%;\n  margin-left: 21px;\n  top: -132px;\n  justify-content: space-between;\n"])));
-var _templateObject$24, _templateObject2$1z, _templateObject3$S, _templateObject4$v;
+var _templateObject$25, _templateObject2$1z, _templateObject3$S, _templateObject4$v;
 function OrderView() {
   notification.config({
     top: 150
@@ -11247,7 +11303,8 @@ function OrderView() {
   var _useLiveRecalling = useLiveRecalling(),
     liveRecalling = _useLiveRecalling[0];
   var systemLogsData = useSystemLogs();
-  // const [, setAssignData] = useAssignData();
+  var _useVisibilityData = useVisibilityData(),
+    setVisibilityData = _useVisibilityData[1];
   // query param
   var location = useLocation();
   var _useState2 = useState([]),
@@ -11337,13 +11394,12 @@ function OrderView() {
   useEffect(function () {
     setLoading(staticDataLoading);
     if (fetchedStaticData && fetchedStaticData.data) {
+      var _fetchedStaticData$da;
       var result = fetchedStaticData == null ? void 0 : fetchedStaticData.data;
       setOrderStaticData(result[0]);
-      // setAssignData(
-      //   fetchedStaticData?.data?.flatMap(
-      //     (i: any) => i?.resource_visibility_type
-      //   )
-      // );
+      setVisibilityData(fetchedStaticData == null || (_fetchedStaticData$da = fetchedStaticData.data) == null ? void 0 : _fetchedStaticData$da.flatMap(function (i) {
+        return i == null ? void 0 : i.resource_visibility_type;
+      }));
     }
   }, [staticDataLoading]);
   useEffect(function () {
@@ -11515,7 +11571,7 @@ function OrderView() {
   console.log(orderId, 'orderId');
   return React.createElement(MainContainer$b, null, React.createElement(GeneralHeader, null), React.createElement(DetailsFilters, null), React.createElement(OrderDetails$1, null), React.createElement(ProductsInfo, null), React.createElement(SplitLayout$1, null, React.createElement(NotesContainer, null, React.createElement(Notes, null)), React.createElement(TablesContainer, null, React.createElement(SystemLogs, null))), React.createElement(OrderActions, null));
 }
-var MainContainer$b = /*#__PURE__*/styled.div(_templateObject$24 || (_templateObject$24 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  padding-bottom: 30px;\n"])));
+var MainContainer$b = /*#__PURE__*/styled.div(_templateObject$25 || (_templateObject$25 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  padding-bottom: 30px;\n"])));
 var SplitLayout$1 = /*#__PURE__*/styled.div(_templateObject2$1z || (_templateObject2$1z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 15px;\n  @media (max-width: 1024px) {\n    display: contents;\n  }\n"])));
 var NotesContainer = /*#__PURE__*/styled.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 1;\n"])));
 var TablesContainer = /*#__PURE__*/styled.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 15px;\n"])));
@@ -11523,7 +11579,7 @@ var TablesContainer = /*#__PURE__*/styled.div(_templateObject4$v || (_templateOb
 var _templateObject2$1A;
 var StyledBulkItem = /*#__PURE__*/styled.div(_templateObject2$1A || (_templateObject2$1A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 8px 12px;\n  display: flex;\n  align-items: center;\n  /* border-right: 1px solid #d0d5dd; */\n  gap: 8px;\n  cursor: pointer;\n  position: relative;\n\n  @media screen and (max-width: 1030px) {\n    padding: 8px 11px;\n  }\n\n  ul {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    box-sizing: border-box;\n    top: 54px;\n  }\n  &:last-child {\n    border-right: none;\n  }\n  &.active svg.arrowDown {\n    transform: rotate(180deg);\n  }\n  label {\n    color: #6a7378;\n    text-align: center;\n    font-family: 'Open Sans';\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 18px;\n    cursor: pointer;\n  }\n\n  &.noPadding {\n    padding: 0;\n  }\n"])));
-var _templateObject$25, _templateObject2$1B;
+var _templateObject$26, _templateObject2$1B;
 var SearchType = function SearchType() {
   var _useState = useState(''),
     searchText = _useState[0],
@@ -11538,7 +11594,7 @@ var SearchType = function SearchType() {
     onChange: handleInputChange
   }));
 };
-var Search = /*#__PURE__*/styled.div(_templateObject$25 || (_templateObject$25 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  svg {\n    position: absolute;\n    left: 12px;\n    top: 50%;\n    transform: translateY(-50%);\n  }\n"])));
+var Search = /*#__PURE__*/styled.div(_templateObject$26 || (_templateObject$26 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  svg {\n    position: absolute;\n    left: 12px;\n    top: 50%;\n    transform: translateY(-50%);\n  }\n"])));
 var SearchInput = /*#__PURE__*/styled.input(_templateObject2$1B || (_templateObject2$1B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-radius: 20px;\n  border: 1px solid #e0e2e7;\n  background: #fff;\n  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n  display: flex;\n  padding: 8.5px 12px;\n  align-items: center;\n  gap: 8px;\n  align-self: stretch;\n  padding-left: 39px;\n"])));
 var BulkFilter = function BulkFilter() {
@@ -11886,7 +11942,7 @@ var overviewfiltersReducerAtom = /*#__PURE__*/atom(function (get) {
   return set(filtersStateAtom$2, filterReducer$2(get(filtersStateAtom$2), action));
 });
-var _templateObject$26, _templateObject2$1C, _templateObject3$T;
+var _templateObject$27, _templateObject2$1C, _templateObject3$T;
 var _excluded$6 = ["count"];
 function ReturnMainTable() {
   var _useAtom = useAtom(overviewfiltersReducerAtom),
@@ -11957,7 +12013,7 @@ function ReturnMainTable() {
     className: " " + (isScrolled ? 'stickyTableHead' : '')
   }, React.createElement("div", {
     className: "Tableconatiner"
-  }, React.createElement(HeaderFilter, null), React.createElement(Container$19, null, React.createElement(Row$7, null, React.createElement(Text, null, "Client Return"), customerId ? React.createElement(ReturnFilter, null) : React.createElement(Filters, null)), React.createElement(ReturnTable$1, null)), total > 0 && React.createElement(Pagination, {
+  }, React.createElement(HeaderFilter, null), React.createElement(Container$1a, null, React.createElement(Row$7, null, React.createElement(Text, null, "Client Return"), customerId ? React.createElement(ReturnFilter, null) : React.createElement(Filters, null)), React.createElement(ReturnTable$1, null)), total > 0 && React.createElement(Pagination, {
     currentPage: page,
     totalItems: total,
     itemsPerPage: itemsPerPage,
@@ -11965,8 +12021,8 @@ function ReturnMainTable() {
     onItemsPerPageChange: handleItemsPerPageChange
   }))));
 }
-var Row$7 = /*#__PURE__*/styled.div(_templateObject$26 || (_templateObject$26 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
-var Container$19 = /*#__PURE__*/styled.div(_templateObject2$1C || (_templateObject2$1C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  top: -46px;\n"])));
+var Row$7 = /*#__PURE__*/styled.div(_templateObject$27 || (_templateObject$27 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
+var Container$1a = /*#__PURE__*/styled.div(_templateObject2$1C || (_templateObject2$1C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  top: -46px;\n"])));
 var DashBoardWrapper$3 = /*#__PURE__*/styled.section(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .Tableconatiner {\n    border-radius: 12px;\n    background: #fff;\n    box-shadow: -2px 0px 12px 0px rgba(56, 71, 109, 0.1);\n    display: block;\n    padding: 15px 20px;\n  }\n  .headerWrap,\n  .tableData,\n  .styleCovered {\n    transition: all ease 0.5s;\n  }\n  &.stickyTableHead {\n    h2 {\n      font-size: 21px;\n    }\n    .headerWrap {\n      height: 84px;\n      padding: 10px;\n      border-radius: 0px 0px 15px 15px;\n      > div {\n        position: relative;\n        z-index: 10;\n      }\n    }\n    .styleCovered {\n      margin-top: -32px;\n      width: 67%;\n      float: right;\n      gap: 5px;\n      padding-right: 11px;\n\n      li {\n        padding: 4px 10px 5px 5px;\n        gap: 5px;\n        .svgCover {\n          width: 30px;\n          height: 30px;\n          svg {\n            height: auto;\n            width: 58%;\n          }\n        }\n        .countDigit {\n          font-size: 19px;\n        }\n      }\n      .countMess {\n        font-size: 13px;\n      }\n    }\n    .dmsBulkFilter {\n      min-height: unset;\n      gap: 4px;\n      > div {\n        padding: 4px 12px;\n        label {\n          font-size: 11px;\n        }\n      }\n    }\n\n    .StyledFilterList {\n      gap: 4px;\n      li {\n        height: 29px;\n        padding: 3px 8px;\n        gap: 4px;\n        .StyledFilterBtnIcon {\n          width: 20px;\n          height: 20px;\n          svh {\n            width: 10px;\n            height: auto;\n          }\n        }\n        .StyledFilterBtnLabel {\n          font-size: 13px;\n        }\n      }\n    }\n    .StyledFilterLabel {\n      padding-left: 10px;\n      span {\n        font-size: 13px;\n      }\n    }\n    .cardcontainer.tableData {\n      max-height: calc(100vh - 310px);\n      min-height: calc(100vh - 310px);\n    }\n\n    .tableData {\n      max-height: calc(100vh - 320px);\n      min-height: calc(100vh - 320px);\n\n      margin-top: 8px;\n      thead {\n        position: sticky;\n        top: 0;\n        z-index: 9;\n        th {\n          font-size: 13px;\n          padding: 2px 15px;\n        }\n      }\n    }\n  }\n"])));
 var OrderViewQueryHandler = function OrderViewQueryHandler() {