@bjsdistribution/dms-client-return 0.0.8 → 0.0.10

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

@@ -1,10 +1,10 @@
 import React, { useEffect, useState, useMemo, useRef, Suspense } from 'react';
-import { useLocation, useParams, NavLink, useNavigate, Routes, Route, Navigate } from 'react-router-dom';
+import { useLocation, useParams, NavLink, useNavigate, Routes, Route } from 'react-router-dom';
 import styled, { css, keyframes } from 'styled-components';
 import { Label as Label$h, Input as Input$1, TextArea, FormSection, displayValueOrNA, SelectDropdown, dropdownStyles, RadioButtonGroup as RadioButtonGroup$1, Switch, Button as Button$1, useApiHook, getBaseEndpoint, formatDateTime, Alert, Checkbox as Checkbox$1, SectionHeader, CrossIcon, AntSelect, AntTable, CustomRating, DeleteIcon, CancelationModal, CancelAndCompleteAction, filterDropdownStyles, BackgroundModal as BackgroundModal$1, AntModal } from '@bjsdistribution/dms-component-library';
 import { useAtom, atom } from 'jotai';
 import { atomWithReducer } from 'jotai/utils';
-import { DatePicker, notification, Skeleton, Upload, message, Input as Input$2, Select, Empty, Checkbox as Checkbox$2, Tabs } from 'antd';
+import { DatePicker, notification, Skeleton, Upload, message, Input as Input$2, Select, Empty, Checkbox as Checkbox$2, Tabs, Tooltip } from 'antd';
 import dayjs from 'dayjs';
 import { useReactTable, getCoreRowModel, getSortedRowModel, flexRender } from '@tanstack/react-table';
 import Scrollbars from 'react-custom-scrollbars-2';
@@ -2330,14 +2330,18 @@ function AddNote() {
                 description: error || 'Something went wrong. Please try again.'
               });
             }
-            _context.next = 18;
+            _context.next = 17;
             break;
           case 14:
             _context.prev = 14;
             _context.t0 = _context["catch"](6);
-            console.error('Error saving note:', _context.t0);
-            alert('Failed to save note');
-          case 18:
+            // console.error('Error saving note:', error);
+            // alert('Failed to save note');
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
+          case 17:
           case "end":
             return _context.stop();
         }
@@ -2819,8 +2823,11 @@ function useGetEventNotes() {
           case 9:
             _json = _context.sent;
             detail = _json == null ? void 0 : _json.detail;
-            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg;
-            console.error('Error response:', msg);
+            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg; // console.error('Error response:', msg);
+            notification.error({
+              message: 'Error',
+              description: "" + msg || 'An error has occurred. Please try again later.'
+            });
             // setLoading(false);
             return _context.abrupt("return", []);
           case 14:
@@ -2838,7 +2845,11 @@ function useGetEventNotes() {
           case 22:
             _context.prev = 22;
             _context.t0 = _context["catch"](1);
-            console.error('Error fetching data:', _context.t0);
+            // console.error('Error fetching data:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
             return _context.abrupt("return", []);
           case 26:
             _context.prev = 26;
@@ -2885,7 +2896,11 @@ function SystemLogs() {
           case 7:
             _context.prev = 7;
             _context.t0 = _context["catch"](0);
-            console.error('Error fetching event notes:', _context.t0);
+            // console.error('Error fetching event notes:', error);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
           case 10:
           case "end":
             return _context.stop();
@@ -3130,7 +3145,7 @@ var Section = /*#__PURE__*/styled.div(_templateObject$V || (_templateObject$V =
 var _templateObject19, _templateObject20, _templateObject21;
 var StyledTable = /*#__PURE__*/styled.table(_templateObject19 || (_templateObject19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-spacing: 0 10px;\n  width: 100%;\n  /* min-width: 1600px; */\n  thead {\n    white-space: nowrap;\n    tr {\n      border-radius: 40px;\n      border-spacing: 0 10px;\n      .emailInvoiceCheckbox {\n        padding-right: 0px;\n        width: 0;\n        > div {\n          width: fit-content;\n        }\n      }\n      .emailInvoiceNo {\n        padding-left: 0px;\n      }\n      .emailInvoiceShare {\n        width: 100px;\n      }\n      th {\n        color: #3a3630;\n        font-size: 14px;\n        font-style: normal;\n        font-weight: 600;\n        line-height: normal;\n        padding: 11px 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        &: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        .actionbox {\n          display: flex;\n          gap: 5px;\n        }\n        .shareIconContainer {\n          display: flex;\n          padding: 2px 12px;\n          align-items: center;\n          gap: 8px;\n          border-radius: 20px;\n          border: 1px solid var(--tonal-brown-101, #e2e0db);\n          background: #fff;\n          list-style-type: none;\n          /* padding-left: 0; */\n          /* fontWeight: 600,\n          paddingLeft: 0, */\n          cursor: pointer;\n          position: relative;\n        }\n        .statusCancelled {\n          color: #e95252;\n          /* background: rgba(233, 82, 82, 0.15); */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusOnHold {\n          color: #f4a503;\n          /* background: #fff1d6; */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusSubContracted {\n          color: #845adf;\n          /* background: rgba(132, 90, 223, 0.15); */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusAwaiting {\n          color: #845adf;\n          /* background: rgba(132, 90, 223, 0.15); */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusCompleted {\n          color: #1f9254;\n          /* background: rgba(41, 204, 106, 0.15); */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusOutstanding {\n          color: #f4a503;\n          /* background: #fff1d6; */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n\n        .statusUnknown {\n          color: #000;\n          /* background: #fff; */\n          padding: 4px 8px;\n          border-radius: 4px;\n        }\n        .statustext {\n          color: #1f9254;\n          font-family: 'Open Sans';\n          font-size: 12px;\n          font-style: normal;\n          font-weight: 600;\n          line-height: normal;\n        }\n        .downloadcontainer {\n          display: flex;\n          padding: 2px 12px;\n          align-items: center;\n\n          width: 28px;\n          height: 28px;\n          flex-direction: column;\n\n          border-radius: 14px;\n          border: 1px solid #e2e0db;\n          background: #fff;\n        }\n        .statuscontainer {\n          display: flex;\n          padding: 5px 30px 5px 30px;\n          justify-content: center;\n          align-items: center;\n          gap: 5px;\n          flex: 1 0 0;\n          border-radius: 22px;\n          background: rgba(41, 204, 106, 0.15);\n        }\n        ul > li > a {\n          text-decoration: none !important;\n          color: #0099ff;\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      .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\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"])));
 // Styled components
-var StyledTableWrapper = /*#__PURE__*/styled.div(_templateObject20 || (_templateObject20 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-x: auto;\n  max-height: calc(100vh - 396px);\n  scrollbar-width: none;\n  height: 400px;\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 = /*#__PURE__*/styled.div(_templateObject20 || (_templateObject20 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-x: auto;\n  max-height: calc(100vh - 396px);\n  scrollbar-width: none;\n  height: 600px;\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 CustomDrop = /*#__PURE__*/styled.div(_templateObject21 || (_templateObject21 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* border-radius: 20px;\n  border: 1px solid #e2e0db;\n  background: #fff;\n  display: flex;\n  padding: 4px 8px;\n  gap: 8px;\n  align-items: center; */\n  cursor: pointer;\n  &.active .drop {\n    transform: rotate(180deg);\n  }\n"])));
 
 var ActionIcon = function ActionIcon() {
@@ -3150,9 +3165,19 @@ var ActionIcon = function ActionIcon() {
   }));
 };
 
+var CreateReturnInitial = {
+  customer_id: 0,
+  account_number: '',
+  return_location_token: '',
+  products: [],
+  return_action: []
+};
 var customerData = /*#__PURE__*/atom([]);
 var actionTypeData = /*#__PURE__*/atom([]);
 var locationData = /*#__PURE__*/atom([]);
+var createReturnPayload = /*#__PURE__*/atom(CreateReturnInitial);
+var newPayload = /*#__PURE__*/atom([]);
+var grpPayload = /*#__PURE__*/atom([]);
 var selectedOrderlList = /*#__PURE__*/atom([]);
 function useSelectedOrders() {
   return useAtom(selectedOrderlList);
@@ -3171,6 +3196,15 @@ function useActionType() {
 function useLocationData() {
   return useAtom(locationData);
 }
+function useReturnPayload() {
+  return useAtom(createReturnPayload);
+}
+function useNewReturnPayload() {
+  return useAtom(newPayload);
+}
+function useGroupedPayload() {
+  return useAtom(grpPayload);
+}
 
 var ReturnProductTable = function ReturnProductTable() {
   var _useSelectedOrders = useSelectedOrders(),
@@ -3219,7 +3253,11 @@ var Container$B = /*#__PURE__*/styled.div(_templateObject$W || (_templateObject$
 var _templateObject$X, _templateObject2$C, _templateObject3$k;
 function ExpandedContent$2() {
   var SaveNote = function SaveNote() {
-    alert('saved');
+    // alert('saved');
+    notification.success({
+      message: 'Success',
+      description: ' Saved successfully.'
+    });
   };
   return React.createElement(Container$C, null, React.createElement(ProductTable, null), React.createElement(MidConatiner, null, React.createElement(SaveNoteContainer$1, null, React.createElement(Button$1, {
     style: {
@@ -4770,7 +4808,11 @@ function ChangeCustomerAccModal() {
     setCurrentAction(undefined);
   };
   var handleSelectChange = function handleSelectChange() {
-    alert('hello');
+    // alert('hello');
+    notification.success({
+      message: 'Success',
+      description: 'Saved successfully.'
+    });
   };
   return React.createElement(OrderActionModal, {
     headerTitle: "Change customer account",
@@ -4900,6 +4942,10 @@ var StyledAntSelect = /*#__PURE__*/styled(AntSelect)(_templateObject3$y || (_tem
 var Dropdowns = function Dropdowns() {
   var handleSelectChange = function handleSelectChange() {
     // alert('hello');
+    notification.success({
+      message: 'Success',
+      description: 'Saved successfully.'
+    });
   };
   return React.createElement(FlexContainer, null, React.createElement(InnerCont, null, React.createElement(Label$h, {
     label: "Escalation Category",
@@ -4973,7 +5019,11 @@ var Notes$2 = function Notes() {
 var _templateObject$1w, _templateObject2$14, _templateObject3$z, _templateObject4$i, _templateObject5$a, _templateObject6$8, _templateObject7$7, _templateObject8$4, _templateObject9$2, _templateObject10$1;
 var Upgrade = function Upgrade() {
   var handleSelectChange = function handleSelectChange() {
-    alert('hello');
+    // alert('hello');
+    notification.success({
+      message: 'Success',
+      description: 'Upgrade successfully.'
+    });
   };
   return React.createElement(React.Fragment, null, React.createElement(Wrapper$g, null, React.createElement(Heading$2, null, "Upgrade"), React.createElement(Container$_, null, React.createElement(Top$3, null, React.createElement(InnerCont$1, null, React.createElement(Toggle, {
     label: 'Timed Service',
@@ -5535,7 +5585,11 @@ var RestoreProducts = function RestoreProducts() {
 var _templateObject$1B, _templateObject2$17;
 function AssigneeDropdown() {
   var handleSelectChange = function handleSelectChange() {
-    alert('hello');
+    // alert('hello');
+    notification.success({
+      message: 'Success',
+      description: 'Order has been saved successfully.'
+    });
   };
   return React.createElement(FormContainer$2, null, React.createElement(Label$h, {
     label: "Assigned To",
@@ -5755,8 +5809,11 @@ function useFetchSingleReminderData() {
           case 10:
             _json = _context.sent;
             detail = _json == null ? void 0 : _json.detail;
-            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg;
-            alert("" + msg);
+            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg; // alert(`${msg}`);
+            notification.error({
+              message: 'Error',
+              description: "" + msg || 'An error has occurred. Please try again later.'
+            });
             setLoading(false);
             return _context.abrupt("return", []);
           case 16:
@@ -5776,7 +5833,11 @@ function useFetchSingleReminderData() {
             _context.prev = 25;
             _context.t0 = _context["catch"](2);
             //setloading(false);
-            console.error('Error fetching data:', _context.t0);
+            // console.error('Error fetching data:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
             return _context.abrupt("return", []);
           case 29:
           case "end":
@@ -5863,12 +5924,20 @@ function useUpdateReminder() {
             return response.json();
           case 11:
             json = _context.sent;
-            alert('Reminder has been updated');
+            // alert('Reminder has been updated');
+            notification.success({
+              message: 'Success',
+              description: 'Reminder has been updated'
+            });
             return _context.abrupt("return", json);
           case 16:
             _context.prev = 16;
             _context.t0 = _context["catch"](2);
-            console.error('Error:', _context.t0);
+            // console.error('Error:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
           case 19:
             _context.prev = 19;
             setLoading(false);
@@ -5932,8 +6001,11 @@ function useFetchReminders() {
           case 9:
             _json = _context.sent;
             detail = _json == null ? void 0 : _json.detail;
-            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg;
-            console.error('Error response:', msg);
+            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg; // console.error('Error response:', msg);
+            notification.error({
+              message: 'Error',
+              description: "" + msg || 'An error has occurred. Please try again later.'
+            });
             // setLoading(false);
             return _context.abrupt("return", []);
           case 14:
@@ -5953,7 +6025,11 @@ function useFetchReminders() {
           case 23:
             _context.prev = 23;
             _context.t0 = _context["catch"](1);
-            console.error('Error fetching data:', _context.t0);
+            // console.error('Error fetching data:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
             return _context.abrupt("return", []);
           case 27:
             _context.prev = 27;
@@ -6216,7 +6292,14 @@ var CustomSwitchSelector = function CustomSwitchSelector(_ref) {
     if (typeof selectedOptionValue === 'string') {
       onSwitchChange(selectedOptionValue);
     } else {
-      console.error('Unexpected type for selectedOptionValue:', typeof selectedOptionValue);
+      // console.error(
+      //   'Unexpected type for selectedOptionValue:',
+      //   typeof selectedOptionValue
+      // );
+      notification.error({
+        message: 'Error',
+        description: "" + typeof selectedOptionValue || 'Unexpected type for selectedOptionValue.'
+      });
     }
   };
   return React.createElement(StyledSwitch, null, React.createElement(SwitchSelector, {
@@ -6666,7 +6749,11 @@ function useCreateTask() {
             setLoading(false);
             throw new Error('response is not ok');
           case 10:
-            alert('Task Created Successfully');
+            // alert('Task Created Successfully');
+            notification.success({
+              message: 'Success',
+              description: 'Task Created Successfully'
+            });
             _context.next = 13;
             return response.json();
           case 13:
@@ -6676,19 +6763,23 @@ function useCreateTask() {
             _context.prev = 17;
             _context.t0 = _context["catch"](2);
             setLoading(false);
-            alert(_context.t0);
-            console.error('Error:', _context.t0);
-          case 22:
-            _context.prev = 22;
+            // alert(err);
+            // console.error('Error:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
+          case 21:
+            _context.prev = 21;
             setLoading(false);
-            return _context.finish(22);
-          case 25:
+            return _context.finish(21);
+          case 24:
             setLoading(false);
-          case 26:
+          case 25:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[2, 17, 22, 25]]);
+      }, _callee, null, [[2, 17, 21, 24]]);
     }));
     return function create(_x) {
       return _ref.apply(this, arguments);
@@ -6726,9 +6817,17 @@ function useCreateReminder() {
             response = _context.sent;
             if (!response.ok) {
               setLoading(false);
-              alert('response is not ok');
+              // alert('response is not ok');
+              notification.error({
+                message: 'Error',
+                description: 'response is not ok'
+              });
             }
-            alert('Reminder Created Successfully');
+            // alert('Reminder Created Successfully');
+            notification.success({
+              message: 'Success',
+              description: 'Reminder Created Successfully'
+            });
             _context.next = 11;
             return response.json();
           case 11:
@@ -6738,19 +6837,23 @@ function useCreateReminder() {
             _context.prev = 15;
             _context.t0 = _context["catch"](2);
             setLoading(false);
-            alert(_context.t0);
-            console.error('Error:', _context.t0);
-          case 20:
-            _context.prev = 20;
+            // alert(err);
+            // console.error('Error:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
+          case 19:
+            _context.prev = 19;
             setLoading(false);
-            return _context.finish(20);
-          case 23:
+            return _context.finish(19);
+          case 22:
             setLoading(false);
-          case 24:
+          case 23:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[2, 15, 20, 23]]);
+      }, _callee, null, [[2, 15, 19, 22]]);
     }));
     return function create(_x) {
       return _ref.apply(this, arguments);
@@ -6805,8 +6908,11 @@ function useFetchUnresolvedTasks() {
           case 9:
             _json = _context.sent;
             detail = _json == null ? void 0 : _json.detail;
-            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg;
-            console.error('Error response:', msg);
+            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg; // console.error('Error response:', msg);
+            notification.error({
+              message: 'Error',
+              description: "" + msg || 'An error has occurred. Please try again later.'
+            });
             setLoading(false);
             return _context.abrupt("return", []);
           case 15:
@@ -6826,7 +6932,11 @@ function useFetchUnresolvedTasks() {
           case 25:
             _context.prev = 25;
             _context.t0 = _context["catch"](1);
-            console.error('Error fetching data:', _context.t0);
+            // console.error('Error fetching data:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
             setLoading(false);
             return _context.abrupt("return", []);
           case 30:
@@ -7058,13 +7168,21 @@ function useUpdateOrder() {
             return response.json();
           case 13:
             json = _context.sent;
-            alert('Order has been updated');
+            // alert('Order has been updated');
+            notification.success({
+              message: 'Success',
+              description: 'Order has been updated.'
+            });
             return _context.abrupt("return", json);
           case 18:
             _context.prev = 18;
             _context.t0 = _context["catch"](4);
             //   setLoading(false);
-            console.log(_context.t0, 'error');
+            // console.log(err, 'error');
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
           case 21:
             _context.prev = 21;
             return _context.finish(21);
@@ -7172,12 +7290,20 @@ function useUpdateFlag() {
             return response.json();
           case 11:
             json = _context.sent;
-            alert('Flag has been updated');
+            // alert('Flag has been updated');
+            notification.success({
+              message: 'Success',
+              description: 'Flag has been updated'
+            });
             return _context.abrupt("return", json);
           case 16:
             _context.prev = 16;
             _context.t0 = _context["catch"](2);
-            console.error('Error:', _context.t0);
+            // console.error('Error:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
           case 19:
             _context.prev = 19;
             setLoading(false);
@@ -7509,7 +7635,7 @@ function useFetchSingleFlagsData() {
     loading = _useFlagsLoading[0],
     setLoading = _useFlagsLoading[1];
   var ssoToken = getCookie('id_token');
-  console.log(loading, "loading loading");
+  console.log(loading, 'loading loading');
   var res = /*#__PURE__*/function () {
     var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
       var endpoint, headers, response, _detail$, _json, detail, msg, json;
@@ -7539,8 +7665,11 @@ function useFetchSingleFlagsData() {
           case 9:
             _json = _context.sent;
             detail = _json == null ? void 0 : _json.detail;
-            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg;
-            alert("" + msg);
+            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg; // alert(`${msg}`);
+            notification.error({
+              message: 'Error',
+              description: "" + msg || 'An error has occurred. Please try again later.'
+            });
             setLoading(false);
             return _context.abrupt("return", []);
           case 15:
@@ -7560,7 +7689,11 @@ function useFetchSingleFlagsData() {
             _context.prev = 24;
             _context.t0 = _context["catch"](1);
             setLoading(false);
-            console.error('Error fetching data:', _context.t0);
+            // console.error('Error fetching data:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
             return _context.abrupt("return", []);
           case 29:
           case "end":
@@ -7848,8 +7981,11 @@ function useSystemLogs() {
           case 9:
             _json = _context.sent;
             detail = _json == null ? void 0 : _json.detail;
-            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg;
-            console.error('Error response:', msg);
+            msg = (_detail$ = detail[0]) == null ? void 0 : _detail$.msg; // console.error('Error response:', msg);
+            notification.error({
+              message: 'Error',
+              description: "" + msg || 'An error has occurred. Please try again later.'
+            });
             // setLoading(false);
             return _context.abrupt("return", []);
           case 14:
@@ -7869,7 +8005,11 @@ function useSystemLogs() {
           case 23:
             _context.prev = 23;
             _context.t0 = _context["catch"](1);
-            console.error('Error fetching data:', _context.t0);
+            // console.error('Error fetching data:', err);
+            notification.error({
+              message: 'Error',
+              description: "" + _context.t0 || 'An error has occurred. Please try again later.'
+            });
             return _context.abrupt("return", []);
           case 27:
             _context.prev = 27;
@@ -8185,6 +8325,16 @@ function SelectionFilter() {
   var _useState4 = useState(false),
     isButtonEnabled = _useState4[0],
     setIsButtonEnabled = _useState4[1];
+  var _useReturnPayload = useReturnPayload(),
+    setReturnPayload = _useReturnPayload[1];
+  var _useState5 = useState(),
+    storedAccNumber = _useState5[0],
+    setStoredAccNumber = _useState5[1];
+  var _useState6 = useState(),
+    storedCustomerId = _useState6[0],
+    setStoredCustomerId = _useState6[1];
+  var _useNewReturnPayload = useNewReturnPayload(),
+    setNewPayload = _useNewReturnPayload[1];
   //client options
   var clientOptions = customers == null ? void 0 : customers.map(function (option) {
     var _option$customer_name, _option$customer_name2;
@@ -8192,7 +8342,9 @@ function SelectionFilter() {
       label: (option == null || (_option$customer_name = option.customer_name) == null || (_option$customer_name = _option$customer_name.charAt(0)) == null ? void 0 : _option$customer_name.toUpperCase()) + (option == null || (_option$customer_name2 = option.customer_name) == null ? void 0 : _option$customer_name2.slice(1)),
       value: (option == null ? void 0 : option.id) + "_" + (option == null ? void 0 : option.uuid),
       id: option == null ? void 0 : option.id,
-      uuid: option == null ? void 0 : option.uuid
+      uuid: option == null ? void 0 : option.uuid,
+      account_number: option == null ? void 0 : option.account_number,
+      gsit_customer_id: option == null ? void 0 : option.gsit_customer_id
     };
   });
   var actionTypeOptions = actionType == null ? void 0 : actionType.map(function (option) {
@@ -8210,14 +8362,28 @@ function SelectionFilter() {
   });
   //client change
   var handleSelectChange = function handleSelectChange(value, option) {
+    setNewPayload([]);
     console.log(value, 'value');
     var selectedLabel = option == null ? void 0 : option.label;
     var selectedValue = option == null ? void 0 : option.id;
     var selectedUuids = option == null ? void 0 : option.uuid;
+    var selectAccountNumber = option.account_number;
+    var selectedCustomerId = option.gsit_customer_id;
     setSelectedClient(selectedValue);
     setName(selectedLabel);
     localStorage.setItem('clientName', selectedLabel);
     localStorage.setItem('clientId', selectedValue.toString());
+    localStorage.setItem('account_number', selectAccountNumber);
+    localStorage.setItem('customer_id', selectedCustomerId.toString());
+    var storedAccNo = localStorage.getItem('account_number');
+    var storedCustomerId = localStorage.getItem('customer_id');
+    setReturnPayload(function (prevState) {
+      return _extends({}, prevState, {
+        account_number: storedAccNo,
+        customer_id: storedCustomerId
+      });
+    });
+    console.log(selectedUuids, 'selectedUuids');
     var filteredSubLocations = locationData == null ? void 0 : locationData.filter(function (subCat) {
       return (subCat == null ? void 0 : subCat.customer_id) === selectedUuids;
     }).map(function (subCat) {
@@ -8229,6 +8395,24 @@ function SelectionFilter() {
     setFilteredLocationOptions(filteredSubLocations);
     setUuid('');
   };
+  useEffect(function () {
+    var accountNumberFromStorage = localStorage.getItem('account_number');
+    var customerIdFromStorage = localStorage.getItem('customer_id');
+    if (accountNumberFromStorage) {
+      setStoredAccNumber(accountNumberFromStorage);
+    }
+    if (customerIdFromStorage) {
+      setStoredCustomerId(customerIdFromStorage);
+    }
+    if (storedAccNumber && storedCustomerId) {
+      setReturnPayload(function (prevState) {
+        return _extends({}, prevState, {
+          account_number: storedAccNumber,
+          customer_id: storedCustomerId
+        });
+      });
+    }
+  }, [storedAccNumber, storedCustomerId]);
   useEffect(function () {}, [getUuid, filteredLocationOptions]);
   //location change
   var handleLocationChange = function handleLocationChange(value, option) {
@@ -8293,6 +8477,7 @@ function SelectionFilter() {
       setIsButtonEnabled(false);
     }
   }, [storedName, selectedFilterValue, selectedLocationValue]);
+  console.log(filteredLocationOptions, 'filteredLocationOptions');
   console.log('check', storedName, selectedFilterValue, selectedLocationValue);
   return React.createElement(Wrapper$k, null, React.createElement(FilterRow, null, React.createElement(LeftColumn, null, React.createElement(FilterColumn, null, React.createElement(Label$g, null, "Clients"), React.createElement(StyledAntSelect$5, {
     options: clientOptions,
@@ -8377,7 +8562,7 @@ function HeaderFilter() {
     if (fetchedStaticData && fetchedStaticData != null && fetchedStaticData.data) {
       var _fetchedStaticData$da;
       setActionType(fetchedStaticData == null || (_fetchedStaticData$da = fetchedStaticData.data) == null ? void 0 : _fetchedStaticData$da.flatMap(function (i) {
-        return i.order_contact_action_type;
+        return i == null ? void 0 : i.order_product_return_action;
       }));
     }
   }, [actionLoading, fetchedStaticData]);
@@ -8391,7 +8576,7 @@ function HeaderFilter() {
 
 var _templateObject$1$, _templateObject4$v, _templateObject5$k, _templateObject7$d, _templateObject8$8;
 //Left side
-var LeftSideConatiner = /*#__PURE__*/styled.div(_templateObject$1$ || (_templateObject$1$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 1px 5px 1px 1.1px;\n  align-items: center;\n  gap: 10px;\n  border-radius: 40px;\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  background: var(--Flowkit-White, #fff);\n\n  .filtercontainer {\n    display: flex;\n    padding: 8px 8px 8px 4px;\n    align-items: center;\n    gap: 4px;\n    align-self: stretch;\n    border-radius: 20px 0px 0px 20px;\n    border-right: 1px solid rgba(0, 0, 0, 0.04);\n    background: var(--BjsColor-Bg-F0F2F2, #f0f2f2);\n\n    .filtericon {\n      display: flex;\n      padding: 7px 0px 5px 5px;\n      align-items: flex-start;\n      gap: 10px;\n      border-radius: 30px;\n    }\n    .textcont {\n      color: #758588;\n      text-align: center;\n      font-size: 14px;\n      font-style: normal;\n      font-weight: 500;\n      line-height: normal;\n    }\n  }\n  .datefilter {\n    display: flex;\n    height: 36px;\n    padding: 6px 8px;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    border-radius: 20px;\n    border: 1px solid var(--tonal-brown-10, #edebe8);\n\n    .dateiconcontainer {\n      display: flex;\n      width: 24px;\n      height: 24px;\n      padding: 5px;\n      flex-direction: column;\n      justify-content: center;\n      align-items: center;\n      border-radius: 20px;\n      border: 1px solid var(--tonal-brown-101, #e2e0db);\n      background: #f1f5f6;\n    }\n    .datetext {\n      color: #6a7378;\n\n      /* body/captions */\n      font-family: 'Lato';\n      font-size: 13px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 16px; /* 123.077% */\n    }\n    .roundbox {\n      display: flex;\n      width: 18px;\n      height: 18px;\n      flex-direction: column;\n      justify-content: center;\n      align-items: center;\n      border-radius: 18px;\n      background: #fff;\n      box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1);\n    }\n  }\n"])));
+var LeftSideConatiner = /*#__PURE__*/styled.div(_templateObject$1$ || (_templateObject$1$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 1px 5px 1px 1.1px;\n  align-items: center;\n  gap: 10px;\n  border-radius: 40px;\n  border: 1px solid rgba(0, 0, 0, 0.08);\n  background: var(--Flowkit-White, #fff);\n\n  .filtercontainer {\n    display: flex;\n    padding: 8px 8px 8px 4px;\n    align-items: center;\n    gap: 4px;\n    align-self: stretch;\n    border-radius: 20px 0px 0px 20px;\n    border-right: 1px solid rgba(0, 0, 0, 0.04);\n    background: var(--BjsColor-Bg-F0F2F2, #f0f2f2);\n\n    .filtericon {\n      display: flex;\n      padding: 7px 0px 5px 5px;\n      align-items: flex-start;\n      gap: 10px;\n      border-radius: 30px;\n    }\n    .textcont {\n      color: #758588;\n      text-align: center;\n      font-size: 14px;\n      font-style: normal;\n      font-weight: 500;\n      line-height: normal;\n    }\n  }\n  .datefilter {\n    display: flex;\n    height: 36px;\n    padding: 6px 8px;\n    justify-content: center;\n    align-items: center;\n    gap: 2px;\n    border-radius: 20px;\n    border: 1px solid #edebe8;\n\n    .dateiconcontainer {\n      display: flex;\n      width: 24px;\n      height: 24px;\n      padding: 5px;\n      flex-direction: column;\n      justify-content: center;\n      align-items: center;\n      border-radius: 20px;\n      border: 1px solid var(--tonal-brown-101, #e2e0db);\n      background: #f1f5f6;\n    }\n    .datetext {\n      color: #6a7378;\n\n      /* body/captions */\n      font-family: 'Lato';\n      font-size: 13px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 16px; /* 123.077% */\n    }\n  }\n"])));
 //
 var StyledFiter = /*#__PURE__*/styled.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
 var StyledFIlterELements = /*#__PURE__*/styled.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 0;\n  gap: 10px;\n  align-items: center;\n"])));
@@ -8461,8 +8646,8 @@ var IconText = /*#__PURE__*/styled.div(_templateObject5$l || (_templateObject5$l
 
 var ReturnFilter = function ReturnFilter() {
   var _useParams = useParams(),
-    selectedClient = _useParams.selectedClient;
-  return React.createElement(React.Fragment, null, React.createElement(StyledFiter, null, React.createElement(Text$7, null, " ", selectedClient), React.createElement(StyledFIlterELements, null, React.createElement(StyledTableFilter, null)), React.createElement(RightFilters, null)));
+    clientName = _useParams.clientName;
+  return React.createElement(React.Fragment, null, React.createElement(StyledFiter, null, React.createElement(Text$7, null, " ", clientName), React.createElement(StyledFIlterELements, null, React.createElement(StyledTableFilter, null)), React.createElement(RightFilters, null)));
 };
 
 var _templateObject$22, _templateObject2$1s, _templateObject3$P, _templateObject4$x, _templateObject34;
@@ -8681,6 +8866,14 @@ var ReturnOrderTable = function ReturnOrderTable(_ref) {
   var _usePrintOptionTOggle = usePrintOptionTOggle(),
     printToogle = _usePrintOptionTOggle[0],
     setPrintToggle = _usePrintOptionTOggle[1];
+  var _useReturnPayload = useReturnPayload(),
+    createReturn = _useReturnPayload[0],
+    setReturnPayload = _useReturnPayload[1];
+  var _useNewReturnPayload = useNewReturnPayload(),
+    newpayload = _useNewReturnPayload[0],
+    setNewPayload = _useNewReturnPayload[1];
+  var _useGroupedPayload = useGroupedPayload(),
+    setGrouped = _useGroupedPayload[1];
   var OpenDropDown = function OpenDropDown(index) {
     setPrintToggle(function (prevIndex) {
       return prevIndex === index ? null : index;
@@ -8715,36 +8908,104 @@ var ReturnOrderTable = function ReturnOrderTable(_ref) {
   var handleSelectAll = function handleSelectAll(e) {
     setSelectAll(e.target.checked);
     if (e.target.checked) {
-      setSelectedReturnOrder(returnData.map(function (invoice) {
+      setSelectedReturnOrder(returnData == null ? void 0 : returnData.map(function (loc) {
+        var _loc$return_locations;
         return {
-          id: invoice.id,
-          status_id: 3
+          id: loc.id,
+          return_locations: loc == null ? void 0 : loc.return_locations,
+          return_location: loc == null ? void 0 : loc.return_location,
+          products: loc.id,
+          order_product_return_action: loc == null ? void 0 : loc.order_product_return_action,
+          return_location_token: loc == null || (_loc$return_locations = loc.return_locations) == null ? void 0 : _loc$return_locations.token
+        };
+      }));
+      setNewPayload(returnData == null ? void 0 : returnData.map(function (loc) {
+        var _loc$order_product_re, _loc$return_locations2;
+        return {
+          id: loc.id,
+          account_number: createReturn == null ? void 0 : createReturn.account_number,
+          customer_id: createReturn == null ? void 0 : createReturn.customer_id,
+          products: loc.id,
+          return_action: (loc == null || (_loc$order_product_re = loc.order_product_return_action) == null ? void 0 : _loc$order_product_re.type) || null,
+          return_location_token: loc == null || (_loc$return_locations2 = loc.return_locations) == null ? void 0 : _loc$return_locations2.token
         };
       }));
     } else {
       setSelectedReturnOrder([]);
     }
   };
-  var handleSelectInvoice = function handleSelectInvoice(id) {
-    setSelectedReturnOrder(function (prevSelectedInvoices) {
-      var isSelected = prevSelectedInvoices == null ? void 0 : prevSelectedInvoices.some(function (invoice) {
-        return invoice.id === id;
+  var handleSelectOrderReturn = function handleSelectOrderReturn(id, return_location, return_locations, order_product_return_action) {
+    setSelectedReturnOrder(function (prevSelectedLocations) {
+      var isSelected = prevSelectedLocations == null ? void 0 : prevSelectedLocations.some(function (loc) {
+        return loc.id === id;
       });
       if (isSelected) {
-        return prevSelectedInvoices.filter(function (invoice) {
-          return invoice.id !== id;
+        var updatedSelectedLocations = prevSelectedLocations.filter(function (loc) {
+          return loc.id !== id;
+        });
+        setReturnPayload(function (prevState) {
+          return _extends({}, prevState, {
+            products: id,
+            return_action: (order_product_return_action == null ? void 0 : order_product_return_action.type) || null,
+            return_location_token: (return_locations == null ? void 0 : return_locations.token) || null
+          });
+        });
+        setNewPayload(function (prevPayload) {
+          return prevPayload.filter(function (item) {
+            return item.id !== id;
+          });
         });
+        return updatedSelectedLocations;
       } else {
-        return [].concat(prevSelectedInvoices, [{
+        var newReturnPayload = {
           id: id,
-          status_id: 3
+          account_number: createReturn == null ? void 0 : createReturn.account_number,
+          customer_id: createReturn == null ? void 0 : createReturn.customer_id,
+          products: id,
+          return_action: (order_product_return_action == null ? void 0 : order_product_return_action.type) || null,
+          return_location_token: (return_locations == null ? void 0 : return_locations.token) || null
+        };
+        setNewPayload(function (prevPayload) {
+          return [].concat(prevPayload, [newReturnPayload]);
+        });
+        setReturnPayload(function (prevState) {
+          return _extends({}, prevState, {
+            products: id,
+            return_action: (order_product_return_action == null ? void 0 : order_product_return_action.type) || null,
+            return_location_token: (return_locations == null ? void 0 : return_locations.token) || null
+          });
+        });
+        return [].concat(prevSelectedLocations, [{
+          id: id,
+          return_location: return_location,
+          return_locations: return_locations,
+          order_product_return_action: order_product_return_action
         }]);
       }
     });
   };
-  return React.createElement(React.Fragment, null, React.createElement(StyledTableWrapper, {
-    id: "tableScrolling"
-  }, React.createElement(StyledTable, null, React.createElement("thead", null, React.createElement("tr", null, React.createElement("th", {
+  useEffect(function () {
+    if ((newpayload == null ? void 0 : newpayload.length) === 0) return;
+    var groupedPayload = newpayload == null ? void 0 : newpayload.reduce(function (acc, item) {
+      var return_location_token = item.return_location_token;
+      if (!return_location_token) {
+        acc.push(item);
+      } else {
+        if (!acc[return_location_token]) {
+          acc[return_location_token] = _extends({}, item, {
+            products: [],
+            return_action: []
+          });
+        }
+        acc[return_location_token].products = [].concat(acc[return_location_token].products, item.products);
+        acc[return_location_token].return_action = [].concat(acc[return_location_token].return_action, item.return_action);
+      }
+      return acc;
+    }, []);
+    var mergedPayload = Object.values(groupedPayload);
+    setGrouped(mergedPayload);
+  }, [newpayload]);
+  return React.createElement(React.Fragment, null, React.createElement(StyledTableWrapper, null, React.createElement(StyledTable, null, React.createElement("thead", null, React.createElement("tr", null, React.createElement("th", {
     className: "emailInvoiceCheckbox"
   }, React.createElement(Checkbox$1, {
     checked: selectAll,
@@ -8768,7 +9029,7 @@ var ReturnOrderTable = function ReturnOrderTable(_ref) {
         return (selectedInvoice == null ? void 0 : selectedInvoice.id) === item.id;
       }),
       onChange: function onChange() {
-        return handleSelectInvoice(item.id);
+        return handleSelectOrderReturn(item.id, item.return_location, item.return_locations, item.order_product_return_action);
       }
     })), React.createElement("td", null, displayValueOrNA(item == null || (_item$orders_products = item.orders_products_stock) == null ? void 0 : _item$orders_products.location)), React.createElement("td", null, " ", displayValueOrNA(item == null ? void 0 : item.return_location)), React.createElement("td", null, React.createElement("ul", {
       style: {
@@ -9303,161 +9564,7 @@ var ProductAction = function ProductAction() {
 var GLobalPopupContent$4 = /*#__PURE__*/styled.div(_templateObject$2c || (_templateObject$2c = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var Container$1a = /*#__PURE__*/styled.div(_templateObject2$1B || (_templateObject2$1B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  height: 50vh;\n  padding-bottom: 30px;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 20px;\n  align-self: stretch;\n  border-radius: 6px;\n  border: 1px solid #edebe8;\n  padding: 15px;\n  overflow-y: scroll;\n  .ant-tabs {\n    width: 100%;\n  }\n  .ant-tabs-tab-active {\n    .ant-tabs-tab-btn {\n      color: #3a3630 !important;\n      font-family: 'Lato', sans-serif;\n      font-size: 14px;\n      font-style: normal;\n      font-weight: 500;\n    }\n  }\n  .ant-tabs-ink-bar {\n    background: #feba30;\n  }\n"])));
 
-var BarCode = function BarCode() {
-  return React.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "18",
-    height: "18",
-    viewBox: "0 0 18 18",
-    fill: "none"
-  }, React.createElement("path", {
-    d: "M1.5 4.3125C1.5 3.76549 1.7173 3.24089 2.10409 2.85409C2.49089 2.4673 3.01549 2.25 3.5625 2.25H4.6875C4.83668 2.25 4.97976 2.30926 5.08525 2.41475C5.19074 2.52024 5.25 2.66332 5.25 2.8125C5.25 2.96168 5.19074 3.10476 5.08525 3.21025C4.97976 3.31574 4.83668 3.375 4.6875 3.375H3.5625C3.045 3.375 2.625 3.795 2.625 4.3125V5.4375C2.625 5.58668 2.56574 5.72976 2.46025 5.83525C2.35476 5.94074 2.21168 6 2.0625 6C1.91332 6 1.77024 5.94074 1.66475 5.83525C1.55926 5.72976 1.5 5.58668 1.5 5.4375V4.3125ZM12.75 2.8125C12.75 2.66332 12.8093 2.52024 12.9148 2.41475C13.0202 2.30926 13.1633 2.25 13.3125 2.25H14.4375C14.9845 2.25 15.5091 2.4673 15.8959 2.85409C16.2827 3.24089 16.5 3.76549 16.5 4.3125V5.4375C16.5 5.58668 16.4407 5.72976 16.3352 5.83525C16.2298 5.94074 16.0867 6 15.9375 6C15.7883 6 15.6452 5.94074 15.5398 5.83525C15.4343 5.72976 15.375 5.58668 15.375 5.4375V4.3125C15.375 3.795 14.955 3.375 14.4375 3.375H13.3125C13.1633 3.375 13.0202 3.31574 12.9148 3.21025C12.8093 3.10476 12.75 2.96168 12.75 2.8125ZM2.0625 12C2.21168 12 2.35476 12.0593 2.46025 12.1648C2.56574 12.2702 2.625 12.4133 2.625 12.5625V13.6875C2.625 14.205 3.045 14.625 3.5625 14.625H4.6875C4.83668 14.625 4.97976 14.6843 5.08525 14.7898C5.19074 14.8952 5.25 15.0383 5.25 15.1875C5.25 15.3367 5.19074 15.4798 5.08525 15.5852C4.97976 15.6907 4.83668 15.75 4.6875 15.75H3.5625C3.01549 15.75 2.49089 15.5327 2.10409 15.1459C1.7173 14.7591 1.5 14.2345 1.5 13.6875V12.5625C1.5 12.4133 1.55926 12.2702 1.66475 12.1648C1.77024 12.0593 1.91332 12 2.0625 12ZM15.9375 12C16.0867 12 16.2298 12.0593 16.3352 12.1648C16.4407 12.2702 16.5 12.4133 16.5 12.5625V13.6875C16.5 14.2345 16.2827 14.7591 15.8959 15.1459C15.5091 15.5327 14.9845 15.75 14.4375 15.75H13.3125C13.1633 15.75 13.0202 15.6907 12.9148 15.5852C12.8093 15.4798 12.75 15.3367 12.75 15.1875C12.75 15.0383 12.8093 14.8952 12.9148 14.7898C13.0202 14.6843 13.1633 14.625 13.3125 14.625H14.4375C14.955 14.625 15.375 14.205 15.375 13.6875V12.5625C15.375 12.4133 15.4343 12.2702 15.5398 12.1648C15.6452 12.0593 15.7883 12 15.9375 12ZM4.3125 5.25C4.46168 5.25 4.60476 5.30926 4.71025 5.41475C4.81574 5.52024 4.875 5.66332 4.875 5.8125V12.1875C4.875 12.3367 4.81574 12.4798 4.71025 12.5852C4.60476 12.6907 4.46168 12.75 4.3125 12.75C4.16332 12.75 4.02024 12.6907 3.91475 12.5852C3.80926 12.4798 3.75 12.3367 3.75 12.1875V5.8125C3.75 5.66332 3.80926 5.52024 3.91475 5.41475C4.02024 5.30926 4.16332 5.25 4.3125 5.25ZM7.875 5.8125C7.875 5.66332 7.81574 5.52024 7.71025 5.41475C7.60476 5.30926 7.46168 5.25 7.3125 5.25C7.16332 5.25 7.02024 5.30926 6.91475 5.41475C6.80926 5.52024 6.75 5.66332 6.75 5.8125V12.1875C6.75 12.3367 6.80926 12.4798 6.91475 12.5852C7.02024 12.6907 7.16332 12.75 7.3125 12.75C7.46168 12.75 7.60476 12.6907 7.71025 12.5852C7.81574 12.4798 7.875 12.3367 7.875 12.1875V5.8125ZM10.3125 5.25C10.4617 5.25 10.6048 5.30926 10.7102 5.41475C10.8157 5.52024 10.875 5.66332 10.875 5.8125V12.1875C10.875 12.3367 10.8157 12.4798 10.7102 12.5852C10.6048 12.6907 10.4617 12.75 10.3125 12.75C10.1633 12.75 10.0202 12.6907 9.91475 12.5852C9.80926 12.4798 9.75 12.3367 9.75 12.1875V5.8125C9.75 5.66332 9.80926 5.52024 9.91475 5.41475C10.0202 5.30926 10.1633 5.25 10.3125 5.25ZM13.875 5.8125C13.875 5.66332 13.8157 5.52024 13.7102 5.41475C13.6048 5.30926 13.4617 5.25 13.3125 5.25C13.1633 5.25 13.0202 5.30926 12.9148 5.41475C12.8093 5.52024 12.75 5.66332 12.75 5.8125V12.1875C12.75 12.3367 12.8093 12.4798 12.9148 12.5852C13.0202 12.6907 13.1633 12.75 13.3125 12.75C13.4617 12.75 13.6048 12.6907 13.7102 12.5852C13.8157 12.4798 13.875 12.3367 13.875 12.1875V5.8125Z",
-    fill: "#3A3630",
-    fillOpacity: "0.8"
-  }));
-};
-
-var WeightIcon = function WeightIcon() {
-  return React.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "18",
-    height: "18",
-    viewBox: "0 0 18 18",
-    fill: "none"
-  }, React.createElement("path", {
-    d: "M9 2.25C9.79565 2.25 10.5587 2.56607 11.1213 3.12868C11.6839 3.69129 12 4.45435 12 5.25C12 5.7975 11.8575 6.3075 11.595 6.75H13.5C14.2125 6.75 14.8125 7.2525 14.9625 7.92C16.47 13.9275 16.5 14.085 16.5 14.25C16.5 14.6478 16.342 15.0294 16.0607 15.3107C15.7794 15.592 15.3978 15.75 15 15.75H3C2.60218 15.75 2.22064 15.592 1.93934 15.3107C1.65804 15.0294 1.5 14.6478 1.5 14.25C1.5 14.085 1.53 13.9275 3.0375 7.92C3.1875 7.2525 3.7875 6.75 4.5 6.75H6.405C6.13724 6.29565 5.99731 5.77737 6 5.25C6 4.45435 6.31607 3.69129 6.87868 3.12868C7.44129 2.56607 8.20435 2.25 9 2.25ZM9 3.75C8.60218 3.75 8.22064 3.90804 7.93934 4.18934C7.65804 4.47064 7.5 4.85218 7.5 5.25C7.5 5.64782 7.65804 6.02936 7.93934 6.31066C8.22064 6.59196 8.60218 6.75 9 6.75C9.39782 6.75 9.77936 6.59196 10.0607 6.31066C10.342 6.02936 10.5 5.64782 10.5 5.25C10.5 4.85218 10.342 4.47064 10.0607 4.18934C9.77936 3.90804 9.39782 3.75 9 3.75ZM4.5 8.25V14.25H6V12.375L6.75 13.125V14.25H8.25V12.75L6.75 11.25L8.25 9.75V8.25H6.75V9.375L6 10.125V8.25H4.5ZM11.25 8.25C10.4175 8.25 9.75 8.9175 9.75 9.75V12.75C9.75 13.5825 10.4175 14.25 11.25 14.25H13.5V10.5H12V12.75H11.25V9.75H13.5V8.25H11.25Z",
-    fill: "#3A3630",
-    fillOpacity: "0.6"
-  }));
-};
-
-var CbmIcon = function CbmIcon() {
-  return React.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "18",
-    height: "18",
-    viewBox: "0 0 18 18",
-    fill: "none"
-  }, React.createElement("path", {
-    d: "M13.4213 2.66475C13.3589 2.54013 13.2631 2.43533 13.1446 2.36208C13.026 2.28883 12.8894 2.25002 12.75 2.25H5.25005C4.9658 2.25 4.7063 2.4105 4.5788 2.66475L1.5788 8.66475C1.52666 8.76895 1.49951 8.88386 1.49951 9.00037C1.49951 9.11689 1.52666 9.2318 1.5788 9.336L4.5788 15.336C4.7063 15.5895 4.9658 15.75 5.25005 15.75H12.75C13.0343 15.75 13.2938 15.5895 13.4213 15.3353L16.4213 9.33525C16.4734 9.23105 16.5006 9.11614 16.5006 8.99963C16.5006 8.88311 16.4734 8.7682 16.4213 8.664L13.4213 2.66475ZM14.5365 8.25H8.71355L6.46355 3.75H12.2865L14.5365 8.25ZM3.08855 9L5.25005 4.677L7.41155 9L5.25005 13.323L3.08855 9ZM12.2865 14.25H6.46355L8.71355 9.75H14.5365L12.2865 14.25Z",
-    fill: "#3A3630",
-    fillOpacity: "0.6"
-  }));
-};
-
-var _templateObject$2d, _templateObject2$1C;
-var AddProduct = function AddProduct() {
-  var _orderStaticData$orde;
-  var _useCreateOrderProduc = useCreateOrderProducts(),
-    orderProduct = _useCreateOrderProduc[0],
-    setOrderProduct = _useCreateOrderProduc[1];
-  var _useOrderStaticData = useOrderStaticData(),
-    orderStaticData = _useOrderStaticData[0];
-  var typeOptions = orderStaticData == null || (_orderStaticData$orde = orderStaticData.order_product_type) == null ? void 0 : _orderStaticData$orde.map(function (option) {
-    return {
-      label: option == null ? void 0 : option.type,
-      value: option == null ? void 0 : option.id
-    };
-  });
-  var handleInputChange = function handleInputChange(index, field, value) {
-    setOrderProduct(function (prevProducts) {
-      var _extends2;
-      var newProducts = [].concat(prevProducts);
-      newProducts[index] = _extends({}, newProducts[index], (_extends2 = {}, _extends2[field] = value, _extends2));
-      return newProducts;
-    });
-  };
-  var onSelectChange = function onSelectChange(index, value) {
-    handleInputChange(index, 'product_type_id', +value);
-  };
-  var onSearch = function onSearch(value) {
-    console.log('search item value:', value);
-  };
-  return React.createElement(GLobalPopupContent$5, null, React.createElement(SimpleTable, null, React.createElement("table", null, React.createElement("thead", null, React.createElement("tr", null, React.createElement("th", null, "Product Type"), React.createElement("th", {
-    style: {
-      width: '130px'
-    }
-  }, React.createElement("span", null, "Code ", React.createElement("em", null, "*"))), React.createElement("th", {
-    style: {
-      width: '33%'
-    }
-  }, React.createElement("span", null, "Description ", React.createElement("em", null, "*"))), React.createElement("th", null, "Barcode"), React.createElement("th", {
-    style: {
-      width: '120px'
-    }
-  }, "Weight"), React.createElement("th", {
-    style: {
-      width: '120px'
-    }
-  }, "CBM"))), React.createElement("tbody", null, orderProduct.length > 0 && (orderProduct == null ? void 0 : orderProduct.map(function (item, index) {
-    return React.createElement("tr", {
-      key: index
-    }, React.createElement("td", null, React.createElement(AntSelect, {
-      options: typeOptions,
-      placeholder: "Deliver",
-      onChange: function onChange(value) {
-        return onSelectChange(index, value);
-      },
-      disabled: false,
-      style: {
-        width: 120
-      },
-      onSearch: onSearch,
-      showSearch: true,
-      popupClassName: 'dropDownStyle',
-      selectWrapperClass: ''
-    })), React.createElement("td", null, React.createElement("div", {
-      className: "inputWrap"
-    }, React.createElement("input", {
-      type: "text",
-      placeholder: "code",
-      value: item.code,
-      onChange: function onChange(e) {
-        return handleInputChange(index, 'code', e.target.value);
-      }
-    }))), React.createElement("td", null, React.createElement("div", {
-      className: "inputWrap"
-    }, React.createElement("input", {
-      type: "text",
-      placeholder: "Enter Description of Product",
-      value: item.description,
-      onChange: function onChange(e) {
-        return handleInputChange(index, 'description', e.target.value);
-      }
-    }))), React.createElement("td", null, React.createElement("div", {
-      className: "inputWrap"
-    }, React.createElement("input", {
-      type: "text",
-      placeholder: "Enter barcode of product",
-      value: item.sku,
-      onChange: function onChange(e) {
-        return handleInputChange(index, 'sku', e.target.value);
-      }
-    }), React.createElement(BarCode, null))), React.createElement("td", null, React.createElement("div", {
-      className: "inputWrap"
-    }, React.createElement("input", {
-      type: "text",
-      placeholder: "00.00",
-      value: item.weight,
-      onChange: function onChange(e) {
-        return handleInputChange(index, 'weight', parseFloat(e.target.value));
-      }
-    }), React.createElement(WeightIcon, null))), React.createElement("td", null, React.createElement("div", {
-      className: "inputWrap"
-    }, React.createElement("input", {
-      type: "text",
-      placeholder: "00.00",
-      value: item.cube,
-      onChange: function onChange(e) {
-        return handleInputChange(index, 'cube', parseFloat(e.target.value));
-      }
-    }), React.createElement(CbmIcon, null))));
-  }))))));
-};
-var GLobalPopupContent$5 = /*#__PURE__*/styled.div(_templateObject$2d || (_templateObject$2d = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var SimpleTable = /*#__PURE__*/styled.div(_templateObject2$1C || (_templateObject2$1C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0 15px;\n  min-height: 158px;\n  table {\n    border-spacing: 0px 12px;\n    border-collapse: separate;\n    thead {\n      tr {\n        th {\n          padding: 0 10px 0;\n          color: #6a7378;\n          font-size: 14px;\n          font-style: normal;\n          font-weight: 500;\n          line-height: 20px;\n          text-align: left;\n          span {\n            position: relative;\n            em {\n              color: #fc5555;\n              font-style: normal;\n            }\n          }\n        }\n      }\n    }\n    tbody {\n      tr {\n        td {\n          padding: 10px 8px;\n          background: #f8fafc;\n          box-shadow: 5px 1px 5px 0px rgba(16, 24, 40, 0.1);\n\n          .inputWrap {\n            position: relative;\n            input[type='text'] {\n              border-radius: 6px;\n              border: 1px solid #e0e2e7;\n              background: #fff;\n              box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\n              padding: 8px 10px;\n              width: 100%;\n              padding-right: 30px;\n              &:focus-visible {\n                outline: none;\n              }\n            }\n            svg {\n              position: absolute;\n              right: 11px;\n              top: 7px;\n            }\n          }\n          &:first-child {\n            border-radius: 5px 0 0 5px;\n          }\n          &:last-child {\n            border-radius: 0 5px 5px 0;\n          }\n        }\n      }\n    }\n  }\n"])));
-
-var _templateObject$2e;
+var _templateObject$2d;
 var LogsTable = function LogsTable() {
   var options = [{
     value: 'bjsCouriers',
@@ -9532,9 +9639,9 @@ var LogsTable = function LogsTable() {
     }
   })));
 };
-var GlobalPopupContent = /*#__PURE__*/styled.div(_templateObject$2e || (_templateObject$2e = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var GlobalPopupContent = /*#__PURE__*/styled.div(_templateObject$2d || (_templateObject$2d = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 
-var _templateObject$2f, _templateObject2$1D;
+var _templateObject$2e, _templateObject2$1C;
 var DefectsModal = function DefectsModal() {
   var options = [{
     value: 'bjsCouriers',
@@ -9577,7 +9684,7 @@ var DefectsModal = function DefectsModal() {
     key: 'images',
     title: 'Images'
   }];
-  return React.createElement(React.Fragment, null, React.createElement(GLobalPopupContent$6, null, React.createElement(StyledConatiner, null, React.createElement(AntTable, {
+  return React.createElement(React.Fragment, null, React.createElement(GLobalPopupContent$5, null, React.createElement(StyledConatiner, null, React.createElement(AntTable, {
     columns: columns,
     data: DefectsData,
     selectOptions: options,
@@ -9586,10 +9693,10 @@ var DefectsModal = function DefectsModal() {
     }
   }))));
 };
-var StyledConatiner = /*#__PURE__*/styled.div(_templateObject$2f || (_templateObject$2f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* tex: nowrap; */\n"])));
-var GLobalPopupContent$6 = /*#__PURE__*/styled.div(_templateObject2$1D || (_templateObject2$1D = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var StyledConatiner = /*#__PURE__*/styled.div(_templateObject$2e || (_templateObject$2e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* tex: nowrap; */\n"])));
+var GLobalPopupContent$5 = /*#__PURE__*/styled.div(_templateObject2$1C || (_templateObject2$1C = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 
-var _templateObject$2g;
+var _templateObject$2f;
 var repackModal = function repackModal() {
   var columns = [{
     key: 'packaging_type',
@@ -9619,28 +9726,24 @@ var repackModal = function repackModal() {
     }
   }))));
 };
-var StyledConatiner$1 = /*#__PURE__*/styled.div(_templateObject$2g || (_templateObject$2g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* text-wrap: nowrap; */\n"])));
+var StyledConatiner$1 = /*#__PURE__*/styled.div(_templateObject$2f || (_templateObject$2f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  /* text-wrap: nowrap; */\n"])));
 
-var _templateObject$2h, _templateObject2$1E, _templateObject3$X;
+var _templateObject$2g, _templateObject2$1D, _templateObject3$X;
 var CreateReturnModal = function CreateReturnModal() {
-  var _useState = useState(),
+  var _useState = useState([]),
+    selectedlocation = _useState[0],
     setSelectedLocations = _useState[1];
-  var _useLocationData = useLocationData(),
-    locationData = _useLocationData[0];
+  var _useSelectedOrders = useSelectedOrders(),
+    selectedReturnOrder = _useSelectedOrders[0];
   var handleSelectLocations = function handleSelectLocations(id) {
     setSelectedLocations(function (prevSelectedLocations) {
-      var isSelected = prevSelectedLocations == null ? void 0 : prevSelectedLocations.some(function (location) {
-        return location.id === id;
-      });
+      var isSelected = prevSelectedLocations.includes(id);
       if (isSelected) {
-        return prevSelectedLocations.filter(function (invoice) {
-          return invoice.id !== id;
+        return prevSelectedLocations.filter(function (selectedId) {
+          return selectedId !== id;
         });
       } else {
-        return [].concat(prevSelectedLocations, [{
-          id: id,
-          status_id: 3
-        }]);
+        return [].concat(prevSelectedLocations, [id]);
       }
     });
   };
@@ -9655,38 +9758,38 @@ var CreateReturnModal = function CreateReturnModal() {
       listStyle: 'none',
       padding: 0
     }
-  }, locationData == null ? void 0 : locationData.map(function (invoice) {
+  }, selectedReturnOrder == null ? void 0 : selectedReturnOrder.map(function (returnLoc) {
     return React.createElement("li", {
-      key: invoice.id,
+      key: returnLoc.id,
       style: {
         marginBottom: '8px',
         display: 'flex',
         alignItems: 'center'
       }
     }, React.createElement(Checkbox$1, {
-      checked: true,
+      checked: selectedlocation.includes(returnLoc.id),
       onChange: function onChange() {
-        return handleSelectLocations(invoice.id);
+        return handleSelectLocations(returnLoc.id);
       }
     }), React.createElement(StyledText$1, {
       style: {
         marginLeft: '8px'
       }
-    }, invoice.location_name));
+    }, returnLoc == null ? void 0 : returnLoc.return_location));
   }))));
 };
-var StyledText$1 = /*#__PURE__*/styled.div(_templateObject$2h || (_templateObject$2h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #8d8f90;\n  font-family: Poppins;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n"])));
-var Container$1b = /*#__PURE__*/styled.div(_templateObject2$1E || (_templateObject2$1E = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var StyledText$1 = /*#__PURE__*/styled.div(_templateObject$2g || (_templateObject$2g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: #8d8f90;\n  font-family: Poppins;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n"])));
+var Container$1b = /*#__PURE__*/styled.div(_templateObject2$1D || (_templateObject2$1D = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var Wrapper$l = /*#__PURE__*/styled.div(_templateObject3$X || (_templateObject3$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 15px;\n  flex-direction: column;\n  justify-content: center;\n  align-items: flex-start;\n  gap: 15px;\n  align-self: stretch;\n  border-radius: 8px;\n  background: #f8fafc;\n  box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1);\n"])));
 
+var _excluded$2 = ["id"];
 var ModalManager = function ModalManager() {
   var _useAtom = useAtom(countReducerAtom),
     popupName = _useAtom[0],
     dispatch = _useAtom[1];
   var _useProductDetails = useProductDetails();
   var _useCreateOrderProduc = useCreateOrderProducts(),
-    orderProduct = _useCreateOrderProduc[0],
-    setOrderProduct = _useCreateOrderProduc[1];
+    orderProduct = _useCreateOrderProduc[0];
   var _useOrderId = useOrderId(),
     orderId = _useOrderId[0];
   var _useDeleteProdsID = useDeleteProdsID(),
@@ -9703,6 +9806,9 @@ var ModalManager = function ModalManager() {
     selectedTab = _useAtom3[0];
   var _useState = useState(false),
     setIsFormValid = _useState[1];
+  var _useNewReturnPayload = useNewReturnPayload(),
+    newPayload = _useNewReturnPayload[0],
+    setNewPayload = _useNewReturnPayload[1];
   console.log(orderProduct, 'abcabcabcabcabcabcabcabcabcabcabc');
   var _closeModal = function closeModal() {
     dispatch({
@@ -9753,68 +9859,73 @@ var ModalManager = function ModalManager() {
   //   }
   // };
   // API block for creating product order
-  var _useApiHook = useApiHook({
-      endpoint: "order/order_products/create/",
-      method: 'POST',
-      body: [orderProduct],
-      performAction: false
-    }),
-    response = _useApiHook.data,
-    setOrderAction = _useApiHook.setShouldPerformAction;
-  var validateAddForm = function validateAddForm() {
-    if (!Array.isArray(orderProduct)) return false;
-    return orderProduct.every(function (product) {
-      return product.code !== '' && product.description !== '' && product.weight !== 0 && product.cube !== 0 && product.order_product_type_id !== 0 && product.sku !== '';
-    });
-  };
-  useEffect(function () {
-    setAddIsFormValid(validateAddForm());
-  }, [orderProduct]);
-  var onAddOrderProduct = function onAddOrderProduct() {
-    if (isAddFormValid) {
-      setOrderProduct(function (prev) {
-        return prev.map(function (product) {
-          return _extends({}, product, {
-            order_id: orderId
-          });
-        });
-      });
-      setOrderAction(true);
-    } else {
-      console.log('Please fill in all required fields before proceeding.');
-    }
-  };
-  useEffect(function () {
-    if (response && response != null && response.data) {
-      dispatch({
-        type: 'close'
-      });
-    }
-  }, [response]);
-  var _useState2 = useState(false),
-    isAddFormValid = _useState2[0],
-    setAddIsFormValid = _useState2[1];
-  var AddMore = function AddMore() {
-    setOrderProduct(function (prevProducts) {
-      return [].concat(prevProducts, [{
-        code: '',
-        description: '',
-        sku: '',
-        weight: '',
-        cube: '',
-        order_product_type_id: ''
-      }]);
-    });
-  };
+  // const {
+  //   data: response,
+  //   setShouldPerformAction: setOrderAction,
+  // } = useApiHook<{
+  //   data: ApiResponse[];
+  // }>({
+  //   endpoint: `order/order_products/create/`,
+  //   method: 'POST',
+  //   body: [orderProduct],
+  //   performAction: false,
+  // });
+  // const validateAddForm = () => {
+  //   if (!Array.isArray(orderProduct)) return false;
+  //   return orderProduct.every(
+  //     (product: any) =>
+  //       product.code !== '' &&
+  //       product.description !== '' &&
+  //       product.weight !== 0 &&
+  //       product.cube !== 0 &&
+  //       product.order_product_type_id !== 0 &&
+  //       product.sku !== ''
+  //   );
+  // };
+  // useEffect(() => {
+  //   setAddIsFormValid(validateAddForm());
+  // }, [orderProduct]);
+  // const onAddOrderProduct = () => {
+  //   if (isAddFormValid) {
+  //     setOrderProduct((prev: any) =>
+  //       prev.map((product: any) => ({
+  //         ...product,
+  //         order_id: orderId,
+  //       }))
+  //     );
+  //     setOrderAction(true);
+  //   } else {
+  //     console.log('Please fill in all required fields before proceeding.');
+  //   }
+  // };
+  // useEffect(() => {
+  //   if (response && response?.data) {
+  //     dispatch({ type: 'close' });
+  //   }
+  // }, [response]);
+  // const [isAddFormValid, setAddIsFormValid] = useState(false);
+  // const AddMore = () => {
+  //   setOrderProduct((prevProducts: any) => [
+  //     ...prevProducts,
+  //     {
+  //       code: '',
+  //       description: '',
+  //       sku: '',
+  //       weight: '',
+  //       cube: '',
+  //       order_product_type_id: '',
+  //     },
+  //   ]);
+  // };
   // api block for the create product order
-  var _useApiHook2 = useApiHook({
+  var _useApiHook = useApiHook({
       endpoint: "order/order_products/unrecieve/",
       method: 'POST',
       body: [unRecieve],
       performAction: false
     }),
-    actionResponse = _useApiHook2.data,
-    setUnrecieveaction = _useApiHook2.setShouldPerformAction;
+    actionResponse = _useApiHook.data,
+    setUnrecieveaction = _useApiHook.setShouldPerformAction;
   useEffect(function () {
     if (actionResponse && actionResponse != null && actionResponse.data) {
       dispatch({
@@ -9823,14 +9934,14 @@ var ModalManager = function ModalManager() {
     }
   }, [actionResponse]);
   // api block for the update product order
-  var _useApiHook3 = useApiHook({
+  var _useApiHook2 = useApiHook({
       endpoint: "order/order_products/type/update/",
       method: 'PUT',
       body: [updateOrderProduct],
       performAction: false
     }),
-    updateResponse = _useApiHook3.data,
-    setUpdateSction = _useApiHook3.setShouldPerformAction;
+    updateResponse = _useApiHook2.data,
+    setUpdateSction = _useApiHook2.setShouldPerformAction;
   // const onUnrecieveProductOrder = () => {
   //   setUnRecieve((prev: any) => ({
   //     ...prev,
@@ -9869,6 +9980,28 @@ var ModalManager = function ModalManager() {
       });
     }
   }, [updateResponse]);
+  //Confirm return popup
+  var _useApiHook3 = useApiHook({
+      endpoint: "return_orders/",
+      method: 'POST',
+      body: [newPayload],
+      performAction: false
+    }),
+    response = _useApiHook3.data,
+    setShouldPerformAction = _useApiHook3.setShouldPerformAction;
+  var handleConfirmReturn = function handleConfirmReturn() {
+    var payloadWithoutId = newPayload == null ? void 0 : newPayload.map(function (_ref) {
+      var rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
+      return _extends({}, rest);
+    });
+    console.log(response);
+    if (payloadWithoutId) {
+      setNewPayload(payloadWithoutId);
+      setShouldPerformAction(true);
+    } else {
+      setShouldPerformAction(false);
+    }
+  };
   return React.createElement(React.Fragment, null, (popupName == null ? void 0 : popupName.state) == 'create-return' && React.createElement(AntModal, {
     openStatus: (popupName == null ? void 0 : popupName.state) == 'create-return' ? true : false,
     closeModal: function closeModal() {
@@ -9882,37 +10015,15 @@ var ModalManager = function ModalManager() {
       btns: [{
         name: 'Submit',
         btnStyle: 'rounded',
-        type: 'button'
+        onClick: handleConfirmReturn,
+        type: 'button',
+        disabled: !newPayload
       }],
       btnAlign: 'justifyEnd'
     },
     BodyComponent: CreateReturnModal,
     width: 800,
     classNameAdd: 'globalPopup'
-  }), (popupName == null ? void 0 : popupName.state) === 'addProduct' && React.createElement(AntModal, {
-    openStatus: (popupName == null ? void 0 : popupName.state) === 'addProduct',
-    closeModal: _closeModal,
-    PopupHeader: {
-      heading: 'Add Product(s) to Order',
-      subHeading: 'Full Stock Control'
-    },
-    PopupFooter: {
-      btns: [{
-        name: 'Add More Product',
-        btnStyle: 'normalLink',
-        icon: 'addIcon',
-        onClick: AddMore
-      }, {
-        name: 'Save Details',
-        btnStyle: 'rounded',
-        onClick: onAddOrderProduct,
-        disabled: !isAddFormValid
-      }],
-      btnAlign: 'justifySpaceBetween'
-    },
-    BodyComponent: AddProduct,
-    width: 1104,
-    classNameAdd: 'globalPopup'
   }), (popupName == null ? void 0 : popupName.state) === 'qclog' && React.createElement(AntModal, {
     openStatus: (popupName == null ? void 0 : popupName.state) === 'qclog',
     closeModal: _closeModal,
@@ -9985,14 +10096,14 @@ var ModalManager = function ModalManager() {
   }));
 };
 
-var _templateObject$2i, _templateObject2$1F;
+var _templateObject$2h, _templateObject2$1E;
 var ReturnTable = function ReturnTable() {
   return React.createElement("div", null, React.createElement(DashBoardWrapper$1, null, React.createElement(RouterHeader, null), React.createElement("div", {
     className: "Tableconatiner"
   }, React.createElement(HeaderFilter, null), React.createElement(Container$1c, null, React.createElement(ReturnFilter, null), React.createElement(ReturnOrderTable, null)))), React.createElement(ModalManager, null));
 };
-var Container$1c = /*#__PURE__*/styled.div(_templateObject$2i || (_templateObject$2i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  top: -46px;\n"])));
-var DashBoardWrapper$1 = /*#__PURE__*/styled.section(_templateObject2$1F || (_templateObject2$1F = /*#__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 Container$1c = /*#__PURE__*/styled.div(_templateObject$2h || (_templateObject$2h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  top: -46px;\n"])));
+var DashBoardWrapper$1 = /*#__PURE__*/styled.section(_templateObject2$1E || (_templateObject2$1E = /*#__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"])));
 
 function LoadIcon() {
   return React.createElement("svg", {
@@ -10215,7 +10326,7 @@ var OrderTable = function OrderTable(_ref) {
   })))));
 };
 
-var _templateObject$2j, _templateObject2$1G, _templateObject3$Y, _templateObject4$E;
+var _templateObject$2i, _templateObject2$1F, _templateObject3$Y, _templateObject4$E;
 var TableFilters = function TableFilters() {
   return React.createElement(Container$1d, null, React.createElement(StyledBulkItem, null, React.createElement(SearchType, null)), React.createElement(IconConatiner$1, null, React.createElement(Mid$1, null, React.createElement(IconText$1, null, "Export"), React.createElement(DownloadIcon, null))));
   //   return (
@@ -10231,8 +10342,8 @@ var TableFilters = function TableFilters() {
   //     // </StyledBulkFilterCover>
   //   );
 };
-var Container$1d = /*#__PURE__*/styled.div(_templateObject$2j || (_templateObject$2j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  /* align-items: flex-start; */\n  gap: 16px;\n  align-items: center;\n"])));
-var Mid$1 = /*#__PURE__*/styled.div(_templateObject2$1G || (_templateObject2$1G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 10px 10px 10px 10px;\n  align-items: center;\n  gap: 8px;\n  align-self: stretch;\n  /* border-radius: 15px 15px 15px 15px; */\n"])));
+var Container$1d = /*#__PURE__*/styled.div(_templateObject$2i || (_templateObject$2i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  /* align-items: flex-start; */\n  gap: 16px;\n  align-items: center;\n"])));
+var Mid$1 = /*#__PURE__*/styled.div(_templateObject2$1F || (_templateObject2$1F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  padding: 10px 10px 10px 10px;\n  align-items: center;\n  gap: 8px;\n  align-self: stretch;\n  /* border-radius: 15px 15px 15px 15px; */\n"])));
 // const TextConatiner = styled.div`
 //   display: flex;
 //   padding: 7px 12px;
@@ -10299,19 +10410,6 @@ var DateIcon = function DateIcon() {
   }));
 };
 
-var DownArrowIcon = function DownArrowIcon() {
-  return React.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "8",
-    height: "4",
-    viewBox: "0 0 8 4",
-    fill: "none"
-  }, React.createElement("path", {
-    d: "M0.350098 0.125L4.1001 3.875L7.8501 0.125H0.350098Z",
-    fill: "#888075"
-  }));
-};
-
 var StatusIcon = function StatusIcon() {
   return React.createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
@@ -10369,37 +10467,143 @@ var AssigneIcon = function AssigneIcon() {
   }))));
 };
 
-var _templateObject$2k;
+var initialState$2 = {
+  'x-filters': [],
+  'x-pagination': {
+    page: 1,
+    per_page: 50
+  }
+};
+var filterReducer$1 = function filterReducer(state, action) {
+  switch (action.type) {
+    case 'SET_DATE_FILTER':
+      return _extends({}, state, {
+        'x-filters': [].concat(state['x-filters'].filter(function (f) {
+          return f.field !== 'created_at';
+        }), [{
+          field: 'created_at',
+          op: '>=',
+          value: format(new Date(action.payload), 'yyyy-MM-dd') + "T00:00:00+00:00"
+        }, {
+          field: 'created_at',
+          op: '<=',
+          value: format(new Date(action.payload), 'yyyy-MM-dd') + "T23:59:59+00:00"
+        }])
+      });
+    case 'SET_CLIENT_FILTER':
+      return _extends({}, state, {
+        'x-filters': [].concat(state['x-filters'].filter(function (f) {
+          return f.field !== 'customer_id';
+        }), [{
+          field: 'customer_id',
+          op: '=',
+          value: action.payload
+        }])
+      });
+    // case 'SET_ACTIONS_FILTER':
+    //   return {
+    //     ...state,
+    //     'x-filters': [
+    //       ...state['x-filters'].filter(
+    //         f => f.field !== 'product_return_action_id'
+    //       ),
+    //       {
+    //         field: 'product_return_action_id',
+    //         op: '=',
+    //         value: action.payload,
+    //       },
+    //     ],
+    //   };
+    // case 'SET_LOCATION_FILTER':
+    //   return {
+    //     ...state,
+    //     'x-filters': [
+    //       ...state['x-filters'].filter(f => f.field !== 'return_location'),
+    //       {
+    //         field: 'return_location',
+    //         op: 'in',
+    //         value: action.payload,
+    //       },
+    //     ],
+    //   };
+    case 'SET_PAGE':
+      return _extends({}, state, {
+        'x-pagination': _extends({}, state['x-pagination'], {
+          page: action.payload
+        })
+      });
+    case 'SET_PERPAGE':
+      return _extends({}, state, {
+        'x-pagination': _extends({}, state['x-pagination'], {
+          per_page: action.payload
+        })
+      });
+    case 'CLEAR_FILTERS':
+      return _extends({}, state);
+    default:
+      return state;
+  }
+};
+var filtersStateAtom$1 = /*#__PURE__*/atom(initialState$2);
+var filtersReducerAtom$1 = /*#__PURE__*/atom(function (get) {
+  return get(filtersStateAtom$1);
+}, function (get, set, action) {
+  return set(filtersStateAtom$1, filterReducer$1(get(filtersStateAtom$1), action));
+});
+
+var _templateObject$2j, _templateObject2$1G;
 var ReturnOrderFilter = function ReturnOrderFilter() {
-  var _useOrderDetails = useOrderDetails(),
-    orderDetails = _useOrderDetails[0],
-    setOrderDetails = _useOrderDetails[1];
-  var _usePrevOrderDetails = usePrevOrderDetails(),
-    prevOrderDetails = _usePrevOrderDetails[0];
-  var actionDate = orderDetails != null && orderDetails.action_date ? new Date(orderDetails == null ? void 0 : orderDetails.action_date) : null;
-  var onChange = function onChange(date, _dateString) {
-    var selectedDate = date == null ? void 0 : date.format('YYYY-MM-DDTHH:mm:ss');
-    if (selectedDate !== undefined && prevOrderDetails.action_date !== undefined) {
-      if (new Date(selectedDate).toLocaleDateString() === new Date(prevOrderDetails.action_date).toLocaleDateString()) {
-        setOrderDetails(function (prev) {
-          return _extends({}, prev, {
-            action_date: prevOrderDetails.action_date
-          });
-        });
-      } else {
-        setOrderDetails(function (prev) {
-          return _extends({}, prev, {
-            action_date: selectedDate
-          });
-        });
-      }
-    } else {
-      setOrderDetails(function (prev) {
-        return _extends({}, prev, {
-          action_date: null
-        });
+  var _useAtom = useAtom(filtersReducerAtom$1),
+    dispatch = _useAtom[1];
+  var _useCustomerData = useCustomerData(),
+    customers = _useCustomerData[0];
+  var _useState = useState(),
+    selectedDate = _useState[0],
+    setSelectedDate = _useState[1];
+  var zoneOptions = [{
+    label: 'Zone 1',
+    value: 'zone1'
+  }, {
+    label: 'Zone 2',
+    value: 'zone2'
+  }, {
+    label: 'Zone 3',
+    value: 'zone3'
+  }, {
+    label: 'Zone 4',
+    value: 'zone4'
+  }, {
+    label: 'Zone 5',
+    value: 'zone5'
+  }];
+  // date change here
+  var handleDateChange = function handleDateChange(date) {
+    setSelectedDate(date ? date == null ? void 0 : date.$d : null);
+    console.log(selectedDate, 'selected');
+  };
+  useEffect(function () {
+    if (selectedDate) {
+      console.log(selectedDate, 'selected');
+      dispatch({
+        type: 'SET_DATE_FILTER',
+        payload: selectedDate
       });
     }
+  }, [selectedDate]);
+  //client options
+  var clientOptions = customers == null ? void 0 : customers.map(function (option) {
+    var _option$customer_name, _option$customer_name2;
+    return {
+      label: (option == null || (_option$customer_name = option.customer_name) == null || (_option$customer_name = _option$customer_name.charAt(0)) == null ? void 0 : _option$customer_name.toUpperCase()) + (option == null || (_option$customer_name2 = option.customer_name) == null ? void 0 : _option$customer_name2.slice(1)),
+      value: option == null ? void 0 : option.id
+    };
+  });
+  var handleClientChange = function handleClientChange(value) {
+    console.log(value, 'value');
+    dispatch({
+      type: 'SET_CLIENT_FILTER',
+      payload: value
+    });
   };
   return React.createElement(React.Fragment, null, React.createElement(StyledFiter, null, React.createElement(StyledFIlterELements, null, React.createElement(LeftSideConatiner, null, React.createElement("div", {
     className: "filtercontainer"
@@ -10413,48 +10617,105 @@ var ReturnOrderFilter = function ReturnOrderFilter() {
     className: "dateiconcontainer"
   }, React.createElement(DateIcon, null)), React.createElement(StyledDatePicker, null, React.createElement(DatePicker, {
     className: "custom-datepicker",
-    onChange: onChange,
-    value: actionDate === null ? actionDate : dayjs(actionDate),
+    onChange: handleDateChange,
+    style: {
+      width: '100px'
+    },
+    value: selectedDate ? dayjs(selectedDate) : null,
     format: "DD/MM/YY",
-    placeholder: "Date"
+    placeholder: "Date",
+    needConfirm: true
   }))), React.createElement("div", {
     className: "datefilter"
   }, React.createElement("div", {
     className: "dateiconcontainer"
-  }, ' ', React.createElement(StatusIcon, null), ' '), React.createElement("div", {
-    className: "datetext"
-  }, "Status of Order"), React.createElement("div", {
-    className: "roundbox"
-  }, React.createElement(DownArrowIcon, null), ' ')), React.createElement("div", {
+  }, React.createElement(StatusIcon, null)), React.createElement(StyledAntSelect$d, null, React.createElement(Select, {
+    options: zoneOptions,
+    className: "custom-select",
+    placeholder: "Status of Order",
+    onChange: function onChange() {},
+    style: {
+      minWidth: '115px'
+    },
+    maxTagCount: 0,
+    maxTagPlaceholder: function maxTagPlaceholder(omittedValues) {
+      return React.createElement(Tooltip, {
+        overlayStyle: {
+          pointerEvents: 'none'
+        },
+        title: omittedValues.map(function (_ref) {
+          var label = _ref.label;
+          return label;
+        }).join(', ')
+      }, React.createElement("span", null, omittedValues.length + " selected"));
+    }
+  }))), React.createElement("div", {
     className: "datefilter"
   }, React.createElement("div", {
     className: "dateiconcontainer"
-  }, React.createElement(ClientIcon, null)), React.createElement("div", {
-    className: "datetext"
-  }, "Client"), React.createElement("div", {
-    className: "roundbox"
-  }, React.createElement(DownArrowIcon, null))), React.createElement("div", {
+  }, React.createElement(ClientIcon, null)), React.createElement(StyledAntSelect$d, null, React.createElement(Select, {
+    options: clientOptions,
+    className: "custom-select",
+    placeholder: "Client",
+    onChange: handleClientChange,
+    style: {
+      width: '125px'
+    },
+    maxTagCount: 0,
+    maxTagPlaceholder: function maxTagPlaceholder(omittedValues) {
+      return React.createElement(Tooltip, {
+        overlayStyle: {
+          pointerEvents: 'none'
+        },
+        title: omittedValues.map(function (_ref2) {
+          var label = _ref2.label;
+          return label;
+        }).join(', ')
+      }, React.createElement("span", null, omittedValues.length + " selected"));
+    }
+  }))), React.createElement("div", {
     className: "datefilter"
   }, React.createElement("div", {
     className: "dateiconcontainer"
-  }, React.createElement(AssigneIcon, null)), React.createElement("div", {
-    className: "datetext"
-  }, "Assignee"), React.createElement("div", {
-    className: "roundbox"
-  }, React.createElement(DownArrowIcon, null))))), React.createElement(TableFilters, null)));
+  }, React.createElement(AssigneIcon, null)), React.createElement(StyledAntSelect$d, null, React.createElement(Select, {
+    options: zoneOptions,
+    className: "custom-select",
+    placeholder: "Asignee",
+    onChange: function onChange() {},
+    style: {
+      minWidth: '100px'
+    },
+    maxTagCount: 0,
+    maxTagPlaceholder: function maxTagPlaceholder(omittedValues) {
+      return React.createElement(Tooltip, {
+        overlayStyle: {
+          pointerEvents: 'none'
+        },
+        title: omittedValues.map(function (_ref3) {
+          var label = _ref3.label;
+          return label;
+        }).join(', ')
+      }, React.createElement("span", null, omittedValues.length + " selected"));
+    }
+  }))))), React.createElement(TableFilters, null)));
 };
-var StyledDatePicker = /*#__PURE__*/styled.div(_templateObject$2k || (_templateObject$2k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .custom-datepicker {\n    border: none;\n    width: 80px;\n  }\n"])));
+var StyledDatePicker = /*#__PURE__*/styled.div(_templateObject$2j || (_templateObject$2j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .custom-datepicker {\n    border: none;\n  }\n"])));
+// const DropdownContainer = styled.div``;
+var StyledAntSelect$d = /*#__PURE__*/styled.div(_templateObject2$1G || (_templateObject2$1G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  .custom-select {\n    border: none;\n    width: 80px;\n  }\n  :where(.css-dev-only-do-not-override-m4timi).ant-select-single:not(.ant-select-customize-input)\n    .ant-select-selector {\n    padding: 0 5px;\n  }\n\n  :where(.css-dev-only-do-not-override-m4timi).ant-select-outlined:not(.ant-select-customize-input)\n    .ant-select-selector {\n    border: none;\n  }\n  .roundbox {\n    display: flex;\n    width: 18px;\n    height: 18px;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    border-radius: 18px;\n    background: #fff;\n    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1);\n    left: 359px;\n    position: absolute;\n    border-radius: 18px;\n    background: #fff;\n    box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1);\n    top: 16px;\n  }\n"])));
 
-var _templateObject$2l, _templateObject2$1H;
+var _templateObject$2k, _templateObject2$1H;
 var ReturnAfterTable = function ReturnAfterTable() {
   var _useReturnAfterOrderD = useReturnAfterOrderData(),
-    returnAfterOrder = _useReturnAfterOrderD[0],
     setReturnOrderData = _useReturnAfterOrderD[1];
   var _useLoading = useLoading(),
     setLoading = _useLoading[1];
+  var _useAtom = useAtom(filtersReducerAtom$1),
+    state = _useAtom[0];
+  var filters = state['x-filters'];
   var _useApiHook = useApiHook({
       endpoint: '/return_orders/?skip_filters=0',
-      method: 'GET'
+      method: 'GET',
+      filters: filters
     }),
     fetchedReturnOrderData = _useApiHook.data,
     staticDataLoading = _useApiHook.loading;
@@ -10464,12 +10725,11 @@ var ReturnAfterTable = function ReturnAfterTable() {
       setReturnOrderData(fetchedReturnOrderData == null ? void 0 : fetchedReturnOrderData.data);
     }
   }, [fetchedReturnOrderData, staticDataLoading]);
-  console.log('returnAfterOrder', returnAfterOrder);
   return React.createElement("div", null, React.createElement(DashBoardWrapper$2, null, React.createElement(RouterHeader, null), React.createElement("div", {
     className: "Tableconatiner"
   }, React.createElement(HeaderFilter, null), React.createElement(Container$1e, null, React.createElement(ReturnOrderFilter, null), React.createElement(OrderTable, null)))));
 };
-var Container$1e = /*#__PURE__*/styled.div(_templateObject$2l || (_templateObject$2l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  top: -30px;\n"])));
+var Container$1e = /*#__PURE__*/styled.div(_templateObject$2k || (_templateObject$2k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  top: -30px;\n"])));
 var DashBoardWrapper$2 = /*#__PURE__*/styled.section(_templateObject2$1H || (_templateObject2$1H = /*#__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 BulkFilter = function BulkFilter() {
@@ -10499,7 +10759,7 @@ var BulkFilter = function BulkFilter() {
   );
 };
 
-var _excluded$2 = ["count"];
+var _excluded$3 = ["count"];
 // import { useAtom } from 'jotai';
 var Filters = function Filters() {
   var _useRoutesTable = useRoutesTable(),
@@ -10525,11 +10785,15 @@ var Filters = function Filters() {
       if (paginationData !== null) {
         var _JSON$parse = JSON.parse(paginationData),
           count = _JSON$parse.count,
-          rest = _objectWithoutPropertiesLoose(_JSON$parse, _excluded$2);
+          rest = _objectWithoutPropertiesLoose(_JSON$parse, _excluded$3);
         setPaginationObject(rest);
         setCount(count);
       } else {
-        console.error('Pagination data is null');
+        // console.error('Pagination data is null');
+        notification.error({
+          message: 'Error',
+          description: 'Pagination data is null'
+        });
       }
     }
   }, [apiLoading]);
@@ -10563,7 +10827,7 @@ var ReturnTable$1 = function ReturnTable(_ref) {
   }, [staticDataLoading, fetchedStaticData]);
   return React.createElement(React.Fragment, null, React.createElement(StyledTableWrapper$1, {
     id: "tableScrolling"
-  }, React.createElement(StyledTable$1, null, React.createElement("thead", null, React.createElement("tr", null, React.createElement("th", null, "Trading Name"), React.createElement("th", null, "Client"), React.createElement("th", null, "Orders"), React.createElement("th", null, "Products"), React.createElement("th", null, "Dispose"), React.createElement("th", null, "Re-allocate"), React.createElement("th", null, "Re-Del"), React.createElement("th", null, "Recycle"), React.createElement("th", null, "Unknown"))), React.createElement("tbody", null, loadingskeleton ? React.createElement("tr", null, React.createElement("td", {
+  }, React.createElement(StyledTable$1, null, React.createElement("thead", null, React.createElement("tr", null, React.createElement("th", null, "Trading Name"), React.createElement("th", null, "Client"), React.createElement("th", null, "Orders"), React.createElement("th", null, "Products"), React.createElement("th", null, "RTS"), React.createElement("th", null, "Pending"), React.createElement("th", null, "Dispose"), React.createElement("th", null, "Re-allocate"), React.createElement("th", null, "Re-Del"), React.createElement("th", null, "Recycle"), React.createElement("th", null, "Unknown"))), React.createElement("tbody", null, loadingskeleton ? React.createElement("tr", null, React.createElement("td", {
     colSpan: 9
   }, React.createElement(Skeleton, {
     active: true
@@ -10583,11 +10847,11 @@ var ReturnTable$1 = function ReturnTable(_ref) {
         fontWeight: 600,
         paddingLeft: 0
       }
-    }, key == null ? void 0 : key.customer_name)), ' '), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.return_orders))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.return_order_products))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.DISPOSE))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key['RE-ALLOCATE']), ' ')), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key['RE-DEL']))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.RECYCLE))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.UNKNOWN))));
+    }, key == null ? void 0 : key.customer_name)), ' '), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.return_orders))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.return_order_products))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.RTS))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.PENDING))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.DISPOSE))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key['RE-ALLOCATE']), ' ')), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key['RE-DEL']))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.RECYCLE))), React.createElement("td", null, React.createElement(ColumStyle, null, React.createElement(GreyBox, null, key == null ? void 0 : key.UNKNOWN))));
   })))));
 };
 
-var _templateObject$2m, _templateObject2$1I, _templateObject3$Z;
+var _templateObject$2l, _templateObject2$1I, _templateObject3$Z;
 // import Loader from '../loader/Loader';
 // interface ApiResponse {
 //   message: string;
@@ -10636,29 +10900,37 @@ function ReturnMainTable() {
     className: "Tableconatiner"
   }, React.createElement(HeaderFilter, null), React.createElement(Container$1f, null, React.createElement(Row$7, null, React.createElement(Text$7, null, "Client Return"), selectedClient ? React.createElement(ReturnFilter, null) : React.createElement(Filters, null)), React.createElement(ReturnTable$1, null)))));
 }
-var Row$7 = /*#__PURE__*/styled.div(_templateObject$2m || (_templateObject$2m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
+var Row$7 = /*#__PURE__*/styled.div(_templateObject$2l || (_templateObject$2l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
 var Container$1f = /*#__PURE__*/styled.div(_templateObject2$1I || (_templateObject2$1I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  top: -46px;\n"])));
 var DashBoardWrapper$3 = /*#__PURE__*/styled.section(_templateObject3$Z || (_templateObject3$Z = /*#__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"])));
 
 function ReturnClient() {
+  var _selectedClientString;
+  notification.config({
+    top: 80
+  });
   var LoadingMessage = function LoadingMessage() {
     return React.createElement("div", null, "Loading...");
   };
   var _useTableName = useTableName(),
     selectedClient = _useTableName[0];
   var navigate = useNavigate();
+  var selectedClientString = selectedClient == null ? void 0 : selectedClient.replace(/\s+/g, '-');
+  selectedClientString = (_selectedClientString = selectedClientString) == null ? void 0 : _selectedClientString.toLowerCase();
+  console.log(selectedClientString, 'selectedClient');
+  console.log("../filter/:" + selectedClientString);
   useEffect(function () {
-    if (!location.pathname.includes('/return')) {
+    if (!location.pathname.includes('/filter')) {
       localStorage.removeItem('clientName');
       localStorage.removeItem('clientId');
     }
   }, [location.pathname]);
   useEffect(function () {
     if (selectedClient) {
-      var selectedClientString = selectedClient.replace(/\s+/g, '-');
-      navigate("return/" + selectedClientString);
+      var _selectedClientString2 = selectedClient.replace(/\s+/g, '-');
+      navigate("filter/" + _selectedClientString2);
     }
-  }, [selectedClient, navigate]);
+  }, [selectedClient]);
   return React.createElement(Suspense, {
     fallback: React.createElement(LoadingMessage, null)
   }, React.createElement(Routes, null, React.createElement(Route, {
@@ -10671,13 +10943,8 @@ function ReturnClient() {
     path: "order-return/:id",
     element: React.createElement(OrderView, null)
   }), React.createElement(Route, {
-    path: "return/:selectedClient",
+    path: "filter/:clientName",
     element: React.createElement(ReturnTable, null)
-  }), React.createElement(Route, {
-    path: "",
-    element: selectedClient ? React.createElement(Navigate, {
-      to: "return/" + selectedClient
-    }) : React.createElement(ReturnMainTable, null)
   })));
 }