@orbe-agro/client-core 3.4.10 → 3.4.12

package/dist/lib/@ecme/views/concepts/customers/CustomerForm/ProfileImageSection.js

@@ -0,0 +1,75 @@
+import { jsxs as o, jsx as e, Fragment as n } from "react/jsx-runtime";
+import "../../../../components/ui/Card/index.js";
+import { Avatar as d } from "../../../../components/ui/Avatar/index.js";
+import "../../../../components/ui/Upload/index.js";
+import "../../../../components/ui/index.js";
+import s from "../../../../components/shared/DoubleSidedImage.js";
+import { Controller as p } from "react-hook-form";
+import { HiOutlineUser as c } from "react-icons/hi";
+import g from "../../../../components/ui/Card/Card.js";
+import f from "../../../../components/ui/Upload/Upload.js";
+import h from "../../../../components/ui/Button/Button.js";
+const L = ({ control: t }) => {
+  const i = (r) => {
+    let a = !0;
+    const l = ["image/jpeg", "image/png"];
+    if (r)
+      for (const m of r)
+        l.includes(m.type) || (a = "Please upload a .jpeg or .png file!");
+    return a;
+  };
+  return /* @__PURE__ */ o(g, { children: [
+    /* @__PURE__ */ e("h4", { className: "mb-6", children: "Image" }),
+    /* @__PURE__ */ e("div", { className: "bg-gray-100 dark:bg-gray-700 rounded-lg text-center p-4", children: /* @__PURE__ */ e("div", { className: "text-center", children: /* @__PURE__ */ e(
+      p,
+      {
+        name: "img",
+        control: t,
+        render: ({ field: r }) => /* @__PURE__ */ o(n, { children: [
+          /* @__PURE__ */ e("div", { className: "flex items-center justify-center", children: r.value ? /* @__PURE__ */ e(
+            d,
+            {
+              size: 100,
+              className: "border-4 border-white bg-gray-100 text-gray-300 shadow-lg",
+              icon: /* @__PURE__ */ e(c, {}),
+              src: r.value
+            }
+          ) : /* @__PURE__ */ e(
+            s,
+            {
+              src: "/img/others/upload.png",
+              darkModeSrc: "/img/others/upload-dark.png",
+              alt: "Upload image"
+            }
+          ) }),
+          /* @__PURE__ */ e(
+            f,
+            {
+              showList: !1,
+              uploadLimit: 1,
+              beforeUpload: i,
+              onChange: (a) => {
+                a.length > 0 && r.onChange(
+                  URL.createObjectURL(a[0])
+                );
+              },
+              children: /* @__PURE__ */ e(
+                h,
+                {
+                  variant: "solid",
+                  className: "mt-4",
+                  type: "button",
+                  children: "Upload Image"
+                }
+              )
+            }
+          )
+        ] })
+      }
+    ) }) })
+  ] });
+};
+export {
+  L as default
+};
+//# sourceMappingURL=ProfileImageSection.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerForm/ProfileImageSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProfileImageSection.js","sources":["../../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/ProfileImageSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Avatar from '@/components/ui/Avatar'\nimport Upload from '@/components/ui/Upload'\nimport { Button } from '@/components/ui'\nimport DoubleSidedImage from '@/components/shared/DoubleSidedImage'\nimport { Controller } from 'react-hook-form'\nimport { HiOutlineUser } from 'react-icons/hi'\nimport type { FormSectionBaseProps } from './types'\n\ntype ProfileImageSectionProps = FormSectionBaseProps\n\nconst ProfileImage = ({ control }: ProfileImageSectionProps) => {\n    const beforeUpload = (files: FileList | null) => {\n        let valid: string | boolean = true\n\n        const allowedFileType = ['image/jpeg', 'image/png']\n        if (files) {\n            for (const file of files) {\n                if (!allowedFileType.includes(file.type)) {\n                    valid = 'Please upload a .jpeg or .png file!'\n                }\n            }\n        }\n\n        return valid\n    }\n\n    return (\n        <Card>\n            <h4 className=\"mb-6\">Image</h4>\n            <div className=\"bg-gray-100 dark:bg-gray-700 rounded-lg text-center p-4\">\n                <div className=\"text-center\">\n                    <Controller\n                        name=\"img\"\n                        control={control}\n                        render={({ field }) => (\n                            <>\n                                <div className=\"flex items-center justify-center\">\n                                    {field.value ? (\n                                        <Avatar\n                                            size={100}\n                                            className=\"border-4 border-white bg-gray-100 text-gray-300 shadow-lg\"\n                                            icon={<HiOutlineUser />}\n                                            src={field.value}\n                                        />\n                                    ) : (\n                                        <DoubleSidedImage\n                                            src=\"/img/others/upload.png\"\n                                            darkModeSrc=\"/img/others/upload-dark.png\"\n                                            alt=\"Upload image\"\n                                        />\n                                    )}\n                                </div>\n                                <Upload\n                                    showList={false}\n                                    uploadLimit={1}\n                                    beforeUpload={beforeUpload}\n                                    onChange={(files) => {\n                                        if (files.length > 0) {\n                                            field.onChange(\n                                                URL.createObjectURL(files[0]),\n                                            )\n                                        }\n                                    }}\n                                >\n                                    <Button\n                                        variant=\"solid\"\n                                        className=\"mt-4\"\n                                        type=\"button\"\n                                    >\n                                        Upload Image\n                                    </Button>\n                                </Upload>\n                            </>\n                        )}\n                    />\n                </div>\n            </div>\n        </Card>\n    )\n}\n\nexport default ProfileImage\n"],"names":["ProfileImage","control","beforeUpload","files","valid","allowedFileType","file","Card","jsx","Controller","field","jsxs","Fragment","Avatar","HiOutlineUser","DoubleSidedImage","Upload","Button"],"mappings":";;;;;;;;;;;AAWA,MAAMA,IAAe,CAAC,EAAE,SAAAC,QAAwC;AACtD,QAAAC,IAAe,CAACC,MAA2B;AAC7C,QAAIC,IAA0B;AAExB,UAAAC,IAAkB,CAAC,cAAc,WAAW;AAClD,QAAIF;AACA,iBAAWG,KAAQH;AACf,QAAKE,EAAgB,SAASC,EAAK,IAAI,MAC3BF,IAAA;AAKb,WAAAA;AAAA,EACX;AAEA,2BACKG,GACG,EAAA,UAAA;AAAA,IAAC,gBAAAC,EAAA,MAAA,EAAG,WAAU,QAAO,UAAK,SAAA;AAAA,sBACzB,OAAI,EAAA,WAAU,2DACX,UAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,eACX,UAAA,gBAAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,MAAK;AAAA,QACL,SAAAR;AAAA,QACA,QAAQ,CAAC,EAAE,OAAAS,EAAA,MAEH,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,UAAA,gBAAAJ,EAAC,OAAI,EAAA,WAAU,oCACV,UAAAE,EAAM,QACH,gBAAAF;AAAA,YAACK;AAAA,YAAA;AAAA,cACG,MAAM;AAAA,cACN,WAAU;AAAA,cACV,wBAAOC,GAAc,EAAA;AAAA,cACrB,KAAKJ,EAAM;AAAA,YAAA;AAAA,UAAA,IAGf,gBAAAF;AAAA,YAACO;AAAA,YAAA;AAAA,cACG,KAAI;AAAA,cACJ,aAAY;AAAA,cACZ,KAAI;AAAA,YAAA;AAAA,UAAA,GAGhB;AAAA,UACA,gBAAAP;AAAA,YAACQ;AAAA,YAAA;AAAA,cACG,UAAU;AAAA,cACV,aAAa;AAAA,cACb,cAAAd;AAAA,cACA,UAAU,CAACC,MAAU;AACb,gBAAAA,EAAM,SAAS,KACTO,EAAA;AAAA,kBACF,IAAI,gBAAgBP,EAAM,CAAC,CAAC;AAAA,gBAChC;AAAA,cAER;AAAA,cAEA,UAAA,gBAAAK;AAAA,gBAACS;AAAA,gBAAA;AAAA,kBACG,SAAQ;AAAA,kBACR,WAAU;AAAA,kBACV,MAAK;AAAA,kBACR,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAED;AAAA,UAAA;AAAA,QACJ,EACJ,CAAA;AAAA,MAAA;AAAA,OAGZ,EACJ,CAAA;AAAA,EAAA,GACJ;AAER;"}

package/dist/lib/@ecme/views/concepts/customers/CustomerForm/TagsSection.js

@@ -0,0 +1,36 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import "../../../../components/ui/Card/index.js";
+import "../../../../components/ui/Select/index.js";
+import { Controller as s } from "react-hook-form";
+import l from "react-select/creatable";
+import n from "../../../../components/ui/Card/Card.js";
+import m from "../../../../components/ui/Select/Select.js";
+const i = [
+  { value: "frequentShoppers", label: "Frequent Shoppers" },
+  { value: "inactiveCustomers", label: "Inactive" },
+  { value: "newCustomers", label: "New" }
+], b = ({ control: r }) => /* @__PURE__ */ a(n, { children: [
+  /* @__PURE__ */ e("h4", { className: "mb-2", children: "Customer Tags" }),
+  /* @__PURE__ */ e("div", { className: "mt-6", children: /* @__PURE__ */ e(
+    s,
+    {
+      name: "tags",
+      control: r,
+      render: ({ field: t }) => /* @__PURE__ */ e(
+        m,
+        {
+          isMulti: !0,
+          isClearable: !0,
+          placeholder: "Add tags for customer...",
+          componentAs: l,
+          options: i,
+          onChange: (o) => t.onChange(o)
+        }
+      )
+    }
+  ) })
+] });
+export {
+  b as default
+};
+//# sourceMappingURL=TagsSection.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerForm/TagsSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagsSection.js","sources":["../../../../../../../lib/@ecme/views/concepts/customers/CustomerForm/TagsSection.tsx"],"sourcesContent":["import Card from '@/components/ui/Card'\nimport Select from '@/components/ui/Select'\nimport { Controller } from 'react-hook-form'\nimport CreatableSelect from 'react-select/creatable'\nimport type { FormSectionBaseProps } from './types'\n\ntype TagsSectionProps = FormSectionBaseProps\n\nconst defaultOptions = [\n    { value: 'frequentShoppers', label: 'Frequent Shoppers' },\n    { value: 'inactiveCustomers', label: 'Inactive' },\n    { value: 'newCustomers', label: 'New' },\n]\n\nconst TagsSection = ({ control }: TagsSectionProps) => {\n    return (\n        <Card>\n            <h4 className=\"mb-2\">Customer Tags</h4>\n            <div className=\"mt-6\">\n                <Controller\n                    name=\"tags\"\n                    control={control}\n                    render={({ field }) => (\n                        <Select\n                            isMulti\n                            isClearable\n                            placeholder=\"Add tags for customer...\"\n                            componentAs={CreatableSelect}\n                            options={defaultOptions}\n                            onChange={(option) => field.onChange(option)}\n                        />\n                    )}\n                />\n            </div>\n        </Card>\n    )\n}\n\nexport default TagsSection\n"],"names":["defaultOptions","TagsSection","control","Card","jsx","Controller","field","Select","CreatableSelect","option"],"mappings":";;;;;;;AAQA,MAAMA,IAAiB;AAAA,EACnB,EAAE,OAAO,oBAAoB,OAAO,oBAAoB;AAAA,EACxD,EAAE,OAAO,qBAAqB,OAAO,WAAW;AAAA,EAChD,EAAE,OAAO,gBAAgB,OAAO,MAAM;AAC1C,GAEMC,IAAc,CAAC,EAAE,SAAAC,0BAEdC,GACG,EAAA,UAAA;AAAA,EAAC,gBAAAC,EAAA,MAAA,EAAG,WAAU,QAAO,UAAa,iBAAA;AAAA,EAClC,gBAAAA,EAAC,OAAI,EAAA,WAAU,QACX,UAAA,gBAAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,SAAAH;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAI,EAAA,MACP,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACG,SAAO;AAAA,UACP,aAAW;AAAA,UACX,aAAY;AAAA,UACZ,aAAaC;AAAA,UACb,SAASR;AAAA,UACT,UAAU,CAACS,MAAWH,EAAM,SAASG,CAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAC/C;AAAA,EAAA,EAGZ,CAAA;AAAA,GACJ;"}

package/dist/lib/@ecme/views/concepts/customers/CustomerForm/index.js

@@ -0,0 +1,5 @@
+import r from "./CustomerForm.js";
+export {
+  r as default
+};
+//# sourceMappingURL=index.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerForm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/lib/@ecme/views/concepts/customers/CustomerForm/types.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=types.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerForm/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/lib/@ecme/views/concepts/customers/CustomerList/CustomerList.js

@@ -0,0 +1,22 @@
+import { jsxs as r, Fragment as o, jsx as e } from "react/jsx-runtime";
+import t from "../../../../components/shared/AdaptiveCard.js";
+import m from "../../../../components/shared/Container.js";
+import s from "./components/CustomerListTable.js";
+import i from "./components/CustomerListActionTools.js";
+import l from "./components/CustomersListTableTools.js";
+import d from "./components/CustomerListSelected.js";
+const C = () => /* @__PURE__ */ r(o, { children: [
+  /* @__PURE__ */ e(m, { children: /* @__PURE__ */ e(t, { children: /* @__PURE__ */ r("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ r("div", { className: "flex flex-col md:flex-row md:items-center md:justify-between gap-2", children: [
+      /* @__PURE__ */ e("h3", { children: "Customers" }),
+      /* @__PURE__ */ e(i, {})
+    ] }),
+    /* @__PURE__ */ e(l, {}),
+    /* @__PURE__ */ e(s, {})
+  ] }) }) }),
+  /* @__PURE__ */ e(d, {})
+] });
+export {
+  C as default
+};
+//# sourceMappingURL=CustomerList.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerList/CustomerList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomerList.js","sources":["../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/CustomerList.tsx"],"sourcesContent":["import AdaptiveCard from '@/components/shared/AdaptiveCard'\nimport Container from '@/components/shared/Container'\nimport CustomerListTable from './components/CustomerListTable'\nimport CustomerListActionTools from './components/CustomerListActionTools'\nimport CustomersListTableTools from './components/CustomersListTableTools'\nimport CustomerListSelected from './components/CustomerListSelected'\n\nconst CustomerList = () => {\n    return (\n        <>\n            <Container>\n                <AdaptiveCard>\n                    <div className=\"flex flex-col gap-4\">\n                        <div className=\"flex flex-col md:flex-row md:items-center md:justify-between gap-2\">\n                            <h3>Customers</h3>\n                            <CustomerListActionTools />\n                        </div>\n                        <CustomersListTableTools />\n                        <CustomerListTable />\n                    </div>\n                </AdaptiveCard>\n            </Container>\n            <CustomerListSelected />\n        </>\n    )\n}\n\nexport default CustomerList\n"],"names":["CustomerList","jsxs","Fragment","jsx","Container","AdaptiveCard","CustomerListActionTools","CustomersListTableTools","CustomerListTable","CustomerListSelected"],"mappings":";;;;;;;AAOA,MAAMA,IAAe,MAGT,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,EAAA,gBAAAC,EAACC,KACG,UAAC,gBAAAD,EAAAE,GAAA,EACG,UAAC,gBAAAJ,EAAA,OAAA,EAAI,WAAU,uBACX,UAAA;AAAA,IAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,sEACX,UAAA;AAAA,MAAA,gBAAAE,EAAC,QAAG,UAAS,YAAA,CAAA;AAAA,wBACZG,GAAwB,CAAA,CAAA;AAAA,IAAA,GAC7B;AAAA,sBACCC,GAAwB,EAAA;AAAA,sBACxBC,GAAkB,CAAA,CAAA;AAAA,EAAA,EACvB,CAAA,EACJ,CAAA,GACJ;AAAA,oBACCC,GAAqB,CAAA,CAAA;AAAA,GAC1B;"}

package/dist/lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListActionTools.js

@@ -0,0 +1,41 @@
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
+import "../../../../../components/ui/Button/index.js";
+import { TbCloudDownload as l, TbUserPlus as i } from "react-icons/tb";
+import { useNavigate as m } from "react-router-dom";
+import a from "../hooks/useCustomerList.js";
+import { CSVLink as c } from "react-csv";
+import s from "../../../../../components/ui/Button/Button.js";
+const N = () => {
+  const t = m(), { customerList: e } = a();
+  return /* @__PURE__ */ r("div", { className: "flex flex-col md:flex-row gap-3", children: [
+    /* @__PURE__ */ o(
+      c,
+      {
+        className: "w-full",
+        filename: "customerList.csv",
+        data: e,
+        children: /* @__PURE__ */ o(
+          s,
+          {
+            icon: /* @__PURE__ */ o(l, { className: "text-xl" }),
+            className: "w-full",
+            children: "Download"
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ o(
+      s,
+      {
+        variant: "solid",
+        icon: /* @__PURE__ */ o(i, { className: "text-xl" }),
+        onClick: () => t("/concepts/customers/customer-create"),
+        children: "Add new"
+      }
+    )
+  ] });
+};
+export {
+  N as default
+};
+//# sourceMappingURL=CustomerListActionTools.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListActionTools.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomerListActionTools.js","sources":["../../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListActionTools.tsx"],"sourcesContent":["import Button from '@/components/ui/Button'\nimport { TbCloudDownload, TbUserPlus } from 'react-icons/tb'\nimport { useNavigate } from 'react-router-dom'\nimport useCustomerList from '../hooks/useCustomerList'\nimport { CSVLink } from 'react-csv'\n\nconst CustomerListActionTools = () => {\n    const navigate = useNavigate()\n\n    const { customerList } = useCustomerList()\n\n    return (\n        <div className=\"flex flex-col md:flex-row gap-3\">\n            <CSVLink\n                className=\"w-full\"\n                filename=\"customerList.csv\"\n                data={customerList}\n            >\n                <Button\n                    icon={<TbCloudDownload className=\"text-xl\" />}\n                    className=\"w-full\"\n                >\n                    Download\n                </Button>\n            </CSVLink>\n            <Button\n                variant=\"solid\"\n                icon={<TbUserPlus className=\"text-xl\" />}\n                onClick={() => navigate('/concepts/customers/customer-create')}\n            >\n                Add new\n            </Button>\n        </div>\n    )\n}\n\nexport default CustomerListActionTools\n"],"names":["CustomerListActionTools","navigate","useNavigate","customerList","useCustomerList","jsxs","jsx","CSVLink","Button","TbCloudDownload","TbUserPlus"],"mappings":";;;;;;;AAMA,MAAMA,IAA0B,MAAM;AAClC,QAAMC,IAAWC,EAAY,GAEvB,EAAE,cAAAC,EAAa,IAAIC,EAAgB;AAGrC,SAAA,gBAAAC,EAAC,OAAI,EAAA,WAAU,mCACX,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,UAAS;AAAA,QACT,MAAMJ;AAAA,QAEN,UAAA,gBAAAG;AAAA,UAACE;AAAA,UAAA;AAAA,YACG,MAAM,gBAAAF,EAACG,GAAgB,EAAA,WAAU,UAAU,CAAA;AAAA,YAC3C,WAAU;AAAA,YACb,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED;AAAA,IACJ;AAAA,IACA,gBAAAH;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,SAAQ;AAAA,QACR,MAAM,gBAAAF,EAACI,GAAW,EAAA,WAAU,UAAU,CAAA;AAAA,QACtC,SAAS,MAAMT,EAAS,qCAAqC;AAAA,QAChE,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,GACJ;AAER;"}

package/dist/lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListSearch.js

@@ -0,0 +1,19 @@
+import { jsx as e } from "react/jsx-runtime";
+import n from "../../../../../components/shared/DebounceInput.js";
+import { TbSearch as s } from "react-icons/tb";
+const f = (r) => {
+  const { onInputChange: t, ref: o } = r;
+  return /* @__PURE__ */ e(
+    n,
+    {
+      ref: o,
+      placeholder: "Quick search...",
+      suffix: /* @__PURE__ */ e(s, { className: "text-lg" }),
+      onChange: (a) => t(a.target.value)
+    }
+  );
+};
+export {
+  f as default
+};
+//# sourceMappingURL=CustomerListSearch.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomerListSearch.js","sources":["../../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListSearch.tsx"],"sourcesContent":["import DebounceInput from '@/components/shared/DebounceInput'\nimport { TbSearch } from 'react-icons/tb'\nimport { Ref } from 'react'\n\ntype CustomerListSearchProps = {\n    onInputChange: (value: string) => void\n    ref?: Ref<HTMLInputElement>\n}\n\nconst CustomerListSearch = (props: CustomerListSearchProps) => {\n    const { onInputChange, ref } = props\n\n    return (\n        <DebounceInput\n            ref={ref}\n            placeholder=\"Quick search...\"\n            suffix={<TbSearch className=\"text-lg\" />}\n            onChange={(e) => onInputChange(e.target.value)}\n        />\n    )\n}\n\nexport default CustomerListSearch\n"],"names":["CustomerListSearch","props","onInputChange","ref","jsx","DebounceInput","TbSearch","e"],"mappings":";;;AASM,MAAAA,IAAqB,CAACC,MAAmC;AACrD,QAAA,EAAE,eAAAC,GAAe,KAAAC,EAAA,IAAQF;AAG3B,SAAA,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,KAAAF;AAAA,MACA,aAAY;AAAA,MACZ,QAAQ,gBAAAC,EAACE,GAAS,EAAA,WAAU,UAAU,CAAA;AAAA,MACtC,UAAU,CAACC,MAAML,EAAcK,EAAE,OAAO,KAAK;AAAA,IAAA;AAAA,EACjD;AAER;"}

package/dist/lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListSelected.js

@@ -0,0 +1,160 @@
+import { jsx as e, jsxs as t, Fragment as k } from "react/jsx-runtime";
+import { useState as l } from "react";
+import S from "../../../../../components/shared/StickyFooter.js";
+import "../../../../../components/ui/Button/index.js";
+import "../../../../../components/ui/Dialog/index.js";
+import { Avatar as d } from "../../../../../components/ui/Avatar/index.js";
+import "../../../../../components/ui/Tooltip/index.js";
+import "../../../../../components/ui/Notification/index.js";
+import "../../../../../components/ui/toast/index.js";
+import "../../../../../components/shared/RichTextEditor/index.js";
+import D from "../../../../../components/shared/ConfirmDialog.js";
+import L from "../hooks/useCustomerList.js";
+import { TbChecks as M } from "react-icons/tb";
+import T from "../../../../../components/ui/toast/toast.js";
+import w from "../../../../../components/ui/Notification/Notification.js";
+import n from "../../../../../components/ui/Button/Button.js";
+import z from "../../../../../components/ui/Dialog/Dialog.js";
+import O from "../../../../../components/ui/Tooltip/Tooltip.js";
+import j from "../../../../../components/shared/RichTextEditor/RichTextEditor.js";
+const _ = () => {
+  const {
+    selectedCustomer: r,
+    customerList: p,
+    mutate: h,
+    customerListTotal: f,
+    setSelectAllCustomer: m
+  } = L(), [u, i] = l(!1), [g, s] = l(!1), [C, c] = l(!1), x = () => {
+    i(!0);
+  }, a = () => {
+    i(!1);
+  }, y = () => {
+    const o = p.filter((v) => !r.some(
+      (N) => N.id === v.id
+    ));
+    m([]), h(
+      {
+        list: o,
+        total: f - r.length
+      },
+      !1
+    ), i(!1);
+  }, b = () => {
+    c(!0), setTimeout(() => {
+      T.push(
+        /* @__PURE__ */ e(w, { type: "success", children: "Message sent!" }),
+        { placement: "top-center" }
+      ), c(!1), s(!1), m([]);
+    }, 500);
+  };
+  return /* @__PURE__ */ t(k, { children: [
+    r.length > 0 && /* @__PURE__ */ e(
+      S,
+      {
+        className: " flex items-center justify-between py-4 bg-white dark:bg-gray-800",
+        stickyClass: "-mx-4 sm:-mx-8 border-t border-gray-200 dark:border-gray-700 px-8",
+        defaultClass: "container mx-auto px-8 rounded-xl border border-gray-200 dark:border-gray-600 mt-4",
+        children: /* @__PURE__ */ e("div", { className: "container mx-auto", children: /* @__PURE__ */ t("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ e("span", { children: r.length > 0 && /* @__PURE__ */ t("span", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ e("span", { className: "text-lg text-primary", children: /* @__PURE__ */ e(M, {}) }),
+            /* @__PURE__ */ t("span", { className: "font-semibold flex items-center gap-1", children: [
+              /* @__PURE__ */ t("span", { className: "heading-text", children: [
+                r.length,
+                " ",
+                "Customers"
+              ] }),
+              /* @__PURE__ */ e("span", { children: "selected" })
+            ] })
+          ] }) }),
+          /* @__PURE__ */ t("div", { className: "flex items-center", children: [
+            /* @__PURE__ */ e(
+              n,
+              {
+                size: "sm",
+                className: "ltr:mr-3 rtl:ml-3",
+                type: "button",
+                customColorClass: () => "border-error ring-1 ring-error text-error hover:border-error hover:ring-error hover:text-error",
+                onClick: x,
+                children: "Delete"
+              }
+            ),
+            /* @__PURE__ */ e(
+              n,
+              {
+                size: "sm",
+                variant: "solid",
+                onClick: () => s(!0),
+                children: "Message"
+              }
+            )
+          ] })
+        ] }) })
+      }
+    ),
+    /* @__PURE__ */ e(
+      D,
+      {
+        isOpen: u,
+        type: "danger",
+        title: "Remove customers",
+        onClose: a,
+        onRequestClose: a,
+        onCancel: a,
+        onConfirm: y,
+        children: /* @__PURE__ */ t("p", { children: [
+          " ",
+          "Are you sure you want to remove these customers? This action can't be undo.",
+          " "
+        ] })
+      }
+    ),
+    /* @__PURE__ */ t(
+      z,
+      {
+        isOpen: g,
+        onRequestClose: () => s(!1),
+        onClose: () => s(!1),
+        children: [
+          /* @__PURE__ */ e("h5", { className: "mb-2", children: "Send Message" }),
+          /* @__PURE__ */ e("p", { children: "Send message to the following customers" }),
+          /* @__PURE__ */ e(
+            d.Group,
+            {
+              chained: !0,
+              omittedAvatarTooltip: !0,
+              className: "mt-4",
+              maxCount: 4,
+              omittedAvatarProps: { size: 30 },
+              children: r.map((o) => /* @__PURE__ */ e(O, { title: o.name, children: /* @__PURE__ */ e(d, { size: 30, src: o.img, alt: "" }) }, o.id))
+            }
+          ),
+          /* @__PURE__ */ e("div", { className: "my-4", children: /* @__PURE__ */ e(j, { content: "" }) }),
+          /* @__PURE__ */ t("div", { className: "ltr:justify-end flex items-center gap-2", children: [
+            /* @__PURE__ */ e(
+              n,
+              {
+                size: "sm",
+                onClick: () => s(!1),
+                children: "Cancel"
+              }
+            ),
+            /* @__PURE__ */ e(
+              n,
+              {
+                size: "sm",
+                variant: "solid",
+                loading: C,
+                onClick: b,
+                children: "Send"
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+};
+export {
+  _ as default
+};
+//# sourceMappingURL=CustomerListSelected.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListSelected.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomerListSelected.js","sources":["../../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListSelected.tsx"],"sourcesContent":["import { useState } from 'react'\nimport StickyFooter from '@/components/shared/StickyFooter'\nimport Button from '@/components/ui/Button'\nimport Dialog from '@/components/ui/Dialog'\nimport Avatar from '@/components/ui/Avatar'\nimport Tooltip from '@/components/ui/Tooltip'\nimport Notification from '@/components/ui/Notification'\nimport toast from '@/components/ui/toast'\nimport RichTextEditor from '@/components/shared/RichTextEditor'\nimport ConfirmDialog from '@/components/shared/ConfirmDialog'\nimport useCustomerList from '../hooks/useCustomerList'\nimport { TbChecks } from 'react-icons/tb'\n\nconst CustomerListSelected = () => {\n    const {\n        selectedCustomer,\n        customerList,\n        mutate,\n        customerListTotal,\n        setSelectAllCustomer,\n    } = useCustomerList()\n\n    const [deleteConfirmationOpen, setDeleteConfirmationOpen] = useState(false)\n    const [sendMessageDialogOpen, setSendMessageDialogOpen] = useState(false)\n    const [sendMessageLoading, setSendMessageLoading] = useState(false)\n\n    const handleDelete = () => {\n        setDeleteConfirmationOpen(true)\n    }\n\n    const handleCancel = () => {\n        setDeleteConfirmationOpen(false)\n    }\n\n    const handleConfirmDelete = () => {\n        const newCustomerList = customerList.filter((customer) => {\n            return !selectedCustomer.some(\n                (selected) => selected.id === customer.id,\n            )\n        })\n        setSelectAllCustomer([])\n        mutate(\n            {\n                list: newCustomerList,\n                total: customerListTotal - selectedCustomer.length,\n            },\n            false,\n        )\n        setDeleteConfirmationOpen(false)\n    }\n\n    const handleSend = () => {\n        setSendMessageLoading(true)\n        setTimeout(() => {\n            toast.push(\n                <Notification type=\"success\">Message sent!</Notification>,\n                { placement: 'top-center' },\n            )\n            setSendMessageLoading(false)\n            setSendMessageDialogOpen(false)\n            setSelectAllCustomer([])\n        }, 500)\n    }\n\n    return (\n        <>\n            {selectedCustomer.length > 0 && (\n                <StickyFooter\n                    className=\" flex items-center justify-between py-4 bg-white dark:bg-gray-800\"\n                    stickyClass=\"-mx-4 sm:-mx-8 border-t border-gray-200 dark:border-gray-700 px-8\"\n                    defaultClass=\"container mx-auto px-8 rounded-xl border border-gray-200 dark:border-gray-600 mt-4\"\n                >\n                    <div className=\"container mx-auto\">\n                        <div className=\"flex items-center justify-between\">\n                            <span>\n                                {selectedCustomer.length > 0 && (\n                                    <span className=\"flex items-center gap-2\">\n                                        <span className=\"text-lg text-primary\">\n                                            <TbChecks />\n                                        </span>\n                                        <span className=\"font-semibold flex items-center gap-1\">\n                                            <span className=\"heading-text\">\n                                                {selectedCustomer.length}{' '}\n                                                Customers\n                                            </span>\n                                            <span>selected</span>\n                                        </span>\n                                    </span>\n                                )}\n                            </span>\n\n                            <div className=\"flex items-center\">\n                                <Button\n                                    size=\"sm\"\n                                    className=\"ltr:mr-3 rtl:ml-3\"\n                                    type=\"button\"\n                                    customColorClass={() =>\n                                        'border-error ring-1 ring-error text-error hover:border-error hover:ring-error hover:text-error'\n                                    }\n                                    onClick={handleDelete}\n                                >\n                                    Delete\n                                </Button>\n                                <Button\n                                    size=\"sm\"\n                                    variant=\"solid\"\n                                    onClick={() =>\n                                        setSendMessageDialogOpen(true)\n                                    }\n                                >\n                                    Message\n                                </Button>\n                            </div>\n                        </div>\n                    </div>\n                </StickyFooter>\n            )}\n            <ConfirmDialog\n                isOpen={deleteConfirmationOpen}\n                type=\"danger\"\n                title=\"Remove customers\"\n                onClose={handleCancel}\n                onRequestClose={handleCancel}\n                onCancel={handleCancel}\n                onConfirm={handleConfirmDelete}\n            >\n                <p>\n                    {' '}\n                    Are you sure you want to remove these customers? This action\n                    can&apos;t be undo.{' '}\n                </p>\n            </ConfirmDialog>\n            <Dialog\n                isOpen={sendMessageDialogOpen}\n                onRequestClose={() => setSendMessageDialogOpen(false)}\n                onClose={() => setSendMessageDialogOpen(false)}\n            >\n                <h5 className=\"mb-2\">Send Message</h5>\n                <p>Send message to the following customers</p>\n                <Avatar.Group\n                    chained\n                    omittedAvatarTooltip\n                    className=\"mt-4\"\n                    maxCount={4}\n                    omittedAvatarProps={{ size: 30 }}\n                >\n                    {selectedCustomer.map((customer) => (\n                        <Tooltip key={customer.id} title={customer.name}>\n                            <Avatar size={30} src={customer.img} alt=\"\" />\n                        </Tooltip>\n                    ))}\n                </Avatar.Group>\n                <div className=\"my-4\">\n                    <RichTextEditor content={''} />\n                </div>\n                <div className=\"ltr:justify-end flex items-center gap-2\">\n                    <Button\n                        size=\"sm\"\n                        onClick={() => setSendMessageDialogOpen(false)}\n                    >\n                        Cancel\n                    </Button>\n                    <Button\n                        size=\"sm\"\n                        variant=\"solid\"\n                        loading={sendMessageLoading}\n                        onClick={handleSend}\n                    >\n                        Send\n                    </Button>\n                </div>\n            </Dialog>\n        </>\n    )\n}\n\nexport default CustomerListSelected\n"],"names":["CustomerListSelected","selectedCustomer","customerList","mutate","customerListTotal","setSelectAllCustomer","useCustomerList","deleteConfirmationOpen","setDeleteConfirmationOpen","useState","sendMessageDialogOpen","setSendMessageDialogOpen","sendMessageLoading","setSendMessageLoading","handleDelete","handleCancel","handleConfirmDelete","newCustomerList","customer","selected","handleSend","toast","jsx","Notification","jsxs","Fragment","StickyFooter","TbChecks","Button","ConfirmDialog","Dialog","Avatar","Tooltip","RichTextEditor"],"mappings":"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"}

package/dist/lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListTable.js

@@ -0,0 +1,157 @@
+import { jsxs as c, jsx as a } from "react/jsx-runtime";
+import { useMemo as N } from "react";
+import { Avatar as T } from "../../../../../components/ui/Avatar/index.js";
+import "../../../../../components/ui/Tag/index.js";
+import "../../../../../components/ui/Tooltip/index.js";
+import A from "../../../../../components/shared/DataTable.js";
+import I from "../hooks/useCustomerList.js";
+import { Link as L, useNavigate as z } from "react-router-dom";
+import i from "lodash/cloneDeep";
+import { TbPencil as E, TbEye as K } from "react-icons/tb";
+import g from "../../../../../components/ui/Tooltip/Tooltip.js";
+import P from "../../../../../components/ui/Tag/Tag.js";
+const $ = {
+  active: "bg-emerald-200 dark:bg-emerald-200 text-gray-900 dark:text-gray-900",
+  blocked: "bg-red-200 dark:bg-red-200 text-gray-900 dark:text-gray-900"
+}, R = ({ row: o }) => /* @__PURE__ */ c("div", { className: "flex items-center", children: [
+  /* @__PURE__ */ a(T, { size: 40, shape: "circle", src: o.img }),
+  /* @__PURE__ */ a(
+    L,
+    {
+      className: "hover:text-primary ml-2 rtl:mr-2 font-semibold text-gray-900 dark:text-gray-100",
+      to: `/concepts/customers/customer-details/${o.id}`,
+      children: o.name
+    }
+  )
+] }), V = ({
+  onEdit: o,
+  onViewDetail: r
+}) => /* @__PURE__ */ c("div", { className: "flex items-center gap-3", children: [
+  /* @__PURE__ */ a(g, { title: "Edit", children: /* @__PURE__ */ a(
+    "div",
+    {
+      className: "text-xl cursor-pointer select-none font-semibold",
+      role: "button",
+      onClick: o,
+      children: /* @__PURE__ */ a(E, {})
+    }
+  ) }),
+  /* @__PURE__ */ a(g, { title: "View", children: /* @__PURE__ */ a(
+    "div",
+    {
+      className: "text-xl cursor-pointer select-none font-semibold",
+      role: "button",
+      onClick: r,
+      children: /* @__PURE__ */ a(K, {})
+    }
+  ) })
+] }), X = () => {
+  const o = z(), {
+    customerList: r,
+    customerListTotal: h,
+    tableData: n,
+    isLoading: d,
+    setTableData: p,
+    setSelectAllCustomer: s,
+    setSelectedCustomer: u,
+    selectedCustomer: m
+  } = I(), x = (e) => {
+    o(`/concepts/customers/customer-edit/${e.id}`);
+  }, b = (e) => {
+    o(`/concepts/customers/customer-details/${e.id}`);
+  }, f = N(
+    () => [
+      {
+        header: "Name",
+        accessorKey: "name",
+        cell: (e) => {
+          const t = e.row.original;
+          return /* @__PURE__ */ a(R, { row: t });
+        }
+      },
+      {
+        header: "Email",
+        accessorKey: "email"
+      },
+      {
+        header: "location",
+        accessorKey: "personalInfo.location"
+      },
+      {
+        header: "Status",
+        accessorKey: "status",
+        cell: (e) => {
+          const t = e.row.original;
+          return /* @__PURE__ */ a("div", { className: "flex items-center", children: /* @__PURE__ */ a(P, { className: $[t.status], children: /* @__PURE__ */ a("span", { className: "capitalize", children: t.status }) }) });
+        }
+      },
+      {
+        header: "Spent",
+        accessorKey: "totalSpending",
+        cell: (e) => /* @__PURE__ */ c("span", { children: [
+          "$",
+          e.row.original.totalSpending
+        ] })
+      },
+      {
+        header: "",
+        id: "action",
+        cell: (e) => /* @__PURE__ */ a(
+          V,
+          {
+            onEdit: () => x(e.row.original),
+            onViewDetail: () => b(e.row.original)
+          }
+        )
+      }
+    ],
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  ), l = (e) => {
+    p(e), m.length > 0 && s([]);
+  }, C = (e) => {
+    const t = i(n);
+    t.pageIndex = e, l(t);
+  }, S = (e) => {
+    const t = i(n);
+    t.pageSize = Number(e), t.pageIndex = 1, l(t);
+  }, k = (e) => {
+    const t = i(n);
+    t.sort = e, l(t);
+  }, w = (e, t) => {
+    u(e, t);
+  }, y = (e, t) => {
+    if (e) {
+      const v = t.map((D) => D.original);
+      s(v);
+    } else
+      s([]);
+  };
+  return /* @__PURE__ */ a(
+    A,
+    {
+      selectable: !0,
+      columns: f,
+      data: r,
+      noData: !d && r.length === 0,
+      skeletonAvatarColumns: [0],
+      skeletonAvatarProps: { width: 28, height: 28 },
+      loading: d,
+      pagingData: {
+        total: h,
+        pageIndex: n.pageIndex,
+        pageSize: n.pageSize
+      },
+      checkboxChecked: (e) => m.some((t) => t.id === e.id),
+      onPaginationChange: C,
+      onSelectChange: S,
+      onSort: k,
+      onCheckBoxChange: w,
+      onIndeterminateCheckBoxChange: y
+    }
+  );
+};
+export {
+  X as default
+};
+//# sourceMappingURL=CustomerListTable.js.map

package/dist/lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CustomerListTable.js","sources":["../../../../../../../../lib/@ecme/views/concepts/customers/CustomerList/components/CustomerListTable.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport Avatar from '@/components/ui/Avatar'\nimport Tag from '@/components/ui/Tag'\nimport Tooltip from '@/components/ui/Tooltip'\nimport DataTable from '@/components/shared/DataTable'\nimport useCustomerList from '../hooks/useCustomerList'\nimport { Link, useNavigate } from 'react-router-dom'\nimport cloneDeep from 'lodash/cloneDeep'\nimport { TbPencil, TbEye } from 'react-icons/tb'\nimport type { OnSortParam, ColumnDef, Row } from '@/components/shared/DataTable'\nimport type { Customer } from '../types'\nimport type { TableQueries } from '@/@types/common'\n\nconst statusColor: Record<string, string> = {\n    active: 'bg-emerald-200 dark:bg-emerald-200 text-gray-900 dark:text-gray-900',\n    blocked: 'bg-red-200 dark:bg-red-200 text-gray-900 dark:text-gray-900',\n}\n\nconst NameColumn = ({ row }: { row: Customer }) => {\n    return (\n        <div className=\"flex items-center\">\n            <Avatar size={40} shape=\"circle\" src={row.img} />\n            <Link\n                className={`hover:text-primary ml-2 rtl:mr-2 font-semibold text-gray-900 dark:text-gray-100`}\n                to={`/concepts/customers/customer-details/${row.id}`}\n            >\n                {row.name}\n            </Link>\n        </div>\n    )\n}\n\nconst ActionColumn = ({\n    onEdit,\n    onViewDetail,\n}: {\n    onEdit: () => void\n    onViewDetail: () => void\n}) => {\n    return (\n        <div className=\"flex items-center gap-3\">\n            <Tooltip title=\"Edit\">\n                <div\n                    className={`text-xl cursor-pointer select-none font-semibold`}\n                    role=\"button\"\n                    onClick={onEdit}\n                >\n                    <TbPencil />\n                </div>\n            </Tooltip>\n            <Tooltip title=\"View\">\n                <div\n                    className={`text-xl cursor-pointer select-none font-semibold`}\n                    role=\"button\"\n                    onClick={onViewDetail}\n                >\n                    <TbEye />\n                </div>\n            </Tooltip>\n        </div>\n    )\n}\n\nconst CustomerListTable = () => {\n    const navigate = useNavigate()\n\n    const {\n        customerList,\n        customerListTotal,\n        tableData,\n        isLoading,\n        setTableData,\n        setSelectAllCustomer,\n        setSelectedCustomer,\n        selectedCustomer,\n    } = useCustomerList()\n\n    const handleEdit = (customer: Customer) => {\n        navigate(`/concepts/customers/customer-edit/${customer.id}`)\n    }\n\n    const handleViewDetails = (customer: Customer) => {\n        navigate(`/concepts/customers/customer-details/${customer.id}`)\n    }\n\n    const columns: ColumnDef<Customer>[] = useMemo(\n        () => [\n            {\n                header: 'Name',\n                accessorKey: 'name',\n                cell: (props) => {\n                    const row = props.row.original\n                    return <NameColumn row={row} />\n                },\n            },\n            {\n                header: 'Email',\n                accessorKey: 'email',\n            },\n            {\n                header: 'location',\n                accessorKey: 'personalInfo.location',\n            },\n            {\n                header: 'Status',\n                accessorKey: 'status',\n                cell: (props) => {\n                    const row = props.row.original\n                    return (\n                        <div className=\"flex items-center\">\n                            <Tag className={statusColor[row.status]}>\n                                <span className=\"capitalize\">{row.status}</span>\n                            </Tag>\n                        </div>\n                    )\n                },\n            },\n            {\n                header: 'Spent',\n                accessorKey: 'totalSpending',\n                cell: (props) => {\n                    return <span>${props.row.original.totalSpending}</span>\n                },\n            },\n            {\n                header: '',\n                id: 'action',\n                cell: (props) => (\n                    <ActionColumn\n                        onEdit={() => handleEdit(props.row.original)}\n                        onViewDetail={() =>\n                            handleViewDetails(props.row.original)\n                        }\n                    />\n                ),\n            },\n        ],\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n        [],\n    )\n\n    const handleSetTableData = (data: TableQueries) => {\n        setTableData(data)\n        if (selectedCustomer.length > 0) {\n            setSelectAllCustomer([])\n        }\n    }\n\n    const handlePaginationChange = (page: number) => {\n        const newTableData = cloneDeep(tableData)\n        newTableData.pageIndex = page\n        handleSetTableData(newTableData)\n    }\n\n    const handleSelectChange = (value: number) => {\n        const newTableData = cloneDeep(tableData)\n        newTableData.pageSize = Number(value)\n        newTableData.pageIndex = 1\n        handleSetTableData(newTableData)\n    }\n\n    const handleSort = (sort: OnSortParam) => {\n        const newTableData = cloneDeep(tableData)\n        newTableData.sort = sort\n        handleSetTableData(newTableData)\n    }\n\n    const handleRowSelect = (checked: boolean, row: Customer) => {\n        setSelectedCustomer(checked, row)\n    }\n\n    const handleAllRowSelect = (checked: boolean, rows: Row<Customer>[]) => {\n        if (checked) {\n            const originalRows = rows.map((row) => row.original)\n            setSelectAllCustomer(originalRows)\n        } else {\n            setSelectAllCustomer([])\n        }\n    }\n\n    return (\n        <DataTable\n            selectable\n            columns={columns}\n            data={customerList}\n            noData={!isLoading && customerList.length === 0}\n            skeletonAvatarColumns={[0]}\n            skeletonAvatarProps={{ width: 28, height: 28 }}\n            loading={isLoading}\n            pagingData={{\n                total: customerListTotal,\n                pageIndex: tableData.pageIndex as number,\n                pageSize: tableData.pageSize as number,\n            }}\n            checkboxChecked={(row) =>\n                selectedCustomer.some((selected) => selected.id === row.id)\n            }\n            onPaginationChange={handlePaginationChange}\n            onSelectChange={handleSelectChange}\n            onSort={handleSort}\n            onCheckBoxChange={handleRowSelect}\n            onIndeterminateCheckBoxChange={handleAllRowSelect}\n        />\n    )\n}\n\nexport default CustomerListTable\n"],"names":["statusColor","NameColumn","row","jsxs","jsx","Avatar","Link","ActionColumn","onEdit","onViewDetail","Tooltip","TbPencil","TbEye","CustomerListTable","navigate","useNavigate","customerList","customerListTotal","tableData","isLoading","setTableData","setSelectAllCustomer","setSelectedCustomer","selectedCustomer","useCustomerList","handleEdit","customer","handleViewDetails","columns","useMemo","props","Tag","handleSetTableData","data","handlePaginationChange","page","newTableData","cloneDeep","handleSelectChange","value","handleSort","sort","handleRowSelect","checked","handleAllRowSelect","rows","originalRows","DataTable","selected"],"mappings":"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"}