@antscorp/antsomi-ui 2.0.13 → 2.0.15

package/es/components/organism/TicketEditor/Content.js

@@ -1,15 +1,5 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React, { useMemo, useEffect, useRef, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useEffect, useRef, useState } from 'react';
 import { Editor } from '@tinymce/tinymce-react';
 import { Helmet } from 'react-helmet';
 import dayjs from 'dayjs';
@@ -35,7 +25,6 @@ const initValueInput = {
     referenceUrl: window.location.href,
 };
 const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers, domainTicket, config, ticketDetails, listComment, userId, fetchgetTicketComments, isLoadingComment, handleCloseDrawer, setIsSuccessCreated, isLoadingDetails, isLoadingDataSouce, accountManage, timeZone, isLoadingSelectedAccount, accountEdit, initOwnerId, isAllAccount, setDrawerHeader, openDrawer, dataSelectInput, setDataSelectInput, }) => {
-    var _a, _b, _c, _d;
     const [isOpenToast, setIsOpenToast] = useState({
         isOpen: false,
         status: 'error',
@@ -73,7 +62,11 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
     //   return true
     // }, [valueInput])
     const updateValueInput = value => {
-        setValueInput(prev => (Object.assign(Object.assign(Object.assign({}, prev), value), { isChanged: true })));
+        setValueInput(prev => ({
+            ...prev,
+            ...value,
+            isChanged: true,
+        }));
     };
     const handleOnchangeInput = e => {
         const { name, value } = e.target;
@@ -84,7 +77,7 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
     const fetchCreateTicket = params => {
         setIsLoading(true);
         Service.tickets.callApi
-            .createTicket(Object.assign(Object.assign({}, params), { networkId: Number(portalId) }), domainTicket, token, config, userId)
+            .createTicket({ ...params, networkId: Number(portalId) }, domainTicket, token, config, userId)
             .then(res => {
             setIsLoading(false);
             if (res.code === 200) {
@@ -118,7 +111,7 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
         else {
             if (!errFile.isError) {
                 const params = formatParams(valueInputRef.current);
-                fetchCreateTicket(Object.assign(Object.assign({}, params), { submitterId: Number(userId) }));
+                fetchCreateTicket({ ...params, submitterId: Number(userId) });
             }
             // handleSendData(valueInput)
         }
@@ -158,8 +151,8 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
         if (!isUpdate) {
             const newFollowers = [];
             let newOwnerIds = [];
-            if ((accountManage === null || accountManage === void 0 ? void 0 : accountManage.length) > 0 && listUsers) {
-                accountManage === null || accountManage === void 0 ? void 0 : accountManage.forEach(acc => {
+            if (accountManage?.length > 0 && listUsers) {
+                accountManage?.forEach(acc => {
                     listUsers.forEach(user => {
                         if (acc === user.userId) {
                             newFollowers.push(user);
@@ -168,9 +161,9 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
                 });
             }
             if ((!isAllAccount || accountEdit !== 4) &&
-                (listUsers === null || listUsers === void 0 ? void 0 : listUsers.length) > 0 &&
+                listUsers?.length > 0 &&
                 (initOwnerId || userId)) {
-                newOwnerIds = listUsers === null || listUsers === void 0 ? void 0 : listUsers.filter(user => user.userId === Number(initOwnerId || userId));
+                newOwnerIds = listUsers?.filter(user => user.userId === Number(initOwnerId || userId));
             }
             updateValueInput({ ownerId: newOwnerIds, followers: newFollowers });
         }
@@ -187,10 +180,9 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
         Service.tickets.callApi
             .getCustomFields({}, domainTicket, token, config, userId, 'get-custom-fields')
             .then(res => {
-            var _a, _b;
             if (res.code === 200) {
-                setDataSelect((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.fields);
-                setDataSelectInput((_b = res === null || res === void 0 ? void 0 : res.data) === null || _b === void 0 ? void 0 : _b.fields);
+                setDataSelect(res?.data?.fields);
+                setDataSelectInput(res?.data?.fields);
             }
         })
             .catch(err => {
@@ -230,13 +222,12 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
         });
     };
     useEffect(() => {
-        var _a;
-        if (((_a = Object.keys(ticketDetails)) === null || _a === void 0 ? void 0 : _a.length) &&
+        if (Object.keys(ticketDetails)?.length &&
             isUpdate &&
-            (listUsers === null || listUsers === void 0 ? void 0 : listUsers.length) &&
-            (dataSelects === null || dataSelects === void 0 ? void 0 : dataSelects.length)) {
-            const _b = formatDatarender(ticketDetails, dataSelects, listUsers), { category, feature, followers, ownerId, priority, ticketType, title, referenceUrl } = _b, rests = __rest(_b, ["category", "feature", "followers", "ownerId", "priority", "ticketType", "title", "referenceUrl"]);
-            if ((ownerId === null || ownerId === void 0 ? void 0 : ownerId.length) > 0) {
+            listUsers?.length &&
+            dataSelects?.length) {
+            const { category, feature, followers, ownerId, priority, ticketType, title, referenceUrl, ...rests } = formatDatarender(ticketDetails, dataSelects, listUsers);
+            if (ownerId?.length > 0) {
                 updateValueInput({
                     category,
                     feature,
@@ -274,13 +265,12 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
         const params = {
             followers: [],
         };
-        if (arrFolowers === null || arrFolowers === void 0 ? void 0 : arrFolowers.length) {
+        if (arrFolowers?.length) {
             params.followers = arrFolowers;
         }
         fetchUpdateFollwers(params);
     };
     const handleUpdateComment = () => {
-        var _a, _b, _c, _d, _e;
         setIsLoading(true);
         const params = {
             followers: [],
@@ -289,17 +279,17 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
             attachments: [],
             message: '',
         };
-        if ((_a = valueInput === null || valueInput === void 0 ? void 0 : valueInput.followers) === null || _a === void 0 ? void 0 : _a.length) {
-            params.followers = formatAccountId(valueInput === null || valueInput === void 0 ? void 0 : valueInput.followers);
+        if (valueInput?.followers?.length) {
+            params.followers = formatAccountId(valueInput?.followers);
         }
-        if (((_b = valueInput === null || valueInput === void 0 ? void 0 : valueInput.files) === null || _b === void 0 ? void 0 : _b.length) > 0) {
-            params.attachments = (_c = valueInput === null || valueInput === void 0 ? void 0 : valueInput.files) === null || _c === void 0 ? void 0 : _c.map((file) => file.token);
+        if (valueInput?.files?.length > 0) {
+            params.attachments = valueInput?.files?.map((file) => file.token);
         }
         params.submitterId = userId;
-        params.ownerId = Number((_d = valueInput === null || valueInput === void 0 ? void 0 : valueInput.ownerId[0]) === null || _d === void 0 ? void 0 : _d.userId);
-        params.message = valueInput === null || valueInput === void 0 ? void 0 : valueInput.message;
+        params.ownerId = Number(valueInput?.ownerId[0]?.userId);
+        params.message = valueInput?.message;
         fetchUpdateComment(params);
-        handleUpdateFollowers((_e = valueInput === null || valueInput === void 0 ? void 0 : valueInput.followers) === null || _e === void 0 ? void 0 : _e.map((fol) => fol.userId));
+        handleUpdateFollowers(valueInput?.followers?.map((fol) => fol.userId));
     };
     const handleUploadFile = params => {
         setIsLoading(true);
@@ -319,7 +309,7 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
     useEffect(() => {
         const timeOut = setTimeout(() => {
             if (isOpenToast.isOpen) {
-                setIsOpenToast(Object.assign(Object.assign({}, isOpenToast), { isOpen: false }));
+                setIsOpenToast({ ...isOpenToast, isOpen: false });
             }
         }, 1000);
         return () => {
@@ -327,9 +317,8 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
         };
     }, [isOpenToast]);
     const handleOnchangeFile = e => {
-        var _a, _b;
         const limitSize = 50 * 1024 * 1024;
-        const sizeFile = (_b = (_a = e.target) === null || _a === void 0 ? void 0 : _a.files[0]) === null || _b === void 0 ? void 0 : _b.size;
+        const sizeFile = e.target?.files[0]?.size;
         if (sizeFile >= limitSize) {
             setErrFile({
                 isError: true,
@@ -351,118 +340,69 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
     };
     const handleRemoveFile = token => {
         let newListFile = valueInput.files;
-        newListFile = newListFile.filter((list) => (list === null || list === void 0 ? void 0 : list.token) !== token);
+        newListFile = newListFile.filter((list) => list?.token !== token);
         updateValueInput({ files: newListFile });
     };
     const handleCloseSnackbar = () => {
-        setIsOpenToast(Object.assign(Object.assign({}, isOpenToast), { isOpen: false }));
+        setIsOpenToast({ ...isOpenToast, isOpen: false });
     };
-    return (React.createElement("div", { style: { height: '100%' } },
-        React.createElement(Helmet, null,
-            React.createElement("meta", { charSet: "utf-8" }),
-            React.createElement("title", null, browserTitle)),
-        React.createElement(Spin, { style: { height: '100vh' }, spinning: isLoading ||
-                isLoadingDetails ||
-                isLoadingDataSouce ||
-                isLoadingFollower ||
-                isLoadingSelectedAccount },
-            React.createElement(DrawerHeader, null,
-                React.createElement(EditableName, { value: valueInput.title, onChange: handleOnchangeTitle, readonly: isUpdate, error: isEmptyField && (!valueInput.title || !valueInput.title.trim())
-                        ? "Title can't be empty"
-                        : '' }),
-                React.createElement("div", { id: "header-journey-right", className: "right-content" }, !isUpdate && (React.createElement(Button, { type: "primary", onClick: handleSubmit }, "Save")))),
-            React.createElement(WrapperContent, { style: { height: '100%' } },
-                React.createElement(WrapperLeftContent, null,
-                    React.createElement(WrapperContentInput, { style: { alignItems: 'flex-start' } },
-                        React.createElement(WrapperLable, null,
-                            "Owner",
-                            React.createElement("span", { style: { color: '#ff0000' } }, "*")),
-                        React.createElement("div", null,
-                            React.createElement(SelectAccount, { type: "default", initData: ((valueInput === null || valueInput === void 0 ? void 0 : valueInput.ownerId) || []).map((item) => item.userId), nameKey: "userName", userIdKey: "userId", users: listUsers, isViewMode: isUpdate || !isAllAccount || accountEdit !== 4, onChange: (_, users) => updateValueInput({ ownerId: users }), onlyOne: true }),
-                            isEmptyField && !((_a = valueInput === null || valueInput === void 0 ? void 0 : valueInput.ownerId) === null || _a === void 0 ? void 0 : _a.length) && (React.createElement("div", { className: "error-message" }, "*This field can't be empty")))),
-                    React.createElement(WrapperContentInput, { style: { marginTop: '15px', alignItems: 'flex-start' } },
-                        React.createElement(WrapperLable, null, "Follower(s)"),
-                        React.createElement(SelectAccount, { type: "default", initData: [
-                                ...accountManage,
-                                ...((valueInput === null || valueInput === void 0 ? void 0 : valueInput.followers) || []).map((item) => item.userId),
-                            ], nameKey: "userName", userIdKey: "userId", users: listUsers, disabledAccount: accountManage, onChange: (_, followers) => updateValueInput({ followers }) })), dataSelects === null || dataSelects === void 0 ? void 0 :
-                    dataSelects.map((data) => {
-                        var _a, _b, _c;
-                        return (
-                        // eslint-disable-next-line react/jsx-key
-                        React.createElement(WrapperContentInput, { key: data.id, style: { marginTop: '15px' } },
-                            React.createElement(WrapperLable, null, data.title),
-                            React.createElement("div", { style: { flex: 1 } }, isUpdate ? (React.createElement(WrapperTextEdit, null, !((_b = (_a = valueInput[data === null || data === void 0 ? void 0 : data.value]) === null || _a === void 0 ? void 0 : _a.name) === null || _b === void 0 ? void 0 : _b.length)
-                                ? '--'
-                                : (_c = valueInput[data === null || data === void 0 ? void 0 : data.value]) === null || _c === void 0 ? void 0 : _c.name)) : (React.createElement(DropdownComponent, { data: data.field_options, setValueInput: updateValueInput, valueInput: valueInput, type: data.value, isUpdate: isUpdate, title: data.title })))));
-                    }),
-                    React.createElement(WrapperContentInput, { style: { marginTop: '15px' } },
-                        React.createElement(WrapperLable, { htmlFor: "referenceUrl" }, "Reference URL"),
-                        isUpdate ? (valueInput.referenceUrl ? (React.createElement(Tooltip, { title: valueInput.referenceUrl, placement: "top" },
-                            React.createElement(WrapperTextEdit, { color: "#005fb8", href: valueInput.referenceUrl, target: "_blank" }, valueInput.referenceUrl))) : (React.createElement(WrapperTextEdit, { color: "#005fb8", href: valueInput.referenceUrl, target: "_blank" }, valueInput.referenceUrl))) : (React.createElement(WrapperTextInput, { placeholder: "Reference URL", id: "referenceUrl", 
-                            // width="300px"
-                            onChange: handleOnchangeInput, name: "referenceUrl", value: valueInput.referenceUrl })))),
-                React.createElement(WrapperRightContent, null,
-                    React.createElement(WrapperEditor, null,
-                        React.createElement("div", null,
-                            React.createElement(Editor, { apiKey: apiKey, 
-                                // placeholder="Enter your comment..."
-                                value: textValue, init: {
-                                    height: 200,
-                                    width: '100%',
-                                    max_height: 800,
-                                    max_width: 800,
-                                    menubar: false,
-                                    plugins: [
-                                        'advlist autolink lists link tinydrive image emoticons charmap print preview anchor',
-                                        'searchreplace visualblocks code fullscreen',
-                                        'insertdatetime media paste code help wordcount ', //
-                                    ],
-                                    toolbar: 'formatselect | bold italic underline strikethrough code | image emoticons | \
+    return (_jsxs("div", { style: { height: '100%' }, children: [_jsxs(Helmet, { children: [_jsx("meta", { charSet: "utf-8" }), _jsx("title", { children: browserTitle })] }), _jsxs(Spin, { style: { height: '100vh' }, spinning: isLoading ||
+                    isLoadingDetails ||
+                    isLoadingDataSouce ||
+                    isLoadingFollower ||
+                    isLoadingSelectedAccount, children: [_jsxs(DrawerHeader, { children: [_jsx(EditableName, { value: valueInput.title, onChange: handleOnchangeTitle, readonly: isUpdate, error: isEmptyField && (!valueInput.title || !valueInput.title.trim())
+                                    ? "Title can't be empty"
+                                    : '' }), _jsx("div", { id: "header-journey-right", className: "right-content", children: !isUpdate && (_jsx(Button, { type: "primary", onClick: handleSubmit, children: "Save" })) })] }), _jsxs(WrapperContent, { style: { height: '100%' }, children: [_jsxs(WrapperLeftContent, { children: [_jsxs(WrapperContentInput, { style: { alignItems: 'flex-start' }, children: [_jsxs(WrapperLable, { children: ["Owner", _jsx("span", { style: { color: '#ff0000' }, children: "*" })] }), _jsxs("div", { children: [_jsx(SelectAccount, { type: "default", initData: (valueInput?.ownerId || []).map((item) => item.userId), nameKey: "userName", userIdKey: "userId", users: listUsers, isViewMode: isUpdate || !isAllAccount || accountEdit !== 4, onChange: (_, users) => updateValueInput({ ownerId: users }), onlyOne: true }), isEmptyField && !valueInput?.ownerId?.length && (_jsx("div", { className: "error-message", children: "*This field can't be empty" }))] })] }), _jsxs(WrapperContentInput, { style: { marginTop: '15px', alignItems: 'flex-start' }, children: [_jsx(WrapperLable, { children: "Follower(s)" }), _jsx(SelectAccount, { type: "default", initData: [
+                                                    ...accountManage,
+                                                    ...(valueInput?.followers || []).map((item) => item.userId),
+                                                ], nameKey: "userName", userIdKey: "userId", users: listUsers, disabledAccount: accountManage, onChange: (_, followers) => updateValueInput({ followers }) })] }), dataSelects?.map((data) => (
+                                    // eslint-disable-next-line react/jsx-key
+                                    _jsxs(WrapperContentInput, { style: { marginTop: '15px' }, children: [_jsx(WrapperLable, { children: data.title }), _jsx("div", { style: { flex: 1 }, children: isUpdate ? (_jsx(WrapperTextEdit, { children: !valueInput[data?.value]?.name?.length
+                                                        ? '--'
+                                                        : valueInput[data?.value]?.name })) : (_jsx(DropdownComponent, { data: data.field_options, setValueInput: updateValueInput, valueInput: valueInput, type: data.value, isUpdate: isUpdate, title: data.title })) })] }, data.id))), _jsxs(WrapperContentInput, { style: { marginTop: '15px' }, children: [_jsx(WrapperLable, { htmlFor: "referenceUrl", children: "Reference URL" }), isUpdate ? (valueInput.referenceUrl ? (_jsx(Tooltip, { title: valueInput.referenceUrl, placement: "top", children: _jsx(WrapperTextEdit, { color: "#005fb8", href: valueInput.referenceUrl, target: "_blank", children: valueInput.referenceUrl }) })) : (_jsx(WrapperTextEdit, { color: "#005fb8", href: valueInput.referenceUrl, target: "_blank", children: valueInput.referenceUrl }))) : (_jsx(WrapperTextInput, { placeholder: "Reference URL", id: "referenceUrl", 
+                                                // width="300px"
+                                                onChange: handleOnchangeInput, name: "referenceUrl", value: valueInput.referenceUrl }))] })] }), _jsxs(WrapperRightContent, { children: [_jsxs(WrapperEditor, { children: [_jsxs("div", { children: [_jsx(Editor, { apiKey: apiKey, 
+                                                        // placeholder="Enter your comment..."
+                                                        value: textValue, init: {
+                                                            height: 238,
+                                                            width: '100%',
+                                                            max_height: 800,
+                                                            max_width: 800,
+                                                            menubar: false,
+                                                            plugins: [
+                                                                'advlist autolink lists link tinydrive image emoticons charmap print preview anchor',
+                                                                'searchreplace visualblocks code fullscreen',
+                                                                'insertdatetime media paste code help wordcount ', //
+                                                            ],
+                                                            toolbar: 'formatselect | bold italic underline strikethrough code | image emoticons | \
                                   forecolor backcolor preview link |\
                                   alignleft aligncenter alignright alignjustify outdent indent |\
                                   numlist bullist checklist undo redo',
-                                    tinydrive_token_provider: `//${domain}/hub/thirdparty-services/v2.0/tinymce?portalId=${portalId}&token=${token}`,
-                                    skin: 'snow',
-                                    toolbar_mode: 'sliding',
-                                    content_css: false,
-                                    branding: false,
-                                    resize: false,
-                                    statusbar: false,
-                                    setup(editor) {
-                                        editor.on('init', e => {
-                                            editor.getBody().style.fontSize = '12px';
-                                        });
-                                    },
-                                    placeholder: 'Enter your comment...',
-                                    entity_encoding: 'raw',
-                                    paste_data_images: true,
-                                }, 
-                                // disabled={!!props.disabled}
-                                // outputFormat='text'
-                                onEditorChange: handleEditorChange }),
-                            React.createElement("div", null,
-                                ((_b = valueInput.files) === null || _b === void 0 ? void 0 : _b.length) > 0 && (React.createElement(WrapperLinkItemFiles, null, (_c = valueInput.files) === null || _c === void 0 ? void 0 : _c.map((file) => (React.createElement("div", { className: "file-item", key: file === null || file === void 0 ? void 0 : file.token },
-                                    React.createElement("div", { className: "file-name-group" },
-                                        React.createElement(Icon, { className: "file-icon", type: "icon-ants-attachment" }),
-                                        React.createElement(Tooltip, { title: file === null || file === void 0 ? void 0 : file.file_name },
-                                            React.createElement("span", { className: "file-name" }, file === null || file === void 0 ? void 0 : file.file_name))),
-                                    React.createElement(Icon, { onClick: () => handleRemoveFile(file === null || file === void 0 ? void 0 : file.token), className: "remove-btn", type: "icon-ants-remove-slim" })))))),
-                                React.createElement(WrapperIconEditor, { borderTop: !!((_d = valueInput.files) === null || _d === void 0 ? void 0 : _d.length) },
-                                    React.createElement(WrapperInputFile, null,
-                                        React.createElement("label", { htmlFor: "fileImage", className: "upload-wrapper-label" },
-                                            React.createElement(Icon, { type: "icon-ants-attachment", className: "upload-icon" })),
-                                        React.createElement("input", { type: "file", style: { position: 'absolute', top: 0, right: 0, display: 'none' }, name: "fileImage", id: "fileImage", onChange: handleOnchangeFile })),
-                                    isUpdate && (React.createElement(Button, { type: "primary", disabled: !handleValidateContent(textValue) || isLoadingUpload, className: "reply-btn", style: {
-                                            background: `${!handleValidateContent(textValue) || isLoadingUpload
-                                                ? '#ccc'
-                                                : '#1f5fac'}`,
-                                        }, onClick: handleUpdateComment, loading: isLoadingUpload }, "Reply"))))),
-                        errFile.isError ? (React.createElement("div", { className: "error-message" }, errFile.message)) : (isEmptyField &&
-                            !(valueInput === null || valueInput === void 0 ? void 0 : valueInput.message) && (React.createElement("div", { className: "error-message" }, "*This field can't be empty")))),
-                    isUpdate && (React.createElement(Spin, { spinning: isLoadingComment },
-                        React.createElement(WrapperMessageContent, null, listComment === null || listComment === void 0 ? void 0 : listComment.map(comment => (React.createElement(MessageComponent, { key: comment === null || comment === void 0 ? void 0 : comment.id, toUser: comment === null || comment === void 0 ? void 0 : comment.toUser, fromUser: comment === null || comment === void 0 ? void 0 : comment.fromUser, followers: comment === null || comment === void 0 ? void 0 : comment.followers, 
-                            // mailFollower={comment?.mailFollower}
-                            message: comment === null || comment === void 0 ? void 0 : comment.message, date: comment === null || comment === void 0 ? void 0 : comment.createdDate, attachments: comment === null || comment === void 0 ? void 0 : comment.attachments, timeZone: timeZone })))))))))));
+                                                            tinydrive_token_provider: `//${domain}/hub/thirdparty-services/v2.0/tinymce?portalId=${portalId}&token=${token}`,
+                                                            skin: 'snow',
+                                                            toolbar_mode: 'sliding',
+                                                            content_css: false,
+                                                            branding: false,
+                                                            resize: false,
+                                                            statusbar: false,
+                                                            setup(editor) {
+                                                                editor.on('init', e => {
+                                                                    editor.getBody().style.fontSize = '12px';
+                                                                });
+                                                            },
+                                                            placeholder: 'Enter your comment...',
+                                                            entity_encoding: 'raw',
+                                                            paste_data_images: true,
+                                                        }, 
+                                                        // disabled={!!props.disabled}
+                                                        // outputFormat='text'
+                                                        onEditorChange: handleEditorChange }), _jsxs("div", { children: [valueInput.files?.length > 0 && (_jsx(WrapperLinkItemFiles, { children: valueInput.files?.map((file) => (_jsxs("div", { className: "file-item", children: [_jsxs("div", { className: "file-name-group", children: [_jsx(Icon, { className: "file-icon", type: "icon-ants-attachment" }), _jsx(Tooltip, { title: file?.file_name, children: _jsx("span", { className: "file-name", children: file?.file_name }) })] }), _jsx(Icon, { onClick: () => handleRemoveFile(file?.token), className: "remove-btn", type: "icon-ants-remove-slim" })] }, file?.token))) })), _jsxs(WrapperIconEditor, { borderTop: !!valueInput.files?.length, children: [_jsxs(WrapperInputFile, { children: [_jsx("label", { htmlFor: "fileImage", className: "upload-wrapper-label", children: _jsx(Icon, { type: "icon-ants-attachment", className: "upload-icon" }) }), _jsx("input", { type: "file", style: { position: 'absolute', top: 0, right: 0, display: 'none' }, name: "fileImage", id: "fileImage", onChange: handleOnchangeFile })] }), isUpdate && (_jsx(Button, { type: "primary", disabled: !handleValidateContent(textValue) || isLoadingUpload, className: "reply-btn", style: {
+                                                                            background: `${!handleValidateContent(textValue) || isLoadingUpload
+                                                                                ? '#ccc'
+                                                                                : '#1f5fac'}`,
+                                                                        }, onClick: handleUpdateComment, loading: isLoadingUpload, children: "Reply" }))] })] })] }), errFile.isError ? (_jsx("div", { className: "error-message", children: errFile.message })) : (isEmptyField &&
+                                                !valueInput?.message && (_jsx("div", { className: "error-message", children: "*This field can't be empty" })))] }), isUpdate && (_jsx(Spin, { spinning: isLoadingComment, children: _jsx(WrapperMessageContent, { children: listComment?.map(comment => (_jsx(MessageComponent, { toUser: comment?.toUser, fromUser: comment?.fromUser, followers: comment?.followers, 
+                                                // mailFollower={comment?.mailFollower}
+                                                message: comment?.message, date: comment?.createdDate, attachments: comment?.attachments, timeZone: timeZone }, comment?.id))) }) }))] })] })] })] }));
 };
 export default Content;

package/es/components/organism/TicketEditor/Service.js

@@ -11,28 +11,28 @@ const API = {
     },
     tickets: {
         callApi: {
-            createTicket: (params, domain, token, config, userId) => callApiWithAuth(`api/ticket/index`, 'POST', Object.assign({}, params), domain, config, token, userId, true).then(res => {
+            createTicket: (params, domain, token, config, userId) => callApiWithAuth(`api/ticket/index`, 'POST', { ...params }, domain, config, token, userId, true).then(res => {
                 const data = getEntriesV2(res, 0);
                 // dataBackup[params.objectName] = data;
                 return data;
             }),
-            getCustomFields: (params, domain, token, config, userId, type) => callApiWithAuth(`api/ticket/index`, 'get', Object.assign({}, params), domain, config, token, userId, true, type).then(res => 
+            getCustomFields: (params, domain, token, config, userId, type) => callApiWithAuth(`api/ticket/index`, 'get', { ...params }, domain, config, token, userId, true, type).then(res => 
             // const data = getEntriesV2(res, 0);
             // dataBackup[params.objectName] = data;
             res.data),
-            getDetailsTicket: (params, domain, token, config, userId, ticketId, type = '') => callApiWithAuth(`api/ticket/index/${ticketId}`, 'get', Object.assign({}, params), domain, config, token, userId, true, type).then(res => 
+            getDetailsTicket: (params, domain, token, config, userId, ticketId, type = '') => callApiWithAuth(`api/ticket/index/${ticketId}`, 'get', { ...params }, domain, config, token, userId, true, type).then(res => 
             // const data = getEntriesV2(res, 0);
             // dataBackup[params.objectName] = data;
             res.data),
-            getListComment: (params, domain, token, config, userId, type, ticketId) => callApiWithAuth(`api/ticket/index/${ticketId}`, 'get', Object.assign({}, params), domain, config, token, userId, true, type).then(res => 
+            getListComment: (params, domain, token, config, userId, type, ticketId) => callApiWithAuth(`api/ticket/index/${ticketId}`, 'get', { ...params }, domain, config, token, userId, true, type).then(res => 
             // const data = getEntriesV2(res, 0);
             // dataBackup[params.objectName] = data;
             res.data),
-            updateComment: (params, domain, token, config, userId, type, ticketId) => callApiWithAuth(`api/ticket/index/${ticketId}`, 'put', Object.assign({}, params), domain, config, token, userId, true, type).then(res => 
+            updateComment: (params, domain, token, config, userId, type, ticketId) => callApiWithAuth(`api/ticket/index/${ticketId}`, 'put', { ...params }, domain, config, token, userId, true, type).then(res => 
             // const data = getEntriesV2(res, 0);
             // dataBackup[params.objectName] = data;
             res.data),
-            updateFollowers: (params, domain, token, config, userId, ticketId) => callApiWithAuth(`api/ticket/index/${ticketId}`, 'put', Object.assign({}, params), domain, config, token, userId, true).then(res => 
+            updateFollowers: (params, domain, token, config, userId, ticketId) => callApiWithAuth(`api/ticket/index/${ticketId}`, 'put', { ...params }, domain, config, token, userId, true).then(res => 
             // const data = getEntriesV2(res, 0);
             // dataBackup[params.objectName] = data;
             res.data),
@@ -44,14 +44,14 @@ const API = {
     },
     accounts: {
         callApi: {
-            getAccountManage: (params, domain, token, config, userId, type) => callApiWithAuth(`api/network/index/${config.api_pid}`, 'GET', Object.assign({}, params), domain, config, token, userId, false, type, true).then(res => res.data),
+            getAccountManage: (params, domain, token, config, userId, type) => callApiWithAuth(`api/network/index/${config.api_pid}`, 'GET', { ...params }, domain, config, token, userId, false, type, true).then(res => res.data),
         },
     },
     permission: {
         callApi: {
             getList: (params, domain, token, config, userId, type, ownerId) => 
             // console.log({params, domain, token, config,userId, type})
-            callApiWithAuth(`api/privilege/index`, 'GET', Object.assign(Object.assign({}, params), { ownerId }), domain, config, token, userId, false, type, false, true).then(res => res.data),
+            callApiWithAuth(`api/privilege/index`, 'GET', { ...params, ownerId }, domain, config, token, userId, false, type, false, true).then(res => res.data),
         },
     },
 };

package/es/components/organism/TicketEditor/components/DropdownComponent.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 declare const DropdownComponent: ({ data, setValueInput, valueInput, type, isUpdate, title }: {
     data: any;
     setValueInput: any;
@@ -6,5 +5,5 @@ declare const DropdownComponent: ({ data, setValueInput, valueInput, type, isUpd
     type: any;
     isUpdate: any;
     title: any;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default DropdownComponent;

package/es/components/organism/TicketEditor/components/DropdownComponent.js

@@ -1,4 +1,5 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from 'react';
 import { Select } from '@antscorp/antsomi-ui/es/components';
 import { getObjectPropSafely } from '../util';
 const EMPTY_VALUE = '____';
@@ -9,7 +10,13 @@ const DropdownComponent = ({ data, setValueInput, valueInput, type, isUpdate, ti
     const handleOnchangeSelect = (item, type) => {
         setLabelSelected(item.name);
         setDropdownOpen(false);
-        setValueInput(Object.assign(Object.assign({}, valueInput), { [type]: Object.assign(Object.assign({}, item), { value: item.value === EMPTY_VALUE ? '' : item.value }) }));
+        setValueInput({
+            ...valueInput,
+            [type]: {
+                ...item,
+                value: item.value === EMPTY_VALUE ? '' : item.value,
+            },
+        });
     };
     const renderData = useMemo(() => (!isUpdate ? [{ name: '-', value: EMPTY_VALUE }, ...data] : data), [data, isUpdate]);
     const handleHideDropdown = event => {
@@ -30,7 +37,10 @@ const DropdownComponent = ({ data, setValueInput, valueInput, type, isUpdate, ti
             document.removeEventListener('click', handleClickOutside, true);
         };
     });
-    return (React.createElement(Select, { value: getObjectPropSafely(() => valueInput[type].value) || EMPTY_VALUE, options: (renderData === null || renderData === void 0 ? void 0 : renderData.map(item => (Object.assign(Object.assign({}, item), { label: item.name })))) || [], onChange: (_, item) => handleOnchangeSelect(item, type) })
+    return (_jsx(Select, { value: getObjectPropSafely(() => valueInput[type].value) || EMPTY_VALUE, options: renderData?.map(item => ({
+            ...item,
+            label: item.name,
+        })) || [], onChange: (_, item) => handleOnchangeSelect(item, type) })
     // <WrapperDropdown ref={dropDonwRef}>
     //   <Tooltip title={title} placement="top" arrow>
     //     <WrapperToggleDropdown

package/es/components/organism/TicketEditor/components/Message.d.ts

@@ -1,3 +1,2 @@
-import React from 'react';
-declare const Message: (props: any) => false | React.JSX.Element;
+declare const Message: (props: any) => false | import("react/jsx-runtime").JSX.Element;
 export default Message;

package/es/components/organism/TicketEditor/components/Message.js

@@ -1,4 +1,5 @@
-import React, { useEffect, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
 import { WrapperMessage } from '../styled';
 import { Icon } from '@antscorp/antsomi-ui/es/components';
 const Message = props => {
@@ -17,23 +18,14 @@ const Message = props => {
             };
         }
     }, [isOpen]);
-    return (isOpenState && (React.createElement(WrapperMessage, { className: "container-content" },
-        React.createElement("div", { className: "floating", style: { color: '#008634' } },
-            React.createElement("span", { style: {
-                    background: `${type === 'success' ? '#008634' : 'red'}`,
-                    borderRadius: '50%',
-                    height: '18px',
-                    width: '18px',
-                    textAlign: 'center',
-                    marginRight: '16px',
-                    lineHeight: '22px',
-                } },
-                React.createElement("span", { className: "icon-check" },
-                    React.createElement(Icon, { className: "check-icon", type: "icon-ants-check" }))),
-            React.createElement("div", null,
-                React.createElement("span", { className: "alert__title" }, message),
-                React.createElement("span", { className: "secondary__title" }, subtitle)),
-            React.createElement("div", { style: { marginLeft: 'auto', cursor: 'pointer' }, onClick: () => setIsOpenState(false) },
-                React.createElement(Icon, { type: "icon-ants-close" }))))));
+    return (isOpenState && (_jsx(WrapperMessage, { className: "container-content", children: _jsxs("div", { className: "floating", style: { color: '#008634' }, children: [_jsx("span", { style: {
+                        background: `${type === 'success' ? '#008634' : 'red'}`,
+                        borderRadius: '50%',
+                        height: '18px',
+                        width: '18px',
+                        textAlign: 'center',
+                        marginRight: '16px',
+                        lineHeight: '22px',
+                    }, children: _jsx("span", { className: "icon-check", children: _jsx(Icon, { className: "check-icon", type: "icon-ants-check" }) }) }), _jsxs("div", { children: [_jsx("span", { className: "alert__title", children: message }), _jsx("span", { className: "secondary__title", children: subtitle })] }), _jsx("div", { style: { marginLeft: 'auto', cursor: 'pointer' }, onClick: () => setIsOpenState(false), children: _jsx(Icon, { type: "icon-ants-close" }) })] }) })));
 };
 export default Message;

package/es/components/organism/TicketEditor/components/MessageComponent.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 declare const MessageComponent: ({ toUser, fromUser, followers, attachments, message, date, timeZone, }: {
     toUser: any;
     fromUser: any;
@@ -7,5 +6,5 @@ declare const MessageComponent: ({ toUser, fromUser, followers, attachments, mes
     message: any;
     date: any;
     timeZone: any;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default MessageComponent;