@bjsdistribution/dms-client-return 0.1.97-prod → 0.1.98-prod

package/dist/assets/icons/ChevronDownIcon.js

@@ -0,0 +1,26 @@
+import { jsx as L } from "react/jsx-runtime";
+function n(o) {
+  return /* @__PURE__ */ L(
+    "svg",
+    {
+      width: "10",
+      height: "6",
+      viewBox: "0 0 10 6",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...o,
+      children: /* @__PURE__ */ L(
+        "path",
+        {
+          opacity: "0.4",
+          d: "M8.99999 0C9.56799 0 9.86466 0.657333 9.52199 1.082L9.47132 1.138L5.47132 5.138C5.35653 5.25279 5.20379 5.32174 5.04178 5.33193C4.87976 5.34211 4.71959 5.29283 4.59132 5.19333L4.52866 5.138L0.528656 1.138L0.473323 1.07533L0.437323 1.024L0.401323 0.96L0.389989 0.936L0.371989 0.891333L0.350656 0.819333L0.343989 0.784L0.337323 0.744L0.334656 0.706V0.627333L0.337989 0.588667L0.343989 0.548667L0.350656 0.514L0.371989 0.442L0.389989 0.397333L0.436656 0.309333L0.479989 0.249333L0.528656 0.195333L0.591323 0.14L0.642656 0.104L0.706656 0.0680002L0.730656 0.0566667L0.775323 0.0386664L0.847322 0.0173333L0.882656 0.0106665L0.922656 0.00399971L0.960656 0.00133324L8.99999 0Z",
+          fill: "#3A3630"
+        }
+      )
+    }
+  );
+}
+export {
+  n as default
+};
+//# sourceMappingURL=ChevronDownIcon.js.map

package/dist/assets/icons/ChevronDownIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChevronDownIcon.js","sources":["../../../src/assets/icons/ChevronDownIcon.tsx"],"sourcesContent":["import React from 'react';\n\nfunction ChevronDownIcon(props: any) {\n  return (\n    <svg\n      width=\"10\"\n      height=\"6\"\n      viewBox=\"0 0 10 6\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      {...props}\n    >\n      <path\n        opacity=\"0.4\"\n        d=\"M8.99999 0C9.56799 0 9.86466 0.657333 9.52199 1.082L9.47132 1.138L5.47132 5.138C5.35653 5.25279 5.20379 5.32174 5.04178 5.33193C4.87976 5.34211 4.71959 5.29283 4.59132 5.19333L4.52866 5.138L0.528656 1.138L0.473323 1.07533L0.437323 1.024L0.401323 0.96L0.389989 0.936L0.371989 0.891333L0.350656 0.819333L0.343989 0.784L0.337323 0.744L0.334656 0.706V0.627333L0.337989 0.588667L0.343989 0.548667L0.350656 0.514L0.371989 0.442L0.389989 0.397333L0.436656 0.309333L0.479989 0.249333L0.528656 0.195333L0.591323 0.14L0.642656 0.104L0.706656 0.0680002L0.730656 0.0566667L0.775323 0.0386664L0.847322 0.0173333L0.882656 0.0106665L0.922656 0.00399971L0.960656 0.00133324L8.99999 0Z\"\n        fill=\"#3A3630\"\n      />\n    </svg>\n  );\n}\n\nexport default ChevronDownIcon;\n"],"names":["ChevronDownIcon","props","jsx"],"mappings":";AAEA,SAASA,EAAgBC,GAAY;AACnC,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,OAAM;AAAA,MACL,GAAGD;AAAA,MAEJ,UAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,GAAE;AAAA,UACF,MAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IACP;AAAA,EAAA;AAGN;"}

package/dist/common/modals/order-action-modal/OrderActionModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrderActionModal.js","sources":["../../../../src/common/modals/order-action-modal/OrderActionModal.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport BackgroundModal from './BackgroundModal';\nimport OrderActionHeader from './header/OrderActionHeader';\nimport OrderActionFooter from './footer/OrderActionFooter';\n\ninterface ActionModalProps {\n  headerTitle: string;\n  showAdditionalInfo?: boolean;\n  infoText?: string;\n  headerActions?: React.ReactNode;\n  submitBtnTitle?: string;\n  footerActions?: React.ReactNode;\n  children: React.ReactNode;\n  onCloseHeader: () => void;\n  onSubmit: () => void;\n  isSubmitDisabled?: boolean;\n  minWidth?: string; // New optional prop for min-width\n  maxWidth?: string; // New optional prop for min-width\n}\n\nfunction OrderActionModal({\n  minWidth = '30vw',\n  maxWidth = '75vw',\n  ...props\n}: ActionModalProps) {\n  return (\n    <BackgroundModal>\n      <MainContainer minWidth={minWidth} maxWidth={maxWidth}>\n        <OrderActionHeader\n          title={props.headerTitle}\n          onClose={props.onCloseHeader}\n          showInformation={props.showAdditionalInfo}\n          infoText={props.infoText}\n          actions={props.headerActions}\n        />\n        {props.children}\n        <OrderActionFooter\n          submitButtonTitle={props.submitBtnTitle}\n          onSubmit={props.onSubmit}\n          actions={props.footerActions}\n          isSubmitDisabled={props.isSubmitDisabled}\n        />\n      </MainContainer>\n    </BackgroundModal>\n  );\n}\n\n// Styled component with dynamic min-width\nconst MainContainer = styled.div<{ minWidth: string; maxWidth: string }>`\n  min-height: 30vh;\n  max-height: 80vh;\n  border-radius: 12px;\n  background: #fff;\n  box-shadow: 0px 20px 24px -4px #10182814;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-between;\n  overflow-x: hidden;\n  max-width: ${({ maxWidth }) => maxWidth}; // Dynamic max-width\n  min-width: ${({ minWidth }) => minWidth}; // Dynamic min-width\n`;\n\nexport default OrderActionModal;\n"],"names":["OrderActionModal","minWidth","maxWidth","props","jsx","BackgroundModal","jsxs","MainContainer","OrderActionHeader","OrderActionFooter","styled"],"mappings":";;;;;AAqBA,SAASA,EAAiB;AAAA,EACxB,UAAAC,IAAW;AAAA,EACX,UAAAC,IAAW;AAAA,EACX,GAAGC;AACL,GAAqB;AACnB,SACE,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAC,EAACC,GAAA,EAAc,UAAAN,GAAoB,UAAAC,GACjC,UAAA;AAAA,IAAA,gBAAAE;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,OAAOL,EAAM;AAAA,QACb,SAASA,EAAM;AAAA,QACf,iBAAiBA,EAAM;AAAA,QACvB,UAAUA,EAAM;AAAA,QAChB,SAASA,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,IAEhBA,EAAM;AAAA,IACP,gBAAAC;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,mBAAmBN,EAAM;AAAA,QACzB,UAAUA,EAAM;AAAA,QAChB,SAASA,EAAM;AAAA,QACf,kBAAkBA,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAC1B,EAAA,CACF,EAAA,CACF;AAEJ;AAGA,MAAMI,IAAgBG,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAWd,CAAC,EAAE,UAAAR,EAAA,MAAeA,CAAQ;AAAA,eAC1B,CAAC,EAAE,UAAAD,EAAA,MAAeA,CAAQ;AAAA;"}
+{"version":3,"file":"OrderActionModal.js","sources":["../../../../src/common/modals/order-action-modal/OrderActionModal.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport BackgroundModal from './BackgroundModal';\nimport OrderActionHeader from './header/OrderActionHeader';\nimport OrderActionFooter from './footer/OrderActionFooter';\n\ninterface ActionModalProps {\n  headerTitle: string;\n  showAdditionalInfo?: boolean;\n  infoText?: string;\n  headerActions?: React.ReactNode;\n  /** ReactNode so a modal can show a spinner alongside the label while submitting. */\n  submitBtnTitle?: React.ReactNode;\n  footerActions?: React.ReactNode;\n  children: React.ReactNode;\n  onCloseHeader: () => void;\n  onSubmit: () => void;\n  isSubmitDisabled?: boolean;\n  minWidth?: string; // New optional prop for min-width\n  maxWidth?: string; // New optional prop for min-width\n}\n\nfunction OrderActionModal({\n  minWidth = '30vw',\n  maxWidth = '75vw',\n  ...props\n}: ActionModalProps) {\n  return (\n    <BackgroundModal>\n      <MainContainer minWidth={minWidth} maxWidth={maxWidth}>\n        <OrderActionHeader\n          title={props.headerTitle}\n          onClose={props.onCloseHeader}\n          showInformation={props.showAdditionalInfo}\n          infoText={props.infoText}\n          actions={props.headerActions}\n        />\n        {props.children}\n        <OrderActionFooter\n          submitButtonTitle={props.submitBtnTitle}\n          onSubmit={props.onSubmit}\n          actions={props.footerActions}\n          isSubmitDisabled={props.isSubmitDisabled}\n        />\n      </MainContainer>\n    </BackgroundModal>\n  );\n}\n\n// Styled component with dynamic min-width\nconst MainContainer = styled.div<{ minWidth: string; maxWidth: string }>`\n  min-height: 30vh;\n  max-height: 80vh;\n  border-radius: 12px;\n  background: #fff;\n  box-shadow: 0px 20px 24px -4px #10182814;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: space-between;\n  overflow-x: hidden;\n  max-width: ${({ maxWidth }) => maxWidth}; // Dynamic max-width\n  min-width: ${({ minWidth }) => minWidth}; // Dynamic min-width\n`;\n\nexport default OrderActionModal;\n"],"names":["OrderActionModal","minWidth","maxWidth","props","jsx","BackgroundModal","jsxs","MainContainer","OrderActionHeader","OrderActionFooter","styled"],"mappings":";;;;;AAsBA,SAASA,EAAiB;AAAA,EACxB,UAAAC,IAAW;AAAA,EACX,UAAAC,IAAW;AAAA,EACX,GAAGC;AACL,GAAqB;AACnB,SACE,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAC,EAACC,GAAA,EAAc,UAAAN,GAAoB,UAAAC,GACjC,UAAA;AAAA,IAAA,gBAAAE;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,OAAOL,EAAM;AAAA,QACb,SAASA,EAAM;AAAA,QACf,iBAAiBA,EAAM;AAAA,QACvB,UAAUA,EAAM;AAAA,QAChB,SAASA,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,IAEhBA,EAAM;AAAA,IACP,gBAAAC;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,mBAAmBN,EAAM;AAAA,QACzB,UAAUA,EAAM;AAAA,QAChB,SAASA,EAAM;AAAA,QACf,kBAAkBA,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAC1B,EAAA,CACF,EAAA,CACF;AAEJ;AAGA,MAAMI,IAAgBG,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAWd,CAAC,EAAE,UAAAR,EAAA,MAAeA,CAAQ;AAAA,eAC1B,CAAC,EAAE,UAAAD,EAAA,MAAeA,CAAQ;AAAA;"}

package/dist/common/modals/order-action-modal/footer/OrderActionFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrderActionFooter.js","sources":["../../../../../src/common/modals/order-action-modal/footer/OrderActionFooter.tsx"],"sourcesContent":["import { Button } from '@bjsdistribution/dms-component-library';\nimport React from 'react';\nimport styled from 'styled-components';\n\ninterface FooterProps {\n  submitButtonTitle?: string;\n  cancelButtonTitle?: string;\n  actions?: React.ReactNode;\n  onSubmit: () => void;\n  onCancel?: () => void;\n  isSubmitDisabled?: boolean;\n}\n\nfunction OrderActionFooter(props: FooterProps) {\n  const { isSubmitDisabled } = props;\n  return (\n    <Container>\n      <SubmitButton\n        shape=\"rounded\"\n        colors=\"primary\"\n        onClick={props.onSubmit}\n        disabled={isSubmitDisabled}\n      >\n        {props.submitButtonTitle || 'submit'}\n      </SubmitButton>\n      {props.actions}\n    </Container>\n  );\n}\n\nconst SubmitButton = styled(Button)``;\n\nconst Container = styled.div`\n  display: flex;\n  /* justify-content: space-between; */\n  gap: 15px;\n  align-items: center;\n  width: 100%;\n  background: #f8fafc;\n  border-radius: 0px 0px 6px 6px;\n  padding: 10px 15px 10px 15px;\n  border-top: 1px solid #edebe8;\n  margin-left: 25px;\n`;\n\nexport default OrderActionFooter;\n"],"names":["OrderActionFooter","props","isSubmitDisabled","Container","jsx","SubmitButton","styled","Button"],"mappings":";;;AAaA,SAASA,EAAkBC,GAAoB;AAC7C,QAAM,EAAE,kBAAAC,MAAqBD;AAC7B,2BACGE,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,QAAO;AAAA,QACP,SAASJ,EAAM;AAAA,QACf,UAAUC;AAAA,QAET,YAAM,qBAAqB;AAAA,MAAA;AAAA,IAAA;AAAA,IAE7BD,EAAM;AAAA,EAAA,GACT;AAEJ;AAEA,MAAMI,IAAeC,EAAOC,CAAM,KAE5BJ,IAAYG,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"OrderActionFooter.js","sources":["../../../../../src/common/modals/order-action-modal/footer/OrderActionFooter.tsx"],"sourcesContent":["import { Button } from '@bjsdistribution/dms-component-library';\nimport React from 'react';\nimport styled from 'styled-components';\n\ninterface FooterProps {\n  submitButtonTitle?: React.ReactNode;\n  cancelButtonTitle?: string;\n  actions?: React.ReactNode;\n  onSubmit: () => void;\n  onCancel?: () => void;\n  isSubmitDisabled?: boolean;\n}\n\nfunction OrderActionFooter(props: FooterProps) {\n  const { isSubmitDisabled } = props;\n  return (\n    <Container>\n      <SubmitButton\n        shape=\"rounded\"\n        colors=\"primary\"\n        onClick={props.onSubmit}\n        disabled={isSubmitDisabled}\n      >\n        {props.submitButtonTitle || 'submit'}\n      </SubmitButton>\n      {props.actions}\n    </Container>\n  );\n}\n\nconst SubmitButton = styled(Button)``;\n\nconst Container = styled.div`\n  display: flex;\n  /* justify-content: space-between; */\n  gap: 15px;\n  align-items: center;\n  width: 100%;\n  background: #f8fafc;\n  border-radius: 0px 0px 6px 6px;\n  padding: 10px 15px 10px 15px;\n  border-top: 1px solid #edebe8;\n  margin-left: 25px;\n`;\n\nexport default OrderActionFooter;\n"],"names":["OrderActionFooter","props","isSubmitDisabled","Container","jsx","SubmitButton","styled","Button"],"mappings":";;;AAaA,SAASA,EAAkBC,GAAoB;AAC7C,QAAM,EAAE,kBAAAC,MAAqBD;AAC7B,2BACGE,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,QAAO;AAAA,QACP,SAASJ,EAAM;AAAA,QACf,UAAUC;AAAA,QAET,YAAM,qBAAqB;AAAA,MAAA;AAAA,IAAA;AAAA,IAE7BD,EAAM;AAAA,EAAA,GACT;AAEJ;AAEA,MAAMI,IAAeC,EAAOC,CAAM,KAE5BJ,IAAYG,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/components/order-view/notes/order-dropdown/NewReturnDropdown.js

@@ -2,7 +2,7 @@ import { jsxs as I, jsx as f } from "react/jsx-runtime";
 import { useState as A, useEffect as d } from "react";
 import l from "styled-components";
 import { useApiHook as C } from "@bjsdistribution/dms-component-library";
-import { useOrderDetails as N, useProductDetails as R, useOrderId as b } from "../../store.js";
+import { useOrderDetails as N, useReturnProductDetails as R, useOrderId as b } from "../../store.js";
 import { Select as j } from "antd";
 import { useNewReturnOrderData as z, useSelectedProducts as E } from "../../../store.js";
 import { atom as h, useAtom as m } from "jotai";
@@ -23,7 +23,7 @@ const T = h(null), $ = h(null), U = () => {
     op: "=",
     value: t[0]
   });
-  const { data: s, setShouldPerformAction: p } = C({
+  const { data: s, setShouldPerformAction: u } = C({
     endpoint: "/v1/return/orders/",
     method: "GET",
     filters: n && n?.length > 0 ? n : void 0,
@@ -32,8 +32,8 @@ const T = h(null), $ = h(null), U = () => {
     performAction: !1
   });
   d(() => {
-    r && t?.length > 0 && t[0] && p(!0);
-  }, [r, t, p]), d(() => {
+    r && t?.length > 0 && t[0] && u(!0);
+  }, [r, t, u]), d(() => {
     s && s?.data && r !== null && v(s?.data);
   }, [s, r]), d(() => {
     o && a?.length > 0 && i({
@@ -43,7 +43,7 @@ const T = h(null), $ = h(null), U = () => {
   }, [o, a, i]);
   const O = (e) => {
     y(e);
-  }, u = S?.map((e) => ({
+  }, p = S?.map((e) => ({
     label: `${e?.recipient_name} - ${e?.postcode}`,
     value: e?.id
   }));
@@ -52,7 +52,7 @@ const T = h(null), $ = h(null), U = () => {
     /* @__PURE__ */ f(
       k,
       {
-        options: u,
+        options: p,
         value: o,
         placeholder: "Select",
         onChange: O,
@@ -60,7 +60,7 @@ const T = h(null), $ = h(null), U = () => {
         showSearch: !0,
         dropdownStyle: { width: "250px" },
         popupClassName: g,
-        status: u.length === 0 || o ? "" : "error",
+        status: p.length === 0 || o ? "" : "error",
         notFoundContent: "No orders found with a similar postcode"
       }
     )

package/dist/components/order-view/notes/order-dropdown/NewReturnDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"NewReturnDropdown.js","sources":["../../../../../src/components/order-view/notes/order-dropdown/NewReturnDropdown.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { useApiHook } from '@bjsdistribution/dms-component-library';\nimport { ApiResponse } from '../../types';\nimport { useOrderDetails, useOrderId, useProductDetails } from '../../store';\nimport { Select } from 'antd';\nimport { useNewReturnOrderData, useSelectedProducts } from '../../../store';\nimport { atom, useAtom } from 'jotai';\n\nexport const payloadAtom = atom<any>(null);\nexport const selectedOrderId = atom<any>(null);\n\nconst NewReturnDropdown = () => {\n  const defaultSelectStyle = { width: '100%' };\n  const defaultPopupClassName = 'dropDownStyle';\n  const [returnOrderData, setReturnOrderData] = useNewReturnOrderData();\n  const [selectedId, setSelectedOrderId] = useAtom(selectedOrderId);\n  const [selectedProducts] = useSelectedProducts();\n  const [orderData] = useOrderDetails();\n  const [, setPayload] = useAtom(payloadAtom);\n  const [productData] = useProductDetails();\n  const [idProduct, setId] = useState<any>();\n  const [orderId] = useOrderId();\n\n  const id = orderData?.customer_id;\n  useEffect(() => {\n    const allProductIds =\n      productData?.map((product: any) => product?.return_location) || [];\n    setId(allProductIds);\n  }, [productData]);\n\n  const filters = [\n    { field: 'customer_id', op: '=', value: id },\n    { field: 'is_deleted', op: '=', value: 0 },\n    { field: 'status', op: '!=', value: 'SD' },\n    { field: 'id', op: '!=', value: orderId },\n  ];\n\n  if (idProduct?.length > 0 && idProduct[0]) {\n    filters.push({\n      field: 'return_order_products.return_location',\n      op: '=',\n      value: idProduct[0],\n    });\n  }\n\n  const { data: fetchedReturnOrderData, setShouldPerformAction } = useApiHook<\n    ApiResponse\n  >({\n    endpoint: '/v1/return/orders/',\n    method: 'GET',\n    filters: filters && filters?.length > 0 ? filters : undefined,\n    //@ts-ignore\n    pagination: { is_pagination: false },\n    performAction: false,\n  });\n\n  useEffect(() => {\n    if (id && idProduct?.length > 0 && idProduct[0]) {\n      setShouldPerformAction(true);\n    }\n  }, [id, idProduct, setShouldPerformAction]);\n\n  useEffect(() => {\n    if (fetchedReturnOrderData && fetchedReturnOrderData?.data && id !== null) {\n      setReturnOrderData(fetchedReturnOrderData?.data);\n    }\n  }, [fetchedReturnOrderData, id]);\n\n  useEffect(() => {\n    if (selectedId && selectedProducts?.length > 0) {\n      const newPayload = {\n        new_return_order: selectedId,\n        products: selectedProducts,\n      };\n      setPayload(newPayload);\n    }\n  }, [selectedId, selectedProducts, setPayload]);\n\n  const handleDropdownChange = (value: string) => {\n    setSelectedOrderId(value);\n  };\n  const dropdownOptions = returnOrderData?.map((order: any) => ({\n    label: `${order?.recipient_name} - ${order?.postcode}`,\n    value: order?.id,\n  }));\n  return (\n    <Container>\n      <Text>New Return Order:</Text>\n      <StyledAntSelect\n        options={dropdownOptions}\n        value={selectedId}\n        placeholder=\"Select\"\n        // @ts-ignore\n        onChange={handleDropdownChange}\n        style={defaultSelectStyle}\n        showSearch\n        dropdownStyle={{ width: '250px' }}\n        popupClassName={defaultPopupClassName}\n        status={dropdownOptions.length === 0 ? '' : selectedId ? '' : 'error'}\n        notFoundContent=\"No orders found with a similar postcode\"\n      />\n    </Container>\n  );\n};\n\nconst StyledAntSelect = styled(Select)`\n  .ant-select-selector {\n    /* width: 22vw; */\n    border-radius: 22px;\n  }\n  .ant-select-clear {\n    top: 40% !important;\n    font-size: 18px !important;\n  }\n`;\n\nconst Container = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  align-self: stretch;\n  white-space: nowrap;\n`;\n\nconst Text = styled.div`\n  color: #000;\n  font-family: 'Lato';\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 16px;\n`;\n\nexport default NewReturnDropdown;\n"],"names":["payloadAtom","atom","selectedOrderId","NewReturnDropdown","defaultSelectStyle","defaultPopupClassName","returnOrderData","setReturnOrderData","useNewReturnOrderData","selectedId","setSelectedOrderId","useAtom","selectedProducts","useSelectedProducts","orderData","useOrderDetails","setPayload","productData","useProductDetails","idProduct","setId","useState","orderId","useOrderId","id","useEffect","allProductIds","product","filters","fetchedReturnOrderData","setShouldPerformAction","useApiHook","handleDropdownChange","value","dropdownOptions","order","Container","jsx","Text","StyledAntSelect","styled","Select"],"mappings":";;;;;;;;AASO,MAAMA,IAAcC,EAAU,IAAI,GAC5BC,IAAkBD,EAAU,IAAI,GAEvCE,IAAoB,MAAM;AAC9B,QAAMC,IAAqB,EAAE,OAAO,OAAA,GAC9BC,IAAwB,iBACxB,CAACC,GAAiBC,CAAkB,IAAIC,EAAA,GACxC,CAACC,GAAYC,CAAkB,IAAIC,EAAQT,CAAe,GAC1D,CAACU,CAAgB,IAAIC,EAAA,GACrB,CAACC,CAAS,IAAIC,EAAA,GACd,GAAGC,CAAU,IAAIL,EAAQX,CAAW,GACpC,CAACiB,CAAW,IAAIC,EAAA,GAChB,CAACC,GAAWC,CAAK,IAAIC,EAAA,GACrB,CAACC,CAAO,IAAIC,EAAA,GAEZC,IAAKV,GAAW;AACtB,EAAAW,EAAU,MAAM;AACd,UAAMC,IACJT,GAAa,IAAI,CAACU,MAAiBA,GAAS,eAAe,KAAK,CAAA;AAClE,IAAAP,EAAMM,CAAa;AAAA,EACrB,GAAG,CAACT,CAAW,CAAC;AAEhB,QAAMW,IAAU;AAAA,IACd,EAAE,OAAO,eAAe,IAAI,KAAK,OAAOJ,EAAA;AAAA,IACxC,EAAE,OAAO,cAAc,IAAI,KAAK,OAAO,EAAA;AAAA,IACvC,EAAE,OAAO,UAAU,IAAI,MAAM,OAAO,KAAA;AAAA,IACpC,EAAE,OAAO,MAAM,IAAI,MAAM,OAAOF,EAAA;AAAA,EAAQ;AAG1C,EAAIH,GAAW,SAAS,KAAKA,EAAU,CAAC,KACtCS,EAAQ,KAAK;AAAA,IACX,OAAO;AAAA,IACP,IAAI;AAAA,IACJ,OAAOT,EAAU,CAAC;AAAA,EAAA,CACnB;AAGH,QAAM,EAAE,MAAMU,GAAwB,wBAAAC,EAAA,IAA2BC,EAE/D;AAAA,IACA,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,SAASH,KAAWA,GAAS,SAAS,IAAIA,IAAU;AAAA;AAAA,IAEpD,YAAY,EAAE,eAAe,GAAA;AAAA,IAC7B,eAAe;AAAA,EAAA,CAChB;AAED,EAAAH,EAAU,MAAM;AACd,IAAID,KAAML,GAAW,SAAS,KAAKA,EAAU,CAAC,KAC5CW,EAAuB,EAAI;AAAA,EAE/B,GAAG,CAACN,GAAIL,GAAWW,CAAsB,CAAC,GAE1CL,EAAU,MAAM;AACd,IAAII,KAA0BA,GAAwB,QAAQL,MAAO,QACnEjB,EAAmBsB,GAAwB,IAAI;AAAA,EAEnD,GAAG,CAACA,GAAwBL,CAAE,CAAC,GAE/BC,EAAU,MAAM;AACd,IAAIhB,KAAcG,GAAkB,SAAS,KAK3CI,EAJmB;AAAA,MACjB,kBAAkBP;AAAA,MAClB,UAAUG;AAAA,IAAA,CAES;AAAA,EAEzB,GAAG,CAACH,GAAYG,GAAkBI,CAAU,CAAC;AAE7C,QAAMgB,IAAuB,CAACC,MAAkB;AAC9C,IAAAvB,EAAmBuB,CAAK;AAAA,EAC1B,GACMC,IAAkB5B,GAAiB,IAAI,CAAC6B,OAAgB;AAAA,IAC5D,OAAO,GAAGA,GAAO,cAAc,MAAMA,GAAO,QAAQ;AAAA,IACpD,OAAOA,GAAO;AAAA,EAAA,EACd;AACF,2BACGC,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAK,UAAA,oBAAA,CAAiB;AAAA,IACvB,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAASL;AAAA,QACT,OAAOzB;AAAA,QACP,aAAY;AAAA,QAEZ,UAAUuB;AAAA,QACV,OAAO5B;AAAA,QACP,YAAU;AAAA,QACV,eAAe,EAAE,OAAO,QAAA;AAAA,QACxB,gBAAgBC;AAAA,QAChB,QAAQ6B,EAAgB,WAAW,KAASzB,IAAL,KAAuB;AAAA,QAC9D,iBAAgB;AAAA,MAAA;AAAA,IAAA;AAAA,EAClB,GACF;AAEJ,GAEM8B,IAAkBC,EAAOC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAW/BL,IAAYI,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQnBF,IAAOE,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"NewReturnDropdown.js","sources":["../../../../../src/components/order-view/notes/order-dropdown/NewReturnDropdown.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport styled from 'styled-components';\nimport { useApiHook } from '@bjsdistribution/dms-component-library';\nimport { ApiResponse } from '../../types';\nimport {\n  useOrderDetails,\n  useOrderId,\n  useReturnProductDetails,\n} from '../../store';\nimport { Select } from 'antd';\nimport { useNewReturnOrderData, useSelectedProducts } from '../../../store';\nimport { atom, useAtom } from 'jotai';\n\nexport const payloadAtom = atom<any>(null);\nexport const selectedOrderId = atom<any>(null);\n\nconst NewReturnDropdown = () => {\n  const defaultSelectStyle = { width: '100%' };\n  const defaultPopupClassName = 'dropDownStyle';\n  const [returnOrderData, setReturnOrderData] = useNewReturnOrderData();\n  const [selectedId, setSelectedOrderId] = useAtom(selectedOrderId);\n  const [selectedProducts] = useSelectedProducts();\n  const [orderData] = useOrderDetails();\n  const [, setPayload] = useAtom(payloadAtom);\n  const [productData] = useReturnProductDetails();\n  const [idProduct, setId] = useState<any>();\n  const [orderId] = useOrderId();\n\n  const id = orderData?.customer_id;\n  useEffect(() => {\n    const allProductIds =\n      productData?.map((product: any) => product?.return_location) || [];\n    setId(allProductIds);\n  }, [productData]);\n\n  const filters = [\n    { field: 'customer_id', op: '=', value: id },\n    { field: 'is_deleted', op: '=', value: 0 },\n    { field: 'status', op: '!=', value: 'SD' },\n    { field: 'id', op: '!=', value: orderId },\n  ];\n\n  if (idProduct?.length > 0 && idProduct[0]) {\n    filters.push({\n      field: 'return_order_products.return_location',\n      op: '=',\n      value: idProduct[0],\n    });\n  }\n\n  const { data: fetchedReturnOrderData, setShouldPerformAction } = useApiHook<\n    ApiResponse\n  >({\n    endpoint: '/v1/return/orders/',\n    method: 'GET',\n    filters: filters && filters?.length > 0 ? filters : undefined,\n    //@ts-ignore\n    pagination: { is_pagination: false },\n    performAction: false,\n  });\n\n  useEffect(() => {\n    if (id && idProduct?.length > 0 && idProduct[0]) {\n      setShouldPerformAction(true);\n    }\n  }, [id, idProduct, setShouldPerformAction]);\n\n  useEffect(() => {\n    if (fetchedReturnOrderData && fetchedReturnOrderData?.data && id !== null) {\n      setReturnOrderData(fetchedReturnOrderData?.data);\n    }\n  }, [fetchedReturnOrderData, id]);\n\n  useEffect(() => {\n    if (selectedId && selectedProducts?.length > 0) {\n      const newPayload = {\n        new_return_order: selectedId,\n        products: selectedProducts,\n      };\n      setPayload(newPayload);\n    }\n  }, [selectedId, selectedProducts, setPayload]);\n\n  const handleDropdownChange = (value: string) => {\n    setSelectedOrderId(value);\n  };\n  const dropdownOptions = returnOrderData?.map((order: any) => ({\n    label: `${order?.recipient_name} - ${order?.postcode}`,\n    value: order?.id,\n  }));\n  return (\n    <Container>\n      <Text>New Return Order:</Text>\n      <StyledAntSelect\n        options={dropdownOptions}\n        value={selectedId}\n        placeholder=\"Select\"\n        // @ts-ignore\n        onChange={handleDropdownChange}\n        style={defaultSelectStyle}\n        showSearch\n        dropdownStyle={{ width: '250px' }}\n        popupClassName={defaultPopupClassName}\n        status={dropdownOptions.length === 0 ? '' : selectedId ? '' : 'error'}\n        notFoundContent=\"No orders found with a similar postcode\"\n      />\n    </Container>\n  );\n};\n\nconst StyledAntSelect = styled(Select)`\n  .ant-select-selector {\n    /* width: 22vw; */\n    border-radius: 22px;\n  }\n  .ant-select-clear {\n    top: 40% !important;\n    font-size: 18px !important;\n  }\n`;\n\nconst Container = styled.div`\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  align-self: stretch;\n  white-space: nowrap;\n`;\n\nconst Text = styled.div`\n  color: #000;\n  font-family: 'Lato';\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 16px;\n`;\n\nexport default NewReturnDropdown;\n"],"names":["payloadAtom","atom","selectedOrderId","NewReturnDropdown","defaultSelectStyle","defaultPopupClassName","returnOrderData","setReturnOrderData","useNewReturnOrderData","selectedId","setSelectedOrderId","useAtom","selectedProducts","useSelectedProducts","orderData","useOrderDetails","setPayload","productData","useReturnProductDetails","idProduct","setId","useState","orderId","useOrderId","id","useEffect","allProductIds","product","filters","fetchedReturnOrderData","setShouldPerformAction","useApiHook","handleDropdownChange","value","dropdownOptions","order","Container","jsx","Text","StyledAntSelect","styled","Select"],"mappings":"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"}

package/dist/components/order-view/order-actions/actions/split-order/SplitOrderTable.js

@@ -1,71 +1,238 @@
-import { jsx as e, jsxs as d } from "react/jsx-runtime";
-import { useState as g, useEffect as b } from "react";
-import { useProductDetails as k } from "../../../store.js";
-import { Skeleton as C, Empty as D } from "antd";
-import { Checkbox as p } from "@bjsdistribution/dms-component-library";
-import { useLoading as T } from "../../../../order-daily-overview/store/store.js";
-import { useSelectedSplit as x, useSplitOrderPayload as P } from "../../store.js";
-import { StyledTableWrapper as A, StyledTable as E, EmptyDataContainer as _ } from "../confirm-order/tables/ReminderStyles.js";
-function q() {
-  const [i] = k(), [m] = T(), [n, c] = x(), [u, o] = g(!1), [S, s] = P(), f = (t) => {
-    const l = t.target.checked;
-    o(l), c(
-      l ? i?.map((h) => ({ id: h.id })) : []
+import { jsx as t, Fragment as x, jsxs as i } from "react/jsx-runtime";
+import L, { useState as u, useMemo as p, useEffect as _ } from "react";
+import { useReturnProductDetails as j } from "../../../store.js";
+import { Skeleton as z, Empty as B } from "antd";
+import { Checkbox as m } from "@bjsdistribution/dms-component-library";
+import { useLoading as F } from "../../../../order-daily-overview/store/store.js";
+import { useSelectedSplit as H, useSplitOrderPayload as M } from "../../store.js";
+import { StyledTableWrapper as O, StyledTable as U, EmptyDataContainer as q } from "../confirm-order/tables/ReminderStyles.js";
+import a from "styled-components";
+import W from "../../../../../assets/icons/ChevronDownIcon.js";
+import { groupProductsByPallet as J, hasAnyPallet as K, toggleGroupSelectionIds as Q } from "../../../return-client-products/product-table/palletGrouping.js";
+const y = 7;
+function pe() {
+  const [n] = j(), [S] = F(), [r, c] = H(), [P, h] = u(!1), [k, f] = M(), g = p(
+    () => (r ?? []).map((e) => e?.id),
+    [r]
+  ), N = p(
+    () => J(n),
+    [n]
+  ), v = p(() => K(n), [
+    n
+  ]), [w, C] = u({}), D = (e) => e.isNoPallet || !!w[e.key], I = (e) => C((l) => ({ ...l, [e]: !l[e] })), G = (e) => {
+    c(e.map((l) => ({ id: l }))), h(e.length === n?.length);
+  }, T = (e) => {
+    const l = e.target.checked;
+    h(l), c(
+      l ? n?.map((o) => ({ id: o.id })) : []
     );
-  }, y = (t) => {
+  }, E = (e) => {
     c((l) => {
-      const a = l?.some((r) => r.id === t) ? l?.filter((r) => r.id !== t) : [...l, { id: t }];
-      return o(a?.length === i?.length), a;
+      const s = l?.some(
+        (d) => d.id === e
+      ) ? l?.filter((d) => d.id !== e) : [...l, { id: e }];
+      return h(s?.length === n?.length), s;
     });
+  }, R = (e, l) => {
+    const o = e.items.map((s) => s?.id);
+    G(Q(g, o, l));
   };
-  return b(() => {
-    s({
-      ...S,
+  _(() => {
+    f({
+      ...k,
       return_order: 1,
       // FOR SPLIT ORDER WE ARE ASKED TO SET THIS AS 1
-      products: n?.map((t) => t.id),
+      products: r?.map((e) => e.id),
       force: !0
     });
-  }, [n, s]), /* @__PURE__ */ e(A, { id: "tableScrolling", children: /* @__PURE__ */ d(E, { children: [
-    /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ d("tr", { children: [
-      /* @__PURE__ */ e("th", { style: { position: "relative" }, children: /* @__PURE__ */ e(
-        p,
+  }, [r, f]);
+  const b = (e) => /* @__PURE__ */ i("tr", { children: [
+    /* @__PURE__ */ t("td", { style: { position: "relative" }, children: /* @__PURE__ */ t(
+      m,
+      {
+        checked: r?.some(
+          (l) => l.id === e.id
+        ),
+        onChange: () => E(e.id)
+      }
+    ) }),
+    /* @__PURE__ */ t("td", { children: e?.order_product_type?.type }),
+    /* @__PURE__ */ t("td", { children: e?.code }),
+    /* @__PURE__ */ t("td", { children: e?.description }),
+    /* @__PURE__ */ t("td", { children: e?.description }),
+    /* @__PURE__ */ t("td", { children: e?.description }),
+    /* @__PURE__ */ t("td", { children: e?.sku })
+  ] }, e.id), $ = (e) => {
+    const l = D(e), o = e.items.filter(
+      (A) => g.includes(A?.id)
+    ).length, s = e.items.length > 0 && o === e.items.length, d = `${e.items.length} ${e.items.length === 1 ? "item" : "items"}`;
+    return /* @__PURE__ */ i(L.Fragment, { children: [
+      /* @__PURE__ */ t(V, { children: /* @__PURE__ */ t("td", { colSpan: y, children: /* @__PURE__ */ t("div", { className: e.isNoPallet ? "no-pallet-divider" : void 0, children: /* @__PURE__ */ i(X, { children: [
+        /* @__PURE__ */ t(
+          m,
+          {
+            checked: s,
+            onChange: () => R(e, s),
+            "aria-label": e.isNoPallet ? "Select all items with no pallet ID" : `Select whole pallet ${e.label}`
+          }
+        ),
+        /* @__PURE__ */ i(
+          Y,
+          {
+            type: "button",
+            disabled: e.isNoPallet,
+            onClick: e.isNoPallet ? void 0 : () => I(e.key),
+            "aria-expanded": e.isNoPallet ? void 0 : l,
+            children: [
+              !e.isNoPallet && /* @__PURE__ */ t(Z, { $isExpanded: l, children: /* @__PURE__ */ t(W, {}) }),
+              /* @__PURE__ */ t("span", { className: "title", children: e.isNoPallet ? /* @__PURE__ */ t("span", { children: "No Pallet ID" }) : /* @__PURE__ */ i(x, { children: [
+                /* @__PURE__ */ t("span", { children: "Pallet ID:" }),
+                /* @__PURE__ */ t("strong", { children: e.label })
+              ] }) }),
+              /* @__PURE__ */ i("span", { className: "count", children: [
+                "(",
+                d,
+                ")"
+              ] }),
+              o > 0 && /* @__PURE__ */ i("span", { className: "selected", children: [
+                o,
+                " selected"
+              ] }),
+              !e.isNoPallet && /* @__PURE__ */ t(ee, { "aria-hidden": "true", children: l ? "−" : "+" })
+            ]
+          }
+        )
+      ] }) }) }) }),
+      l && e.items.map(b)
+    ] }, e.key);
+  };
+  return /* @__PURE__ */ t(x, { children: /* @__PURE__ */ t(O, { id: "tableScrolling", children: /* @__PURE__ */ i(U, { children: [
+    /* @__PURE__ */ t("thead", { children: /* @__PURE__ */ i("tr", { children: [
+      /* @__PURE__ */ t("th", { style: { position: "relative" }, children: /* @__PURE__ */ t(
+        m,
         {
-          checked: u,
-          onChange: f,
-          disabled: i?.length === 0 || i?.length === null
+          checked: P,
+          onChange: T,
+          disabled: n?.length === 0 || n?.length === null
         }
       ) }),
-      /* @__PURE__ */ e("th", { children: "Type" }),
-      /* @__PURE__ */ e("th", { children: "Code" }),
-      /* @__PURE__ */ e("th", { children: "Scan" }),
-      /* @__PURE__ */ e("th", { children: "Description" }),
-      /* @__PURE__ */ e("th", { children: "Delivery Instructions" }),
-      /* @__PURE__ */ e("th", { children: "Barcode" })
+      /* @__PURE__ */ t("th", { children: "Type" }),
+      /* @__PURE__ */ t("th", { children: "Code" }),
+      /* @__PURE__ */ t("th", { children: "Scan" }),
+      /* @__PURE__ */ t("th", { children: "Description" }),
+      /* @__PURE__ */ t("th", { children: "Delivery Instructions" }),
+      /* @__PURE__ */ t("th", { children: "Barcode" })
     ] }) }),
-    /* @__PURE__ */ e("tbody", { children: m ? /* @__PURE__ */ d("tr", { children: [
-      /* @__PURE__ */ e("td", { colSpan: 6, children: /* @__PURE__ */ e(C, { active: !0 }) }),
-      /* @__PURE__ */ e("td", { colSpan: 6 })
-    ] }) : i?.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e("td", { className: "emptyTd", colSpan: 7, children: /* @__PURE__ */ e(_, { children: /* @__PURE__ */ e(D, { description: "No Data Found" }) }) }) }) : i?.length > 0 && i?.map((t) => /* @__PURE__ */ d("tr", { children: [
-      /* @__PURE__ */ e("td", { style: { position: "relative" }, children: /* @__PURE__ */ e(
-        p,
-        {
-          checked: n?.some(
-            (l) => l.id === t.id
-          ),
-          onChange: () => y(t.id)
-        }
-      ) }),
-      /* @__PURE__ */ e("td", { children: t?.order_product_type?.type }),
-      /* @__PURE__ */ e("td", { children: t?.code }),
-      /* @__PURE__ */ e("td", { children: t?.description }),
-      /* @__PURE__ */ e("td", { children: t?.description }),
-      /* @__PURE__ */ e("td", { children: t?.description }),
-      /* @__PURE__ */ e("td", { children: t?.sku })
-    ] }, t.id)) })
-  ] }) });
+    /* @__PURE__ */ t("tbody", { children: S ? /* @__PURE__ */ i("tr", { children: [
+      /* @__PURE__ */ t("td", { colSpan: 6, children: /* @__PURE__ */ t(z, { active: !0 }) }),
+      /* @__PURE__ */ t("td", { colSpan: 6 })
+    ] }) : n?.length === 0 ? /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("td", { className: "emptyTd", colSpan: y, children: /* @__PURE__ */ t(q, { children: /* @__PURE__ */ t(B, { description: "No Data Found" }) }) }) }) : v ? N.map($) : n?.length > 0 && n?.map(
+      (e) => b(e)
+    ) })
+  ] }) }) });
 }
+const V = a.tr`
+  && > td {
+    padding: 4px 0;
+    background: transparent;
+    border: none;
+    border-radius: 0;
+  }
+
+  /*
+    Divider separating the No Pallet ID group from the palletised groups. Applied
+    to an inner wrapper rather than the td, because the rule above resets cell
+    borders at && specificity and would win over a border on the td itself.
+  */
+  && .no-pallet-divider {
+    border-top: 1px solid #c9c6c1;
+    padding-top: 10px;
+    margin-top: 4px;
+  }
+`, X = a.div`
+  /*
+    Required. The library Checkbox renders its real <input> as position:absolute
+    with no offsets, so it needs a positioned ancestor here — otherwise its
+    containing block resolves outside this scrolling modal, the invisible input
+    stops scrolling with the visible box, and clicks land on another pallet's
+    checkbox. Same reason the product cells set position:relative inline.
+  */
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  padding: 8px 12px;
+  border: 1px solid #e2e0db;
+  border-radius: 6px;
+  background: #f1f5f9;
+  font-family: 'Roboto', sans-serif;
+  font-size: 13px;
+  font-weight: 500;
+  color: #3a3630;
+
+`, Y = a.button`
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex: 1;
+  padding: 0;
+  border: none;
+  background: transparent;
+  cursor: pointer;
+  text-align: left;
+  font: inherit;
+  color: inherit;
+
+  &:disabled {
+    cursor: default;
+    opacity: 1;
+  }
+
+  .title {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    text-transform: uppercase;
+    letter-spacing: 0.3px;
+
+    strong {
+      font-weight: 700;
+      text-transform: none;
+      letter-spacing: 0;
+    }
+  }
+
+  .count {
+    color: #6a7378;
+    font-weight: 400;
+  }
+
+  .selected {
+    color: #0099ff;
+    font-weight: 600;
+    font-size: 12px;
+  }
+`, Z = a.span`
+  display: inline-flex;
+  align-items: center;
+  transition: transform 0.15s ease-in-out;
+  transform: rotate(${(n) => n.$isExpanded ? "0deg" : "-90deg"});
+`, ee = a.span`
+  margin-left: auto;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  border: 1px solid #cbd5e1;
+  border-radius: 4px;
+  background: #fff;
+  font-size: 14px;
+  line-height: 1;
+  color: #475569;
+`;
 export {
-  q as default
+  pe as default
 };
 //# sourceMappingURL=SplitOrderTable.js.map

package/dist/components/order-view/order-actions/actions/split-order/SplitOrderTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"SplitOrderTable.js","sources":["../../../../../../src/components/order-view/order-actions/actions/split-order/SplitOrderTable.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { useProductDetails } from '../../../store';\n\nimport { Empty, Skeleton } from 'antd';\nimport { Checkbox } from '@bjsdistribution/dms-component-library';\nimport { useLoading } from '../../../../order-daily-overview/store/store';\nimport { useSelectedSplit, useSplitOrderPayload } from '../../store';\nimport {\n  EmptyDataContainer,\n  StyledTable,\n  StyledTableWrapper,\n} from '../confirm-order/tables/ReminderStyles';\n\nfunction SplitOrderTable() {\n  const [orderProductDetails] = useProductDetails();\n  const [loading] = useLoading();\n  const [selectedSplits, setSelectedSplit] = useSelectedSplit();\n  const [selectAll, setSelectAll] = useState(false);\n  const [payload, setPayload] = useSplitOrderPayload();\n\n  // Handle Select All\n  const handleSelectAll = (e: any) => {\n    const isChecked = e.target.checked;\n    setSelectAll(isChecked);\n\n    if (isChecked) {\n      setSelectedSplit(\n        orderProductDetails?.map((order: any) => ({ id: order.id }))\n      );\n    } else {\n      setSelectedSplit([]);\n    }\n  };\n\n  const handleSelectedSplitList = (id: any) => {\n    setSelectedSplit(prevSelectedOrder => {\n      const isSelected = prevSelectedOrder?.some(order => order.id === id);\n\n      const updatedSelection = isSelected\n        ? prevSelectedOrder?.filter(order => order.id !== id)\n        : [...prevSelectedOrder, { id }];\n\n      setSelectAll(updatedSelection?.length === orderProductDetails?.length);\n\n      return updatedSelection;\n    });\n  };\n\n  useEffect(() => {\n    setPayload({\n      ...payload,\n      return_order: 1, // FOR SPLIT ORDER WE ARE ASKED TO SET THIS AS 1\n      products: selectedSplits?.map(order => order.id),\n      force: true,\n    });\n  }, [selectedSplits, setPayload]);\n\n  return (\n    <StyledTableWrapper id=\"tableScrolling\">\n      <StyledTable>\n        <thead>\n          <tr>\n            <th style={{ position: 'relative' }}>\n              <Checkbox\n                checked={selectAll}\n                onChange={handleSelectAll}\n                disabled={\n                  orderProductDetails?.length === 0 ||\n                  orderProductDetails?.length === null\n                }\n              />\n            </th>\n            <th>Type</th>\n            <th>Code</th>\n            <th>Scan</th>\n            <th>Description</th>\n            <th>Delivery Instructions</th>\n            <th>Barcode</th>\n          </tr>\n        </thead>\n        <tbody>\n          {loading ? (\n            <tr>\n              <td colSpan={6}>\n                <Skeleton active />\n              </td>\n              <td colSpan={6}></td>\n            </tr>\n          ) : orderProductDetails?.length === 0 ? (\n            <tr>\n              <td className=\"emptyTd\" colSpan={7}>\n                <EmptyDataContainer>\n                  <Empty description=\"No Data Found\" />\n                </EmptyDataContainer>\n              </td>\n            </tr>\n          ) : (\n            orderProductDetails?.length > 0 &&\n            orderProductDetails?.map((order: any) => (\n              <tr key={order.id}>\n                <td style={{ position: 'relative' }}>\n                  <Checkbox\n                    checked={selectedSplits?.some(\n                      selectedOrder => selectedOrder.id === order.id\n                    )}\n                    onChange={() => handleSelectedSplitList(order.id)}\n                  />\n                </td>\n                <td>{order?.order_product_type?.type}</td>\n                <td>{order?.code}</td>\n                <td>{order?.description}</td>\n                <td>{order?.description}</td>\n                <td>{order?.description}</td>\n                <td>{order?.sku}</td>\n              </tr>\n            ))\n          )}\n        </tbody>\n      </StyledTable>\n    </StyledTableWrapper>\n  );\n}\n\nexport default SplitOrderTable;\n"],"names":["SplitOrderTable","orderProductDetails","useProductDetails","loading","useLoading","selectedSplits","setSelectedSplit","useSelectedSplit","selectAll","setSelectAll","useState","payload","setPayload","useSplitOrderPayload","handleSelectAll","e","isChecked","order","handleSelectedSplitList","id","prevSelectedOrder","updatedSelection","useEffect","jsx","StyledTableWrapper","StyledTable","Checkbox","jsxs","Skeleton","EmptyDataContainer","Empty","selectedOrder"],"mappings":"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"}
+{"version":3,"file":"SplitOrderTable.js","sources":["../../../../../../src/components/order-view/order-actions/actions/split-order/SplitOrderTable.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport { useReturnProductDetails } from '../../../store';\n\nimport { Empty, Skeleton } from 'antd';\nimport { Checkbox } from '@bjsdistribution/dms-component-library';\nimport { useLoading } from '../../../../order-daily-overview/store/store';\nimport { useSelectedSplit, useSplitOrderPayload } from '../../store';\nimport {\n  EmptyDataContainer,\n  StyledTable,\n  StyledTableWrapper,\n} from '../confirm-order/tables/ReminderStyles';\nimport styled from 'styled-components';\nimport ChevronDownIcon from '../../../../../assets/icons/ChevronDownIcon';\nimport {\n  groupProductsByPallet,\n  hasAnyPallet,\n  PalletGroup,\n  toggleGroupSelectionIds,\n} from '../../../return-client-products/product-table/palletGrouping';\n\nconst COLUMN_COUNT = 7;\n\nfunction SplitOrderTable() {\n  /**\n   * Reads the return-products atom rather than the shared `productDetails` one:\n   * this modal splits a return order, and only that payload carries pallet data.\n   */\n  const [orderProductDetails] = useReturnProductDetails();\n  const [loading] = useLoading();\n  const [selectedSplits, setSelectedSplit] = useSelectedSplit();\n  const [selectAll, setSelectAll] = useState(false);\n  const [payload, setPayload] = useSplitOrderPayload();\n\n  const selectedIds = useMemo(\n    () => (selectedSplits ?? []).map((order: any) => order?.id),\n    [selectedSplits]\n  );\n\n  const palletGroups = useMemo(\n    () => groupProductsByPallet(orderProductDetails),\n    [orderProductDetails]\n  );\n\n  /** Return orders picked before pallet scanning keep the original flat list. */\n  const isGrouped = useMemo(() => hasAnyPallet(orderProductDetails), [\n    orderProductDetails,\n  ]);\n\n  /** Pallet groups start collapsed; the No Pallet ID group is always open. */\n  const [expandedPallets, setExpandedPallets] = useState<\n    Record<string, boolean>\n  >({});\n\n  const isGroupExpanded = (group: PalletGroup) =>\n    group.isNoPallet || !!expandedPallets[group.key];\n\n  const togglePallet = (key: string) =>\n    setExpandedPallets(prev => ({ ...prev, [key]: !prev[key] }));\n\n  const applySelection = (ids: any[]) => {\n    setSelectedSplit(ids.map((id: any) => ({ id })));\n    setSelectAll(ids.length === orderProductDetails?.length);\n  };\n\n  // Handle Select All\n  const handleSelectAll = (e: any) => {\n    const isChecked = e.target.checked;\n    setSelectAll(isChecked);\n\n    if (isChecked) {\n      setSelectedSplit(\n        orderProductDetails?.map((order: any) => ({ id: order.id }))\n      );\n    } else {\n      setSelectedSplit([]);\n    }\n  };\n\n  const handleSelectedSplitList = (id: any) => {\n    setSelectedSplit((prevSelectedOrder: any) => {\n      const isSelected = prevSelectedOrder?.some(\n        (order: any) => order.id === id\n      );\n\n      const updatedSelection = isSelected\n        ? prevSelectedOrder?.filter((order: any) => order.id !== id)\n        : [...prevSelectedOrder, { id }];\n\n      setSelectAll(updatedSelection?.length === orderProductDetails?.length);\n\n      return updatedSelection;\n    });\n  };\n\n  /** Selecting a whole pallet is a shortcut for ticking each of its rows. */\n  const toggleGroupSelection = (group: PalletGroup, allSelected: boolean) => {\n    const groupIds = group.items.map((item: any) => item?.id);\n    applySelection(toggleGroupSelectionIds(selectedIds, groupIds, allSelected));\n  };\n\n  useEffect(() => {\n    setPayload({\n      ...payload,\n      return_order: 1, // FOR SPLIT ORDER WE ARE ASKED TO SET THIS AS 1\n      products: selectedSplits?.map((order: any) => order.id),\n      force: true,\n    });\n  }, [selectedSplits, setPayload]);\n\n  const renderProductRow = (product: any) => (\n    <tr key={product.id}>\n      <td style={{ position: 'relative' }}>\n        <Checkbox\n          checked={selectedSplits?.some(\n            (selectedOrder: any) => selectedOrder.id === product.id\n          )}\n          onChange={() => handleSelectedSplitList(product.id)}\n        />\n      </td>\n      <td>{product?.order_product_type?.type}</td>\n      <td>{product?.code}</td>\n      <td>{product?.description}</td>\n      <td>{product?.description}</td>\n      <td>{product?.description}</td>\n      <td>{product?.sku}</td>\n    </tr>\n  );\n\n  const renderPalletGroup = (group: PalletGroup) => {\n    const expanded = isGroupExpanded(group);\n    const selectedInGroup = group.items.filter((item: any) =>\n      selectedIds.includes(item?.id)\n    ).length;\n    const allSelectedInGroup =\n      group.items.length > 0 && selectedInGroup === group.items.length;\n    const itemLabel = `${group.items.length} ${\n      group.items.length === 1 ? 'item' : 'items'\n    }`;\n\n    return (\n      <React.Fragment key={group.key}>\n        <PalletHeaderRow>\n          <td colSpan={COLUMN_COUNT}>\n            <div className={group.isNoPallet ? 'no-pallet-divider' : undefined}>\n              <PalletHeaderBar>\n              <Checkbox\n                checked={allSelectedInGroup}\n                onChange={() => toggleGroupSelection(group, allSelectedInGroup)}\n                aria-label={\n                  group.isNoPallet\n                    ? 'Select all items with no pallet ID'\n                    : `Select whole pallet ${group.label}`\n                }\n              />\n\n              <PalletHeaderToggle\n                type=\"button\"\n                disabled={group.isNoPallet}\n                onClick={\n                  group.isNoPallet ? undefined : () => togglePallet(group.key)\n                }\n                aria-expanded={group.isNoPallet ? undefined : expanded}\n              >\n                {!group.isNoPallet && (\n                  <Chevron $isExpanded={expanded}>\n                    <ChevronDownIcon />\n                  </Chevron>\n                )}\n\n                <span className=\"title\">\n                  {group.isNoPallet ? (\n                    <span>No Pallet ID</span>\n                  ) : (\n                    <>\n                      <span>Pallet ID:</span>\n                      <strong>{group.label}</strong>\n                    </>\n                  )}\n                </span>\n\n                <span className=\"count\">({itemLabel})</span>\n\n                {selectedInGroup > 0 && (\n                  <span className=\"selected\">{selectedInGroup} selected</span>\n                )}\n\n                {!group.isNoPallet && (\n                  <ToggleGlyph aria-hidden=\"true\">\n                    {expanded ? '−' : '+'}\n                  </ToggleGlyph>\n                )}\n              </PalletHeaderToggle>\n              </PalletHeaderBar>\n            </div>\n          </td>\n        </PalletHeaderRow>\n\n        {expanded && group.items.map(renderProductRow)}\n      </React.Fragment>\n    );\n  };\n\n  return (\n    <>\n      <StyledTableWrapper id=\"tableScrolling\">\n        <StyledTable>\n          <thead>\n            <tr>\n              <th style={{ position: 'relative' }}>\n                <Checkbox\n                  checked={selectAll}\n                  onChange={handleSelectAll}\n                  disabled={\n                    orderProductDetails?.length === 0 ||\n                    orderProductDetails?.length === null\n                  }\n                />\n              </th>\n              <th>Type</th>\n              <th>Code</th>\n              <th>Scan</th>\n              <th>Description</th>\n              <th>Delivery Instructions</th>\n              <th>Barcode</th>\n            </tr>\n          </thead>\n          <tbody>\n            {loading ? (\n              <tr>\n                <td colSpan={6}>\n                  <Skeleton active />\n                </td>\n                <td colSpan={6}></td>\n              </tr>\n            ) : orderProductDetails?.length === 0 ? (\n              <tr>\n                <td className=\"emptyTd\" colSpan={COLUMN_COUNT}>\n                  <EmptyDataContainer>\n                    <Empty description=\"No Data Found\" />\n                  </EmptyDataContainer>\n                </td>\n              </tr>\n            ) : isGrouped ? (\n              palletGroups.map(renderPalletGroup)\n            ) : (\n              orderProductDetails?.length > 0 &&\n              orderProductDetails?.map((product: any) =>\n                renderProductRow(product)\n              )\n            )}\n          </tbody>\n        </StyledTable>\n      </StyledTableWrapper>\n    </>\n  );\n}\n\nconst PalletHeaderRow = styled.tr`\n  && > td {\n    padding: 4px 0;\n    background: transparent;\n    border: none;\n    border-radius: 0;\n  }\n\n  /*\n    Divider separating the No Pallet ID group from the palletised groups. Applied\n    to an inner wrapper rather than the td, because the rule above resets cell\n    borders at && specificity and would win over a border on the td itself.\n  */\n  && .no-pallet-divider {\n    border-top: 1px solid #c9c6c1;\n    padding-top: 10px;\n    margin-top: 4px;\n  }\n`;\n\nconst PalletHeaderBar = styled.div`\n  /*\n    Required. The library Checkbox renders its real <input> as position:absolute\n    with no offsets, so it needs a positioned ancestor here — otherwise its\n    containing block resolves outside this scrolling modal, the invisible input\n    stops scrolling with the visible box, and clicks land on another pallet's\n    checkbox. Same reason the product cells set position:relative inline.\n  */\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  width: 100%;\n  padding: 8px 12px;\n  border: 1px solid #e2e0db;\n  border-radius: 6px;\n  background: #f1f5f9;\n  font-family: 'Roboto', sans-serif;\n  font-size: 13px;\n  font-weight: 500;\n  color: #3a3630;\n\n`;\n\nconst PalletHeaderToggle = styled.button`\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  flex: 1;\n  padding: 0;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  text-align: left;\n  font: inherit;\n  color: inherit;\n\n  &:disabled {\n    cursor: default;\n    opacity: 1;\n  }\n\n  .title {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    text-transform: uppercase;\n    letter-spacing: 0.3px;\n\n    strong {\n      font-weight: 700;\n      text-transform: none;\n      letter-spacing: 0;\n    }\n  }\n\n  .count {\n    color: #6a7378;\n    font-weight: 400;\n  }\n\n  .selected {\n    color: #0099ff;\n    font-weight: 600;\n    font-size: 12px;\n  }\n`;\n\nconst Chevron = styled.span<{ $isExpanded: boolean }>`\n  display: inline-flex;\n  align-items: center;\n  transition: transform 0.15s ease-in-out;\n  transform: rotate(${props => (props.$isExpanded ? '0deg' : '-90deg')});\n`;\n\nconst ToggleGlyph = styled.span`\n  margin-left: auto;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  border: 1px solid #cbd5e1;\n  border-radius: 4px;\n  background: #fff;\n  font-size: 14px;\n  line-height: 1;\n  color: #475569;\n`;\n\nexport default SplitOrderTable;\n"],"names":["COLUMN_COUNT","SplitOrderTable","orderProductDetails","useReturnProductDetails","loading","useLoading","selectedSplits","setSelectedSplit","useSelectedSplit","selectAll","setSelectAll","useState","payload","setPayload","useSplitOrderPayload","selectedIds","useMemo","order","palletGroups","groupProductsByPallet","isGrouped","hasAnyPallet","expandedPallets","setExpandedPallets","isGroupExpanded","group","togglePallet","key","prev","applySelection","ids","id","handleSelectAll","isChecked","handleSelectedSplitList","prevSelectedOrder","updatedSelection","toggleGroupSelection","allSelected","groupIds","item","toggleGroupSelectionIds","useEffect","renderProductRow","product","jsxs","jsx","Checkbox","selectedOrder","renderPalletGroup","expanded","selectedInGroup","allSelectedInGroup","itemLabel","React","PalletHeaderRow","PalletHeaderBar","PalletHeaderToggle","Chevron","ChevronDownIcon","Fragment","ToggleGlyph","StyledTableWrapper","StyledTable","Skeleton","EmptyDataContainer","Empty","styled","props"],"mappings":"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"}

package/dist/components/order-view/order-actions/actions/split-order/index.js

@@ -1,54 +1,67 @@
-import { jsx as t, Fragment as x } from "react/jsx-runtime";
-import { useEffect as b } from "react";
-import g from "../../../../../common/modals/order-action-modal/OrderActionModal.js";
-import O from "styled-components";
-import A from "./SplitOrderTable.js";
-import { useCurrentAction as v, useOrderDetails as w, useOrderId as y } from "../../../store.js";
-import { useApiHook as C } from "@bjsdistribution/dms-component-library";
-import { useSplitOrderPayload as D, useSelectedSplit as P } from "../../store.js";
-import { notification as I } from "antd";
-import { useNavigate as T } from "react-router-dom";
-function z() {
-  const [, o] = v(), [c] = w(), r = c?.order_recipient, a = `${r?.recipient_name}, ${r?.postcode}`, [i, p] = y(), [m] = D(), [n, s] = P(), u = () => {
+import { jsx as e, Fragment as x, jsxs as O } from "react/jsx-runtime";
+import { useEffect as v } from "react";
+import A from "../../../../../common/modals/order-action-modal/OrderActionModal.js";
+import c from "styled-components";
+import w from "./SplitOrderTable.js";
+import { useCurrentAction as y, useOrderDetails as C, useOrderId as D } from "../../../store.js";
+import { useApiHook as P } from "@bjsdistribution/dms-component-library";
+import { useSplitOrderPayload as T, useSelectedSplit as I } from "../../store.js";
+import { notification as $, Spin as k } from "antd";
+import { useNavigate as j } from "react-router-dom";
+function K() {
+  const [, o] = y(), [p] = C(), i = p?.order_recipient, u = `${i?.recipient_name}, ${i?.postcode}`, [r, m] = D(), [f] = T(), [n, s] = I(), S = () => {
     o(void 0);
-  }, f = T(), {
-    data: e,
-    setShouldPerformAction: S
-  } = C({
-    endpoint: `/v1/return/split/${i}`,
+  }, h = j(), {
+    data: t,
+    loading: d,
+    setShouldPerformAction: b
+  } = P({
+    endpoint: `/v1/return/split/${r}`,
     method: "POST",
-    body: m,
+    body: f,
     performAction: !1
-  }), h = () => {
-    i && S(!0);
-  }, d = e?.data?.new_order;
-  return b(() => {
-    if (e?.code === 200) {
-      const l = location.pathname.split("/").slice(0, -1).join("/");
-      console.log(l, "currentPath"), f(`${l}/${d}`), p(d), s([]), I.success({
+  }), g = () => {
+    r && b(!0);
+  }, l = t?.data?.new_order;
+  return v(() => {
+    if (t?.code === 200) {
+      const a = location.pathname.split("/").slice(0, -1).join("/");
+      console.log(a, "currentPath"), h(`${a}/${l}`), m(l), s([]), $.success({
         message: "Success",
         description: (
           //@ts-ignore
-          e?.message || "Sucess"
+          t?.message || "Sucess"
         )
       }), o(void 0), s([]);
     }
-  }, [e]), /* @__PURE__ */ t(
-    g,
+  }, [t]), /* @__PURE__ */ e(
+    A,
     {
       headerTitle: "Split Order",
       showAdditionalInfo: !0,
-      infoText: a,
-      onCloseHeader: u,
-      onSubmit: h,
-      submitBtnTitle: "Split Order",
-      footerActions: /* @__PURE__ */ t(x, {}),
-      isSubmitDisabled: n?.length > 0 ? !n : !0,
-      children: /* @__PURE__ */ t($, { children: /* @__PURE__ */ t(A, {}) })
+      infoText: u,
+      onCloseHeader: S,
+      onSubmit: g,
+      submitBtnTitle: d ? /* @__PURE__ */ O(_, { children: [
+        /* @__PURE__ */ e(k, { size: "small" }),
+        "Splitting..."
+      ] }) : "Split Order",
+      footerActions: /* @__PURE__ */ e(x, {}),
+      isSubmitDisabled: d ? !0 : n?.length > 0 ? !n : !0,
+      children: /* @__PURE__ */ e(H, { children: /* @__PURE__ */ e(w, {}) })
     }
   );
 }
-const $ = O.div`
+const _ = c.span`
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+
+  /* The button label is light, so the default dark spinner would be invisible. */
+  .ant-spin-dot-item {
+    background-color: currentColor;
+  }
+`, H = c.div`
   /* display: flex; */
   padding: 15px 12px;
   flex: 1 0 0;
@@ -64,6 +77,6 @@ const $ = O.div`
   scrollbar-width: thin;
 `;
 export {
-  z as default
+  K as default
 };
 //# sourceMappingURL=index.js.map