@orbe-agro/client-core 5.5.3 → 5.5.9

package/dist/@ecme/views/concepts/accounts/Settings/components/SettingsBilling.js.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsBilling.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsBilling.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Button from '@/components/ui/Button'\nimport Tag from '@/components/ui/Tag'\nimport Avatar from '@/components/ui/Avatar'\nimport Notification from '@/components/ui/Notification'\nimport toast from '@/components/ui/toast'\nimport CreditCardDialog from '@/components/view/CreditCardDialog'\nimport BillingHistory from './BillingHistory'\nimport { apiGetSettingsBilling } from '@/services/AccontsService'\nimport classNames from '@/utils/classNames'\nimport isLastChild from '@/utils/isLastChild'\nimport sleep from '@/utils/sleep'\nimport { TbPlus } from 'react-icons/tb'\nimport useSWR from 'swr'\nimport dayjs from 'dayjs'\nimport { useNavigate } from 'react-router-dom'\nimport { PiLightningFill } from 'react-icons/pi'\nimport { NumericFormat } from 'react-number-format'\n\nimport type {\n    GetSettingsBillingResponse,\n    CreditCard,\n    CreditCardInfo,\n} from '../types'\n\nconst months = [\n    'Jan',\n    'Feb',\n    'Mar',\n    'Apr',\n    'May',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec',\n]\n\nconst SettingsBilling = () => {\n    const navigate = useNavigate()\n\n    const [selectedCard, setSelectedCard] = useState<{\n        type: 'NEW' | 'EDIT' | ''\n        dialogOpen: boolean\n        cardInfo: Partial<CreditCardInfo>\n    }>({\n        type: '',\n        dialogOpen: false,\n        cardInfo: {},\n    })\n\n    const {\n        data = {\n            currentPlan: {\n                plan: '',\n                status: '',\n                billingCycle: '',\n                nextPaymentDate: null,\n                amount: null,\n            },\n            paymentMethods: [],\n            transactionHistory: [],\n        },\n    } = useSWR(\n        '/api/settings/billing/',\n        () => apiGetSettingsBilling<GetSettingsBillingResponse>(),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            revalidateOnReconnect: false,\n        },\n    )\n\n    const handleEditCreditCard = (card: Partial<CreditCard>) => {\n        setSelectedCard({\n            type: 'EDIT',\n            dialogOpen: true,\n            cardInfo: card,\n        })\n    }\n\n    const handleCreditCardDialogClose = () => {\n        setSelectedCard({\n            type: '',\n            dialogOpen: false,\n            cardInfo: {},\n        })\n    }\n\n    const handleEditCreditCardSubmit = async () => {\n        await sleep(500)\n        handleCreditCardDialogClose()\n        toast.push(\n            <Notification type=\"success\">Credit card updated!</Notification>,\n            { placement: 'top-center' },\n        )\n    }\n\n    const handleAddCreditCardSubmit = async (values: CreditCard) => {\n        console.log('Submitted values', values)\n        await sleep(500)\n        handleCreditCardDialogClose()\n        toast.push(\n            <Notification type=\"success\">Credit card added!</Notification>,\n            { placement: 'top-center' },\n        )\n    }\n\n    const handleChangePlan = () => {\n        navigate('/concepts/account/pricing?subcription=basic&cycle=monthly')\n    }\n\n    return (\n        <div>\n            <h4 className=\"mb-4\">Billing</h4>\n            <div className=\"bg-gray-100 dark:bg-gray-700 rounded-xl p-6\">\n                <div className=\"flex flex-col lg:flex-row lg:items-center justify-between gap-4\">\n                    <div className=\"flex items-center gap-3\">\n                        <div>\n                            <Avatar\n                                className=\"bg-emerald-500\"\n                                shape=\"circle\"\n                                icon={<PiLightningFill />}\n                            />\n                        </div>\n                        <div>\n                            <div className=\"flex items-center gap-2\">\n                                <h6 className=\"font-bold\">\n                                    {data.currentPlan.plan}\n                                </h6>\n                                <Tag className=\"bg-success-subtle text-success rounded-md border-0\">\n                                    <span className=\"capitalize\">\n                                        {data.currentPlan.status}\n                                    </span>\n                                </Tag>\n                            </div>\n                            <div className=\"font-semibold\">\n                                <span>\n                                    Billing {data.currentPlan.billingCycle}\n                                </span>\n                                <span> | </span>\n                                <span>\n                                    Next payment on{' '}\n                                    {dayjs\n                                        .unix(\n                                            (data.currentPlan\n                                                .nextPaymentDate as number) ||\n                                                0,\n                                        )\n                                        .format('MM/DD/YYYY')}\n                                </span>\n                                <span>\n                                    <span className=\"mx-1\">for</span>\n                                    <NumericFormat\n                                        className=\"font-bold heading-text\"\n                                        displayType=\"text\"\n                                        value={(\n                                            Math.round(\n                                                (data.currentPlan.amount || 0) *\n                                                    100,\n                                            ) / 100\n                                        ).toFixed(2)}\n                                        prefix={'$'}\n                                        thousandSeparator={true}\n                                    />\n                                </span>\n                            </div>\n                        </div>\n                    </div>\n                    <div className=\"flex\">\n                        <Button\n                            size=\"sm\"\n                            variant=\"solid\"\n                            onClick={handleChangePlan}\n                        >\n                            Change plan\n                        </Button>\n                    </div>\n                </div>\n            </div>\n            <div className=\"mt-8\">\n                <h5>Payment method</h5>\n                <div>\n                    {data.paymentMethods?.map((card, index) => (\n                        <div\n                            key={card.cardId}\n                            className={classNames(\n                                'flex items-center justify-between p-4',\n                                !isLastChild(data.paymentMethods, index) &&\n                                    'border-b border-gray-200 dark:border-gray-600',\n                            )}\n                        >\n                            <div className=\"flex items-center\">\n                                {card.cardType === 'VISA' && (\n                                    <img\n                                        src=\"/img/others/img-8.png\"\n                                        alt=\"visa\"\n                                    />\n                                )}\n                                {card.cardType === 'MASTER' && (\n                                    <img\n                                        src=\"/img/others/img-9.png\"\n                                        alt=\"master\"\n                                    />\n                                )}\n                                <div className=\"ml-3 rtl:mr-3\">\n                                    <div className=\"flex items-center\">\n                                        <div className=\"text-gray-900 dark:text-gray-100 font-semibold\">\n                                            {card.cardHolderName} ••••{' '}\n                                            {card.last4Number}\n                                        </div>\n                                        {card.primary && (\n                                            <Tag className=\"bg-primary-subtle text-primary rounded-md border-0 mx-2\">\n                                                <span className=\"capitalize\">\n                                                    {' '}\n                                                    Primary{' '}\n                                                </span>\n                                            </Tag>\n                                        )}\n                                    </div>\n                                    <span>\n                                        Expired{' '}\n                                        {months[parseInt(card.expMonth) - 1]} 20\n                                        {card.expYear}\n                                    </span>\n                                </div>\n                            </div>\n                            <div className=\"flex\">\n                                <Button\n                                    size=\"sm\"\n                                    type=\"button\"\n                                    onClick={() => handleEditCreditCard(card)}\n                                >\n                                    Edit\n                                </Button>\n                            </div>\n                        </div>\n                    ))}\n                    <Button\n                        variant=\"plain\"\n                        icon={<TbPlus />}\n                        onClick={() => {\n                            setSelectedCard({\n                                type: 'NEW',\n                                dialogOpen: true,\n                                cardInfo: {},\n                            })\n                        }}\n                    >\n                        Add payment method\n                    </Button>\n                </div>\n            </div>\n            <div className=\"mt-8\">\n                <h5>Transaction history</h5>\n                <BillingHistory\n                    className=\"mt-4\"\n                    data={data.transactionHistory}\n                />\n            </div>\n            <CreditCardDialog\n                title={\n                    selectedCard.type === 'NEW'\n                        ? 'Add credit card'\n                        : 'Edit credit card'\n                }\n                defaultValues={selectedCard.cardInfo as CreditCard}\n                dialogOpen={selectedCard.dialogOpen}\n                onDialogClose={handleCreditCardDialogClose}\n                onSubmit={\n                    selectedCard.type === 'NEW'\n                        ? (values) =>\n                              handleAddCreditCardSubmit(values as CreditCard)\n                        : handleEditCreditCardSubmit\n                }\n            />\n        </div>\n    )\n}\n\nexport default SettingsBilling\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SettingsBilling.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsBilling.tsx"],"sourcesContent":["import { useState } from 'react'\nimport Button from '@/components/ui/Button'\nimport Tag from '@/components/ui/Tag'\nimport Avatar from '@/components/ui/Avatar'\nimport Notification from '@/components/ui/Notification'\nimport toast from '@/components/ui/toast'\nimport CreditCardDialog from '@/components/view/CreditCardDialog'\nimport BillingHistory from './BillingHistory'\nimport { apiGetSettingsBilling } from '@/services/AccontsService'\nimport classNames from '@/utils/classNames'\nimport isLastChild from '@/utils/isLastChild'\nimport sleep from '@/utils/sleep'\nimport { TbPlus } from 'react-icons/tb'\nimport useSWR from 'swr'\nimport dayjs from 'dayjs'\nimport { useNavigate } from 'react-router-dom'\nimport { PiLightningFill } from 'react-icons/pi'\nimport { NumericFormat } from 'react-number-format'\n\nimport type {\n    GetSettingsBillingResponse,\n    CreditCard,\n    CreditCardInfo,\n} from '../types'\n\nconst months = [\n    'Jan',\n    'Feb',\n    'Mar',\n    'Apr',\n    'May',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec',\n]\n\nconst SettingsBilling = () => {\n    const navigate = useNavigate()\n\n    const [selectedCard, setSelectedCard] = useState<{\n        type: 'NEW' | 'EDIT' | ''\n        dialogOpen: boolean\n        cardInfo: Partial<CreditCardInfo>\n    }>({\n        type: '',\n        dialogOpen: false,\n        cardInfo: {},\n    })\n\n    const {\n        data = {\n            currentPlan: {\n                plan: '',\n                status: '',\n                billingCycle: '',\n                nextPaymentDate: null,\n                amount: null,\n            },\n            paymentMethods: [],\n            transactionHistory: [],\n        },\n    } = useSWR(\n        '/api/settings/billing/',\n        () => apiGetSettingsBilling<GetSettingsBillingResponse>(),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            revalidateOnReconnect: false,\n        },\n    )\n\n    const handleEditCreditCard = (card: Partial<CreditCard>) => {\n        setSelectedCard({\n            type: 'EDIT',\n            dialogOpen: true,\n            cardInfo: card,\n        })\n    }\n\n    const handleCreditCardDialogClose = () => {\n        setSelectedCard({\n            type: '',\n            dialogOpen: false,\n            cardInfo: {},\n        })\n    }\n\n    const handleEditCreditCardSubmit = async () => {\n        await sleep(500)\n        handleCreditCardDialogClose()\n        toast.push(\n            <Notification type=\"success\">Credit card updated!</Notification>,\n            { placement: 'top-center' },\n        )\n    }\n\n    const handleAddCreditCardSubmit = async (values: CreditCard) => {\n        console.log('Submitted values', values)\n        await sleep(500)\n        handleCreditCardDialogClose()\n        toast.push(\n            <Notification type=\"success\">Credit card added!</Notification>,\n            { placement: 'top-center' },\n        )\n    }\n\n    const handleChangePlan = () => {\n        navigate('/concepts/account/pricing?subcription=basic&cycle=monthly')\n    }\n\n    return (\n        <div>\n            <h4 className=\"mb-4\">Billing</h4>\n            <div className=\"bg-gray-100 dark:bg-gray-700 rounded-xl p-6\">\n                <div className=\"flex flex-col lg:flex-row lg:items-center justify-between gap-4\">\n                    <div className=\"flex items-center gap-3\">\n                        <div>\n                            <Avatar\n                                className=\"bg-emerald-500\"\n                                shape=\"circle\"\n                                icon={<PiLightningFill />}\n                            />\n                        </div>\n                        <div>\n                            <div className=\"flex items-center gap-2\">\n                                <h6 className=\"font-bold\">\n                                    {data.currentPlan.plan}\n                                </h6>\n                                <Tag className=\"bg-success-subtle text-success rounded-md border-0\">\n                                    <span className=\"capitalize\">\n                                        {data.currentPlan.status}\n                                    </span>\n                                </Tag>\n                            </div>\n                            <div className=\"font-semibold\">\n                                <span>\n                                    Billing {data.currentPlan.billingCycle}\n                                </span>\n                                <span> | </span>\n                                <span>\n                                    Next payment on{' '}\n                                    {dayjs\n                                        .unix(\n                                            (data.currentPlan\n                                                .nextPaymentDate as number) ||\n                                                0,\n                                        )\n                                        .format('MM/DD/YYYY')}\n                                </span>\n                                <span>\n                                    <span className=\"mx-1\">for</span>\n                                    <NumericFormat\n                                        className=\"font-bold heading-text\"\n                                        displayType=\"text\"\n                                        value={(\n                                            Math.round(\n                                                (data.currentPlan.amount || 0) *\n                                                    100,\n                                            ) / 100\n                                        ).toFixed(2)}\n                                        prefix={'$'}\n                                        thousandSeparator={true}\n                                    />\n                                </span>\n                            </div>\n                        </div>\n                    </div>\n                    <div className=\"flex\">\n                        <Button\n                            size=\"sm\"\n                            variant=\"solid\"\n                            onClick={handleChangePlan}\n                        >\n                            Change plan\n                        </Button>\n                    </div>\n                </div>\n            </div>\n            <div className=\"mt-8\">\n                <h5>Payment method</h5>\n                <div>\n                    {data.paymentMethods?.map((card, index) => (\n                        <div\n                            key={card.cardId}\n                            className={classNames(\n                                'flex items-center justify-between p-4',\n                                !isLastChild(data.paymentMethods, index) &&\n                                    'border-b border-gray-200 dark:border-gray-600',\n                            )}\n                        >\n                            <div className=\"flex items-center\">\n                                {card.cardType === 'VISA' && (\n                                    <img\n                                        src=\"/img/others/img-8.png\"\n                                        alt=\"visa\"\n                                    />\n                                )}\n                                {card.cardType === 'MASTER' && (\n                                    <img\n                                        src=\"/img/others/img-9.png\"\n                                        alt=\"master\"\n                                    />\n                                )}\n                                <div className=\"ml-3 rtl:mr-3\">\n                                    <div className=\"flex items-center\">\n                                        <div className=\"text-gray-900 dark:text-gray-100 font-semibold\">\n                                            {card.cardHolderName} ••••{' '}\n                                            {card.last4Number}\n                                        </div>\n                                        {card.primary && (\n                                            <Tag className=\"bg-primary-subtle text-primary rounded-md border-0 mx-2\">\n                                                <span className=\"capitalize\">\n                                                    {' '}\n                                                    Primary{' '}\n                                                </span>\n                                            </Tag>\n                                        )}\n                                    </div>\n                                    <span>\n                                        Expired{' '}\n                                        {months[parseInt(card.expMonth) - 1]} 20\n                                        {card.expYear}\n                                    </span>\n                                </div>\n                            </div>\n                            <div className=\"flex\">\n                                <Button\n                                    size=\"sm\"\n                                    type=\"button\"\n                                    onClick={() => handleEditCreditCard(card)}\n                                >\n                                    Edit\n                                </Button>\n                            </div>\n                        </div>\n                    ))}\n                    <Button\n                        variant=\"plain\"\n                        icon={<TbPlus />}\n                        onClick={() => {\n                            setSelectedCard({\n                                type: 'NEW',\n                                dialogOpen: true,\n                                cardInfo: {},\n                            })\n                        }}\n                    >\n                        Add payment method\n                    </Button>\n                </div>\n            </div>\n            <div className=\"mt-8\">\n                <h5>Transaction history</h5>\n                <BillingHistory\n                    className=\"mt-4\"\n                    data={data.transactionHistory}\n                />\n            </div>\n            <CreditCardDialog\n                title={\n                    selectedCard.type === 'NEW'\n                        ? 'Add credit card'\n                        : 'Edit credit card'\n                }\n                defaultValues={selectedCard.cardInfo as CreditCard}\n                dialogOpen={selectedCard.dialogOpen}\n                onDialogClose={handleCreditCardDialogClose}\n                onSubmit={\n                    selectedCard.type === 'NEW'\n                        ? (values) =>\n                              handleAddCreditCardSubmit(values as CreditCard)\n                        : handleEditCreditCardSubmit\n                }\n            />\n        </div>\n    )\n}\n\nexport default SettingsBilling\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAM,SAAS;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ;AAEA,MAAM,kBAAkB,MAAM;AAC1B,QAAM,WAAW,YAAA;AAEjB,QAAM,CAAC,cAAc,eAAe,IAAI,SAIrC;AAAA,IACC,MAAM;AAAA,IACN,YAAY;AAAA,IACZ,UAAU,CAAA;AAAA,EAAC,CACd;AAED,QAAM;AAAA,IACF,OAAO;AAAA,MACH,aAAa;AAAA,QACT,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,iBAAiB;AAAA,QACjB,QAAQ;AAAA,MAAA;AAAA,MAEZ,gBAAgB,CAAA;AAAA,MAChB,oBAAoB,CAAA;AAAA,IAAC;AAAA,EACzB,IACA;AAAA,IACA;AAAA,IACA,MAAM,sBAAA;AAAA,IACN;AAAA,MACI,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB,uBAAuB;AAAA,IAAA;AAAA,EAC3B;AAGJ,QAAM,uBAAuB,CAAC,SAA8B;AACxD,oBAAgB;AAAA,MACZ,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,UAAU;AAAA,IAAA,CACb;AAAA,EACL;AAEA,QAAM,8BAA8B,MAAM;AACtC,oBAAgB;AAAA,MACZ,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,UAAU,CAAA;AAAA,IAAC,CACd;AAAA,EACL;AAEA,QAAM,6BAA6B,YAAY;AAC3C,UAAM,MAAM,GAAG;AACf,gCAAA;AACA,UAAM;AAAA,MACF,oBAAC,cAAA,EAAa,MAAK,WAAU,UAAA,wBAAoB;AAAA,MACjD,EAAE,WAAW,aAAA;AAAA,IAAa;AAAA,EAElC;AAEA,QAAM,4BAA4B,OAAO,WAAuB;AAC5D,YAAQ,IAAI,oBAAoB,MAAM;AACtC,UAAM,MAAM,GAAG;AACf,gCAAA;AACA,UAAM;AAAA,MACF,oBAAC,cAAA,EAAa,MAAK,WAAU,UAAA,sBAAkB;AAAA,MAC/C,EAAE,WAAW,aAAA;AAAA,IAAa;AAAA,EAElC;AAEA,QAAM,mBAAmB,MAAM;AAC3B,aAAS,2DAA2D;AAAA,EACxE;AAEA,8BACK,OAAA,EACG,UAAA;AAAA,IAAA,oBAAC,MAAA,EAAG,WAAU,QAAO,UAAA,WAAO;AAAA,wBAC3B,OAAA,EAAI,WAAU,+CACX,UAAA,qBAAC,OAAA,EAAI,WAAU,mEACX,UAAA;AAAA,MAAA,qBAAC,OAAA,EAAI,WAAU,2BACX,UAAA;AAAA,QAAA,oBAAC,OAAA,EACG,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAU;AAAA,YACV,OAAM;AAAA,YACN,0BAAO,iBAAA,CAAA,CAAgB;AAAA,UAAA;AAAA,QAAA,GAE/B;AAAA,6BACC,OAAA,EACG,UAAA;AAAA,UAAA,qBAAC,OAAA,EAAI,WAAU,2BACX,UAAA;AAAA,YAAA,oBAAC,MAAA,EAAG,WAAU,aACT,UAAA,KAAK,YAAY,MACtB;AAAA,YACA,oBAAC,KAAA,EAAI,WAAU,sDACX,UAAA,oBAAC,QAAA,EAAK,WAAU,cACX,UAAA,KAAK,YAAY,OAAA,CACtB,EAAA,CACJ;AAAA,UAAA,GACJ;AAAA,UACA,qBAAC,OAAA,EAAI,WAAU,iBACX,UAAA;AAAA,YAAA,qBAAC,QAAA,EAAK,UAAA;AAAA,cAAA;AAAA,cACO,KAAK,YAAY;AAAA,YAAA,GAC9B;AAAA,YACA,oBAAC,UAAK,UAAA,MAAA,CAAG;AAAA,iCACR,QAAA,EAAK,UAAA;AAAA,cAAA;AAAA,cACc;AAAA,cACf,MACI;AAAA,gBACI,KAAK,YACD,mBACD;AAAA,cAAA,EAEP,OAAO,YAAY;AAAA,YAAA,GAC5B;AAAA,iCACC,QAAA,EACG,UAAA;AAAA,cAAA,oBAAC,QAAA,EAAK,WAAU,QAAO,UAAA,OAAG;AAAA,cAC1B;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,WAAU;AAAA,kBACV,aAAY;AAAA,kBACZ,QACI,KAAK;AAAA,qBACA,KAAK,YAAY,UAAU,KACxB;AAAA,kBAAA,IACJ,KACN,QAAQ,CAAC;AAAA,kBACX,QAAQ;AAAA,kBACR,mBAAmB;AAAA,gBAAA;AAAA,cAAA;AAAA,YACvB,EAAA,CACJ;AAAA,UAAA,EAAA,CACJ;AAAA,QAAA,EAAA,CACJ;AAAA,MAAA,GACJ;AAAA,MACA,oBAAC,OAAA,EAAI,WAAU,QACX,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,MAAK;AAAA,UACL,SAAQ;AAAA,UACR,SAAS;AAAA,UACZ,UAAA;AAAA,QAAA;AAAA,MAAA,EAED,CACJ;AAAA,IAAA,EAAA,CACJ,EAAA,CACJ;AAAA,IACA,qBAAC,OAAA,EAAI,WAAU,QACX,UAAA;AAAA,MAAA,oBAAC,QAAG,UAAA,iBAAA,CAAc;AAAA,2BACjB,OAAA,EACI,UAAA;AAAA,QAAA,KAAK,gBAAgB,IAAI,CAAC,MAAM,UAC7B;AAAA,UAAC;AAAA,UAAA;AAAA,YAEG,WAAW;AAAA,cACP;AAAA,cACA,CAAC,YAAY,KAAK,gBAAgB,KAAK,KACnC;AAAA,YAAA;AAAA,YAGR,UAAA;AAAA,cAAA,qBAAC,OAAA,EAAI,WAAU,qBACV,UAAA;AAAA,gBAAA,KAAK,aAAa,UACf;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACG,KAAI;AAAA,oBACJ,KAAI;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGX,KAAK,aAAa,YACf;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACG,KAAI;AAAA,oBACJ,KAAI;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGZ,qBAAC,OAAA,EAAI,WAAU,iBACX,UAAA;AAAA,kBAAA,qBAAC,OAAA,EAAI,WAAU,qBACX,UAAA;AAAA,oBAAA,qBAAC,OAAA,EAAI,WAAU,kDACV,UAAA;AAAA,sBAAA,KAAK;AAAA,sBAAe;AAAA,sBAAM;AAAA,sBAC1B,KAAK;AAAA,oBAAA,GACV;AAAA,oBACC,KAAK,WACF,oBAAC,KAAA,EAAI,WAAU,2DACX,UAAA,qBAAC,QAAA,EAAK,WAAU,cACX,UAAA;AAAA,sBAAA;AAAA,sBAAI;AAAA,sBACG;AAAA,oBAAA,EAAA,CACZ,EAAA,CACJ;AAAA,kBAAA,GAER;AAAA,uCACC,QAAA,EAAK,UAAA;AAAA,oBAAA;AAAA,oBACM;AAAA,oBACP,OAAO,SAAS,KAAK,QAAQ,IAAI,CAAC;AAAA,oBAAE;AAAA,oBACpC,KAAK;AAAA,kBAAA,EAAA,CACV;AAAA,gBAAA,EAAA,CACJ;AAAA,cAAA,GACJ;AAAA,cACA,oBAAC,OAAA,EAAI,WAAU,QACX,UAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACG,MAAK;AAAA,kBACL,MAAK;AAAA,kBACL,SAAS,MAAM,qBAAqB,IAAI;AAAA,kBAC3C,UAAA;AAAA,gBAAA;AAAA,cAAA,EAED,CACJ;AAAA,YAAA;AAAA,UAAA;AAAA,UAlDK,KAAK;AAAA,QAAA,CAoDjB;AAAA,QACD;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,SAAQ;AAAA,YACR,0BAAO,QAAA,EAAO;AAAA,YACd,SAAS,MAAM;AACX,8BAAgB;AAAA,gBACZ,MAAM;AAAA,gBACN,YAAY;AAAA,gBACZ,UAAU,CAAA;AAAA,cAAC,CACd;AAAA,YACL;AAAA,YACH,UAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAED,EAAA,CACJ;AAAA,IAAA,GACJ;AAAA,IACA,qBAAC,OAAA,EAAI,WAAU,QACX,UAAA;AAAA,MAAA,oBAAC,QAAG,UAAA,sBAAA,CAAmB;AAAA,MACvB;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,WAAU;AAAA,UACV,MAAM,KAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IACf,GACJ;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,OACI,aAAa,SAAS,QAChB,oBACA;AAAA,QAEV,eAAe,aAAa;AAAA,QAC5B,YAAY,aAAa;AAAA,QACzB,eAAe;AAAA,QACf,UACI,aAAa,SAAS,QAChB,CAAC,WACG,0BAA0B,MAAoB,IAClD;AAAA,MAAA;AAAA,IAAA;AAAA,EAEd,GACJ;AAER;"}

package/dist/@ecme/views/concepts/accounts/Settings/components/SettingsMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsMenu.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsMenu.tsx"],"sourcesContent":["import Menu from '@/components/ui/Menu'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport { useSettingsStore } from '../store/settingsStore'\nimport useQuery from '@/utils/hooks/useQuery'\nimport {\n    TbUserSquare,\n    TbLock,\n    TbBell,\n    TbFileDollar,\n    TbRefreshDot,\n} from 'react-icons/tb'\nimport type { View } from '../types'\nimport type { ReactNode } from 'react'\n\nconst { MenuItem } = Menu\n\nconst menuList: { label: string; value: View; icon: ReactNode }[] = [\n    { label: 'Profile', value: 'profile', icon: <TbUserSquare /> },\n    { label: 'Security', value: 'security', icon: <TbLock /> },\n    { label: 'Notification', value: 'notification', icon: <TbBell /> },\n    { label: 'Billing', value: 'billing', icon: <TbFileDollar /> },\n    { label: 'Integration', value: 'integration', icon: <TbRefreshDot /> },\n]\n\nexport const SettingsMenu = ({ onChange }: { onChange?: () => void }) => {\n    const query = useQuery()\n\n    const { currentView, setCurrentView } = useSettingsStore()\n\n    const currentPath = query.get('category') || query.get('label') || 'inbox'\n\n    const handleSelect = (value: View) => {\n        setCurrentView(value)\n        onChange?.()\n    }\n\n    return (\n        <div className=\"flex h-full flex-col justify-between\">\n            <ScrollBar className=\"h-full overflow-y-auto\">\n                <Menu className=\"mx-2 mb-10\">\n                    {menuList.map((menu) => (\n                        <MenuItem\n                            key={menu.value}\n                            eventKey={menu.value}\n                            className={`mb-2 ${\n                                currentView === menu.value\n                                    ? 'bg-gray-100 dark:bg-gray-700'\n                                    : ''\n                            }`}\n                            isActive={currentPath === menu.value}\n                            onSelect={() => handleSelect(menu.value)}\n                        >\n                            <span className=\"text-2xl ltr:mr-2 rtl:ml-2\">\n                                {menu.icon}\n                            </span>\n                            <span>{menu.label}</span>\n                        </MenuItem>\n                    ))}\n                </Menu>\n            </ScrollBar>\n        </div>\n    )\n}\n\nexport default SettingsMenu\n"],"names":[],"mappings":";;;;;;;AAcA,MAAM,EAAE,SAAa,IAAA;AAErB,MAAM,WAA8D;AAAA,EAChE,EAAE,OAAO,WAAW,OAAO,WAAW,MAAM,oBAAC,gBAAa,EAAG;AAAA,EAC7D,EAAE,OAAO,YAAY,OAAO,YAAY,MAAM,oBAAC,UAAO,EAAG;AAAA,EACzD,EAAE,OAAO,gBAAgB,OAAO,gBAAgB,MAAM,oBAAC,UAAO,EAAG;AAAA,EACjE,EAAE,OAAO,WAAW,OAAO,WAAW,MAAM,oBAAC,gBAAa,EAAG;AAAA,EAC7D,EAAE,OAAO,eAAe,OAAO,eAAe,MAAM,oBAAC,gBAAa,EAAG;AACzE;AAEO,MAAM,eAAe,CAAC,EAAE,eAA0C;AACrE,QAAM,QAAQ,SAAS;AAEvB,QAAM,EAAE,aAAa,eAAe,IAAI,iBAAiB;AAEnD,QAAA,cAAc,MAAM,IAAI,UAAU,KAAK,MAAM,IAAI,OAAO,KAAK;AAE7D,QAAA,eAAe,CAAC,UAAgB;AAClC,mBAAe,KAAK;AACT,eAAA;AAAA,EACf;AAEA,SACK,oBAAA,OAAA,EAAI,WAAU,wCACX,8BAAC,WAAU,EAAA,WAAU,0BACjB,UAAA,oBAAC,QAAK,WAAU,cACX,UAAS,SAAA,IAAI,CAAC,SACX;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,UAAU,KAAK;AAAA,MACf,WAAW,QACP,gBAAgB,KAAK,QACf,iCACA,EACV;AAAA,MACA,UAAU,gBAAgB,KAAK;AAAA,MAC/B,UAAU,MAAM,aAAa,KAAK,KAAK;AAAA,MAEvC,UAAA;AAAA,QAAA,oBAAC,QAAK,EAAA,WAAU,8BACX,UAAA,KAAK,MACV;AAAA,QACA,oBAAC,QAAM,EAAA,UAAA,KAAK,MAAM,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAbb,KAAK;AAAA,EAAA,CAejB,EACL,CAAA,EACJ,CAAA,GACJ;AAER;"}
+{"version":3,"file":"SettingsMenu.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsMenu.tsx"],"sourcesContent":["import Menu from '@/components/ui/Menu'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport { useSettingsStore } from '../store/settingsStore'\nimport useQuery from '@/utils/hooks/useQuery'\nimport {\n    TbUserSquare,\n    TbLock,\n    TbBell,\n    TbFileDollar,\n    TbRefreshDot,\n} from 'react-icons/tb'\nimport type { View } from '../types'\nimport type { ReactNode } from 'react'\n\nconst { MenuItem } = Menu\n\nconst menuList: { label: string; value: View; icon: ReactNode }[] = [\n    { label: 'Profile', value: 'profile', icon: <TbUserSquare /> },\n    { label: 'Security', value: 'security', icon: <TbLock /> },\n    { label: 'Notification', value: 'notification', icon: <TbBell /> },\n    { label: 'Billing', value: 'billing', icon: <TbFileDollar /> },\n    { label: 'Integration', value: 'integration', icon: <TbRefreshDot /> },\n]\n\nexport const SettingsMenu = ({ onChange }: { onChange?: () => void }) => {\n    const query = useQuery()\n\n    const { currentView, setCurrentView } = useSettingsStore()\n\n    const currentPath = query.get('category') || query.get('label') || 'inbox'\n\n    const handleSelect = (value: View) => {\n        setCurrentView(value)\n        onChange?.()\n    }\n\n    return (\n        <div className=\"flex h-full flex-col justify-between\">\n            <ScrollBar className=\"h-full overflow-y-auto\">\n                <Menu className=\"mx-2 mb-10\">\n                    {menuList.map((menu) => (\n                        <MenuItem\n                            key={menu.value}\n                            eventKey={menu.value}\n                            className={`mb-2 ${\n                                currentView === menu.value\n                                    ? 'bg-gray-100 dark:bg-gray-700'\n                                    : ''\n                            }`}\n                            isActive={currentPath === menu.value}\n                            onSelect={() => handleSelect(menu.value)}\n                        >\n                            <span className=\"text-2xl ltr:mr-2 rtl:ml-2\">\n                                {menu.icon}\n                            </span>\n                            <span>{menu.label}</span>\n                        </MenuItem>\n                    ))}\n                </Menu>\n            </ScrollBar>\n        </div>\n    )\n}\n\nexport default SettingsMenu\n"],"names":[],"mappings":";;;;;;;AAcA,MAAM,EAAE,aAAa;AAErB,MAAM,WAA8D;AAAA,EAChE,EAAE,OAAO,WAAW,OAAO,WAAW,MAAM,oBAAC,gBAAa,EAAA;AAAA,EAC1D,EAAE,OAAO,YAAY,OAAO,YAAY,MAAM,oBAAC,UAAO,EAAA;AAAA,EACtD,EAAE,OAAO,gBAAgB,OAAO,gBAAgB,MAAM,oBAAC,UAAO,EAAA;AAAA,EAC9D,EAAE,OAAO,WAAW,OAAO,WAAW,MAAM,oBAAC,gBAAa,EAAA;AAAA,EAC1D,EAAE,OAAO,eAAe,OAAO,eAAe,MAAM,oBAAC,gBAAa,EAAA;AACtE;AAEO,MAAM,eAAe,CAAC,EAAE,eAA0C;AACrE,QAAM,QAAQ,SAAA;AAEd,QAAM,EAAE,aAAa,eAAA,IAAmB,iBAAA;AAExC,QAAM,cAAc,MAAM,IAAI,UAAU,KAAK,MAAM,IAAI,OAAO,KAAK;AAEnE,QAAM,eAAe,CAAC,UAAgB;AAClC,mBAAe,KAAK;AACpB,eAAA;AAAA,EACJ;AAEA,SACI,oBAAC,OAAA,EAAI,WAAU,wCACX,8BAAC,WAAA,EAAU,WAAU,0BACjB,UAAA,oBAAC,QAAK,WAAU,cACX,UAAA,SAAS,IAAI,CAAC,SACX;AAAA,IAAC;AAAA,IAAA;AAAA,MAEG,UAAU,KAAK;AAAA,MACf,WAAW,QACP,gBAAgB,KAAK,QACf,iCACA,EACV;AAAA,MACA,UAAU,gBAAgB,KAAK;AAAA,MAC/B,UAAU,MAAM,aAAa,KAAK,KAAK;AAAA,MAEvC,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,8BACX,UAAA,KAAK,MACV;AAAA,QACA,oBAAC,QAAA,EAAM,UAAA,KAAK,MAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,IAbb,KAAK;AAAA,EAAA,CAejB,EAAA,CACL,EAAA,CACJ,GACJ;AAER;"}

package/dist/@ecme/views/concepts/accounts/Settings/components/SettingsNotification.js.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsNotification.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsNotification.tsx"],"sourcesContent":["import Checkbox from '@/components/ui/Checkbox'\nimport Radio from '@/components/ui/Radio'\nimport Switcher from '@/components/ui/Switcher'\nimport { apiGetSettingsNotification } from '@/services/AccontsService'\nimport useSWR from 'swr'\nimport cloneDeep from 'lodash/cloneDeep'\nimport { TbMessageCircleCheck } from 'react-icons/tb'\nimport type { GetSettingsNotificationResponse } from '../types'\n\ntype EmailNotificationFields =\n    | 'newsAndUpdate'\n    | 'tipsAndTutorial'\n    | 'offerAndPromotion'\n    | 'followUpReminder'\n\nconst emailNotificationOption: {\n    label: string\n    value: EmailNotificationFields\n    desc: string\n}[] = [\n    {\n        label: 'News & updates',\n        value: 'newsAndUpdate',\n        desc: 'New about product and features update',\n    },\n    {\n        label: 'Tips & tutorials',\n        value: 'tipsAndTutorial',\n        desc: 'Tips & trick in order to increase your performance efficiency',\n    },\n    {\n        label: 'Offer & promotions',\n        value: 'offerAndPromotion',\n        desc: 'Promotion about product price & lastest discount',\n    },\n    {\n        label: 'Follow up remider',\n        value: 'followUpReminder',\n        desc: 'Receive notification all the reminder that have been made',\n    },\n]\n\nconst notifyMeOption: {\n    label: string\n    value: string\n    desc: string\n}[] = [\n    {\n        label: 'All new messages',\n        value: 'allNewMessage',\n        desc: 'Broadcast notifications to the channel for each new message',\n    },\n    {\n        label: 'Mentions only',\n        value: 'mentionsOnly',\n        desc: 'Only alert me in the channel if someone mentions me in a message',\n    },\n    {\n        label: 'Nothing',\n        value: 'nothing',\n        desc: `Don't notify me anything`,\n    },\n]\n\nconst SettingsNotification = () => {\n    const {\n        data = {\n            email: [],\n            desktop: false,\n            unreadMessageBadge: false,\n            notifymeAbout: '',\n        },\n        mutate,\n    } = useSWR(\n        '/api/settings/notification/',\n        () => apiGetSettingsNotification<GetSettingsNotificationResponse>(),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            revalidateOnReconnect: false,\n        },\n    )\n\n    const handleEmailNotificationOptionChange = (values: string[]) => {\n        const newData = cloneDeep(data)\n        newData.email = values\n        mutate(newData, false)\n    }\n\n    const handleEmailNotificationOptionCheckAll = (value: boolean) => {\n        const newData = cloneDeep(data)\n        if (value) {\n            newData.email = [\n                'newsAndUpdate',\n                'tipsAndTutorial',\n                'offerAndPromotion',\n                'followUpReminder',\n            ]\n        } else {\n            newData.email = []\n        }\n\n        mutate(newData, false)\n    }\n\n    const handleDesktopNotificationCheck = (value: boolean) => {\n        const newData = cloneDeep(data)\n        newData.desktop = value\n        mutate(newData, false)\n    }\n\n    const handleUnreadMessagebadgeCheck = (value: boolean) => {\n        const newData = cloneDeep(data)\n        newData.unreadMessageBadge = value\n        mutate(newData, false)\n    }\n\n    const handleNotifyMeChange = (value: string) => {\n        const newData = cloneDeep(data)\n        newData.notifymeAbout = value\n        mutate(newData, false)\n    }\n\n    return (\n        <div>\n            <h4>Notification</h4>\n            <div className=\"mt-2\">\n                <div className=\"flex items-center justify-between py-6 border-b border-gray-200 dark:border-gray-600\">\n                    <div>\n                        <h5>Enable desktop notification</h5>\n                        <p>\n                            Decide whether you want to be notified of new\n                            message & updates\n                        </p>\n                    </div>\n                    <div>\n                        <Switcher\n                            checked={data.desktop}\n                            onChange={handleDesktopNotificationCheck}\n                        />\n                    </div>\n                </div>\n                <div className=\"flex items-center justify-between py-6 border-b border-gray-200 dark:border-gray-600\">\n                    <div>\n                        <h5>Enable unread notification badge</h5>\n                        <p>\n                            Display a red indicator on of the notification icon\n                            when you have unread message\n                        </p>\n                    </div>\n                    <div>\n                        <Switcher\n                            checked={data.unreadMessageBadge}\n                            onChange={handleUnreadMessagebadgeCheck}\n                        />\n                    </div>\n                </div>\n                <div className=\"py-6 border-b border-gray-200 dark:border-gray-600\">\n                    <h5>Enable unread notification badge</h5>\n                    <div className=\"mt-4\">\n                        <Radio.Group\n                            vertical\n                            className=\"flex flex-col gap-6\"\n                            value={data.notifymeAbout}\n                            onChange={handleNotifyMeChange}\n                        >\n                            {notifyMeOption.map((option) => (\n                                <div key={option.value} className=\"flex gap-4\">\n                                    <div className=\"mt-1.5\">\n                                        <Radio value={option.value} />\n                                    </div>\n                                    <div className=\"flex gap-2\">\n                                        <div className=\"mt-1\">\n                                            <TbMessageCircleCheck className=\"text-lg\" />\n                                        </div>\n                                        <div>\n                                            <h6>{option.label}</h6>\n                                            <p>{option.desc}</p>\n                                        </div>\n                                    </div>\n                                </div>\n                            ))}\n                        </Radio.Group>\n                    </div>\n                </div>\n                <div className=\"flex items-center justify-between py-6\">\n                    <div>\n                        <h5>Email notification</h5>\n                        <p>\n                            Substance can send you email notification for any\n                            new direct message\n                        </p>\n                    </div>\n                    <div>\n                        <Switcher\n                            checked={data.email.length > 0}\n                            onChange={handleEmailNotificationOptionCheckAll}\n                        />\n                    </div>\n                </div>\n                <Checkbox.Group\n                    vertical\n                    className=\"flex flex-col gap-6\"\n                    value={data.email}\n                    onChange={handleEmailNotificationOptionChange}\n                >\n                    {emailNotificationOption.map((option) => (\n                        <div key={option.value} className=\"flex gap-4\">\n                            <div className=\"mt-1.5\">\n                                <Checkbox value={option.value} />\n                            </div>\n                            <div>\n                                <h6>{option.label}</h6>\n                                <p>{option.desc}</p>\n                            </div>\n                        </div>\n                    ))}\n                </Checkbox.Group>\n            </div>\n        </div>\n    )\n}\n\nexport default SettingsNotification\n"],"names":[],"mappings":";;;;;;;;;AAeA,MAAM,0BAIA;AAAA,EACF;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAEd;AAEA,MAAM,iBAIA;AAAA,EACF;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACV;AAAA,EACA;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAEd;AAEA,MAAM,uBAAuB,MAAM;AACzB,QAAA;AAAA,IACF,OAAO;AAAA,MACH,OAAO,CAAC;AAAA,MACR,SAAS;AAAA,MACT,oBAAoB;AAAA,MACpB,eAAe;AAAA,IACnB;AAAA,IACA;AAAA,EAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM,2BAA4D;AAAA,IAClE;AAAA,MACI,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB,uBAAuB;AAAA,IAAA;AAAA,EAE/B;AAEM,QAAA,sCAAsC,CAAC,WAAqB;AACxD,UAAA,UAAU,UAAU,IAAI;AAC9B,YAAQ,QAAQ;AAChB,WAAO,SAAS,KAAK;AAAA,EACzB;AAEM,QAAA,wCAAwC,CAAC,UAAmB;AACxD,UAAA,UAAU,UAAU,IAAI;AAC9B,QAAI,OAAO;AACP,cAAQ,QAAQ;AAAA,QACZ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACJ;AAAA,IAAA,OACG;AACH,cAAQ,QAAQ,CAAC;AAAA,IAAA;AAGrB,WAAO,SAAS,KAAK;AAAA,EACzB;AAEM,QAAA,iCAAiC,CAAC,UAAmB;AACjD,UAAA,UAAU,UAAU,IAAI;AAC9B,YAAQ,UAAU;AAClB,WAAO,SAAS,KAAK;AAAA,EACzB;AAEM,QAAA,gCAAgC,CAAC,UAAmB;AAChD,UAAA,UAAU,UAAU,IAAI;AAC9B,YAAQ,qBAAqB;AAC7B,WAAO,SAAS,KAAK;AAAA,EACzB;AAEM,QAAA,uBAAuB,CAAC,UAAkB;AACtC,UAAA,UAAU,UAAU,IAAI;AAC9B,YAAQ,gBAAgB;AACxB,WAAO,SAAS,KAAK;AAAA,EACzB;AAEA,8BACK,OACG,EAAA,UAAA;AAAA,IAAA,oBAAC,QAAG,UAAY,eAAA,CAAA;AAAA,IAChB,qBAAC,OAAI,EAAA,WAAU,QACX,UAAA;AAAA,MAAC,qBAAA,OAAA,EAAI,WAAU,wFACX,UAAA;AAAA,QAAA,qBAAC,OACG,EAAA,UAAA;AAAA,UAAA,oBAAC,QAAG,UAA2B,8BAAA,CAAA;AAAA,UAC/B,oBAAC,OAAE,UAGH,kEAAA,CAAA;AAAA,QAAA,GACJ;AAAA,4BACC,OACG,EAAA,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,SAAS,KAAK;AAAA,YACd,UAAU;AAAA,UAAA;AAAA,QAAA,EAElB,CAAA;AAAA,MAAA,GACJ;AAAA,MACA,qBAAC,OAAI,EAAA,WAAU,wFACX,UAAA;AAAA,QAAA,qBAAC,OACG,EAAA,UAAA;AAAA,UAAA,oBAAC,QAAG,UAAgC,mCAAA,CAAA;AAAA,UACpC,oBAAC,OAAE,UAGH,mFAAA,CAAA;AAAA,QAAA,GACJ;AAAA,4BACC,OACG,EAAA,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,SAAS,KAAK;AAAA,YACd,UAAU;AAAA,UAAA;AAAA,QAAA,EAElB,CAAA;AAAA,MAAA,GACJ;AAAA,MACA,qBAAC,OAAI,EAAA,WAAU,sDACX,UAAA;AAAA,QAAA,oBAAC,QAAG,UAAgC,mCAAA,CAAA;AAAA,QACpC,oBAAC,OAAI,EAAA,WAAU,QACX,UAAA;AAAA,UAAC,MAAM;AAAA,UAAN;AAAA,YACG,UAAQ;AAAA,YACR,WAAU;AAAA,YACV,OAAO,KAAK;AAAA,YACZ,UAAU;AAAA,YAET,yBAAe,IAAI,CAAC,WAChB,qBAAA,OAAA,EAAuB,WAAU,cAC9B,UAAA;AAAA,cAAC,oBAAA,OAAA,EAAI,WAAU,UACX,UAAA,oBAAC,SAAM,OAAO,OAAO,OAAO,EAChC,CAAA;AAAA,cACA,qBAAC,OAAI,EAAA,WAAU,cACX,UAAA;AAAA,gBAAA,oBAAC,SAAI,WAAU,QACX,8BAAC,sBAAqB,EAAA,WAAU,WAAU,EAC9C,CAAA;AAAA,qCACC,OACG,EAAA,UAAA;AAAA,kBAAC,oBAAA,MAAA,EAAI,iBAAO,MAAM,CAAA;AAAA,kBAClB,oBAAC,KAAG,EAAA,UAAA,OAAO,KAAK,CAAA;AAAA,gBAAA,EACpB,CAAA;AAAA,cAAA,EACJ,CAAA;AAAA,YAAA,EAZM,GAAA,OAAO,KAajB,CACH;AAAA,UAAA;AAAA,QAAA,EAET,CAAA;AAAA,MAAA,GACJ;AAAA,MACA,qBAAC,OAAI,EAAA,WAAU,0CACX,UAAA;AAAA,QAAA,qBAAC,OACG,EAAA,UAAA;AAAA,UAAA,oBAAC,QAAG,UAAkB,qBAAA,CAAA;AAAA,UACtB,oBAAC,OAAE,UAGH,uEAAA,CAAA;AAAA,QAAA,GACJ;AAAA,4BACC,OACG,EAAA,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,SAAS,KAAK,MAAM,SAAS;AAAA,YAC7B,UAAU;AAAA,UAAA;AAAA,QAAA,EAElB,CAAA;AAAA,MAAA,GACJ;AAAA,MACA;AAAA,QAAC,SAAS;AAAA,QAAT;AAAA,UACG,UAAQ;AAAA,UACR,WAAU;AAAA,UACV,OAAO,KAAK;AAAA,UACZ,UAAU;AAAA,UAET,kCAAwB,IAAI,CAAC,WACzB,qBAAA,OAAA,EAAuB,WAAU,cAC9B,UAAA;AAAA,YAAC,oBAAA,OAAA,EAAI,WAAU,UACX,UAAA,oBAAC,YAAS,OAAO,OAAO,OAAO,EACnC,CAAA;AAAA,iCACC,OACG,EAAA,UAAA;AAAA,cAAC,oBAAA,MAAA,EAAI,iBAAO,MAAM,CAAA;AAAA,cAClB,oBAAC,KAAG,EAAA,UAAA,OAAO,KAAK,CAAA;AAAA,YAAA,EACpB,CAAA;AAAA,UAAA,EAPM,GAAA,OAAO,KAQjB,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACL,EACJ,CAAA;AAAA,EAAA,GACJ;AAER;"}
+{"version":3,"file":"SettingsNotification.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsNotification.tsx"],"sourcesContent":["import Checkbox from '@/components/ui/Checkbox'\nimport Radio from '@/components/ui/Radio'\nimport Switcher from '@/components/ui/Switcher'\nimport { apiGetSettingsNotification } from '@/services/AccontsService'\nimport useSWR from 'swr'\nimport cloneDeep from 'lodash/cloneDeep'\nimport { TbMessageCircleCheck } from 'react-icons/tb'\nimport type { GetSettingsNotificationResponse } from '../types'\n\ntype EmailNotificationFields =\n    | 'newsAndUpdate'\n    | 'tipsAndTutorial'\n    | 'offerAndPromotion'\n    | 'followUpReminder'\n\nconst emailNotificationOption: {\n    label: string\n    value: EmailNotificationFields\n    desc: string\n}[] = [\n    {\n        label: 'News & updates',\n        value: 'newsAndUpdate',\n        desc: 'New about product and features update',\n    },\n    {\n        label: 'Tips & tutorials',\n        value: 'tipsAndTutorial',\n        desc: 'Tips & trick in order to increase your performance efficiency',\n    },\n    {\n        label: 'Offer & promotions',\n        value: 'offerAndPromotion',\n        desc: 'Promotion about product price & lastest discount',\n    },\n    {\n        label: 'Follow up remider',\n        value: 'followUpReminder',\n        desc: 'Receive notification all the reminder that have been made',\n    },\n]\n\nconst notifyMeOption: {\n    label: string\n    value: string\n    desc: string\n}[] = [\n    {\n        label: 'All new messages',\n        value: 'allNewMessage',\n        desc: 'Broadcast notifications to the channel for each new message',\n    },\n    {\n        label: 'Mentions only',\n        value: 'mentionsOnly',\n        desc: 'Only alert me in the channel if someone mentions me in a message',\n    },\n    {\n        label: 'Nothing',\n        value: 'nothing',\n        desc: `Don't notify me anything`,\n    },\n]\n\nconst SettingsNotification = () => {\n    const {\n        data = {\n            email: [],\n            desktop: false,\n            unreadMessageBadge: false,\n            notifymeAbout: '',\n        },\n        mutate,\n    } = useSWR(\n        '/api/settings/notification/',\n        () => apiGetSettingsNotification<GetSettingsNotificationResponse>(),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            revalidateOnReconnect: false,\n        },\n    )\n\n    const handleEmailNotificationOptionChange = (values: string[]) => {\n        const newData = cloneDeep(data)\n        newData.email = values\n        mutate(newData, false)\n    }\n\n    const handleEmailNotificationOptionCheckAll = (value: boolean) => {\n        const newData = cloneDeep(data)\n        if (value) {\n            newData.email = [\n                'newsAndUpdate',\n                'tipsAndTutorial',\n                'offerAndPromotion',\n                'followUpReminder',\n            ]\n        } else {\n            newData.email = []\n        }\n\n        mutate(newData, false)\n    }\n\n    const handleDesktopNotificationCheck = (value: boolean) => {\n        const newData = cloneDeep(data)\n        newData.desktop = value\n        mutate(newData, false)\n    }\n\n    const handleUnreadMessagebadgeCheck = (value: boolean) => {\n        const newData = cloneDeep(data)\n        newData.unreadMessageBadge = value\n        mutate(newData, false)\n    }\n\n    const handleNotifyMeChange = (value: string) => {\n        const newData = cloneDeep(data)\n        newData.notifymeAbout = value\n        mutate(newData, false)\n    }\n\n    return (\n        <div>\n            <h4>Notification</h4>\n            <div className=\"mt-2\">\n                <div className=\"flex items-center justify-between py-6 border-b border-gray-200 dark:border-gray-600\">\n                    <div>\n                        <h5>Enable desktop notification</h5>\n                        <p>\n                            Decide whether you want to be notified of new\n                            message & updates\n                        </p>\n                    </div>\n                    <div>\n                        <Switcher\n                            checked={data.desktop}\n                            onChange={handleDesktopNotificationCheck}\n                        />\n                    </div>\n                </div>\n                <div className=\"flex items-center justify-between py-6 border-b border-gray-200 dark:border-gray-600\">\n                    <div>\n                        <h5>Enable unread notification badge</h5>\n                        <p>\n                            Display a red indicator on of the notification icon\n                            when you have unread message\n                        </p>\n                    </div>\n                    <div>\n                        <Switcher\n                            checked={data.unreadMessageBadge}\n                            onChange={handleUnreadMessagebadgeCheck}\n                        />\n                    </div>\n                </div>\n                <div className=\"py-6 border-b border-gray-200 dark:border-gray-600\">\n                    <h5>Enable unread notification badge</h5>\n                    <div className=\"mt-4\">\n                        <Radio.Group\n                            vertical\n                            className=\"flex flex-col gap-6\"\n                            value={data.notifymeAbout}\n                            onChange={handleNotifyMeChange}\n                        >\n                            {notifyMeOption.map((option) => (\n                                <div key={option.value} className=\"flex gap-4\">\n                                    <div className=\"mt-1.5\">\n                                        <Radio value={option.value} />\n                                    </div>\n                                    <div className=\"flex gap-2\">\n                                        <div className=\"mt-1\">\n                                            <TbMessageCircleCheck className=\"text-lg\" />\n                                        </div>\n                                        <div>\n                                            <h6>{option.label}</h6>\n                                            <p>{option.desc}</p>\n                                        </div>\n                                    </div>\n                                </div>\n                            ))}\n                        </Radio.Group>\n                    </div>\n                </div>\n                <div className=\"flex items-center justify-between py-6\">\n                    <div>\n                        <h5>Email notification</h5>\n                        <p>\n                            Substance can send you email notification for any\n                            new direct message\n                        </p>\n                    </div>\n                    <div>\n                        <Switcher\n                            checked={data.email.length > 0}\n                            onChange={handleEmailNotificationOptionCheckAll}\n                        />\n                    </div>\n                </div>\n                <Checkbox.Group\n                    vertical\n                    className=\"flex flex-col gap-6\"\n                    value={data.email}\n                    onChange={handleEmailNotificationOptionChange}\n                >\n                    {emailNotificationOption.map((option) => (\n                        <div key={option.value} className=\"flex gap-4\">\n                            <div className=\"mt-1.5\">\n                                <Checkbox value={option.value} />\n                            </div>\n                            <div>\n                                <h6>{option.label}</h6>\n                                <p>{option.desc}</p>\n                            </div>\n                        </div>\n                    ))}\n                </Checkbox.Group>\n            </div>\n        </div>\n    )\n}\n\nexport default SettingsNotification\n"],"names":[],"mappings":";;;;;;;;;AAeA,MAAM,0BAIA;AAAA,EACF;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAAA,EAEV;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAAA,EAEV;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAAA,EAEV;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAEd;AAEA,MAAM,iBAIA;AAAA,EACF;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAAA,EAEV;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAAA,EAEV;AAAA,IACI,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EAAA;AAEd;AAEA,MAAM,uBAAuB,MAAM;AAC/B,QAAM;AAAA,IACF,OAAO;AAAA,MACH,OAAO,CAAA;AAAA,MACP,SAAS;AAAA,MACT,oBAAoB;AAAA,MACpB,eAAe;AAAA,IAAA;AAAA,IAEnB;AAAA,EAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM,2BAAA;AAAA,IACN;AAAA,MACI,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB,uBAAuB;AAAA,IAAA;AAAA,EAC3B;AAGJ,QAAM,sCAAsC,CAAC,WAAqB;AAC9D,UAAM,UAAU,UAAU,IAAI;AAC9B,YAAQ,QAAQ;AAChB,WAAO,SAAS,KAAK;AAAA,EACzB;AAEA,QAAM,wCAAwC,CAAC,UAAmB;AAC9D,UAAM,UAAU,UAAU,IAAI;AAC9B,QAAI,OAAO;AACP,cAAQ,QAAQ;AAAA,QACZ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAER,OAAO;AACH,cAAQ,QAAQ,CAAA;AAAA,IACpB;AAEA,WAAO,SAAS,KAAK;AAAA,EACzB;AAEA,QAAM,iCAAiC,CAAC,UAAmB;AACvD,UAAM,UAAU,UAAU,IAAI;AAC9B,YAAQ,UAAU;AAClB,WAAO,SAAS,KAAK;AAAA,EACzB;AAEA,QAAM,gCAAgC,CAAC,UAAmB;AACtD,UAAM,UAAU,UAAU,IAAI;AAC9B,YAAQ,qBAAqB;AAC7B,WAAO,SAAS,KAAK;AAAA,EACzB;AAEA,QAAM,uBAAuB,CAAC,UAAkB;AAC5C,UAAM,UAAU,UAAU,IAAI;AAC9B,YAAQ,gBAAgB;AACxB,WAAO,SAAS,KAAK;AAAA,EACzB;AAEA,8BACK,OAAA,EACG,UAAA;AAAA,IAAA,oBAAC,QAAG,UAAA,eAAA,CAAY;AAAA,IAChB,qBAAC,OAAA,EAAI,WAAU,QACX,UAAA;AAAA,MAAA,qBAAC,OAAA,EAAI,WAAU,wFACX,UAAA;AAAA,QAAA,qBAAC,OAAA,EACG,UAAA;AAAA,UAAA,oBAAC,QAAG,UAAA,8BAAA,CAA2B;AAAA,UAC/B,oBAAC,OAAE,UAAA,kEAAA,CAGH;AAAA,QAAA,GACJ;AAAA,4BACC,OAAA,EACG,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,SAAS,KAAK;AAAA,YACd,UAAU;AAAA,UAAA;AAAA,QAAA,EACd,CACJ;AAAA,MAAA,GACJ;AAAA,MACA,qBAAC,OAAA,EAAI,WAAU,wFACX,UAAA;AAAA,QAAA,qBAAC,OAAA,EACG,UAAA;AAAA,UAAA,oBAAC,QAAG,UAAA,mCAAA,CAAgC;AAAA,UACpC,oBAAC,OAAE,UAAA,mFAAA,CAGH;AAAA,QAAA,GACJ;AAAA,4BACC,OAAA,EACG,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,SAAS,KAAK;AAAA,YACd,UAAU;AAAA,UAAA;AAAA,QAAA,EACd,CACJ;AAAA,MAAA,GACJ;AAAA,MACA,qBAAC,OAAA,EAAI,WAAU,sDACX,UAAA;AAAA,QAAA,oBAAC,QAAG,UAAA,mCAAA,CAAgC;AAAA,QACpC,oBAAC,OAAA,EAAI,WAAU,QACX,UAAA;AAAA,UAAC,MAAM;AAAA,UAAN;AAAA,YACG,UAAQ;AAAA,YACR,WAAU;AAAA,YACV,OAAO,KAAK;AAAA,YACZ,UAAU;AAAA,YAET,yBAAe,IAAI,CAAC,WACjB,qBAAC,OAAA,EAAuB,WAAU,cAC9B,UAAA;AAAA,cAAA,oBAAC,OAAA,EAAI,WAAU,UACX,UAAA,oBAAC,SAAM,OAAO,OAAO,OAAO,EAAA,CAChC;AAAA,cACA,qBAAC,OAAA,EAAI,WAAU,cACX,UAAA;AAAA,gBAAA,oBAAC,SAAI,WAAU,QACX,8BAAC,sBAAA,EAAqB,WAAU,WAAU,EAAA,CAC9C;AAAA,qCACC,OAAA,EACG,UAAA;AAAA,kBAAA,oBAAC,MAAA,EAAI,iBAAO,MAAA,CAAM;AAAA,kBAClB,oBAAC,KAAA,EAAG,UAAA,OAAO,KAAA,CAAK;AAAA,gBAAA,EAAA,CACpB;AAAA,cAAA,EAAA,CACJ;AAAA,YAAA,EAAA,GAZM,OAAO,KAajB,CACH;AAAA,UAAA;AAAA,QAAA,EACL,CACJ;AAAA,MAAA,GACJ;AAAA,MACA,qBAAC,OAAA,EAAI,WAAU,0CACX,UAAA;AAAA,QAAA,qBAAC,OAAA,EACG,UAAA;AAAA,UAAA,oBAAC,QAAG,UAAA,qBAAA,CAAkB;AAAA,UACtB,oBAAC,OAAE,UAAA,uEAAA,CAGH;AAAA,QAAA,GACJ;AAAA,4BACC,OAAA,EACG,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,SAAS,KAAK,MAAM,SAAS;AAAA,YAC7B,UAAU;AAAA,UAAA;AAAA,QAAA,EACd,CACJ;AAAA,MAAA,GACJ;AAAA,MACA;AAAA,QAAC,SAAS;AAAA,QAAT;AAAA,UACG,UAAQ;AAAA,UACR,WAAU;AAAA,UACV,OAAO,KAAK;AAAA,UACZ,UAAU;AAAA,UAET,kCAAwB,IAAI,CAAC,WAC1B,qBAAC,OAAA,EAAuB,WAAU,cAC9B,UAAA;AAAA,YAAA,oBAAC,OAAA,EAAI,WAAU,UACX,UAAA,oBAAC,YAAS,OAAO,OAAO,OAAO,EAAA,CACnC;AAAA,iCACC,OAAA,EACG,UAAA;AAAA,cAAA,oBAAC,MAAA,EAAI,iBAAO,MAAA,CAAM;AAAA,cAClB,oBAAC,KAAA,EAAG,UAAA,OAAO,KAAA,CAAK;AAAA,YAAA,EAAA,CACpB;AAAA,UAAA,EAAA,GAPM,OAAO,KAQjB,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACL,EAAA,CACJ;AAAA,EAAA,GACJ;AAER;"}

package/dist/@ecme/views/concepts/accounts/Settings/components/SettingsProfile.js.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsProfile.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsProfile.tsx"],"sourcesContent":["import { useMemo, useEffect } from 'react'\nimport Button from '@/components/ui/Button'\nimport Upload from '@/components/ui/Upload'\nimport Input from '@/components/ui/Input'\nimport Select, { Option as DefaultOption } from '@/components/ui/Select'\nimport Avatar from '@/components/ui/Avatar'\nimport { Form, FormItem } from '@/components/ui/Form'\nimport NumericInput from '@/components/shared/NumericInput'\nimport { countryList } from '@/constants/countries.constant'\nimport { components } from 'react-select'\nimport type { ControlProps, OptionProps } from 'react-select'\nimport { apiGetSettingsProfile } from '@/services/AccontsService'\nimport sleep from '@/utils/sleep'\nimport useSWR from 'swr'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useForm, Controller } from 'react-hook-form'\nimport { z } from 'zod'\nimport { HiOutlineUser } from 'react-icons/hi'\nimport { TbPlus } from 'react-icons/tb'\nimport type { ZodType } from 'zod'\nimport type { GetSettingsProfileResponse } from '../types'\n\ntype ProfileSchema = {\n    firstName: string\n    lastName: string\n    email: string\n    dialCode: string\n    phoneNumber: string\n    img: string\n    country: string\n    address: string\n    postcode: string\n    city: string\n}\n\ntype CountryOption = {\n    label: string\n    dialCode: string\n    value: string\n}\n\nconst { Control } = components\n\nconst validationSchema: ZodType<ProfileSchema> = z.object({\n    firstName: z.string().min(1, { message: 'First name required' }),\n    lastName: z.string().min(1, { message: 'Last name required' }),\n    email: z\n        .string()\n        .min(1, { message: 'Email required' })\n        .email({ message: 'Invalid email' }),\n    dialCode: z.string().min(1, { message: 'Please select your country code' }),\n    phoneNumber: z\n        .string()\n        .min(1, { message: 'Please input your mobile number' }),\n    country: z.string().min(1, { message: 'Please select a country' }),\n    address: z.string().min(1, { message: 'Addrress required' }),\n    postcode: z.string().min(1, { message: 'Postcode required' }),\n    city: z.string().min(1, { message: 'City required' }),\n    img: z.string(),\n})\n\nconst CustomSelectOption = (\n    props: OptionProps<CountryOption> & { variant: 'country' | 'phone' },\n) => {\n    return (\n        <DefaultOption<CountryOption>\n            {...props}\n            customLabel={(data, label) => (\n                <span className=\"flex items-center gap-2\">\n                    <Avatar\n                        shape=\"circle\"\n                        size={20}\n                        src={`/img/countries/${data.value}.png`}\n                    />\n                    {props.variant === 'country' && <span>{label}</span>}\n                    {props.variant === 'phone' && <span>{data.dialCode}</span>}\n                </span>\n            )}\n        />\n    )\n}\n\nconst CustomControl = ({ children, ...props }: ControlProps<CountryOption>) => {\n    const selected = props.getValue()[0]\n    return (\n        <Control {...props}>\n            {selected && (\n                <Avatar\n                    className=\"ltr:ml-4 rtl:mr-4\"\n                    shape=\"circle\"\n                    size={20}\n                    src={`/img/countries/${selected.value}.png`}\n                />\n            )}\n            {children}\n        </Control>\n    )\n}\n\nconst SettingsProfile = () => {\n    const { data, mutate } = useSWR(\n        '/api/settings/profile/',\n        () => apiGetSettingsProfile<GetSettingsProfileResponse>(),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            revalidateOnReconnect: false,\n        },\n    )\n\n    const dialCodeList = useMemo(() => {\n        const newCountryList: Array<CountryOption> = JSON.parse(\n            JSON.stringify(countryList),\n        )\n\n        return newCountryList.map((country) => {\n            country.label = country.dialCode\n            return country\n        })\n    }, [])\n\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    const {\n        handleSubmit,\n        reset,\n        formState: { errors, isSubmitting },\n        control,\n    } = useForm<ProfileSchema>({\n        resolver: zodResolver(validationSchema),\n    })\n\n    useEffect(() => {\n        if (data) {\n            reset(data)\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [data])\n\n    const onSubmit = async (values: ProfileSchema) => {\n        await sleep(500)\n        if (data) {\n            mutate({ ...data, ...values }, false)\n        }\n    }\n\n    return (\n        <>\n            <h4 className=\"mb-8\">Personal information</h4>\n            <Form onSubmit={handleSubmit(onSubmit)}>\n                <div className=\"mb-8\">\n                    <Controller\n                        name=\"img\"\n                        control={control}\n                        render={({ field }) => (\n                            <div className=\"flex items-center gap-4\">\n                                <Avatar\n                                    size={90}\n                                    className=\"border-4 border-white bg-gray-100 text-gray-300 shadow-lg\"\n                                    icon={<HiOutlineUser />}\n                                    src={field.value}\n                                />\n                                <div className=\"flex items-center gap-2\">\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(\n                                                        files[0],\n                                                    ),\n                                                )\n                                            }\n                                        }}\n                                    >\n                                        <Button\n                                            variant=\"solid\"\n                                            size=\"sm\"\n                                            type=\"button\"\n                                            icon={<TbPlus />}\n                                        >\n                                            Upload Image\n                                        </Button>\n                                    </Upload>\n                                    <Button\n                                        size=\"sm\"\n                                        type=\"button\"\n                                        onClick={() => {\n                                            field.onChange('')\n                                        }}\n                                    >\n                                        Remove\n                                    </Button>\n                                </div>\n                            </div>\n                        )}\n                    />\n                </div>\n                <div className=\"grid md:grid-cols-2 gap-4\">\n                    <FormItem\n                        label=\"First name\"\n                        invalid={Boolean(errors.firstName)}\n                        errorMessage={errors.firstName?.message}\n                    >\n                        <Controller\n                            name=\"firstName\"\n                            control={control}\n                            render={({ field }) => (\n                                <Input\n                                    type=\"text\"\n                                    autoComplete=\"off\"\n                                    placeholder=\"First Name\"\n                                    {...field}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                    <FormItem\n                        label=\"User name\"\n                        invalid={Boolean(errors.lastName)}\n                        errorMessage={errors.lastName?.message}\n                    >\n                        <Controller\n                            name=\"lastName\"\n                            control={control}\n                            render={({ field }) => (\n                                <Input\n                                    type=\"text\"\n                                    autoComplete=\"off\"\n                                    placeholder=\"Last Name\"\n                                    {...field}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                </div>\n                <FormItem\n                    label=\"Email\"\n                    invalid={Boolean(errors.email)}\n                    errorMessage={errors.email?.message}\n                >\n                    <Controller\n                        name=\"email\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"email\"\n                                autoComplete=\"off\"\n                                placeholder=\"Email\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <div className=\"flex items-end gap-4 w-full mb-6\">\n                    <FormItem\n                        invalid={\n                            Boolean(errors.phoneNumber) ||\n                            Boolean(errors.dialCode)\n                        }\n                    >\n                        <label className=\"form-label mb-2\">Phone number</label>\n                        <Controller\n                            name=\"dialCode\"\n                            control={control}\n                            render={({ field }) => (\n                                <Select<CountryOption>\n                                    options={dialCodeList}\n                                    {...field}\n                                    className=\"w-[150px]\"\n                                    components={{\n                                        Option: (props) => (\n                                            <CustomSelectOption\n                                                variant=\"phone\"\n                                                {...(props as OptionProps<CountryOption>)}\n                                            />\n                                        ),\n                                        Control: CustomControl,\n                                    }}\n                                    placeholder=\"\"\n                                    value={dialCodeList.filter(\n                                        (option) =>\n                                            option.dialCode === field.value,\n                                    )}\n                                    onChange={(option) =>\n                                        field.onChange(option?.dialCode)\n                                    }\n                                />\n                            )}\n                        />\n                    </FormItem>\n                    <FormItem\n                        className=\"w-full\"\n                        invalid={\n                            Boolean(errors.phoneNumber) ||\n                            Boolean(errors.dialCode)\n                        }\n                        errorMessage={errors.phoneNumber?.message}\n                    >\n                        <Controller\n                            name=\"phoneNumber\"\n                            control={control}\n                            render={({ field }) => (\n                                <NumericInput\n                                    autoComplete=\"off\"\n                                    placeholder=\"Phone Number\"\n                                    value={field.value}\n                                    onChange={field.onChange}\n                                    onBlur={field.onBlur}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                </div>\n                <h4 className=\"mb-6\">Address information</h4>\n                <FormItem\n                    label=\"Country\"\n                    invalid={Boolean(errors.country)}\n                    errorMessage={errors.country?.message}\n                >\n                    <Controller\n                        name=\"country\"\n                        control={control}\n                        render={({ field }) => (\n                            <Select<CountryOption>\n                                options={countryList}\n                                {...field}\n                                components={{\n                                    Option: (props) => (\n                                        <CustomSelectOption\n                                            variant=\"country\"\n                                            {...(props as OptionProps<CountryOption>)}\n                                        />\n                                    ),\n                                    Control: CustomControl,\n                                }}\n                                placeholder=\"\"\n                                value={countryList.filter(\n                                    (option) => option.value === field.value,\n                                )}\n                                onChange={(option) =>\n                                    field.onChange(option?.value)\n                                }\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"Address\"\n                    invalid={Boolean(errors.address)}\n                    errorMessage={errors.address?.message}\n                >\n                    <Controller\n                        name=\"address\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"Address\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n                    <FormItem\n                        label=\"City\"\n                        invalid={Boolean(errors.city)}\n                        errorMessage={errors.city?.message}\n                    >\n                        <Controller\n                            name=\"city\"\n                            control={control}\n                            render={({ field }) => (\n                                <Input\n                                    type=\"text\"\n                                    autoComplete=\"off\"\n                                    placeholder=\"City\"\n                                    {...field}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                    <FormItem\n                        label=\"Postal Code\"\n                        invalid={Boolean(errors.postcode)}\n                        errorMessage={errors.postcode?.message}\n                    >\n                        <Controller\n                            name=\"postcode\"\n                            control={control}\n                            render={({ field }) => (\n                                <Input\n                                    type=\"text\"\n                                    autoComplete=\"off\"\n                                    placeholder=\"Postal Code\"\n                                    {...field}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                </div>\n                <div className=\"flex justify-end\">\n                    <Button\n                        variant=\"solid\"\n                        type=\"submit\"\n                        loading={isSubmitting}\n                    >\n                        Save\n                    </Button>\n                </div>\n            </Form>\n        </>\n    )\n}\n\nexport default SettingsProfile\n"],"names":["DefaultOption"],"mappings":"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"}
+{"version":3,"file":"SettingsProfile.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsProfile.tsx"],"sourcesContent":["import { useMemo, useEffect } from 'react'\nimport Button from '@/components/ui/Button'\nimport Upload from '@/components/ui/Upload'\nimport Input from '@/components/ui/Input'\nimport Select, { Option as DefaultOption } from '@/components/ui/Select'\nimport Avatar from '@/components/ui/Avatar'\nimport { Form, FormItem } from '@/components/ui/Form'\nimport NumericInput from '@/components/shared/NumericInput'\nimport { countryList } from '@/constants/countries.constant'\nimport { components } from 'react-select'\nimport type { ControlProps, OptionProps } from 'react-select'\nimport { apiGetSettingsProfile } from '@/services/AccontsService'\nimport sleep from '@/utils/sleep'\nimport useSWR from 'swr'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useForm, Controller } from 'react-hook-form'\nimport { z } from 'zod'\nimport { HiOutlineUser } from 'react-icons/hi'\nimport { TbPlus } from 'react-icons/tb'\nimport type { ZodType } from 'zod'\nimport type { GetSettingsProfileResponse } from '../types'\n\ntype ProfileSchema = {\n    firstName: string\n    lastName: string\n    email: string\n    dialCode: string\n    phoneNumber: string\n    img: string\n    country: string\n    address: string\n    postcode: string\n    city: string\n}\n\ntype CountryOption = {\n    label: string\n    dialCode: string\n    value: string\n}\n\nconst { Control } = components\n\nconst validationSchema: ZodType<ProfileSchema> = z.object({\n    firstName: z.string().min(1, { message: 'First name required' }),\n    lastName: z.string().min(1, { message: 'Last name required' }),\n    email: z\n        .string()\n        .min(1, { message: 'Email required' })\n        .email({ message: 'Invalid email' }),\n    dialCode: z.string().min(1, { message: 'Please select your country code' }),\n    phoneNumber: z\n        .string()\n        .min(1, { message: 'Please input your mobile number' }),\n    country: z.string().min(1, { message: 'Please select a country' }),\n    address: z.string().min(1, { message: 'Addrress required' }),\n    postcode: z.string().min(1, { message: 'Postcode required' }),\n    city: z.string().min(1, { message: 'City required' }),\n    img: z.string(),\n})\n\nconst CustomSelectOption = (\n    props: OptionProps<CountryOption> & { variant: 'country' | 'phone' },\n) => {\n    return (\n        <DefaultOption<CountryOption>\n            {...props}\n            customLabel={(data, label) => (\n                <span className=\"flex items-center gap-2\">\n                    <Avatar\n                        shape=\"circle\"\n                        size={20}\n                        src={`/img/countries/${data.value}.png`}\n                    />\n                    {props.variant === 'country' && <span>{label}</span>}\n                    {props.variant === 'phone' && <span>{data.dialCode}</span>}\n                </span>\n            )}\n        />\n    )\n}\n\nconst CustomControl = ({ children, ...props }: ControlProps<CountryOption>) => {\n    const selected = props.getValue()[0]\n    return (\n        <Control {...props}>\n            {selected && (\n                <Avatar\n                    className=\"ltr:ml-4 rtl:mr-4\"\n                    shape=\"circle\"\n                    size={20}\n                    src={`/img/countries/${selected.value}.png`}\n                />\n            )}\n            {children}\n        </Control>\n    )\n}\n\nconst SettingsProfile = () => {\n    const { data, mutate } = useSWR(\n        '/api/settings/profile/',\n        () => apiGetSettingsProfile<GetSettingsProfileResponse>(),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            revalidateOnReconnect: false,\n        },\n    )\n\n    const dialCodeList = useMemo(() => {\n        const newCountryList: Array<CountryOption> = JSON.parse(\n            JSON.stringify(countryList),\n        )\n\n        return newCountryList.map((country) => {\n            country.label = country.dialCode\n            return country\n        })\n    }, [])\n\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    const {\n        handleSubmit,\n        reset,\n        formState: { errors, isSubmitting },\n        control,\n    } = useForm<ProfileSchema>({\n        resolver: zodResolver(validationSchema),\n    })\n\n    useEffect(() => {\n        if (data) {\n            reset(data)\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, [data])\n\n    const onSubmit = async (values: ProfileSchema) => {\n        await sleep(500)\n        if (data) {\n            mutate({ ...data, ...values }, false)\n        }\n    }\n\n    return (\n        <>\n            <h4 className=\"mb-8\">Personal information</h4>\n            <Form onSubmit={handleSubmit(onSubmit)}>\n                <div className=\"mb-8\">\n                    <Controller\n                        name=\"img\"\n                        control={control}\n                        render={({ field }) => (\n                            <div className=\"flex items-center gap-4\">\n                                <Avatar\n                                    size={90}\n                                    className=\"border-4 border-white bg-gray-100 text-gray-300 shadow-lg\"\n                                    icon={<HiOutlineUser />}\n                                    src={field.value}\n                                />\n                                <div className=\"flex items-center gap-2\">\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(\n                                                        files[0],\n                                                    ),\n                                                )\n                                            }\n                                        }}\n                                    >\n                                        <Button\n                                            variant=\"solid\"\n                                            size=\"sm\"\n                                            type=\"button\"\n                                            icon={<TbPlus />}\n                                        >\n                                            Upload Image\n                                        </Button>\n                                    </Upload>\n                                    <Button\n                                        size=\"sm\"\n                                        type=\"button\"\n                                        onClick={() => {\n                                            field.onChange('')\n                                        }}\n                                    >\n                                        Remove\n                                    </Button>\n                                </div>\n                            </div>\n                        )}\n                    />\n                </div>\n                <div className=\"grid md:grid-cols-2 gap-4\">\n                    <FormItem\n                        label=\"First name\"\n                        invalid={Boolean(errors.firstName)}\n                        errorMessage={errors.firstName?.message}\n                    >\n                        <Controller\n                            name=\"firstName\"\n                            control={control}\n                            render={({ field }) => (\n                                <Input\n                                    type=\"text\"\n                                    autoComplete=\"off\"\n                                    placeholder=\"First Name\"\n                                    {...field}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                    <FormItem\n                        label=\"User name\"\n                        invalid={Boolean(errors.lastName)}\n                        errorMessage={errors.lastName?.message}\n                    >\n                        <Controller\n                            name=\"lastName\"\n                            control={control}\n                            render={({ field }) => (\n                                <Input\n                                    type=\"text\"\n                                    autoComplete=\"off\"\n                                    placeholder=\"Last Name\"\n                                    {...field}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                </div>\n                <FormItem\n                    label=\"Email\"\n                    invalid={Boolean(errors.email)}\n                    errorMessage={errors.email?.message}\n                >\n                    <Controller\n                        name=\"email\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"email\"\n                                autoComplete=\"off\"\n                                placeholder=\"Email\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <div className=\"flex items-end gap-4 w-full mb-6\">\n                    <FormItem\n                        invalid={\n                            Boolean(errors.phoneNumber) ||\n                            Boolean(errors.dialCode)\n                        }\n                    >\n                        <label className=\"form-label mb-2\">Phone number</label>\n                        <Controller\n                            name=\"dialCode\"\n                            control={control}\n                            render={({ field }) => (\n                                <Select<CountryOption>\n                                    options={dialCodeList}\n                                    {...field}\n                                    className=\"w-[150px]\"\n                                    components={{\n                                        Option: (props) => (\n                                            <CustomSelectOption\n                                                variant=\"phone\"\n                                                {...(props as OptionProps<CountryOption>)}\n                                            />\n                                        ),\n                                        Control: CustomControl,\n                                    }}\n                                    placeholder=\"\"\n                                    value={dialCodeList.filter(\n                                        (option) =>\n                                            option.dialCode === field.value,\n                                    )}\n                                    onChange={(option) =>\n                                        field.onChange(option?.dialCode)\n                                    }\n                                />\n                            )}\n                        />\n                    </FormItem>\n                    <FormItem\n                        className=\"w-full\"\n                        invalid={\n                            Boolean(errors.phoneNumber) ||\n                            Boolean(errors.dialCode)\n                        }\n                        errorMessage={errors.phoneNumber?.message}\n                    >\n                        <Controller\n                            name=\"phoneNumber\"\n                            control={control}\n                            render={({ field }) => (\n                                <NumericInput\n                                    autoComplete=\"off\"\n                                    placeholder=\"Phone Number\"\n                                    value={field.value}\n                                    onChange={field.onChange}\n                                    onBlur={field.onBlur}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                </div>\n                <h4 className=\"mb-6\">Address information</h4>\n                <FormItem\n                    label=\"Country\"\n                    invalid={Boolean(errors.country)}\n                    errorMessage={errors.country?.message}\n                >\n                    <Controller\n                        name=\"country\"\n                        control={control}\n                        render={({ field }) => (\n                            <Select<CountryOption>\n                                options={countryList}\n                                {...field}\n                                components={{\n                                    Option: (props) => (\n                                        <CustomSelectOption\n                                            variant=\"country\"\n                                            {...(props as OptionProps<CountryOption>)}\n                                        />\n                                    ),\n                                    Control: CustomControl,\n                                }}\n                                placeholder=\"\"\n                                value={countryList.filter(\n                                    (option) => option.value === field.value,\n                                )}\n                                onChange={(option) =>\n                                    field.onChange(option?.value)\n                                }\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"Address\"\n                    invalid={Boolean(errors.address)}\n                    errorMessage={errors.address?.message}\n                >\n                    <Controller\n                        name=\"address\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"text\"\n                                autoComplete=\"off\"\n                                placeholder=\"Address\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <div className=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\n                    <FormItem\n                        label=\"City\"\n                        invalid={Boolean(errors.city)}\n                        errorMessage={errors.city?.message}\n                    >\n                        <Controller\n                            name=\"city\"\n                            control={control}\n                            render={({ field }) => (\n                                <Input\n                                    type=\"text\"\n                                    autoComplete=\"off\"\n                                    placeholder=\"City\"\n                                    {...field}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                    <FormItem\n                        label=\"Postal Code\"\n                        invalid={Boolean(errors.postcode)}\n                        errorMessage={errors.postcode?.message}\n                    >\n                        <Controller\n                            name=\"postcode\"\n                            control={control}\n                            render={({ field }) => (\n                                <Input\n                                    type=\"text\"\n                                    autoComplete=\"off\"\n                                    placeholder=\"Postal Code\"\n                                    {...field}\n                                />\n                            )}\n                        />\n                    </FormItem>\n                </div>\n                <div className=\"flex justify-end\">\n                    <Button\n                        variant=\"solid\"\n                        type=\"submit\"\n                        loading={isSubmitting}\n                    >\n                        Save\n                    </Button>\n                </div>\n            </Form>\n        </>\n    )\n}\n\nexport default SettingsProfile\n"],"names":["DefaultOption"],"mappings":"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"}

package/dist/@ecme/views/concepts/accounts/Settings/components/SettingsSecurity.js.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsSecurity.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsSecurity.tsx"],"sourcesContent":["import { useState, useRef } from 'react'\nimport Avatar from '@/components/ui/Avatar'\nimport Button from '@/components/ui/Button'\nimport Input from '@/components/ui/Input'\nimport ConfirmDialog from '@/components/shared/ConfirmDialog'\nimport { Form, FormItem } from '@/components/ui/Form'\nimport classNames from '@/utils/classNames'\nimport sleep from '@/utils/sleep'\nimport isLastChild from '@/utils/isLastChild'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useForm, Controller } from 'react-hook-form'\nimport { z } from 'zod'\nimport type { ZodType } from 'zod'\n\ntype PasswordSchema = {\n    currentPassword: string\n    newPassword: string\n    confirmNewPassword: string\n}\n\nconst authenticatorList = [\n    {\n        label: 'Google Authenticator',\n        value: 'googleAuthenticator',\n        img: '/img/others/google.png',\n        desc: 'Using Google Authenticator app generates time-sensitive codes for secure logins.',\n    },\n    {\n        label: 'Okta Verify',\n        value: 'oktaVerify',\n        img: '/img/others/okta.png',\n        desc: 'Receive push notifications from Okta Verify app on your phone for quick login approval.',\n    },\n    {\n        label: 'E Mail verification',\n        value: 'emailVerification',\n        img: '/img/others/email.png',\n        desc: 'Unique codes sent to email for confirming logins.',\n    },\n]\n\nconst validationSchema: ZodType<PasswordSchema> = z\n    .object({\n        currentPassword: z\n            .string()\n            .min(1, { message: 'Please enter your current password!' }),\n        newPassword: z\n            .string()\n            .min(1, { message: 'Please enter your new password!' }),\n        confirmNewPassword: z\n            .string()\n            .min(1, { message: 'Please confirm your new password!' }),\n    })\n    .refine((data) => data.confirmNewPassword === data.newPassword, {\n        message: 'Password not match',\n        path: ['confirmNewPassword'],\n    })\n\nconst SettingsSecurity = () => {\n    const [selected2FaType, setSelected2FaType] = useState(\n        'googleAuthenticator',\n    )\n    const [confirmationOpen, setConfirmationOpen] = useState(false)\n    const [isSubmitting, setIsSubmitting] = useState(false)\n\n    const formRef = useRef<HTMLFormElement>(null)\n\n    const {\n        getValues,\n        handleSubmit,\n        formState: { errors },\n        control,\n    } = useForm<PasswordSchema>({\n        resolver: zodResolver(validationSchema),\n    })\n\n    const handlePostSubmit = async () => {\n        setIsSubmitting(true)\n        await sleep(1000)\n        console.log('getValues', getValues())\n        setConfirmationOpen(false)\n        setIsSubmitting(false)\n    }\n\n    const onSubmit = async () => {\n        setConfirmationOpen(true)\n    }\n\n    return (\n        <div>\n            <div className=\"mb-8\">\n                <h4>Password</h4>\n                <p>\n                    Remember, your password is your digital key to your account.\n                    Keep it safe, keep it secure!\n                </p>\n            </div>\n            <Form\n                ref={formRef}\n                className=\"mb-8\"\n                onSubmit={handleSubmit(onSubmit)}\n            >\n                <FormItem\n                    label=\"Current password\"\n                    invalid={Boolean(errors.currentPassword)}\n                    errorMessage={errors.currentPassword?.message}\n                >\n                    <Controller\n                        name=\"currentPassword\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"password\"\n                                autoComplete=\"off\"\n                                placeholder=\"•••••••••\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"New password\"\n                    invalid={Boolean(errors.newPassword)}\n                    errorMessage={errors.newPassword?.message}\n                >\n                    <Controller\n                        name=\"newPassword\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"password\"\n                                autoComplete=\"off\"\n                                placeholder=\"•••••••••\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"Confirm new password\"\n                    invalid={Boolean(errors.confirmNewPassword)}\n                    errorMessage={errors.confirmNewPassword?.message}\n                >\n                    <Controller\n                        name=\"confirmNewPassword\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"password\"\n                                autoComplete=\"off\"\n                                placeholder=\"•••••••••\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <div className=\"flex justify-end\">\n                    <Button variant=\"solid\" type=\"submit\">\n                        Update\n                    </Button>\n                </div>\n            </Form>\n            <ConfirmDialog\n                isOpen={confirmationOpen}\n                type=\"warning\"\n                title=\"Update password\"\n                confirmButtonProps={{\n                    loading: isSubmitting,\n                    onClick: handlePostSubmit,\n                }}\n                onClose={() => setConfirmationOpen(false)}\n                onRequestClose={() => setConfirmationOpen(false)}\n                onCancel={() => setConfirmationOpen(false)}\n            >\n                <p>Are you sure you want to change your password?</p>\n            </ConfirmDialog>\n            <div className=\"mb-8\">\n                <h4>2-Step verification</h4>\n                <p>\n                    Your account holds great value to hackers. Enable two-step\n                    verification to safeguard your account!\n                </p>\n                <div className=\"mt-8\">\n                    {authenticatorList.map((authOption, index) => (\n                        <div\n                            key={authOption.value}\n                            className={classNames(\n                                'py-6 border-gray-200 dark:border-gray-600',\n                                !isLastChild(authenticatorList, index) &&\n                                    'border-b',\n                            )}\n                        >\n                            <div className=\"flex items-center justify-between gap-4\">\n                                <div className=\"flex items-center gap-4\">\n                                    <Avatar\n                                        size={35}\n                                        className=\"bg-transparent\"\n                                        src={authOption.img}\n                                    />\n                                    <div>\n                                        <h6>{authOption.label}</h6>\n                                        <span>{authOption.desc}</span>\n                                    </div>\n                                </div>\n                                <div>\n                                    {selected2FaType === authOption.value ? (\n                                        <Button\n                                            size=\"sm\"\n                                            customColorClass={() =>\n                                                'border-success ring-1 ring-success text-success hover:border-success hover:ring-success hover:text-success bg-transparent'\n                                            }\n                                            onClick={() =>\n                                                setSelected2FaType('')\n                                            }\n                                        >\n                                            Activated\n                                        </Button>\n                                    ) : (\n                                        <Button\n                                            size=\"sm\"\n                                            onClick={() =>\n                                                setSelected2FaType(\n                                                    authOption.value,\n                                                )\n                                            }\n                                        >\n                                            Enable\n                                        </Button>\n                                    )}\n                                </div>\n                            </div>\n                        </div>\n                    ))}\n                </div>\n            </div>\n        </div>\n    )\n}\n\nexport default SettingsSecurity\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SettingsSecurity.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/components/SettingsSecurity.tsx"],"sourcesContent":["import { useState, useRef } from 'react'\nimport Avatar from '@/components/ui/Avatar'\nimport Button from '@/components/ui/Button'\nimport Input from '@/components/ui/Input'\nimport ConfirmDialog from '@/components/shared/ConfirmDialog'\nimport { Form, FormItem } from '@/components/ui/Form'\nimport classNames from '@/utils/classNames'\nimport sleep from '@/utils/sleep'\nimport isLastChild from '@/utils/isLastChild'\nimport { zodResolver } from '@hookform/resolvers/zod'\nimport { useForm, Controller } from 'react-hook-form'\nimport { z } from 'zod'\nimport type { ZodType } from 'zod'\n\ntype PasswordSchema = {\n    currentPassword: string\n    newPassword: string\n    confirmNewPassword: string\n}\n\nconst authenticatorList = [\n    {\n        label: 'Google Authenticator',\n        value: 'googleAuthenticator',\n        img: '/img/others/google.png',\n        desc: 'Using Google Authenticator app generates time-sensitive codes for secure logins.',\n    },\n    {\n        label: 'Okta Verify',\n        value: 'oktaVerify',\n        img: '/img/others/okta.png',\n        desc: 'Receive push notifications from Okta Verify app on your phone for quick login approval.',\n    },\n    {\n        label: 'E Mail verification',\n        value: 'emailVerification',\n        img: '/img/others/email.png',\n        desc: 'Unique codes sent to email for confirming logins.',\n    },\n]\n\nconst validationSchema: ZodType<PasswordSchema> = z\n    .object({\n        currentPassword: z\n            .string()\n            .min(1, { message: 'Please enter your current password!' }),\n        newPassword: z\n            .string()\n            .min(1, { message: 'Please enter your new password!' }),\n        confirmNewPassword: z\n            .string()\n            .min(1, { message: 'Please confirm your new password!' }),\n    })\n    .refine((data) => data.confirmNewPassword === data.newPassword, {\n        message: 'Password not match',\n        path: ['confirmNewPassword'],\n    })\n\nconst SettingsSecurity = () => {\n    const [selected2FaType, setSelected2FaType] = useState(\n        'googleAuthenticator',\n    )\n    const [confirmationOpen, setConfirmationOpen] = useState(false)\n    const [isSubmitting, setIsSubmitting] = useState(false)\n\n    const formRef = useRef<HTMLFormElement>(null)\n\n    const {\n        getValues,\n        handleSubmit,\n        formState: { errors },\n        control,\n    } = useForm<PasswordSchema>({\n        resolver: zodResolver(validationSchema),\n    })\n\n    const handlePostSubmit = async () => {\n        setIsSubmitting(true)\n        await sleep(1000)\n        console.log('getValues', getValues())\n        setConfirmationOpen(false)\n        setIsSubmitting(false)\n    }\n\n    const onSubmit = async () => {\n        setConfirmationOpen(true)\n    }\n\n    return (\n        <div>\n            <div className=\"mb-8\">\n                <h4>Password</h4>\n                <p>\n                    Remember, your password is your digital key to your account.\n                    Keep it safe, keep it secure!\n                </p>\n            </div>\n            <Form\n                ref={formRef}\n                className=\"mb-8\"\n                onSubmit={handleSubmit(onSubmit)}\n            >\n                <FormItem\n                    label=\"Current password\"\n                    invalid={Boolean(errors.currentPassword)}\n                    errorMessage={errors.currentPassword?.message}\n                >\n                    <Controller\n                        name=\"currentPassword\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"password\"\n                                autoComplete=\"off\"\n                                placeholder=\"•••••••••\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"New password\"\n                    invalid={Boolean(errors.newPassword)}\n                    errorMessage={errors.newPassword?.message}\n                >\n                    <Controller\n                        name=\"newPassword\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"password\"\n                                autoComplete=\"off\"\n                                placeholder=\"•••••••••\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <FormItem\n                    label=\"Confirm new password\"\n                    invalid={Boolean(errors.confirmNewPassword)}\n                    errorMessage={errors.confirmNewPassword?.message}\n                >\n                    <Controller\n                        name=\"confirmNewPassword\"\n                        control={control}\n                        render={({ field }) => (\n                            <Input\n                                type=\"password\"\n                                autoComplete=\"off\"\n                                placeholder=\"•••••••••\"\n                                {...field}\n                            />\n                        )}\n                    />\n                </FormItem>\n                <div className=\"flex justify-end\">\n                    <Button variant=\"solid\" type=\"submit\">\n                        Update\n                    </Button>\n                </div>\n            </Form>\n            <ConfirmDialog\n                isOpen={confirmationOpen}\n                type=\"warning\"\n                title=\"Update password\"\n                confirmButtonProps={{\n                    loading: isSubmitting,\n                    onClick: handlePostSubmit,\n                }}\n                onClose={() => setConfirmationOpen(false)}\n                onRequestClose={() => setConfirmationOpen(false)}\n                onCancel={() => setConfirmationOpen(false)}\n            >\n                <p>Are you sure you want to change your password?</p>\n            </ConfirmDialog>\n            <div className=\"mb-8\">\n                <h4>2-Step verification</h4>\n                <p>\n                    Your account holds great value to hackers. Enable two-step\n                    verification to safeguard your account!\n                </p>\n                <div className=\"mt-8\">\n                    {authenticatorList.map((authOption, index) => (\n                        <div\n                            key={authOption.value}\n                            className={classNames(\n                                'py-6 border-gray-200 dark:border-gray-600',\n                                !isLastChild(authenticatorList, index) &&\n                                    'border-b',\n                            )}\n                        >\n                            <div className=\"flex items-center justify-between gap-4\">\n                                <div className=\"flex items-center gap-4\">\n                                    <Avatar\n                                        size={35}\n                                        className=\"bg-transparent\"\n                                        src={authOption.img}\n                                    />\n                                    <div>\n                                        <h6>{authOption.label}</h6>\n                                        <span>{authOption.desc}</span>\n                                    </div>\n                                </div>\n                                <div>\n                                    {selected2FaType === authOption.value ? (\n                                        <Button\n                                            size=\"sm\"\n                                            customColorClass={() =>\n                                                'border-success ring-1 ring-success text-success hover:border-success hover:ring-success hover:text-success bg-transparent'\n                                            }\n                                            onClick={() =>\n                                                setSelected2FaType('')\n                                            }\n                                        >\n                                            Activated\n                                        </Button>\n                                    ) : (\n                                        <Button\n                                            size=\"sm\"\n                                            onClick={() =>\n                                                setSelected2FaType(\n                                                    authOption.value,\n                                                )\n                                            }\n                                        >\n                                            Enable\n                                        </Button>\n                                    )}\n                                </div>\n                            </div>\n                        </div>\n                    ))}\n                </div>\n            </div>\n        </div>\n    )\n}\n\nexport default SettingsSecurity\n"],"names":[],"mappings":"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"}

package/dist/@ecme/views/concepts/accounts/Settings/store/settingsStore.js.map

@@ -1 +1 @@
-{"version":3,"file":"settingsStore.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/store/settingsStore.ts"],"sourcesContent":["import { create } from 'zustand'\nimport type { View } from '../types'\n\nexport type SettingsState = {\n    currentView: View\n}\n\ntype SettingsAction = {\n    setCurrentView: (payload: View) => void\n}\n\nconst initialState: SettingsState = {\n    currentView: 'profile',\n}\n\nexport const useSettingsStore = create<SettingsState & SettingsAction>(\n    (set) => ({\n        ...initialState,\n        setCurrentView: (payload) => set(() => ({ currentView: payload })),\n    }),\n)\n"],"names":[],"mappings":";AAWA,MAAM,eAA8B;AAAA,EAChC,aAAa;AACjB;AAEO,MAAM,mBAAmB;AAAA,EAC5B,CAAC,SAAS;AAAA,IACN,GAAG;AAAA,IACH,gBAAgB,CAAC,YAAY,IAAI,OAAO,EAAE,aAAa,UAAU;AAAA,EACrE;AACJ;"}
+{"version":3,"file":"settingsStore.js","sources":["../../../../../../../lib/@ecme/views/concepts/accounts/Settings/store/settingsStore.ts"],"sourcesContent":["import { create } from 'zustand'\nimport type { View } from '../types'\n\nexport type SettingsState = {\n    currentView: View\n}\n\ntype SettingsAction = {\n    setCurrentView: (payload: View) => void\n}\n\nconst initialState: SettingsState = {\n    currentView: 'profile',\n}\n\nexport const useSettingsStore = create<SettingsState & SettingsAction>(\n    (set) => ({\n        ...initialState,\n        setCurrentView: (payload) => set(() => ({ currentView: payload })),\n    }),\n)\n"],"names":[],"mappings":";AAWA,MAAM,eAA8B;AAAA,EAChC,aAAa;AACjB;AAEO,MAAM,mBAAmB;AAAA,EAC5B,CAAC,SAAS;AAAA,IACN,GAAG;AAAA,IACH,gBAAgB,CAAC,YAAY,IAAI,OAAO,EAAE,aAAa,UAAU;AAAA,EAAA;AAEzE;"}

package/dist/@ecme/views/concepts/ai/Chat/GenerativeChat.js.map

@@ -1 +1 @@
-{"version":3,"file":"GenerativeChat.js","sources":["../../../../../../lib/@ecme/views/concepts/ai/Chat/GenerativeChat.tsx"],"sourcesContent":["import ChatSideNav from './components/ChatSideNav'\nimport ChatView from './components/ChatView'\nimport ChatHistoryRenameDialog from './components/ChatHistoryRenameDialog'\nimport useResponsive from '@/utils/hooks/useResponsive'\n\nconst GenerativeChat = () => {\n    const { larger } = useResponsive()\n\n    return (\n        <div className=\"h-full\">\n            <div className=\"flex flex-auto gap-4 h-full\">\n                <ChatView />\n                {larger.xl && <ChatSideNav />}\n                <ChatHistoryRenameDialog />\n            </div>\n        </div>\n    )\n}\n\nexport default GenerativeChat\n"],"names":[],"mappings":";;;;;AAKA,MAAM,iBAAiB,MAAM;AACnB,QAAA,EAAE,OAAO,IAAI,cAAc;AAEjC,6BACK,OAAI,EAAA,WAAU,UACX,UAAC,qBAAA,OAAA,EAAI,WAAU,+BACX,UAAA;AAAA,IAAA,oBAAC,UAAS,EAAA;AAAA,IACT,OAAO,MAAM,oBAAC,aAAY,CAAA,CAAA;AAAA,wBAC1B,yBAAwB,CAAA,CAAA;AAAA,EAAA,EAAA,CAC7B,EACJ,CAAA;AAER;"}
+{"version":3,"file":"GenerativeChat.js","sources":["../../../../../../lib/@ecme/views/concepts/ai/Chat/GenerativeChat.tsx"],"sourcesContent":["import ChatSideNav from './components/ChatSideNav'\nimport ChatView from './components/ChatView'\nimport ChatHistoryRenameDialog from './components/ChatHistoryRenameDialog'\nimport useResponsive from '@/utils/hooks/useResponsive'\n\nconst GenerativeChat = () => {\n    const { larger } = useResponsive()\n\n    return (\n        <div className=\"h-full\">\n            <div className=\"flex flex-auto gap-4 h-full\">\n                <ChatView />\n                {larger.xl && <ChatSideNav />}\n                <ChatHistoryRenameDialog />\n            </div>\n        </div>\n    )\n}\n\nexport default GenerativeChat\n"],"names":[],"mappings":";;;;;AAKA,MAAM,iBAAiB,MAAM;AACzB,QAAM,EAAE,OAAA,IAAW,cAAA;AAEnB,6BACK,OAAA,EAAI,WAAU,UACX,UAAA,qBAAC,OAAA,EAAI,WAAU,+BACX,UAAA;AAAA,IAAA,oBAAC,UAAA,EAAS;AAAA,IACT,OAAO,MAAM,oBAAC,aAAA,CAAA,CAAY;AAAA,wBAC1B,yBAAA,CAAA,CAAwB;AAAA,EAAA,EAAA,CAC7B,EAAA,CACJ;AAER;"}

package/dist/@ecme/views/concepts/ai/Chat/components/ChatCustomAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChatCustomAction.js","sources":["../../../../../../../lib/@ecme/views/concepts/ai/Chat/components/ChatCustomAction.tsx"],"sourcesContent":["import { useRef, useState, useEffect } from 'react'\nimport Button from '@/components/ui/Button'\nimport Input from '@/components/ui/Input'\nimport Select from '@/components/ui/Select'\nimport Notification from '@/components/ui/Notification'\nimport toast from '@/components/ui/toast'\nimport { Form, FormItem } from '@/components/ui/Form'\nimport Dialog from '@/components/ui/Dialog'\nimport Tooltip from '@/components/ui/Tooltip'\nimport classNames from '@/utils/classNames'\nimport {\n    TbThumbUp,\n    TbThumbUpFilled,\n    TbThumbDown,\n    TbThumbDownFilled,\n    TbCopy,\n    TbCheck,\n} from 'react-icons/tb'\n\ntype ChatCustomActionProps = {\n    content: string\n}\n\nconst responseOption = [\n    { label: 'Not factually correct', value: 'notFactuallyCorrect' },\n    { label: 'Harmful content', value: 'harmfulContent' },\n    { label: 'Overeactive refusal', value: 'overeactiveRefusal' },\n    { label: 'Other', value: 'other' },\n]\n\nconst ChatCustomAction = ({ content }: ChatCustomActionProps) => {\n    const detailInput = useRef<HTMLTextAreaElement>(null)\n    const [copied, setCopied] = useState(false)\n    const [selected, setSelected] = useState('')\n    const [responseSend, setResponSend] = useState('')\n    const [responseDialog, setResponseDialog] = useState<{\n        type: string\n        open: boolean\n    }>({\n        type: '',\n        open: false,\n    })\n\n    const btnClass =\n        'p-2 rounded-full hover:bg-black  hover:bg-opacity-5 hover:text-gray-900 dark:hover:bg-black dark:hover:text-gray-100 dark:hover:bg-opacity-40 transition-colors duration-300 ease-in-out'\n\n    useEffect(() => {\n        if (copied && content) {\n            navigator.clipboard.writeText(content)\n            if (copied) {\n                const copyFeedbackInterval = setTimeout(\n                    () => setCopied(false),\n                    2000,\n                )\n\n                return () => {\n                    clearTimeout(copyFeedbackInterval)\n                }\n            }\n        }\n    }, [copied, content])\n\n    const handleDialogClose = () => {\n        setResponseDialog({\n            type: '',\n            open: false,\n        })\n    }\n\n    const handleSubmit = () => {\n        setResponSend(responseDialog.type)\n        handleDialogClose()\n        toast.push(\n            <Notification type=\"success\">\n                Thanks for your feedback!\n            </Notification>,\n            { placement: 'top-center' },\n        )\n    }\n\n    return (\n        <>\n            <div className=\"flex mt-0.5\">\n                <Tooltip title={copied ? 'Copied' : 'Copy'} placement=\"bottom\">\n                    <button\n                        className={classNames(btnClass, 'text-lg')}\n                        onClick={() => setCopied(true)}\n                    >\n                        {copied ? (\n                            <TbCheck className=\"text-emerald-500\" />\n                        ) : (\n                            <TbCopy />\n                        )}\n                    </button>\n                </Tooltip>\n                <Tooltip title=\"Good response\" placement=\"bottom\">\n                    <button\n                        className={classNames(btnClass, 'text-lg')}\n                        onClick={() =>\n                            setResponseDialog({ type: 'praise', open: true })\n                        }\n                    >\n                        {responseSend === 'praise' ? (\n                            <TbThumbUpFilled />\n                        ) : (\n                            <TbThumbUp />\n                        )}\n                    </button>\n                </Tooltip>\n                <Tooltip title=\"Bad response\" placement=\"bottom\">\n                    <button\n                        className={classNames(btnClass, 'text-lg')}\n                        onClick={() =>\n                            setResponseDialog({ type: 'blame', open: true })\n                        }\n                    >\n                        {responseSend === 'blame' ? (\n                            <TbThumbDownFilled />\n                        ) : (\n                            <TbThumbDown />\n                        )}\n                    </button>\n                </Tooltip>\n            </div>\n            <Dialog\n                isOpen={responseDialog.open}\n                onClose={handleDialogClose}\n                onRequestClose={handleDialogClose}\n            >\n                <h5 className=\"mb-4\">Feedback</h5>\n                <Form onSubmit={handleSubmit}>\n                    {responseDialog.type === 'praise' && (\n                        <FormItem label=\"Please provide details: (optional)\">\n                            <Input\n                                ref={detailInput}\n                                textArea\n                                placeholder=\"What was statifying about this response?\"\n                            />\n                        </FormItem>\n                    )}\n                    {responseDialog.type === 'blame' && (\n                        <>\n                            <FormItem label=\"What type of issue do you wish to report? (optional)\">\n                                <Select\n                                    options={responseOption}\n                                    value={responseOption.filter(\n                                        (response) =>\n                                            response.value === selected,\n                                    )}\n                                    onChange={(option) =>\n                                        setSelected(option?.value || '')\n                                    }\n                                />\n                            </FormItem>\n                            <FormItem label=\"Please provide details: (optional)\">\n                                <Input\n                                    ref={detailInput}\n                                    textArea\n                                    placeholder=\"What was unstatifying about this response?\"\n                                />\n                            </FormItem>\n                        </>\n                    )}\n                </Form>\n                <div className=\"flex justify-end gap-2\">\n                    <Button\n                        className=\"ltr:mr-2 rtl:ml-2\"\n                        variant=\"plain\"\n                        type=\"button\"\n                        onClick={handleDialogClose}\n                    >\n                        Cancel\n                    </Button>\n                    <Button\n                        variant=\"solid\"\n                        type=\"submit\"\n                        onClick={handleSubmit}\n                    >\n                        Submit\n                    </Button>\n                </div>\n            </Dialog>\n        </>\n    )\n}\n\nexport default ChatCustomAction\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ChatCustomAction.js","sources":["../../../../../../../lib/@ecme/views/concepts/ai/Chat/components/ChatCustomAction.tsx"],"sourcesContent":["import { useRef, useState, useEffect } from 'react'\nimport Button from '@/components/ui/Button'\nimport Input from '@/components/ui/Input'\nimport Select from '@/components/ui/Select'\nimport Notification from '@/components/ui/Notification'\nimport toast from '@/components/ui/toast'\nimport { Form, FormItem } from '@/components/ui/Form'\nimport Dialog from '@/components/ui/Dialog'\nimport Tooltip from '@/components/ui/Tooltip'\nimport classNames from '@/utils/classNames'\nimport {\n    TbThumbUp,\n    TbThumbUpFilled,\n    TbThumbDown,\n    TbThumbDownFilled,\n    TbCopy,\n    TbCheck,\n} from 'react-icons/tb'\n\ntype ChatCustomActionProps = {\n    content: string\n}\n\nconst responseOption = [\n    { label: 'Not factually correct', value: 'notFactuallyCorrect' },\n    { label: 'Harmful content', value: 'harmfulContent' },\n    { label: 'Overeactive refusal', value: 'overeactiveRefusal' },\n    { label: 'Other', value: 'other' },\n]\n\nconst ChatCustomAction = ({ content }: ChatCustomActionProps) => {\n    const detailInput = useRef<HTMLTextAreaElement>(null)\n    const [copied, setCopied] = useState(false)\n    const [selected, setSelected] = useState('')\n    const [responseSend, setResponSend] = useState('')\n    const [responseDialog, setResponseDialog] = useState<{\n        type: string\n        open: boolean\n    }>({\n        type: '',\n        open: false,\n    })\n\n    const btnClass =\n        'p-2 rounded-full hover:bg-black  hover:bg-opacity-5 hover:text-gray-900 dark:hover:bg-black dark:hover:text-gray-100 dark:hover:bg-opacity-40 transition-colors duration-300 ease-in-out'\n\n    useEffect(() => {\n        if (copied && content) {\n            navigator.clipboard.writeText(content)\n            if (copied) {\n                const copyFeedbackInterval = setTimeout(\n                    () => setCopied(false),\n                    2000,\n                )\n\n                return () => {\n                    clearTimeout(copyFeedbackInterval)\n                }\n            }\n        }\n    }, [copied, content])\n\n    const handleDialogClose = () => {\n        setResponseDialog({\n            type: '',\n            open: false,\n        })\n    }\n\n    const handleSubmit = () => {\n        setResponSend(responseDialog.type)\n        handleDialogClose()\n        toast.push(\n            <Notification type=\"success\">\n                Thanks for your feedback!\n            </Notification>,\n            { placement: 'top-center' },\n        )\n    }\n\n    return (\n        <>\n            <div className=\"flex mt-0.5\">\n                <Tooltip title={copied ? 'Copied' : 'Copy'} placement=\"bottom\">\n                    <button\n                        className={classNames(btnClass, 'text-lg')}\n                        onClick={() => setCopied(true)}\n                    >\n                        {copied ? (\n                            <TbCheck className=\"text-emerald-500\" />\n                        ) : (\n                            <TbCopy />\n                        )}\n                    </button>\n                </Tooltip>\n                <Tooltip title=\"Good response\" placement=\"bottom\">\n                    <button\n                        className={classNames(btnClass, 'text-lg')}\n                        onClick={() =>\n                            setResponseDialog({ type: 'praise', open: true })\n                        }\n                    >\n                        {responseSend === 'praise' ? (\n                            <TbThumbUpFilled />\n                        ) : (\n                            <TbThumbUp />\n                        )}\n                    </button>\n                </Tooltip>\n                <Tooltip title=\"Bad response\" placement=\"bottom\">\n                    <button\n                        className={classNames(btnClass, 'text-lg')}\n                        onClick={() =>\n                            setResponseDialog({ type: 'blame', open: true })\n                        }\n                    >\n                        {responseSend === 'blame' ? (\n                            <TbThumbDownFilled />\n                        ) : (\n                            <TbThumbDown />\n                        )}\n                    </button>\n                </Tooltip>\n            </div>\n            <Dialog\n                isOpen={responseDialog.open}\n                onClose={handleDialogClose}\n                onRequestClose={handleDialogClose}\n            >\n                <h5 className=\"mb-4\">Feedback</h5>\n                <Form onSubmit={handleSubmit}>\n                    {responseDialog.type === 'praise' && (\n                        <FormItem label=\"Please provide details: (optional)\">\n                            <Input\n                                ref={detailInput}\n                                textArea\n                                placeholder=\"What was statifying about this response?\"\n                            />\n                        </FormItem>\n                    )}\n                    {responseDialog.type === 'blame' && (\n                        <>\n                            <FormItem label=\"What type of issue do you wish to report? (optional)\">\n                                <Select\n                                    options={responseOption}\n                                    value={responseOption.filter(\n                                        (response) =>\n                                            response.value === selected,\n                                    )}\n                                    onChange={(option) =>\n                                        setSelected(option?.value || '')\n                                    }\n                                />\n                            </FormItem>\n                            <FormItem label=\"Please provide details: (optional)\">\n                                <Input\n                                    ref={detailInput}\n                                    textArea\n                                    placeholder=\"What was unstatifying about this response?\"\n                                />\n                            </FormItem>\n                        </>\n                    )}\n                </Form>\n                <div className=\"flex justify-end gap-2\">\n                    <Button\n                        className=\"ltr:mr-2 rtl:ml-2\"\n                        variant=\"plain\"\n                        type=\"button\"\n                        onClick={handleDialogClose}\n                    >\n                        Cancel\n                    </Button>\n                    <Button\n                        variant=\"solid\"\n                        type=\"submit\"\n                        onClick={handleSubmit}\n                    >\n                        Submit\n                    </Button>\n                </div>\n            </Dialog>\n        </>\n    )\n}\n\nexport default ChatCustomAction\n"],"names":[],"mappings":"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"}

package/dist/@ecme/views/concepts/ai/Chat/components/ChatCustomContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChatCustomContent.js","sources":["../../../../../../../lib/@ecme/views/concepts/ai/Chat/components/ChatCustomContent.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { useState, useMemo, createElement, useEffect, ReactNode } from 'react'\nimport useInterval from '@/utils/hooks/useInterval '\nimport { getCurrentNodeOverflow, getStringPosition } from '../utils'\nimport ReactHtmlParser from 'html-react-parser'\nimport { marked } from 'marked'\nimport type { CommonProps } from '@/@types/common'\n\ntype ChatCustomContentProps = {\n    content: string\n    triggerTyping: boolean\n    onFinish?: () => void\n}\n\nconst AIWriter = ({\n    children,\n    delay = 25,\n    onFinish = () => {},\n}: CommonProps & { delay?: number; onFinish?: () => void }) => {\n    const [pos, setPos] = useState(0)\n\n    const tokenLengths = useMemo(() => {\n        const arr: number[] = []\n\n        const traverseNodesAndCountTokens = (reactNode: any) => {\n            const nodeChildren = reactNode?.props?.children\n\n            if (Array.isArray(reactNode)) {\n                reactNode.forEach((node) => {\n                    if (typeof node === 'object') {\n                        traverseNodesAndCountTokens(node)\n                    } else if (typeof node === 'string') {\n                        arr.push(node.split(' ').length)\n                    }\n                })\n            }\n\n            if (nodeChildren === undefined) {\n                if (typeof reactNode === 'string') {\n                    arr.push(reactNode.split(' ').length)\n                }\n            }\n\n            // TODO mb try checking if it's a react element\n            if (typeof nodeChildren === 'object') {\n                traverseNodesAndCountTokens(nodeChildren)\n            }\n            if (typeof nodeChildren === 'string') {\n                arr.push(nodeChildren.split(' ').length)\n            }\n\n            return arr\n        }\n\n        return traverseNodesAndCountTokens(children)\n    }, [children])\n\n    const totalTokens = useMemo(\n        () => tokenLengths.reduce((acc, curr) => acc + curr, 0),\n        [tokenLengths],\n    )\n\n    const nodex = useMemo(() => {\n        let tmpCurrentLoopTokenPos = 0\n        let tmpCurrentLoopNodePos = 0\n\n        const traverseNodesAndInjectAIWriter: any = (reactNode: any) => {\n            if (tmpCurrentLoopTokenPos > pos) {\n                return null\n            }\n\n            const nodeChildren = reactNode?.props?.children\n\n            if (Array.isArray(reactNode)) {\n                const joinedNodes: ReactNode[] = []\n                reactNode.forEach((node) => {\n                    if (typeof node === 'object') {\n                        joinedNodes.push(traverseNodesAndInjectAIWriter(node))\n                    } else if (typeof node === 'string') {\n                        tmpCurrentLoopTokenPos += node.split(' ').length\n                        tmpCurrentLoopNodePos++\n                        const [nodeIndex, currentNodePos] =\n                            getCurrentNodeOverflow(tokenLengths, pos)\n\n                        if (nodeIndex < tmpCurrentLoopNodePos) {\n                            joinedNodes.push(\n                                node.slice(\n                                    0,\n                                    getStringPosition(\n                                        node,\n                                        ' ',\n                                        currentNodePos,\n                                    ),\n                                ),\n                            )\n                        }\n\n                        joinedNodes.push(node)\n                    }\n                })\n\n                return joinedNodes\n            }\n\n            if (nodeChildren === undefined) {\n                if (typeof reactNode === 'string') {\n                    tmpCurrentLoopTokenPos += reactNode.split(' ').length\n                    tmpCurrentLoopNodePos++\n\n                    const [nodeIndex, currentNodePos] = getCurrentNodeOverflow(\n                        tokenLengths,\n                        pos,\n                    )\n\n                    if (nodeIndex < tmpCurrentLoopNodePos) {\n                        return reactNode.slice(\n                            0,\n                            getStringPosition(reactNode, ' ', currentNodePos),\n                        )\n                    }\n\n                    return reactNode\n                }\n            }\n\n            if (typeof nodeChildren === 'object') {\n                return createElement(\n                    reactNode.type,\n                    reactNode?.props,\n                    traverseNodesAndInjectAIWriter(nodeChildren),\n                )\n            }\n\n            if (typeof nodeChildren === 'string') {\n                tmpCurrentLoopTokenPos += nodeChildren.split(' ').length\n                tmpCurrentLoopNodePos++\n                const [nodeIndex, currentNodePos] = getCurrentNodeOverflow(\n                    tokenLengths,\n                    pos,\n                )\n\n                if (nodeIndex < tmpCurrentLoopNodePos) {\n                    return createElement(\n                        reactNode.type,\n                        reactNode?.props,\n                        nodeChildren.slice(\n                            0,\n                            getStringPosition(\n                                nodeChildren,\n                                ' ',\n                                currentNodePos,\n                            ),\n                        ),\n                    )\n                }\n\n                return reactNode\n            }\n        }\n\n        return traverseNodesAndInjectAIWriter(children)\n    }, [children, pos, tokenLengths])\n\n    useInterval(\n        () => {\n            setPos((prevPos) => {\n                if (prevPos + 1 >= totalTokens) {\n                    onFinish()\n                }\n\n                return prevPos + 1\n            })\n        },\n        totalTokens > pos ? delay : null,\n    )\n\n    useEffect(() => {\n        setPos(0)\n    }, [children])\n\n    return nodex\n}\n\nconst ChatCustomContent = ({\n    content = '',\n    triggerTyping,\n    onFinish,\n}: ChatCustomContentProps) => {\n    const finalContent = ReactHtmlParser(marked(content) as string)\n\n    return (\n        <>\n            {triggerTyping ? (\n                <AIWriter onFinish={onFinish}>{finalContent}</AIWriter>\n            ) : (\n                finalContent\n            )}\n        </>\n    )\n}\n\nexport default ChatCustomContent\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ChatCustomContent.js","sources":["../../../../../../../lib/@ecme/views/concepts/ai/Chat/components/ChatCustomContent.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { useState, useMemo, createElement, useEffect, ReactNode } from 'react'\nimport useInterval from '@/utils/hooks/useInterval '\nimport { getCurrentNodeOverflow, getStringPosition } from '../utils'\nimport ReactHtmlParser from 'html-react-parser'\nimport { marked } from 'marked'\nimport type { CommonProps } from '@/@types/common'\n\ntype ChatCustomContentProps = {\n    content: string\n    triggerTyping: boolean\n    onFinish?: () => void\n}\n\nconst AIWriter = ({\n    children,\n    delay = 25,\n    onFinish = () => {},\n}: CommonProps & { delay?: number; onFinish?: () => void }) => {\n    const [pos, setPos] = useState(0)\n\n    const tokenLengths = useMemo(() => {\n        const arr: number[] = []\n\n        const traverseNodesAndCountTokens = (reactNode: any) => {\n            const nodeChildren = reactNode?.props?.children\n\n            if (Array.isArray(reactNode)) {\n                reactNode.forEach((node) => {\n                    if (typeof node === 'object') {\n                        traverseNodesAndCountTokens(node)\n                    } else if (typeof node === 'string') {\n                        arr.push(node.split(' ').length)\n                    }\n                })\n            }\n\n            if (nodeChildren === undefined) {\n                if (typeof reactNode === 'string') {\n                    arr.push(reactNode.split(' ').length)\n                }\n            }\n\n            // TODO mb try checking if it's a react element\n            if (typeof nodeChildren === 'object') {\n                traverseNodesAndCountTokens(nodeChildren)\n            }\n            if (typeof nodeChildren === 'string') {\n                arr.push(nodeChildren.split(' ').length)\n            }\n\n            return arr\n        }\n\n        return traverseNodesAndCountTokens(children)\n    }, [children])\n\n    const totalTokens = useMemo(\n        () => tokenLengths.reduce((acc, curr) => acc + curr, 0),\n        [tokenLengths],\n    )\n\n    const nodex = useMemo(() => {\n        let tmpCurrentLoopTokenPos = 0\n        let tmpCurrentLoopNodePos = 0\n\n        const traverseNodesAndInjectAIWriter: any = (reactNode: any) => {\n            if (tmpCurrentLoopTokenPos > pos) {\n                return null\n            }\n\n            const nodeChildren = reactNode?.props?.children\n\n            if (Array.isArray(reactNode)) {\n                const joinedNodes: ReactNode[] = []\n                reactNode.forEach((node) => {\n                    if (typeof node === 'object') {\n                        joinedNodes.push(traverseNodesAndInjectAIWriter(node))\n                    } else if (typeof node === 'string') {\n                        tmpCurrentLoopTokenPos += node.split(' ').length\n                        tmpCurrentLoopNodePos++\n                        const [nodeIndex, currentNodePos] =\n                            getCurrentNodeOverflow(tokenLengths, pos)\n\n                        if (nodeIndex < tmpCurrentLoopNodePos) {\n                            joinedNodes.push(\n                                node.slice(\n                                    0,\n                                    getStringPosition(\n                                        node,\n                                        ' ',\n                                        currentNodePos,\n                                    ),\n                                ),\n                            )\n                        }\n\n                        joinedNodes.push(node)\n                    }\n                })\n\n                return joinedNodes\n            }\n\n            if (nodeChildren === undefined) {\n                if (typeof reactNode === 'string') {\n                    tmpCurrentLoopTokenPos += reactNode.split(' ').length\n                    tmpCurrentLoopNodePos++\n\n                    const [nodeIndex, currentNodePos] = getCurrentNodeOverflow(\n                        tokenLengths,\n                        pos,\n                    )\n\n                    if (nodeIndex < tmpCurrentLoopNodePos) {\n                        return reactNode.slice(\n                            0,\n                            getStringPosition(reactNode, ' ', currentNodePos),\n                        )\n                    }\n\n                    return reactNode\n                }\n            }\n\n            if (typeof nodeChildren === 'object') {\n                return createElement(\n                    reactNode.type,\n                    reactNode?.props,\n                    traverseNodesAndInjectAIWriter(nodeChildren),\n                )\n            }\n\n            if (typeof nodeChildren === 'string') {\n                tmpCurrentLoopTokenPos += nodeChildren.split(' ').length\n                tmpCurrentLoopNodePos++\n                const [nodeIndex, currentNodePos] = getCurrentNodeOverflow(\n                    tokenLengths,\n                    pos,\n                )\n\n                if (nodeIndex < tmpCurrentLoopNodePos) {\n                    return createElement(\n                        reactNode.type,\n                        reactNode?.props,\n                        nodeChildren.slice(\n                            0,\n                            getStringPosition(\n                                nodeChildren,\n                                ' ',\n                                currentNodePos,\n                            ),\n                        ),\n                    )\n                }\n\n                return reactNode\n            }\n        }\n\n        return traverseNodesAndInjectAIWriter(children)\n    }, [children, pos, tokenLengths])\n\n    useInterval(\n        () => {\n            setPos((prevPos) => {\n                if (prevPos + 1 >= totalTokens) {\n                    onFinish()\n                }\n\n                return prevPos + 1\n            })\n        },\n        totalTokens > pos ? delay : null,\n    )\n\n    useEffect(() => {\n        setPos(0)\n    }, [children])\n\n    return nodex\n}\n\nconst ChatCustomContent = ({\n    content = '',\n    triggerTyping,\n    onFinish,\n}: ChatCustomContentProps) => {\n    const finalContent = ReactHtmlParser(marked(content) as string)\n\n    return (\n        <>\n            {triggerTyping ? (\n                <AIWriter onFinish={onFinish}>{finalContent}</AIWriter>\n            ) : (\n                finalContent\n            )}\n        </>\n    )\n}\n\nexport default ChatCustomContent\n"],"names":[],"mappings":"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"}

package/dist/@ecme/views/concepts/ai/Chat/components/ChatHistory.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChatHistory.js","sources":["../../../../../../../lib/@ecme/views/concepts/ai/Chat/components/ChatHistory.tsx"],"sourcesContent":["import { Fragment } from 'react'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport ChatHistoryItem from './ChatHistoryItem'\nimport { usGenerativeChatStore } from '../store/generativeChatStore'\nimport { apiGetChatHistory } from '@/services/AiService'\n\nimport useSWR from 'swr'\nimport type { GetChatHistoryResponse } from '../types'\n\ntype ChatHistoryProps = {\n    queryText?: string\n    onClick?: () => void\n}\n\nconst ChatHistory = ({ queryText = '', onClick }: ChatHistoryProps) => {\n    const {\n        chatHistory,\n        setChatHistory,\n        setRenameDialog,\n        setSelectedConversation,\n        selectedConversation,\n    } = usGenerativeChatStore()\n\n    useSWR(\n        ['/api/ai/chat/history'],\n        () => apiGetChatHistory<GetChatHistoryResponse>(),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            revalidateOnReconnect: false,\n            onSuccess: (data) => {\n                setChatHistory(data)\n            },\n        },\n    )\n\n    const handleDelete = (id: string) => {\n        setChatHistory(chatHistory.filter((item) => item.id !== id))\n        setSelectedConversation('')\n    }\n\n    const handleArchive = (id: string) => {\n        setChatHistory(chatHistory.filter((item) => item.id !== id))\n        setSelectedConversation('')\n    }\n\n    const handleRename = (id: string, title: string) => {\n        setRenameDialog({\n            id,\n            title,\n            open: true,\n        })\n    }\n\n    const handleClick = (id: string) => {\n        setSelectedConversation(id)\n        onClick?.()\n    }\n\n    return (\n        <ScrollBar className=\"h-full\">\n            <div className=\"flex flex-col gap-2 py-2 px-3\">\n                {chatHistory\n                    .filter((item) =>\n                        item.title\n                            .toLowerCase()\n                            .includes(queryText.toLowerCase()),\n                    )\n                    .map((item) => {\n                        if (!item.enable) {\n                            return <Fragment key={item.id} />\n                        }\n                        return (\n                            <ChatHistoryItem\n                                key={item.id}\n                                data-testid={item.id}\n                                title={item.title}\n                                conversation={item.lastConversation}\n                                active={selectedConversation === item.id}\n                                onDelete={() => handleDelete(item.id)}\n                                onArchive={() => handleArchive(item.id)}\n                                onRename={() =>\n                                    handleRename(item.id, item.title)\n                                }\n                                onClick={() => handleClick(item.id)}\n                            />\n                        )\n                    })}\n            </div>\n        </ScrollBar>\n    )\n}\n\nexport default ChatHistory\n"],"names":[],"mappings":";;;;;;;;AAcA,MAAM,cAAc,CAAC,EAAE,YAAY,IAAI,cAAgC;AAC7D,QAAA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACA,sBAAsB;AAE1B;AAAA,IACI,CAAC,sBAAsB;AAAA,IACvB,MAAM,kBAA0C;AAAA,IAChD;AAAA,MACI,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB,uBAAuB;AAAA,MACvB,WAAW,CAAC,SAAS;AACjB,uBAAe,IAAI;AAAA,MAAA;AAAA,IACvB;AAAA,EAER;AAEM,QAAA,eAAe,CAAC,OAAe;AACjC,mBAAe,YAAY,OAAO,CAAC,SAAS,KAAK,OAAO,EAAE,CAAC;AAC3D,4BAAwB,EAAE;AAAA,EAC9B;AAEM,QAAA,gBAAgB,CAAC,OAAe;AAClC,mBAAe,YAAY,OAAO,CAAC,SAAS,KAAK,OAAO,EAAE,CAAC;AAC3D,4BAAwB,EAAE;AAAA,EAC9B;AAEM,QAAA,eAAe,CAAC,IAAY,UAAkB;AAChC,oBAAA;AAAA,MACZ;AAAA,MACA;AAAA,MACA,MAAM;AAAA,IAAA,CACT;AAAA,EACL;AAEM,QAAA,cAAc,CAAC,OAAe;AAChC,4BAAwB,EAAE;AAChB,cAAA;AAAA,EACd;AAGI,SAAA,oBAAC,aAAU,WAAU,UACjB,8BAAC,OAAI,EAAA,WAAU,iCACV,UACI,YAAA;AAAA,IAAO,CAAC,SACL,KAAK,MACA,cACA,SAAS,UAAU,YAAa,CAAA;AAAA,EAAA,EAExC,IAAI,CAAC,SAAS;AACP,QAAA,CAAC,KAAK,QAAQ;AACP,aAAA,oBAAC,UAAc,IAAA,KAAK,EAAI;AAAA,IAAA;AAG/B,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QAEG,eAAa,KAAK;AAAA,QAClB,OAAO,KAAK;AAAA,QACZ,cAAc,KAAK;AAAA,QACnB,QAAQ,yBAAyB,KAAK;AAAA,QACtC,UAAU,MAAM,aAAa,KAAK,EAAE;AAAA,QACpC,WAAW,MAAM,cAAc,KAAK,EAAE;AAAA,QACtC,UAAU,MACN,aAAa,KAAK,IAAI,KAAK,KAAK;AAAA,QAEpC,SAAS,MAAM,YAAY,KAAK,EAAE;AAAA,MAAA;AAAA,MAV7B,KAAK;AAAA,IAWd;AAAA,EAAA,CAEP,GACT,EACJ,CAAA;AAER;"}
+{"version":3,"file":"ChatHistory.js","sources":["../../../../../../../lib/@ecme/views/concepts/ai/Chat/components/ChatHistory.tsx"],"sourcesContent":["import { Fragment } from 'react'\nimport ScrollBar from '@/components/ui/ScrollBar'\nimport ChatHistoryItem from './ChatHistoryItem'\nimport { usGenerativeChatStore } from '../store/generativeChatStore'\nimport { apiGetChatHistory } from '@/services/AiService'\n\nimport useSWR from 'swr'\nimport type { GetChatHistoryResponse } from '../types'\n\ntype ChatHistoryProps = {\n    queryText?: string\n    onClick?: () => void\n}\n\nconst ChatHistory = ({ queryText = '', onClick }: ChatHistoryProps) => {\n    const {\n        chatHistory,\n        setChatHistory,\n        setRenameDialog,\n        setSelectedConversation,\n        selectedConversation,\n    } = usGenerativeChatStore()\n\n    useSWR(\n        ['/api/ai/chat/history'],\n        () => apiGetChatHistory<GetChatHistoryResponse>(),\n        {\n            revalidateOnFocus: false,\n            revalidateIfStale: false,\n            revalidateOnReconnect: false,\n            onSuccess: (data) => {\n                setChatHistory(data)\n            },\n        },\n    )\n\n    const handleDelete = (id: string) => {\n        setChatHistory(chatHistory.filter((item) => item.id !== id))\n        setSelectedConversation('')\n    }\n\n    const handleArchive = (id: string) => {\n        setChatHistory(chatHistory.filter((item) => item.id !== id))\n        setSelectedConversation('')\n    }\n\n    const handleRename = (id: string, title: string) => {\n        setRenameDialog({\n            id,\n            title,\n            open: true,\n        })\n    }\n\n    const handleClick = (id: string) => {\n        setSelectedConversation(id)\n        onClick?.()\n    }\n\n    return (\n        <ScrollBar className=\"h-full\">\n            <div className=\"flex flex-col gap-2 py-2 px-3\">\n                {chatHistory\n                    .filter((item) =>\n                        item.title\n                            .toLowerCase()\n                            .includes(queryText.toLowerCase()),\n                    )\n                    .map((item) => {\n                        if (!item.enable) {\n                            return <Fragment key={item.id} />\n                        }\n                        return (\n                            <ChatHistoryItem\n                                key={item.id}\n                                data-testid={item.id}\n                                title={item.title}\n                                conversation={item.lastConversation}\n                                active={selectedConversation === item.id}\n                                onDelete={() => handleDelete(item.id)}\n                                onArchive={() => handleArchive(item.id)}\n                                onRename={() =>\n                                    handleRename(item.id, item.title)\n                                }\n                                onClick={() => handleClick(item.id)}\n                            />\n                        )\n                    })}\n            </div>\n        </ScrollBar>\n    )\n}\n\nexport default ChatHistory\n"],"names":[],"mappings":";;;;;;;;AAcA,MAAM,cAAc,CAAC,EAAE,YAAY,IAAI,cAAgC;AACnE,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACA,sBAAA;AAEJ;AAAA,IACI,CAAC,sBAAsB;AAAA,IACvB,MAAM,kBAAA;AAAA,IACN;AAAA,MACI,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB,uBAAuB;AAAA,MACvB,WAAW,CAAC,SAAS;AACjB,uBAAe,IAAI;AAAA,MACvB;AAAA,IAAA;AAAA,EACJ;AAGJ,QAAM,eAAe,CAAC,OAAe;AACjC,mBAAe,YAAY,OAAO,CAAC,SAAS,KAAK,OAAO,EAAE,CAAC;AAC3D,4BAAwB,EAAE;AAAA,EAC9B;AAEA,QAAM,gBAAgB,CAAC,OAAe;AAClC,mBAAe,YAAY,OAAO,CAAC,SAAS,KAAK,OAAO,EAAE,CAAC;AAC3D,4BAAwB,EAAE;AAAA,EAC9B;AAEA,QAAM,eAAe,CAAC,IAAY,UAAkB;AAChD,oBAAgB;AAAA,MACZ;AAAA,MACA;AAAA,MACA,MAAM;AAAA,IAAA,CACT;AAAA,EACL;AAEA,QAAM,cAAc,CAAC,OAAe;AAChC,4BAAwB,EAAE;AAC1B,cAAA;AAAA,EACJ;AAEA,SACI,oBAAC,aAAU,WAAU,UACjB,8BAAC,OAAA,EAAI,WAAU,iCACV,UAAA,YACI;AAAA,IAAO,CAAC,SACL,KAAK,MACA,cACA,SAAS,UAAU,YAAA,CAAa;AAAA,EAAA,EAExC,IAAI,CAAC,SAAS;AACX,QAAI,CAAC,KAAK,QAAQ;AACd,aAAO,oBAAC,UAAA,IAAc,KAAK,EAAI;AAAA,IACnC;AACA,WACI;AAAA,MAAC;AAAA,MAAA;AAAA,QAEG,eAAa,KAAK;AAAA,QAClB,OAAO,KAAK;AAAA,QACZ,cAAc,KAAK;AAAA,QACnB,QAAQ,yBAAyB,KAAK;AAAA,QACtC,UAAU,MAAM,aAAa,KAAK,EAAE;AAAA,QACpC,WAAW,MAAM,cAAc,KAAK,EAAE;AAAA,QACtC,UAAU,MACN,aAAa,KAAK,IAAI,KAAK,KAAK;AAAA,QAEpC,SAAS,MAAM,YAAY,KAAK,EAAE;AAAA,MAAA;AAAA,MAV7B,KAAK;AAAA,IAAA;AAAA,EAatB,CAAC,GACT,GACJ;AAER;"}

package/dist/@ecme/views/concepts/ai/Chat/components/ChatHistoryItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChatHistoryItem.js","sources":["../../../../../../../lib/@ecme/views/concepts/ai/Chat/components/ChatHistoryItem.tsx"],"sourcesContent":["import { useState, useRef } from 'react'\nimport Dropdown from '@/components/ui/Dropdown'\nimport classNames from 'classnames'\nimport { TbDots, TbArchive, TbPencil, TbTrash } from 'react-icons/tb'\nimport type { DropdownRef } from '@/components/ui/Dropdown'\n\nimport type { MouseEvent, SyntheticEvent } from 'react'\n\ntype ChatHistoryItemProps = {\n    title: string\n    conversation: string\n    active?: boolean\n    onDelete?: () => void\n    onArchive?: () => void\n    onRename?: () => void\n    onClick?: () => void\n}\n\nconst ChatHistoryItem = (props: ChatHistoryItemProps) => {\n    const [dropdownOpen, setDropdownOpen] = useState(false)\n\n    const dropdownRef = useRef<DropdownRef>(null)\n\n    const {\n        title,\n        conversation,\n        active,\n        onRename,\n        onArchive,\n        onDelete,\n        onClick,\n        ...rest\n    } = props\n\n    const handleCallback = (\n        e: SyntheticEvent<Element, Event>,\n        callback?: () => void,\n    ) => {\n        e.stopPropagation()\n        callback?.()\n    }\n\n    const handleDropdownToggleClick = (e: MouseEvent) => {\n        e.stopPropagation()\n        dropdownRef.current?.handleDropdownOpen()\n    }\n\n    return (\n        <div\n            className={classNames(\n                'rounded-xl p-3 px-5 hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer group relative',\n                (dropdownOpen || active) && 'bg-gray-100 dark:bg-gray-700',\n            )}\n            onClick={onClick}\n            {...rest}\n        >\n            <div>\n                <div className=\"heading-text font-bold truncate\">{title}</div>\n                <div className=\"truncate\">{conversation}</div>\n            </div>\n            <div\n                className={classNames(\n                    'rounded-xl absolute bottom-0 top-0 to-transparent ltr:right-0 ltr:bg-gradient-to-l rtl:left-0 rtl:bg-gradient-to-r group-hover:from-gray-100 dark:group-hover:from-gray-700 w-8 from-0% group-hover:w-20 group-hover:from-60% flex items-center justify-end',\n                    dropdownOpen &&\n                        'from-gray-100 dark:from-gray-700 w-20 from-60%',\n                )}\n            >\n                <Dropdown\n                    ref={dropdownRef}\n                    placement=\"bottom-end\"\n                    renderTitle={\n                        <div\n                            className={classNames(\n                                'p-2 opacity-0 group-hover:opacity-100',\n                                dropdownOpen && 'opacity-100',\n                            )}\n                        >\n                            <TbDots\n                                className=\"text-xl\"\n                                onClick={handleDropdownToggleClick}\n                            />\n                        </div>\n                    }\n                    onOpen={(bool) => setDropdownOpen(bool)}\n                >\n                    <Dropdown.Item\n                        eventKey=\"rename\"\n                        onClick={(e) => handleCallback(e, onRename)}\n                    >\n                        <TbPencil className=\"text-xl\" />\n                        <span>Rename</span>\n                    </Dropdown.Item>\n                    <Dropdown.Item\n                        eventKey=\"rename\"\n                        onClick={(e) => handleCallback(e, onArchive)}\n                    >\n                        <TbArchive className=\"text-xl\" />\n                        <span>Archive</span>\n                    </Dropdown.Item>\n                    <Dropdown.Item\n                        className=\"text-error\"\n                        eventKey=\"rename\"\n                        onClick={(e) => handleCallback(e, onDelete)}\n                    >\n                        <TbTrash className=\"text-xl text-error\" />\n                        <span className=\"text-error\">Deleted</span>\n                    </Dropdown.Item>\n                </Dropdown>\n            </div>\n        </div>\n    )\n}\n\nexport default ChatHistoryItem\n"],"names":[],"mappings":";;;;;AAkBM,MAAA,kBAAkB,CAAC,UAAgC;AACrD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AAEhD,QAAA,cAAc,OAAoB,IAAI;AAEtC,QAAA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AAEE,QAAA,iBAAiB,CACnB,GACA,aACC;AACD,MAAE,gBAAgB;AACP,eAAA;AAAA,EACf;AAEM,QAAA,4BAA4B,CAAC,MAAkB;AACjD,MAAE,gBAAgB;AAClB,gBAAY,SAAS,mBAAmB;AAAA,EAC5C;AAGI,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW;AAAA,QACP;AAAA,SACC,gBAAgB,WAAW;AAAA,MAChC;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAA,qBAAC,OACG,EAAA,UAAA;AAAA,UAAC,oBAAA,OAAA,EAAI,WAAU,mCAAmC,UAAM,OAAA;AAAA,UACvD,oBAAA,OAAA,EAAI,WAAU,YAAY,UAAa,aAAA,CAAA;AAAA,QAAA,GAC5C;AAAA,QACA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAW;AAAA,cACP;AAAA,cACA,gBACI;AAAA,YACR;AAAA,YAEA,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACG,KAAK;AAAA,gBACL,WAAU;AAAA,gBACV,aACI;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACG,WAAW;AAAA,sBACP;AAAA,sBACA,gBAAgB;AAAA,oBACpB;AAAA,oBAEA,UAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACG,WAAU;AAAA,wBACV,SAAS;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACb;AAAA,gBACJ;AAAA,gBAEJ,QAAQ,CAAC,SAAS,gBAAgB,IAAI;AAAA,gBAEtC,UAAA;AAAA,kBAAA;AAAA,oBAAC,SAAS;AAAA,oBAAT;AAAA,sBACG,UAAS;AAAA,sBACT,SAAS,CAAC,MAAM,eAAe,GAAG,QAAQ;AAAA,sBAE1C,UAAA;AAAA,wBAAC,oBAAA,UAAA,EAAS,WAAU,UAAU,CAAA;AAAA,wBAC9B,oBAAC,UAAK,UAAM,SAAA,CAAA;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBAChB;AAAA,kBACA;AAAA,oBAAC,SAAS;AAAA,oBAAT;AAAA,sBACG,UAAS;AAAA,sBACT,SAAS,CAAC,MAAM,eAAe,GAAG,SAAS;AAAA,sBAE3C,UAAA;AAAA,wBAAC,oBAAA,WAAA,EAAU,WAAU,UAAU,CAAA;AAAA,wBAC/B,oBAAC,UAAK,UAAO,UAAA,CAAA;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACjB;AAAA,kBACA;AAAA,oBAAC,SAAS;AAAA,oBAAT;AAAA,sBACG,WAAU;AAAA,sBACV,UAAS;AAAA,sBACT,SAAS,CAAC,MAAM,eAAe,GAAG,QAAQ;AAAA,sBAE1C,UAAA;AAAA,wBAAC,oBAAA,SAAA,EAAQ,WAAU,qBAAqB,CAAA;AAAA,wBACvC,oBAAA,QAAA,EAAK,WAAU,cAAa,UAAO,UAAA,CAAA;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACxC;AAAA,cAAA;AAAA,YAAA;AAAA,UACJ;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EACJ;AAER;"}
+{"version":3,"file":"ChatHistoryItem.js","sources":["../../../../../../../lib/@ecme/views/concepts/ai/Chat/components/ChatHistoryItem.tsx"],"sourcesContent":["import { useState, useRef } from 'react'\nimport Dropdown from '@/components/ui/Dropdown'\nimport classNames from 'classnames'\nimport { TbDots, TbArchive, TbPencil, TbTrash } from 'react-icons/tb'\nimport type { DropdownRef } from '@/components/ui/Dropdown'\n\nimport type { MouseEvent, SyntheticEvent } from 'react'\n\ntype ChatHistoryItemProps = {\n    title: string\n    conversation: string\n    active?: boolean\n    onDelete?: () => void\n    onArchive?: () => void\n    onRename?: () => void\n    onClick?: () => void\n}\n\nconst ChatHistoryItem = (props: ChatHistoryItemProps) => {\n    const [dropdownOpen, setDropdownOpen] = useState(false)\n\n    const dropdownRef = useRef<DropdownRef>(null)\n\n    const {\n        title,\n        conversation,\n        active,\n        onRename,\n        onArchive,\n        onDelete,\n        onClick,\n        ...rest\n    } = props\n\n    const handleCallback = (\n        e: SyntheticEvent<Element, Event>,\n        callback?: () => void,\n    ) => {\n        e.stopPropagation()\n        callback?.()\n    }\n\n    const handleDropdownToggleClick = (e: MouseEvent) => {\n        e.stopPropagation()\n        dropdownRef.current?.handleDropdownOpen()\n    }\n\n    return (\n        <div\n            className={classNames(\n                'rounded-xl p-3 px-5 hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer group relative',\n                (dropdownOpen || active) && 'bg-gray-100 dark:bg-gray-700',\n            )}\n            onClick={onClick}\n            {...rest}\n        >\n            <div>\n                <div className=\"heading-text font-bold truncate\">{title}</div>\n                <div className=\"truncate\">{conversation}</div>\n            </div>\n            <div\n                className={classNames(\n                    'rounded-xl absolute bottom-0 top-0 to-transparent ltr:right-0 ltr:bg-gradient-to-l rtl:left-0 rtl:bg-gradient-to-r group-hover:from-gray-100 dark:group-hover:from-gray-700 w-8 from-0% group-hover:w-20 group-hover:from-60% flex items-center justify-end',\n                    dropdownOpen &&\n                        'from-gray-100 dark:from-gray-700 w-20 from-60%',\n                )}\n            >\n                <Dropdown\n                    ref={dropdownRef}\n                    placement=\"bottom-end\"\n                    renderTitle={\n                        <div\n                            className={classNames(\n                                'p-2 opacity-0 group-hover:opacity-100',\n                                dropdownOpen && 'opacity-100',\n                            )}\n                        >\n                            <TbDots\n                                className=\"text-xl\"\n                                onClick={handleDropdownToggleClick}\n                            />\n                        </div>\n                    }\n                    onOpen={(bool) => setDropdownOpen(bool)}\n                >\n                    <Dropdown.Item\n                        eventKey=\"rename\"\n                        onClick={(e) => handleCallback(e, onRename)}\n                    >\n                        <TbPencil className=\"text-xl\" />\n                        <span>Rename</span>\n                    </Dropdown.Item>\n                    <Dropdown.Item\n                        eventKey=\"rename\"\n                        onClick={(e) => handleCallback(e, onArchive)}\n                    >\n                        <TbArchive className=\"text-xl\" />\n                        <span>Archive</span>\n                    </Dropdown.Item>\n                    <Dropdown.Item\n                        className=\"text-error\"\n                        eventKey=\"rename\"\n                        onClick={(e) => handleCallback(e, onDelete)}\n                    >\n                        <TbTrash className=\"text-xl text-error\" />\n                        <span className=\"text-error\">Deleted</span>\n                    </Dropdown.Item>\n                </Dropdown>\n            </div>\n        </div>\n    )\n}\n\nexport default ChatHistoryItem\n"],"names":[],"mappings":";;;;;AAkBA,MAAM,kBAAkB,CAAC,UAAgC;AACrD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AAEtD,QAAM,cAAc,OAAoB,IAAI;AAE5C,QAAM;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AAEJ,QAAM,iBAAiB,CACnB,GACA,aACC;AACD,MAAE,gBAAA;AACF,eAAA;AAAA,EACJ;AAEA,QAAM,4BAA4B,CAAC,MAAkB;AACjD,MAAE,gBAAA;AACF,gBAAY,SAAS,mBAAA;AAAA,EACzB;AAEA,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW;AAAA,QACP;AAAA,SACC,gBAAgB,WAAW;AAAA,MAAA;AAAA,MAEhC;AAAA,MACC,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAA,qBAAC,OAAA,EACG,UAAA;AAAA,UAAA,oBAAC,OAAA,EAAI,WAAU,mCAAmC,UAAA,OAAM;AAAA,UACxD,oBAAC,OAAA,EAAI,WAAU,YAAY,UAAA,aAAA,CAAa;AAAA,QAAA,GAC5C;AAAA,QACA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAW;AAAA,cACP;AAAA,cACA,gBACI;AAAA,YAAA;AAAA,YAGR,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACG,KAAK;AAAA,gBACL,WAAU;AAAA,gBACV,aACI;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACG,WAAW;AAAA,sBACP;AAAA,sBACA,gBAAgB;AAAA,oBAAA;AAAA,oBAGpB,UAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACG,WAAU;AAAA,wBACV,SAAS;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACb;AAAA,gBAAA;AAAA,gBAGR,QAAQ,CAAC,SAAS,gBAAgB,IAAI;AAAA,gBAEtC,UAAA;AAAA,kBAAA;AAAA,oBAAC,SAAS;AAAA,oBAAT;AAAA,sBACG,UAAS;AAAA,sBACT,SAAS,CAAC,MAAM,eAAe,GAAG,QAAQ;AAAA,sBAE1C,UAAA;AAAA,wBAAA,oBAAC,UAAA,EAAS,WAAU,UAAA,CAAU;AAAA,wBAC9B,oBAAC,UAAK,UAAA,SAAA,CAAM;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBAAA;AAAA,kBAEhB;AAAA,oBAAC,SAAS;AAAA,oBAAT;AAAA,sBACG,UAAS;AAAA,sBACT,SAAS,CAAC,MAAM,eAAe,GAAG,SAAS;AAAA,sBAE3C,UAAA;AAAA,wBAAA,oBAAC,WAAA,EAAU,WAAU,UAAA,CAAU;AAAA,wBAC/B,oBAAC,UAAK,UAAA,UAAA,CAAO;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBAAA;AAAA,kBAEjB;AAAA,oBAAC,SAAS;AAAA,oBAAT;AAAA,sBACG,WAAU;AAAA,sBACV,UAAS;AAAA,sBACT,SAAS,CAAC,MAAM,eAAe,GAAG,QAAQ;AAAA,sBAE1C,UAAA;AAAA,wBAAA,oBAAC,SAAA,EAAQ,WAAU,qBAAA,CAAqB;AAAA,wBACxC,oBAAC,QAAA,EAAK,WAAU,cAAa,UAAA,UAAA,CAAO;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACxC;AAAA,cAAA;AAAA,YAAA;AAAA,UACJ;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAAA;AAGZ;"}