npm - @orbe-agro/client-core - Versions diffs - 5.3.86 → 5.3.89 - Mend

@orbe-agro/client-core 5.3.86 → 5.3.89

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

Files changed (502) hide show

package/dist/@ecme/views/concepts/accounts/Pricing/components/PaymentDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PaymentDialog.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Pricing/components/PaymentDialog.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Button from '@/components/ui/Button'\nimport Dialog from '@/components/ui/Dialog'\nimport Segment from '@/components/ui/Segment'\nimport classNames from '@/utils/classNames'\nimport sleep from '@/utils/sleep'\nimport { usePricingStore } from '../store/pricingStore'\nimport { TbCheck, TbCreditCard, TbMail } from 'react-icons/tb'\nimport {\n NumericFormat,\n PatternFormat,\n NumberFormatBase,\n} from 'react-number-format'\nimport { useNavigate } from 'react-router-dom'\nimport { PaymentCycle } from '../types'\n\nfunction limit(val: string, max: string) {\n if (val.length === 1 && val[0] > max[0]) {\n val = '0' + val\n }\n\n if (val.length === 2) {\n if (Number(val) === 0) {\n val = '01'\n } else if (val > max) {\n val = max\n }\n }\n\n return val\n}\n\nfunction cardExpiryFormat(val: string) {\n const month = limit(val.substring(0, 2), '12')\n const date = limit(val.substring(2, 4), '31')\n\n return month + (date.length ? '/' + date : '')\n}\n\nconst PaymentDialog = () => {\n const [loading, setLoading] = useState(false)\n const [paymentSuccessful, setPaymentSuccessful] = useState(false)\n\n const navigate = useNavigate()\n\n const { paymentDialog, setPaymentDialog, selectedPlan, setSelectedPlan } =\n usePricingStore()\n\n const handleDialogClose = async () => {\n setPaymentDialog(false)\n await sleep(200)\n setSelectedPlan({})\n setPaymentSuccessful(false)\n }\n\n const handlePaymentChange = (paymentCycle: PaymentCycle) => {\n setSelectedPlan({\n ...selectedPlan,\n paymentCycle,\n })\n }\n\n const handlePay = async () => {\n setLoading(true)\n await sleep(500)\n setLoading(false)\n setPaymentSuccessful(true)\n }\n\n const handleManageSubscription = async () => {\n navigate('/concepts/account/settings?view=billing')\n await handleDialogClose()\n }\n\n return (\n <Dialog\n isOpen={paymentDialog}\n closable={!paymentSuccessful}\n onClose={handleDialogClose}\n onRequestClose={handleDialogClose}\n >\n {paymentSuccessful ? (\n <>\n <div className=\"text-center mt-6 mb-2\">\n <div className=\"inline-flex rounded-full p-5 bg-success\">\n <TbCheck className=\"text-5xl text-white\" />\n </div>\n <div className=\"mt-6\">\n <h4>Thank you for your purchase!</h4>\n <p className=\"text-base max-w-[400px] mx-auto mt-4 leading-relaxed\">\n We've received your order and are\n processing it now. You'll get an email with\n your order details soon\n </p>\n </div>\n <div className=\"grid grid-cols-2 gap-2 mt-8\">\n <Button block onClick={handleManageSubscription}>\n Manage subscription\n </Button>\n <Button\n block\n variant=\"solid\"\n onClick={handleDialogClose}\n >\n Close\n </Button>\n </div>\n </div>\n </>\n ) : (\n <>\n <h4>{selectedPlan.planName} plan</h4>\n <div className=\"mt-6\">\n <Segment\n defaultValue={selectedPlan.paymentCycle}\n className=\"gap-4 flex bg-transparent\"\n onChange={(value) =>\n handlePaymentChange(value as PaymentCycle)\n }\n >\n {Object.entries(selectedPlan.price \|\| {}).map(\n ([key, value]) => (\n <Segment.Item key={key} value={key}>\n {({ active, onSegmentItemClick }) => {\n return (\n <div\n className={classNames(\n 'flex justify-between border rounded-xl border-gray-300 py-5 px-4 select-none ring-1 w-1/2',\n active\n ? 'ring-primary border-primary '\n : 'ring-transparent bg-gray-100',\n )}\n role=\"button\"\n onClick={onSegmentItemClick}\n >\n <div>\n <div className=\"heading-text mb-0.5\">\n Pay{' '}\n {key === 'monthly'\n ? 'monthly'\n : 'anually'}\n </div>\n <span className=\"text-lg font-bold heading-text flex gap-0.5\">\n <NumericFormat\n displayType=\"text\"\n value={value}\n prefix={'$'}\n thousandSeparator={\n true\n }\n />\n <span>{'/'}</span>\n <span>\n {key ===\n 'monthly'\n ? 'month'\n : 'year'}\n </span>\n </span>\n </div>\n {active && (\n <TbCheck className=\"text-primary text-xl\" />\n )}\n </div>\n )\n }}\n </Segment.Item>\n ),\n )}\n </Segment>\n </div>\n <div className=\"mt-6 border border-gray-200 dark:border-gray-600 rounded-lg\">\n <div className=\"flex items-center justify-between p-4 border-b border-gray-200 dark:border-gray-600\">\n <div className=\"w-full\">\n <span>Billing email</span>\n <div className=\"flex items-center gap-2 mt-2\">\n <TbMail className=\"text-2xl\" />\n <input\n className=\"focus:outline-none heading-text flex-1\"\n placeholder=\"Enter email\"\n type=\"email\"\n />\n </div>\n </div>\n </div>\n <div className=\"flex items-center justify-between p-4\">\n <div className=\"w-full\">\n <span>Credit card</span>\n <div className=\"flex items-center gap-2 mt-2\">\n <div className=\"flex-1\">\n <TbCreditCard className=\"text-2xl\" />\n </div>\n <PatternFormat\n className=\"focus:outline-none heading-text w-full\"\n placeholder=\"Credit card number\"\n format=\"#### #### #### ####\"\n />\n <NumberFormatBase\n className=\"focus:outline-none heading-text max-w-12 sm:max-w-28\"\n placeholder=\"MM/YY\"\n format={cardExpiryFormat}\n />\n <PatternFormat\n className=\"focus:outline-none heading-text max-w-12 sm:max-w-28\"\n placeholder=\"CVC\"\n format=\"###\"\n />\n </div>\n </div>\n </div>\n </div>\n <div className=\"mt-6 flex flex-col items-end\">\n <h4>\n <span>Bill now: </span>\n <span>\n <NumericFormat\n displayType=\"text\"\n value={\n selectedPlan.price?.[\n selectedPlan.paymentCycle as PaymentCycle\n ]\n }\n prefix={'$'}\n thousandSeparator={true}\n />\n </span>\n </h4>\n <div className=\"max-w-[350px] ltr:text-right rtl:text-left leading-none mt-2 opacity-80\">\n <small>\n By clicking "Pay", you agree to be\n charged $399 every month, you can cancel this\n subscription any time.\n </small>\n </div>\n </div>\n <div className=\"mt-6\">\n <Button\n block\n variant=\"solid\"\n loading={loading}\n onClick={handlePay}\n >\n Pay\n </Button>\n </div>\n </>\n )}\n </Dialog>\n )\n}\n\nexport default PaymentDialog\n"],"names":["limit","val","max","cardExpiryFormat","month","date","PaymentDialog","loading","setLoading","useState","paymentSuccessful","setPaymentSuccessful","navigate","useNavigate","paymentDialog","setPaymentDialog","selectedPlan","setSelectedPlan","usePricingStore","handleDialogClose","sleep","handlePaymentChange","paymentCycle","handlePay","jsx","Dialog","Fragment","jsxs","TbCheck","Button","Segment","value","key","active","onSegmentItemClick","classNames","NumericFormat","TbMail","TbCreditCard","PatternFormat","NumberFormatBase","_a"],"mappings":"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"}
1	+ {"version":3,"file":"PaymentDialog.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Pricing/components/PaymentDialog.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Button from '@/components/ui/Button'\nimport Dialog from '@/components/ui/Dialog'\nimport Segment from '@/components/ui/Segment'\nimport classNames from '@/utils/classNames'\nimport sleep from '@/utils/sleep'\nimport { usePricingStore } from '../store/pricingStore'\nimport { TbCheck, TbCreditCard, TbMail } from 'react-icons/tb'\nimport {\n NumericFormat,\n PatternFormat,\n NumberFormatBase,\n} from 'react-number-format'\nimport { useNavigate } from 'react-router-dom'\nimport { PaymentCycle } from '../types'\n\nfunction limit(val: string, max: string) {\n if (val.length === 1 && val[0] > max[0]) {\n val = '0' + val\n }\n\n if (val.length === 2) {\n if (Number(val) === 0) {\n val = '01'\n } else if (val > max) {\n val = max\n }\n }\n\n return val\n}\n\nfunction cardExpiryFormat(val: string) {\n const month = limit(val.substring(0, 2), '12')\n const date = limit(val.substring(2, 4), '31')\n\n return month + (date.length ? '/' + date : '')\n}\n\nconst PaymentDialog = () => {\n const [loading, setLoading] = useState(false)\n const [paymentSuccessful, setPaymentSuccessful] = useState(false)\n\n const navigate = useNavigate()\n\n const { paymentDialog, setPaymentDialog, selectedPlan, setSelectedPlan } =\n usePricingStore()\n\n const handleDialogClose = async () => {\n setPaymentDialog(false)\n await sleep(200)\n setSelectedPlan({})\n setPaymentSuccessful(false)\n }\n\n const handlePaymentChange = (paymentCycle: PaymentCycle) => {\n setSelectedPlan({\n ...selectedPlan,\n paymentCycle,\n })\n }\n\n const handlePay = async () => {\n setLoading(true)\n await sleep(500)\n setLoading(false)\n setPaymentSuccessful(true)\n }\n\n const handleManageSubscription = async () => {\n navigate('/concepts/account/settings?view=billing')\n await handleDialogClose()\n }\n\n return (\n <Dialog\n isOpen={paymentDialog}\n closable={!paymentSuccessful}\n onClose={handleDialogClose}\n onRequestClose={handleDialogClose}\n >\n {paymentSuccessful ? (\n <>\n <div className=\"text-center mt-6 mb-2\">\n <div className=\"inline-flex rounded-full p-5 bg-success\">\n <TbCheck className=\"text-5xl text-white\" />\n </div>\n <div className=\"mt-6\">\n <h4>Thank you for your purchase!</h4>\n <p className=\"text-base max-w-[400px] mx-auto mt-4 leading-relaxed\">\n We've received your order and are\n processing it now. You'll get an email with\n your order details soon\n </p>\n </div>\n <div className=\"grid grid-cols-2 gap-2 mt-8\">\n <Button block onClick={handleManageSubscription}>\n Manage subscription\n </Button>\n <Button\n block\n variant=\"solid\"\n onClick={handleDialogClose}\n >\n Close\n </Button>\n </div>\n </div>\n </>\n ) : (\n <>\n <h4>{selectedPlan.planName} plan</h4>\n <div className=\"mt-6\">\n <Segment\n defaultValue={selectedPlan.paymentCycle}\n className=\"gap-4 flex bg-transparent\"\n onChange={(value) =>\n handlePaymentChange(value as PaymentCycle)\n }\n >\n {Object.entries(selectedPlan.price \|\| {}).map(\n ([key, value]) => (\n <Segment.Item key={key} value={key}>\n {({ active, onSegmentItemClick }) => {\n return (\n <div\n className={classNames(\n 'flex justify-between border rounded-xl border-gray-300 py-5 px-4 select-none ring-1 w-1/2',\n active\n ? 'ring-primary border-primary '\n : 'ring-transparent bg-gray-100',\n )}\n role=\"button\"\n onClick={onSegmentItemClick}\n >\n <div>\n <div className=\"heading-text mb-0.5\">\n Pay{' '}\n {key === 'monthly'\n ? 'monthly'\n : 'anually'}\n </div>\n <span className=\"text-lg font-bold heading-text flex gap-0.5\">\n <NumericFormat\n displayType=\"text\"\n value={value}\n prefix={'$'}\n thousandSeparator={\n true\n }\n />\n <span>{'/'}</span>\n <span>\n {key ===\n 'monthly'\n ? 'month'\n : 'year'}\n </span>\n </span>\n </div>\n {active && (\n <TbCheck className=\"text-primary text-xl\" />\n )}\n </div>\n )\n }}\n </Segment.Item>\n ),\n )}\n </Segment>\n </div>\n <div className=\"mt-6 border border-gray-200 dark:border-gray-600 rounded-lg\">\n <div className=\"flex items-center justify-between p-4 border-b border-gray-200 dark:border-gray-600\">\n <div className=\"w-full\">\n <span>Billing email</span>\n <div className=\"flex items-center gap-2 mt-2\">\n <TbMail className=\"text-2xl\" />\n <input\n className=\"focus:outline-none heading-text flex-1\"\n placeholder=\"Enter email\"\n type=\"email\"\n />\n </div>\n </div>\n </div>\n <div className=\"flex items-center justify-between p-4\">\n <div className=\"w-full\">\n <span>Credit card</span>\n <div className=\"flex items-center gap-2 mt-2\">\n <div className=\"flex-1\">\n <TbCreditCard className=\"text-2xl\" />\n </div>\n <PatternFormat\n className=\"focus:outline-none heading-text w-full\"\n placeholder=\"Credit card number\"\n format=\"#### #### #### ####\"\n />\n <NumberFormatBase\n className=\"focus:outline-none heading-text max-w-12 sm:max-w-28\"\n placeholder=\"MM/YY\"\n format={cardExpiryFormat}\n />\n <PatternFormat\n className=\"focus:outline-none heading-text max-w-12 sm:max-w-28\"\n placeholder=\"CVC\"\n format=\"###\"\n />\n </div>\n </div>\n </div>\n </div>\n <div className=\"mt-6 flex flex-col items-end\">\n <h4>\n <span>Bill now: </span>\n <span>\n <NumericFormat\n displayType=\"text\"\n value={\n selectedPlan.price?.[\n selectedPlan.paymentCycle as PaymentCycle\n ]\n }\n prefix={'$'}\n thousandSeparator={true}\n />\n </span>\n </h4>\n <div className=\"max-w-[350px] ltr:text-right rtl:text-left leading-none mt-2 opacity-80\">\n <small>\n By clicking "Pay", you agree to be\n charged $399 every month, you can cancel this\n subscription any time.\n </small>\n </div>\n </div>\n <div className=\"mt-6\">\n <Button\n block\n variant=\"solid\"\n loading={loading}\n onClick={handlePay}\n >\n Pay\n </Button>\n </div>\n </>\n )}\n </Dialog>\n )\n}\n\nexport default PaymentDialog\n"],"names":["limit","val","max","cardExpiryFormat","month","date","PaymentDialog","loading","setLoading","useState","paymentSuccessful","setPaymentSuccessful","navigate","useNavigate","paymentDialog","setPaymentDialog","selectedPlan","setSelectedPlan","usePricingStore","handleDialogClose","sleep","handlePaymentChange","paymentCycle","handlePay","jsx","Dialog","Fragment","jsxs","TbCheck","Button","Segment","value","key","active","onSegmentItemClick","classNames","NumericFormat","TbMail","TbCreditCard","PatternFormat","NumberFormatBase"],"mappings":"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"}

package/dist/@ecme/views/concepts/accounts/Pricing/components/Plans.js CHANGED Viewed

@@ -13,7 +13,7 @@ import { TbCheck as v } from "react-icons/tb";
 import P from "../../../../../components/ui/Tag/Tag.js";
 import S from "../../../../../components/ui/Button/Button.js";
 const Q = () => {
-  const { paymentCycle: t, setPaymentDialog: m, setSelectedPlan: n } = g(), o = b(), c = o.get("subcription"), l = o.get("cycle"), { data: s } = y(
+  const { paymentCycle: t, setPaymentDialog: m, setSelectedPlan: n } = g(), s = b(), o = s.get("subcription"), c = s.get("cycle"), { data: l } = y(
     ["/api/pricing"],
     () => h(),
     {
@@ -22,12 +22,12 @@ const Q = () => {
       revalidateOnReconnect: !1
     }
   );
-  return /* @__PURE__ */ r("div", { className: "grid grid-cols-1 xl:grid-cols-3 gap-8 xl:gap-4", children: s == null ? void 0 : s.plans.map((e, p) => /* @__PURE__ */ i(
+  return /* @__PURE__ */ r("div", { className: "grid grid-cols-1 xl:grid-cols-3 gap-8 xl:gap-4", children: l?.plans.map((e, p) => /* @__PURE__ */ i(
     "div",
     {
       className: d(
         "px-6 pt-2 flex flex-col justify-between",
-        !x(s.plans, p) && "border-r-0 xl:border-r border-gray-200 dark:border-gray-700"
+        !x(l.plans, p) && "border-r-0 xl:border-r border-gray-200 dark:border-gray-700"
       ),
       children: [
         /* @__PURE__ */ i("div", { children: [
@@ -80,7 +80,7 @@ const Q = () => {
           S,
           {
             block: !0,
-            disabled: c === e.id && l === t,
+            disabled: o === e.id && c === t,
             onClick: () => {
               n({
                 paymentCycle: t,
@@ -88,7 +88,7 @@ const Q = () => {
                 price: e.price
               }), m(!0);
             },
-            children: c === e.id && l === t ? "Current plan" : "Select plan"
+            children: o === e.id && c === t ? "Current plan" : "Select plan"
           }
         ) })
       ]

package/dist/@ecme/views/concepts/accounts/Pricing/components/Plans.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Plans.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Pricing/components/Plans.tsx"],"sourcesContent":["import Button from '@/components/ui/Button'\nimport Tag from '@/components/ui/Tag'\nimport { usePricingStore } from '../store/pricingStore'\nimport { apiGetPricingPlans } from '@/services/AccontsService'\nimport { featuresList } from '../constants'\nimport classNames from '@/utils/classNames'\nimport isLastChild from '@/utils/isLastChild'\nimport useQuery from '@/utils/hooks/useQuery'\nimport useSWR from 'swr'\nimport { NumericFormat } from 'react-number-format'\nimport { TbCheck } from 'react-icons/tb'\nimport type { GetPricingPanResponse } from '../types'\n\nconst Plans = () => {\n const { paymentCycle, setPaymentDialog, setSelectedPlan } =\n usePricingStore()\n\n const query = useQuery()\n const subcription = query.get('subcription')\n const cycle = query.get('cycle')\n\n const { data } = useSWR(\n ['/api/pricing'],\n () => apiGetPricingPlans<GetPricingPanResponse>(),\n {\n revalidateOnFocus: false,\n revalidateIfStale: false,\n revalidateOnReconnect: false,\n },\n )\n\n return (\n <div className=\"grid grid-cols-1 xl:grid-cols-3 gap-8 xl:gap-4\">\n {data?.plans.map((plan, index) => (\n <div\n key={plan.id}\n className={classNames(\n 'px-6 pt-2 flex flex-col justify-between',\n !isLastChild(data.plans, index) &&\n 'border-r-0 xl:border-r border-gray-200 dark:border-gray-700',\n )}\n >\n <div>\n <h5 className=\"mb-6 flex items-center gap-2\">\n <span>{plan.name}</span>\n {plan.recommended && (\n <Tag className=\"rounded-full bg-green-200 font-bold\">\n Recommended\n </Tag>\n )}\n </h5>\n <div className=\"\">{plan.description}</div>\n <div className=\"mt-6\">\n <NumericFormat\n className=\"h1\"\n displayType=\"text\"\n value={plan.price[paymentCycle]}\n prefix={'$'}\n thousandSeparator={true}\n />\n <span className=\"text-lg font-bold\">\n {' '}\n /{' '}\n {paymentCycle === 'monthly' ? 'month' : 'year'}\n </span>\n </div>\n <div className=\"flex flex-col gap-4 border-t border-gray-200 dark:border-gray-700 mt-6 pt-6\">\n {featuresList.map((feature) => (\n <div\n key={feature.id}\n className=\"flex items-center gap-4 font-semibold heading-text\"\n >\n {plan.features.includes(feature.id) && (\n <>\n <TbCheck\n className={classNames(\n 'text-2xl',\n plan.features.includes(\n feature.id,\n )\n ? 'text-primary'\n : 'text-gray-100',\n )}\n />\n <span>\n {\n feature.description[\n plan.id as string\n ]\n }\n </span>\n </>\n )}\n </div>\n ))}\n </div>\n </div>\n <div className=\"mt-10\">\n <Button\n block\n disabled={\n subcription === plan.id &&\n cycle === paymentCycle\n }\n onClick={() => {\n setSelectedPlan({\n paymentCycle,\n planName: plan.name,\n price: plan.price,\n })\n setPaymentDialog(true)\n }}\n >\n {subcription === plan.id && cycle === paymentCycle\n ? 'Current plan'\n : 'Select plan'}\n </Button>\n </div>\n </div>\n ))}\n </div>\n )\n}\n\nexport default Plans\n"],"names":["Plans","paymentCycle","setPaymentDialog","setSelectedPlan","usePricingStore","query","useQuery","subcription","cycle","data","useSWR","apiGetPricingPlans","jsx","plan","index","jsxs","classNames","isLastChild","Tag","NumericFormat","featuresList","feature","Fragment","TbCheck","Button"],"mappings":";;;;;;;;;;;;;;AAaA,MAAMA,IAAQ,MAAM;AAChB,QAAM,EAAE,cAAAC,GAAc,kBAAAC,GAAkB,iBAAAC,EAAA,IACpCC,EAAA,GAEEC,IAAQC,EAAA,GACRC,IAAcF,EAAM,IAAI,aAAa,GACrCG,IAAQH,EAAM,IAAI,OAAO,GAEzB,EAAE,MAAAI,MAASC;AAAA,IACb,CAAC,cAAc;AAAA,IACf,MAAMC,EAAA;AAAA,IACN;AAAA,MACI,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB,uBAAuB;AAAA,IAAA;AAAA,EAC3B;AAGJ,SACI,gBAAAC,EAAC,SAAI,WAAU,kDACV,~~iCAAM~~,MAAM,IAAI,CAACC,GAAMC,MACpB,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,WAAWC;AAAA,QACP;AAAA,QACA,CAACC,EAAYR,EAAK,OAAOK,CAAK,KAC1B;AAAA,MAAA;AAAA,MAGR,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EACG,UAAA;AAAA,UAAA,gBAAAA,EAAC,MAAA,EAAG,WAAU,gCACV,UAAA;AAAA,YAAA,gBAAAH,EAAC,QAAA,EAAM,YAAK,KAAA,CAAK;AAAA,YAChBC,EAAK,eACF,gBAAAD,EAACM,GAAA,EAAI,WAAU,uCAAsC,UAAA,cAAA,CAErD;AAAA,UAAA,GAER;AAAA,UACA,gBAAAN,EAAC,OAAA,EAAI,WAAU,IAAI,YAAK,aAAY;AAAA,UACpC,gBAAAG,EAAC,OAAA,EAAI,WAAU,QACX,UAAA;AAAA,YAAA,gBAAAH;AAAA,cAACO;AAAA,cAAA;AAAA,gBACG,WAAU;AAAA,gBACV,aAAY;AAAA,gBACZ,OAAON,EAAK,MAAMZ,CAAY;AAAA,gBAC9B,QAAQ;AAAA,gBACR,mBAAmB;AAAA,cAAA;AAAA,YAAA;AAAA,YAEvB,gBAAAc,EAAC,QAAA,EAAK,WAAU,qBACX,UAAA;AAAA,cAAA;AAAA,cAAI;AAAA,cACH;AAAA,cACDd,MAAiB,YAAY,UAAU;AAAA,YAAA,EAAA,CAC5C;AAAA,UAAA,GACJ;AAAA,4BACC,OAAA,EAAI,WAAU,+EACV,UAAAmB,EAAa,IAAI,CAACC,MACf,gBAAAT;AAAA,YAAC;AAAA,YAAA;AAAA,cAEG,WAAU;AAAA,cAET,YAAK,SAAS,SAASS,EAAQ,EAAE,KAC9B,gBAAAN,EAAAO,GAAA,EACI,UAAA;AAAA,gBAAA,gBAAAV;AAAA,kBAACW;AAAA,kBAAA;AAAA,oBACG,WAAWP;AAAA,sBACP;AAAA,sBACAH,EAAK,SAAS;AAAA,wBACVQ,EAAQ;AAAA,sBAAA,IAEN,iBACA;AAAA,oBAAA;AAAA,kBACV;AAAA,gBAAA;AAAA,kCAEH,QAAA,EAEO,UAAAA,EAAQ,YACJR,EAAK,EACT,EAAA,CAER;AAAA,cAAA,EAAA,CACJ;AAAA,YAAA;AAAA,YAtBCQ,EAAQ;AAAA,UAAA,CAyBpB,EAAA,CACL;AAAA,QAAA,GACJ;AAAA,QACA,gBAAAT,EAAC,OAAA,EAAI,WAAU,SACX,UAAA,gBAAAA;AAAA,UAACY;AAAA,UAAA;AAAA,YACG,OAAK;AAAA,YACL,UACIjB,MAAgBM,EAAK,MACrBL,MAAUP;AAAA,YAEd,SAAS,MAAM;AACX,cAAAE,EAAgB;AAAA,gBACZ,cAAAF;AAAA,gBACA,UAAUY,EAAK;AAAA,gBACf,OAAOA,EAAK;AAAA,cAAA,CACf,GACDX,EAAiB,EAAI;AAAA,YACzB;AAAA,YAEC,UAAAK,MAAgBM,EAAK,MAAML,MAAUP,IAChC,iBACA;AAAA,UAAA;AAAA,QAAA,EACV,CACJ;AAAA,MAAA;AAAA,IAAA;AAAA,IAlFKY,EAAK;AAAA,EAAA,~~IAqFtB~~;AAER;"}
1	+ {"version":3,"file":"Plans.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Pricing/components/Plans.tsx"],"sourcesContent":["import Button from '@/components/ui/Button'\nimport Tag from '@/components/ui/Tag'\nimport { usePricingStore } from '../store/pricingStore'\nimport { apiGetPricingPlans } from '@/services/AccontsService'\nimport { featuresList } from '../constants'\nimport classNames from '@/utils/classNames'\nimport isLastChild from '@/utils/isLastChild'\nimport useQuery from '@/utils/hooks/useQuery'\nimport useSWR from 'swr'\nimport { NumericFormat } from 'react-number-format'\nimport { TbCheck } from 'react-icons/tb'\nimport type { GetPricingPanResponse } from '../types'\n\nconst Plans = () => {\n const { paymentCycle, setPaymentDialog, setSelectedPlan } =\n usePricingStore()\n\n const query = useQuery()\n const subcription = query.get('subcription')\n const cycle = query.get('cycle')\n\n const { data } = useSWR(\n ['/api/pricing'],\n () => apiGetPricingPlans<GetPricingPanResponse>(),\n {\n revalidateOnFocus: false,\n revalidateIfStale: false,\n revalidateOnReconnect: false,\n },\n )\n\n return (\n <div className=\"grid grid-cols-1 xl:grid-cols-3 gap-8 xl:gap-4\">\n {data?.plans.map((plan, index) => (\n <div\n key={plan.id}\n className={classNames(\n 'px-6 pt-2 flex flex-col justify-between',\n !isLastChild(data.plans, index) &&\n 'border-r-0 xl:border-r border-gray-200 dark:border-gray-700',\n )}\n >\n <div>\n <h5 className=\"mb-6 flex items-center gap-2\">\n <span>{plan.name}</span>\n {plan.recommended && (\n <Tag className=\"rounded-full bg-green-200 font-bold\">\n Recommended\n </Tag>\n )}\n </h5>\n <div className=\"\">{plan.description}</div>\n <div className=\"mt-6\">\n <NumericFormat\n className=\"h1\"\n displayType=\"text\"\n value={plan.price[paymentCycle]}\n prefix={'$'}\n thousandSeparator={true}\n />\n <span className=\"text-lg font-bold\">\n {' '}\n /{' '}\n {paymentCycle === 'monthly' ? 'month' : 'year'}\n </span>\n </div>\n <div className=\"flex flex-col gap-4 border-t border-gray-200 dark:border-gray-700 mt-6 pt-6\">\n {featuresList.map((feature) => (\n <div\n key={feature.id}\n className=\"flex items-center gap-4 font-semibold heading-text\"\n >\n {plan.features.includes(feature.id) && (\n <>\n <TbCheck\n className={classNames(\n 'text-2xl',\n plan.features.includes(\n feature.id,\n )\n ? 'text-primary'\n : 'text-gray-100',\n )}\n />\n <span>\n {\n feature.description[\n plan.id as string\n ]\n }\n </span>\n </>\n )}\n </div>\n ))}\n </div>\n </div>\n <div className=\"mt-10\">\n <Button\n block\n disabled={\n subcription === plan.id &&\n cycle === paymentCycle\n }\n onClick={() => {\n setSelectedPlan({\n paymentCycle,\n planName: plan.name,\n price: plan.price,\n })\n setPaymentDialog(true)\n }}\n >\n {subcription === plan.id && cycle === paymentCycle\n ? 'Current plan'\n : 'Select plan'}\n </Button>\n </div>\n </div>\n ))}\n </div>\n )\n}\n\nexport default Plans\n"],"names":["Plans","paymentCycle","setPaymentDialog","setSelectedPlan","usePricingStore","query","useQuery","subcription","cycle","data","useSWR","apiGetPricingPlans","jsx","plan","index","jsxs","classNames","isLastChild","Tag","NumericFormat","featuresList","feature","Fragment","TbCheck","Button"],"mappings":"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"}

package/dist/@ecme/views/concepts/accounts/RolesPermissions/components/RolesPermissionsAccessDialog.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { jsx as e, jsxs as i, Fragment as b } from "react/jsx-runtime";
+import { jsx as e, jsxs as n, Fragment as b } from "react/jsx-runtime";
 import { useState as A, useRef as g, useMemo as F } from "react";
 import "../../../../../components/ui/Button/index.js";
 import { Avatar as B } from "../../../../../components/ui/Avatar/index.js";
@@ -18,7 +18,7 @@ import K from "../../../../../components/ui/Dialog/Dialog.js";
 import L from "../../../../../components/ui/ScrollBar/ScrollBar.js";
 import v from "../../../../../components/ui/Form/FormItem.js";
 import N from "../../../../../components/ui/Input/Input.js";
-import p from "../../../../../components/ui/Button/Button.js";
+import m from "../../../../../components/ui/Button/Button.js";
 const Q = {
   users: /* @__PURE__ */ e(H, {}),
   products: /* @__PURE__ */ e(G, {}),
@@ -26,56 +26,55 @@ const Q = {
   files: /* @__PURE__ */ e($, {}),
   reports: /* @__PURE__ */ e(O, {})
 }, { useUniqueId: V } = P, be = ({
-  roleList: c,
+  roleList: o,
   mutate: d
 }) => {
-  const { selectedRole: m, setSelectedRole: R, setRoleDialog: w, roleDialog: s } = q(), [k, S] = A({}), f = g(null), h = g(null), u = V("role-"), l = () => {
+  const { selectedRole: c, setSelectedRole: R, setRoleDialog: w, roleDialog: s } = q(), [k, S] = A({}), p = g(null), f = g(null), h = V("role-"), a = () => {
     w({
       type: "",
       open: !1
     });
   }, T = async () => {
-    l(), await M(300), R("");
+    a(), await M(300), R("");
   }, I = async () => {
-    var n, t;
-    const r = structuredClone(c);
+    const r = structuredClone(o);
     r.push({
-      id: u,
-      name: ((n = f.current) == null ? void 0 : n.value) || `Untitle-${u}`,
-      description: ((t = h.current) == null ? void 0 : t.value) || "",
+      id: h,
+      name: p.current?.value || `Untitle-${h}`,
+      description: f.current?.value || "",
       users: [],
       accessRight: k
-    }), d(r, !1), l();
-  }, a = F(() => c.find((r) => r.id === m), [m, c]), D = (r, n) => {
-    if (s.type === "new" && S((t) => (t[n] = r, t)), s.type === "edit") {
-      const t = structuredClone(c).map((o) => (o.id === m && (o.accessRight[n] = r), o));
+    }), d(r, !1), a();
+  }, u = F(() => o.find((r) => r.id === c), [c, o]), D = (r, l) => {
+    if (s.type === "new" && S((t) => (t[l] = r, t)), s.type === "edit") {
+      const t = structuredClone(o).map((i) => (i.id === c && (i.accessRight[l] = r), i));
       d(t, !1);
     }
   };
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ n(
     K,
     {
       isOpen: s.open,
       width: 900,
-      onClose: l,
-      onRequestClose: l,
+      onClose: a,
+      onRequestClose: a,
       children: [
-        /* @__PURE__ */ e("h4", { children: s.type === "new" ? "Create role" : a == null ? void 0 : a.name }),
-        /* @__PURE__ */ e(L, { className: "mt-6 max-h-[600px] overflow-y-auto", children: /* @__PURE__ */ i("div", { className: "px-4", children: [
-          s.type === "new" && /* @__PURE__ */ i(b, { children: [
-            /* @__PURE__ */ e(v, { label: "Role name", children: /* @__PURE__ */ e(N, { ref: f }) }),
-            /* @__PURE__ */ e(v, { label: "Description", children: /* @__PURE__ */ e(N, { ref: h, textArea: !0 }) }),
+        /* @__PURE__ */ e("h4", { children: s.type === "new" ? "Create role" : u?.name }),
+        /* @__PURE__ */ e(L, { className: "mt-6 max-h-[600px] overflow-y-auto", children: /* @__PURE__ */ n("div", { className: "px-4", children: [
+          s.type === "new" && /* @__PURE__ */ n(b, { children: [
+            /* @__PURE__ */ e(v, { label: "Role name", children: /* @__PURE__ */ e(N, { ref: p }) }),
+            /* @__PURE__ */ e(v, { label: "Description", children: /* @__PURE__ */ e(N, { ref: f, textArea: !0 }) }),
             /* @__PURE__ */ e("span", { className: "font-semibold mb-2", children: "Permission" })
           ] }),
-          x.map((r, n) => /* @__PURE__ */ i(
+          x.map((r, l) => /* @__PURE__ */ n(
             "div",
             {
               className: C(
                 "flex flex-col md:flex-row md:items-center justify-between gap-4 py-6 border-gray-200 dark:border-gray-600",
-                !z(x, n) && "border-b"
+                !z(x, l) && "border-b"
               ),
               children: [
-                /* @__PURE__ */ i("div", { className: "flex items-center gap-4", children: [
+                /* @__PURE__ */ n("div", { className: "flex items-center gap-4", children: [
                   /* @__PURE__ */ e(
                     B,
                     {
@@ -85,7 +84,7 @@ const Q = {
                       shape: "round"
                     }
                   ),
-                  /* @__PURE__ */ i("div", { children: [
+                  /* @__PURE__ */ n("div", { children: [
                     /* @__PURE__ */ e("h6", { className: "font-bold", children: r.name }),
                     /* @__PURE__ */ e("span", { children: r.description })
                   ] })
@@ -95,21 +94,21 @@ const Q = {
                   {
                     className: "bg-transparent dark:bg-transparent",
                     selectionType: "multiple",
-                    value: a == null ? void 0 : a.accessRight[r.id],
+                    value: u?.accessRight[r.id],
                     onChange: (t) => D(t, r.id),
                     children: r.accessor.map((t) => /* @__PURE__ */ e(
                       y.Item,
                       {
                         value: t.value,
                         children: ({
-                          active: o,
+                          active: i,
                           onSegmentItemClick: U
                         }) => /* @__PURE__ */ e(
-                          p,
+                          m,
                           {
                             variant: "default",
-                            icon: o ? /* @__PURE__ */ e(J, { className: "text-primary text-xl" }) : /* @__PURE__ */ e(b, {}),
-                            active: o,
+                            icon: i ? /* @__PURE__ */ e(J, { className: "text-primary text-xl" }) : /* @__PURE__ */ e(b, {}),
+                            active: i,
                             type: "button",
                             className: "md:min-w-[100px]",
                             size: "sm",
@@ -131,18 +130,18 @@ const Q = {
             },
             r.id
           )),
-          /* @__PURE__ */ i("div", { className: "flex justify-end mt-6", children: [
+          /* @__PURE__ */ n("div", { className: "flex justify-end mt-6", children: [
             /* @__PURE__ */ e(
-              p,
+              m,
               {
                 className: "ltr:mr-2 rtl:ml-2",
                 variant: "plain",
-                onClick: l,
+                onClick: a,
                 children: "Cancel"
               }
             ),
             /* @__PURE__ */ e(
-              p,
+              m,
               {
                 variant: "solid",
                 onClick: s.type === "edit" ? T : I,

package/dist/@ecme/views/concepts/accounts/RolesPermissions/components/RolesPermissionsAccessDialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RolesPermissionsAccessDialog.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/RolesPermissions/components/RolesPermissionsAccessDialog.tsx"],"sourcesContent":["import { useMemo, useState, useRef } from 'react'\nimport Button from '@/components/ui/Button'\nimport Avatar from '@/components/ui/Avatar'\nimport Segment from '@/components/ui/Segment'\nimport Dialog from '@/components/ui/Dialog'\nimport Input from '@/components/ui/Input'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport { FormItem } from '@/components/ui/Form'\nimport hooks from '@/components/ui/hooks'\nimport { useRolePermissionsStore } from '../store/rolePermissionsStore'\nimport { accessModules } from '../constants'\nimport classNames from '@/utils/classNames'\nimport isLastChild from '@/utils/isLastChild'\nimport sleep from '@/utils/sleep'\nimport {\n TbUserCog,\n TbBox,\n TbSettings,\n TbFiles,\n TbFileChart,\n TbCheck,\n} from 'react-icons/tb'\nimport type { MutateRolesPermissionsRolesResponse, Roles } from '../types'\nimport type { ReactNode } from 'react'\n\ntype RolesPermissionsAccessDialog = {\n roleList: Roles\n mutate: MutateRolesPermissionsRolesResponse\n}\n\nconst moduleIcon: Record<string, ReactNode> = {\n users: <TbUserCog />,\n products: <TbBox />,\n configurations: <TbSettings />,\n files: <TbFiles />,\n reports: <TbFileChart />,\n}\n\nconst { useUniqueId } = hooks\n\nconst RolesPermissionsAccessDialog = ({\n roleList,\n mutate,\n}: RolesPermissionsAccessDialog) => {\n const { selectedRole, setSelectedRole, setRoleDialog, roleDialog } =\n useRolePermissionsStore()\n\n const [accessRight, setAccessRight] = useState<Record<string, string[]>>({})\n\n const roleNameRef = useRef<HTMLInputElement>(null)\n const descriptionRef = useRef<HTMLTextAreaElement>(null)\n\n const newId = useUniqueId('role-')\n\n const handleClose = () => {\n setRoleDialog({\n type: '',\n open: false,\n })\n }\n\n const handleUpdate = async () => {\n handleClose()\n await sleep(300)\n setSelectedRole('')\n }\n\n const handleSubmit = async () => {\n const newRoleList = structuredClone(roleList)\n newRoleList.push({\n id: newId,\n name: roleNameRef.current?.value \|\| `Untitle-${newId}`,\n description: descriptionRef.current?.value \|\| '',\n users: [],\n accessRight,\n })\n mutate(newRoleList, false)\n handleClose()\n }\n\n const modules = useMemo(() => {\n return roleList.find((role) => role.id === selectedRole)\n }, [selectedRole, roleList])\n\n const handleChange = (accessRight: string[], key: string) => {\n if (roleDialog.type === 'new') {\n setAccessRight((value) => {\n value[key] = accessRight\n return value\n })\n }\n\n if (roleDialog.type === 'edit') {\n const newRoleList = structuredClone(roleList).map((role) => {\n if (role.id === selectedRole) {\n role.accessRight[key] = accessRight\n }\n\n return role\n })\n\n mutate(newRoleList, false)\n }\n }\n\n return (\n <Dialog\n isOpen={roleDialog.open}\n width={900}\n onClose={handleClose}\n onRequestClose={handleClose}\n >\n <h4>{roleDialog.type === 'new' ? 'Create role' : modules?.name}</h4>\n <ScrollBar className=\"mt-6 max-h-[600px] overflow-y-auto\">\n <div className=\"px-4\">\n {roleDialog.type === 'new' && (\n <>\n <FormItem label=\"Role name\">\n <Input ref={roleNameRef} />\n </FormItem>\n <FormItem label=\"Description\">\n <Input ref={descriptionRef} textArea />\n </FormItem>\n <span className=\"font-semibold mb-2\">\n Permission\n </span>\n </>\n )}\n {accessModules.map((module, index) => (\n <div\n key={module.id}\n className={classNames(\n 'flex flex-col md:flex-row md:items-center justify-between gap-4 py-6 border-gray-200 dark:border-gray-600',\n !isLastChild(accessModules, index) &&\n 'border-b',\n )}\n >\n <div className=\"flex items-center gap-4\">\n <Avatar\n className=\"bg-transparent dark:bg-transparent p-2 border-2 border-gray-200 dark:border-gray-600 text-primary\"\n size={50}\n icon={moduleIcon[module.id]}\n shape=\"round\"\n />\n <div>\n <h6 className=\"font-bold\">{module.name}</h6>\n <span>{module.description}</span>\n </div>\n </div>\n <div className=\"flex items-center gap-4\">\n <Segment\n className=\"bg-transparent dark:bg-transparent\"\n selectionType=\"multiple\"\n value={modules?.accessRight[module.id]}\n onChange={(val) =>\n handleChange(val as string[], module.id)\n }\n >\n {module.accessor.map((access) => (\n <Segment.Item\n key={module.id + access.value}\n value={access.value}\n >\n {({\n active,\n onSegmentItemClick,\n }) => {\n return (\n <Button\n variant=\"default\"\n icon={\n active ? (\n <TbCheck className=\"text-primary text-xl\" />\n ) : (\n <></>\n )\n }\n active={active}\n type=\"button\"\n className=\"md:min-w-[100px]\"\n size=\"sm\"\n customColorClass={({\n active,\n }) =>\n classNames(\n active &&\n 'bg-transparent dark:bg-transparent text-primary border-primary ring-1 ring-primary',\n )\n }\n onClick={\n onSegmentItemClick\n }\n >\n {access.label}\n </Button>\n )\n }}\n </Segment.Item>\n ))}\n </Segment>\n </div>\n </div>\n ))}\n <div className=\"flex justify-end mt-6\">\n <Button\n className=\"ltr:mr-2 rtl:ml-2\"\n variant=\"plain\"\n onClick={handleClose}\n >\n Cancel\n </Button>\n <Button\n variant=\"solid\"\n onClick={\n roleDialog.type === 'edit'\n ? handleUpdate\n : handleSubmit\n }\n >\n {roleDialog.type === 'edit' ? 'Update' : 'Create'}\n </Button>\n </div>\n </div>\n </ScrollBar>\n </Dialog>\n )\n}\n\nexport default RolesPermissionsAccessDialog\n"],"names":["moduleIcon","TbUserCog","TbBox","TbSettings","TbFiles","TbFileChart","useUniqueId","hooks","RolesPermissionsAccessDialog","roleList","mutate","selectedRole","setSelectedRole","setRoleDialog","roleDialog","useRolePermissionsStore","accessRight","setAccessRight","useState","roleNameRef","useRef","descriptionRef","newId","handleClose","handleUpdate","sleep","handleSubmit","newRoleList","_a","_b","modules","useMemo","role","handleChange","key","value","jsxs","Dialog","jsx","ScrollBar","Fragment","FormItem","Input","accessModules","module","index","classNames","isLastChild","Avatar","Segment","val","access","active","onSegmentItemClick","Button","TbCheck"],"mappings":"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"}
1	+ {"version":3,"file":"RolesPermissionsAccessDialog.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/RolesPermissions/components/RolesPermissionsAccessDialog.tsx"],"sourcesContent":["import { useMemo, useState, useRef } from 'react'\nimport Button from '@/components/ui/Button'\nimport Avatar from '@/components/ui/Avatar'\nimport Segment from '@/components/ui/Segment'\nimport Dialog from '@/components/ui/Dialog'\nimport Input from '@/components/ui/Input'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport { FormItem } from '@/components/ui/Form'\nimport hooks from '@/components/ui/hooks'\nimport { useRolePermissionsStore } from '../store/rolePermissionsStore'\nimport { accessModules } from '../constants'\nimport classNames from '@/utils/classNames'\nimport isLastChild from '@/utils/isLastChild'\nimport sleep from '@/utils/sleep'\nimport {\n TbUserCog,\n TbBox,\n TbSettings,\n TbFiles,\n TbFileChart,\n TbCheck,\n} from 'react-icons/tb'\nimport type { MutateRolesPermissionsRolesResponse, Roles } from '../types'\nimport type { ReactNode } from 'react'\n\ntype RolesPermissionsAccessDialog = {\n roleList: Roles\n mutate: MutateRolesPermissionsRolesResponse\n}\n\nconst moduleIcon: Record<string, ReactNode> = {\n users: <TbUserCog />,\n products: <TbBox />,\n configurations: <TbSettings />,\n files: <TbFiles />,\n reports: <TbFileChart />,\n}\n\nconst { useUniqueId } = hooks\n\nconst RolesPermissionsAccessDialog = ({\n roleList,\n mutate,\n}: RolesPermissionsAccessDialog) => {\n const { selectedRole, setSelectedRole, setRoleDialog, roleDialog } =\n useRolePermissionsStore()\n\n const [accessRight, setAccessRight] = useState<Record<string, string[]>>({})\n\n const roleNameRef = useRef<HTMLInputElement>(null)\n const descriptionRef = useRef<HTMLTextAreaElement>(null)\n\n const newId = useUniqueId('role-')\n\n const handleClose = () => {\n setRoleDialog({\n type: '',\n open: false,\n })\n }\n\n const handleUpdate = async () => {\n handleClose()\n await sleep(300)\n setSelectedRole('')\n }\n\n const handleSubmit = async () => {\n const newRoleList = structuredClone(roleList)\n newRoleList.push({\n id: newId,\n name: roleNameRef.current?.value \|\| `Untitle-${newId}`,\n description: descriptionRef.current?.value \|\| '',\n users: [],\n accessRight,\n })\n mutate(newRoleList, false)\n handleClose()\n }\n\n const modules = useMemo(() => {\n return roleList.find((role) => role.id === selectedRole)\n }, [selectedRole, roleList])\n\n const handleChange = (accessRight: string[], key: string) => {\n if (roleDialog.type === 'new') {\n setAccessRight((value) => {\n value[key] = accessRight\n return value\n })\n }\n\n if (roleDialog.type === 'edit') {\n const newRoleList = structuredClone(roleList).map((role) => {\n if (role.id === selectedRole) {\n role.accessRight[key] = accessRight\n }\n\n return role\n })\n\n mutate(newRoleList, false)\n }\n }\n\n return (\n <Dialog\n isOpen={roleDialog.open}\n width={900}\n onClose={handleClose}\n onRequestClose={handleClose}\n >\n <h4>{roleDialog.type === 'new' ? 'Create role' : modules?.name}</h4>\n <ScrollBar className=\"mt-6 max-h-[600px] overflow-y-auto\">\n <div className=\"px-4\">\n {roleDialog.type === 'new' && (\n <>\n <FormItem label=\"Role name\">\n <Input ref={roleNameRef} />\n </FormItem>\n <FormItem label=\"Description\">\n <Input ref={descriptionRef} textArea />\n </FormItem>\n <span className=\"font-semibold mb-2\">\n Permission\n </span>\n </>\n )}\n {accessModules.map((module, index) => (\n <div\n key={module.id}\n className={classNames(\n 'flex flex-col md:flex-row md:items-center justify-between gap-4 py-6 border-gray-200 dark:border-gray-600',\n !isLastChild(accessModules, index) &&\n 'border-b',\n )}\n >\n <div className=\"flex items-center gap-4\">\n <Avatar\n className=\"bg-transparent dark:bg-transparent p-2 border-2 border-gray-200 dark:border-gray-600 text-primary\"\n size={50}\n icon={moduleIcon[module.id]}\n shape=\"round\"\n />\n <div>\n <h6 className=\"font-bold\">{module.name}</h6>\n <span>{module.description}</span>\n </div>\n </div>\n <div className=\"flex items-center gap-4\">\n <Segment\n className=\"bg-transparent dark:bg-transparent\"\n selectionType=\"multiple\"\n value={modules?.accessRight[module.id]}\n onChange={(val) =>\n handleChange(val as string[], module.id)\n }\n >\n {module.accessor.map((access) => (\n <Segment.Item\n key={module.id + access.value}\n value={access.value}\n >\n {({\n active,\n onSegmentItemClick,\n }) => {\n return (\n <Button\n variant=\"default\"\n icon={\n active ? (\n <TbCheck className=\"text-primary text-xl\" />\n ) : (\n <></>\n )\n }\n active={active}\n type=\"button\"\n className=\"md:min-w-[100px]\"\n size=\"sm\"\n customColorClass={({\n active,\n }) =>\n classNames(\n active &&\n 'bg-transparent dark:bg-transparent text-primary border-primary ring-1 ring-primary',\n )\n }\n onClick={\n onSegmentItemClick\n }\n >\n {access.label}\n </Button>\n )\n }}\n </Segment.Item>\n ))}\n </Segment>\n </div>\n </div>\n ))}\n <div className=\"flex justify-end mt-6\">\n <Button\n className=\"ltr:mr-2 rtl:ml-2\"\n variant=\"plain\"\n onClick={handleClose}\n >\n Cancel\n </Button>\n <Button\n variant=\"solid\"\n onClick={\n roleDialog.type === 'edit'\n ? handleUpdate\n : handleSubmit\n }\n >\n {roleDialog.type === 'edit' ? 'Update' : 'Create'}\n </Button>\n </div>\n </div>\n </ScrollBar>\n </Dialog>\n )\n}\n\nexport default RolesPermissionsAccessDialog\n"],"names":["moduleIcon","TbUserCog","TbBox","TbSettings","TbFiles","TbFileChart","useUniqueId","hooks","RolesPermissionsAccessDialog","roleList","mutate","selectedRole","setSelectedRole","setRoleDialog","roleDialog","useRolePermissionsStore","accessRight","setAccessRight","useState","roleNameRef","useRef","descriptionRef","newId","handleClose","handleUpdate","sleep","handleSubmit","newRoleList","modules","useMemo","role","handleChange","key","value","jsxs","Dialog","jsx","ScrollBar","Fragment","FormItem","Input","accessModules","module","index","classNames","isLastChild","Avatar","Segment","val","access","active","onSegmentItemClick","Button","TbCheck"],"mappings":"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"}

package/dist/@ecme/views/concepts/accounts/RolesPermissions/components/RolesPermissionsUserAction.js CHANGED Viewed

@@ -1,13 +1,13 @@
-import { jsx as l, jsxs as o } from "react/jsx-runtime";
+import { jsx as l, jsxs as s } from "react/jsx-runtime";
 import "../../../../../components/ui/Badge/index.js";
 import "../../../../../components/ui/Select/index.js";
-import p from "../../../../../components/shared/DebounceInput.js";
+import d from "../../../../../components/shared/DebounceInput.js";
 import { useRolePermissionsStore as g } from "../store/rolePermissionsStore.js";
 import { TbSearch as b } from "react-icons/tb";
 import { components as v } from "react-select";
-import n from "../../../../../components/ui/Select/Option.js";
+import r from "../../../../../components/ui/Select/Option.js";
 import c from "../../../../../components/ui/Badge/Badge.js";
-import r from "../../../../../components/ui/Select/Select.js";
+import n from "../../../../../components/ui/Select/Select.js";
 const { Control: h } = v, f = [
   { label: "All", value: "", dotBackground: "bg-gray-200" },
   { label: "Active", value: "active", dotBackground: "bg-success" },
@@ -20,50 +20,50 @@ const { Control: h } = v, f = [
   { label: "User", value: "user" },
   { label: "Auditor", value: "auditor" },
   { label: "Guest", value: "guest" }
-], S = (s) => /* @__PURE__ */ l(
-  n,
+], S = (o) => /* @__PURE__ */ l(
+  r,
   {
-    ...s,
-    customLabel: (t, a) => /* @__PURE__ */ o("span", { className: "flex items-center gap-2", children: [
+    ...o,
+    customLabel: (t, a) => /* @__PURE__ */ s("span", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ l(c, { className: t.dotBackground }),
       /* @__PURE__ */ l("span", { children: a })
     ] })
   }
-), C = (s) => /* @__PURE__ */ l(
-  n,
+), C = (o) => /* @__PURE__ */ l(
+  r,
   {
-    ...s,
+    ...o,
     customLabel: (t, a) => /* @__PURE__ */ l("span", { children: a })
   }
-), N = ({ children: s, ...t }) => {
+), N = ({ children: o, ...t }) => {
   const a = t.getValue()[0];
-  return /* @__PURE__ */ o(h, { ...t, children: [
+  return /* @__PURE__ */ s(h, { ...t, children: [
     a && /* @__PURE__ */ l("div", { className: "flex ml-3", children: /* @__PURE__ */ l(c, { className: a.dotBackground }) }),
-    s
+    o
   ] });
 }, V = () => {
-  const { tableData: s, filterData: t, setFilterData: a, setTableData: u } = g(), m = (e) => {
+  const { tableData: o, filterData: t, setFilterData: a, setTableData: u } = g(), i = (e) => {
     a({ ...t, status: e });
-  }, i = (e) => {
+  }, m = (e) => {
     a({ ...t, role: e });
-  }, d = (e) => {
-    u({ ...s, query: e });
+  }, p = (e) => {
+    u({ ...o, query: e });
   };
-  return /* @__PURE__ */ o("div", { className: "flex items-center justify-between", children: [
+  return /* @__PURE__ */ s("div", { className: "flex items-center justify-between", children: [
     /* @__PURE__ */ l(
-      p,
+      d,
       {
         className: "max-w-[300px]",
         placeholder: "Search...",
         type: "text",
         size: "sm",
         prefix: /* @__PURE__ */ l(b, { className: "text-lg" }),
-        onChange: (e) => d(e.target.value)
+        onChange: (e) => p(e.target.value)
       }
     ),
-    /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
+    /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ l(
-        r,
+        n,
         {
           className: "min-w-[150px] w-full",
           components: {
@@ -78,11 +78,11 @@ const { Control: h } = v, f = [
             value: "",
             dotBackground: "bg-gray-200"
           },
-          onChange: (e) => m((e == null ? void 0 : e.value) || "")
+          onChange: (e) => i(e?.value || "")
         }
       ),
       /* @__PURE__ */ l(
-        r,
+        n,
         {
           className: "min-w-[150px] w-full",
           components: {
@@ -92,7 +92,7 @@ const { Control: h } = v, f = [
           size: "sm",
           placeholder: "Role",
           defaultValue: { label: "All", value: "" },
-          onChange: (e) => i((e == null ? void 0 : e.value) || "")
+          onChange: (e) => m(e?.value || "")
         }
       )
     ] })

package/dist/@ecme/views/concepts/accounts/RolesPermissions/components/RolesPermissionsUserAction.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RolesPermissionsUserAction.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/RolesPermissions/components/RolesPermissionsUserAction.tsx"],"sourcesContent":["import Badge from '@/components/ui/Badge'\nimport Select, { Option as DefaultOption } from '@/components/ui/Select'\nimport DebounceInput from '@/components/shared/DebounceInput'\nimport { useRolePermissionsStore } from '../store/rolePermissionsStore'\nimport { TbSearch } from 'react-icons/tb'\nimport { components } from 'react-select'\nimport type { ControlProps, OptionProps } from 'react-select'\n\nconst { Control } = components\n\ntype StatusOption = {\n label: string\n value: string\n dotBackground: string\n}\n\ntype RoleOption = {\n label: string\n value: string\n}\n\nconst statusOptions = [\n { label: 'All', value: '', dotBackground: 'bg-gray-200' },\n { label: 'Active', value: 'active', dotBackground: 'bg-success' },\n { label: 'Blocked', value: 'blocked', dotBackground: 'bg-error' },\n]\n\nconst roleOptions = [\n { label: 'All', value: '' },\n { label: 'Admin', value: 'admin' },\n { label: 'Supervisor', value: 'supervisor' },\n { label: 'Support', value: 'support' },\n { label: 'User', value: 'user' },\n { label: 'Auditor', value: 'auditor' },\n { label: 'Guest', value: 'guest' },\n]\n\nconst StatusSelectOption = (props: OptionProps<StatusOption>) => {\n return (\n <DefaultOption<StatusOption>\n {...props}\n customLabel={(data, label) => (\n <span className=\"flex items-center gap-2\">\n <Badge className={data.dotBackground} />\n <span>{label}</span>\n </span>\n )}\n />\n )\n}\n\nconst RoleSelectOption = (props: OptionProps<RoleOption>) => {\n return (\n <DefaultOption<RoleOption>\n {...props}\n customLabel={(_, label) => <span>{label}</span>}\n />\n )\n}\n\nconst CustomControl = ({ children, ...props }: ControlProps<StatusOption>) => {\n const selected = props.getValue()[0]\n return (\n <Control {...props}>\n {selected && (\n <div className=\"flex ml-3\">\n <Badge className={selected.dotBackground} />\n </div>\n )}\n {children}\n </Control>\n )\n}\n\nconst RolesPermissionsUserAction = () => {\n const { tableData, filterData, setFilterData, setTableData } =\n useRolePermissionsStore()\n\n const handleStatusChange = (status: string) => {\n setFilterData({ ...filterData, status })\n }\n\n const handleRoleChange = (role: string) => {\n setFilterData({ ...filterData, role })\n }\n\n const handleInputChange = (query: string) => {\n setTableData({ ...tableData, query })\n }\n\n return (\n <div className=\"flex items-center justify-between\">\n <DebounceInput\n className=\"max-w-[300px]\"\n placeholder=\"Search...\"\n type=\"text\"\n size=\"sm\"\n prefix={<TbSearch className=\"text-lg\" />}\n onChange={(e) => handleInputChange(e.target.value)}\n />\n <div className=\"flex items-center gap-2\">\n <Select<StatusOption, false>\n className=\"min-w-[150px] w-full\"\n components={{\n Control: CustomControl,\n Option: StatusSelectOption,\n }}\n options={statusOptions}\n size=\"sm\"\n placeholder=\"Status\"\n defaultValue={{\n label: 'All',\n value: '',\n dotBackground: 'bg-gray-200',\n }}\n onChange={(option) =>\n handleStatusChange(option?.value \|\| '')\n }\n />\n <Select<RoleOption>\n className=\"min-w-[150px] w-full\"\n components={{\n Option: RoleSelectOption,\n }}\n options={roleOptions}\n size=\"sm\"\n placeholder=\"Role\"\n defaultValue={{ label: 'All', value: '' }}\n onChange={(option) => handleRoleChange(option?.value \|\| '')}\n />\n </div>\n </div>\n )\n}\n\nexport default RolesPermissionsUserAction\n"],"names":["Control","components","statusOptions","roleOptions","StatusSelectOption","props","jsx","DefaultOption","data","label","jsxs","Badge","RoleSelectOption","_","CustomControl","children","selected","RolesPermissionsUserAction","tableData","filterData","setFilterData","setTableData","useRolePermissionsStore","handleStatusChange","status","handleRoleChange","role","handleInputChange","query","DebounceInput","TbSearch","Select","option"],"mappings":"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~~GAAmBS~~,~~KAAA~~,~~gBAAAA~~,~~EAAQ,UAAS,~~EAAE;AAAA,QAAA;AAAA,MAAA;AAAA,MAG9C,gBAAA1B;AAAA,QAACyB;AAAA,QAAA;AAAA,UACG,WAAU;AAAA,UACV,YAAY;AAAA,YACR,QAAQnB;AAAA,UAAA;AAAA,UAEZ,SAAST;AAAA,UACT,MAAK;AAAA,UACL,aAAY;AAAA,UACZ,cAAc,EAAE,OAAO,OAAO,OAAO,GAAA;AAAA,UACrC,UAAU,CAAC6B,MAAWP,~~GAAiBO~~,~~KAAA~~,~~gBAAAA~~,~~EAAQ,UAAS,~~EAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IAC9D,EAAA,CACJ;AAAA,EAAA,GACJ;AAER;"}
1	+ {"version":3,"file":"RolesPermissionsUserAction.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/RolesPermissions/components/RolesPermissionsUserAction.tsx"],"sourcesContent":["import Badge from '@/components/ui/Badge'\nimport Select, { Option as DefaultOption } from '@/components/ui/Select'\nimport DebounceInput from '@/components/shared/DebounceInput'\nimport { useRolePermissionsStore } from '../store/rolePermissionsStore'\nimport { TbSearch } from 'react-icons/tb'\nimport { components } from 'react-select'\nimport type { ControlProps, OptionProps } from 'react-select'\n\nconst { Control } = components\n\ntype StatusOption = {\n label: string\n value: string\n dotBackground: string\n}\n\ntype RoleOption = {\n label: string\n value: string\n}\n\nconst statusOptions = [\n { label: 'All', value: '', dotBackground: 'bg-gray-200' },\n { label: 'Active', value: 'active', dotBackground: 'bg-success' },\n { label: 'Blocked', value: 'blocked', dotBackground: 'bg-error' },\n]\n\nconst roleOptions = [\n { label: 'All', value: '' },\n { label: 'Admin', value: 'admin' },\n { label: 'Supervisor', value: 'supervisor' },\n { label: 'Support', value: 'support' },\n { label: 'User', value: 'user' },\n { label: 'Auditor', value: 'auditor' },\n { label: 'Guest', value: 'guest' },\n]\n\nconst StatusSelectOption = (props: OptionProps<StatusOption>) => {\n return (\n <DefaultOption<StatusOption>\n {...props}\n customLabel={(data, label) => (\n <span className=\"flex items-center gap-2\">\n <Badge className={data.dotBackground} />\n <span>{label}</span>\n </span>\n )}\n />\n )\n}\n\nconst RoleSelectOption = (props: OptionProps<RoleOption>) => {\n return (\n <DefaultOption<RoleOption>\n {...props}\n customLabel={(_, label) => <span>{label}</span>}\n />\n )\n}\n\nconst CustomControl = ({ children, ...props }: ControlProps<StatusOption>) => {\n const selected = props.getValue()[0]\n return (\n <Control {...props}>\n {selected && (\n <div className=\"flex ml-3\">\n <Badge className={selected.dotBackground} />\n </div>\n )}\n {children}\n </Control>\n )\n}\n\nconst RolesPermissionsUserAction = () => {\n const { tableData, filterData, setFilterData, setTableData } =\n useRolePermissionsStore()\n\n const handleStatusChange = (status: string) => {\n setFilterData({ ...filterData, status })\n }\n\n const handleRoleChange = (role: string) => {\n setFilterData({ ...filterData, role })\n }\n\n const handleInputChange = (query: string) => {\n setTableData({ ...tableData, query })\n }\n\n return (\n <div className=\"flex items-center justify-between\">\n <DebounceInput\n className=\"max-w-[300px]\"\n placeholder=\"Search...\"\n type=\"text\"\n size=\"sm\"\n prefix={<TbSearch className=\"text-lg\" />}\n onChange={(e) => handleInputChange(e.target.value)}\n />\n <div className=\"flex items-center gap-2\">\n <Select<StatusOption, false>\n className=\"min-w-[150px] w-full\"\n components={{\n Control: CustomControl,\n Option: StatusSelectOption,\n }}\n options={statusOptions}\n size=\"sm\"\n placeholder=\"Status\"\n defaultValue={{\n label: 'All',\n value: '',\n dotBackground: 'bg-gray-200',\n }}\n onChange={(option) =>\n handleStatusChange(option?.value \|\| '')\n }\n />\n <Select<RoleOption>\n className=\"min-w-[150px] w-full\"\n components={{\n Option: RoleSelectOption,\n }}\n options={roleOptions}\n size=\"sm\"\n placeholder=\"Role\"\n defaultValue={{ label: 'All', value: '' }}\n onChange={(option) => handleRoleChange(option?.value \|\| '')}\n />\n </div>\n </div>\n )\n}\n\nexport default RolesPermissionsUserAction\n"],"names":["Control","components","statusOptions","roleOptions","StatusSelectOption","props","jsx","DefaultOption","data","label","jsxs","Badge","RoleSelectOption","_","CustomControl","children","selected","RolesPermissionsUserAction","tableData","filterData","setFilterData","setTableData","useRolePermissionsStore","handleStatusChange","status","handleRoleChange","role","handleInputChange","query","DebounceInput","TbSearch","Select","option"],"mappings":"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"}