@antscorp/antsomi-ui 2.0.73 → 2.0.75

package/es/components/organism/Help/Help.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 /* eslint-disable jsx-a11y/label-has-associated-control */
 /* eslint-disable no-multi-str */
 // Libraries
-import { isEmpty } from 'lodash';
+import { isEmpty, keyBy } from 'lodash';
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 // Assets
@@ -29,6 +29,7 @@ import { ATTACH_CAPTURE_TYPES, ATTACH_KEYS, DEFAULT_POSITIONS, MENU_KEYS, MESSAG
 import { BugIcon, CameraIcon, OpenUrlIcon, RequestIcon, ScreenshotMonitorIcon, } from '@antscorp/antsomi-ui/es/components/icons';
 import { base64ToFile, convertBlobToFile, generateUniqueId, mergeAudioStreams, } from '@antscorp/antsomi-ui/es/components/molecules/CaptureScreen/utils';
 import { expendDefault, formatParams, postCustomEvent } from './utils';
+import { useGetListUser } from './queries';
 const antIcon = _jsx(LoadingOutlined, { style: { fontSize: 40 }, spin: true });
 const Loading = ({ isLoading, height, width }) => isLoading && (_jsx(WrapperLoading, { className: "loader-container", height: height, width: width, children: _jsx(Spin, { indicator: antIcon }) }));
 const Help = props => {
@@ -53,6 +54,12 @@ const Help = props => {
         files: [],
         referenceUrl: '',
     });
+    const { listUsers, isFetchingUsers } = useGetListUser({
+        domain,
+        config,
+        userId,
+        token,
+    });
     const [errFile, setErrFile] = useState({
         isError: false,
         message: '',
@@ -616,12 +623,17 @@ const Help = props => {
         }
         if (!errFile.isError) {
             const params = formatParams({ ...valueInput, feature: appTargeting });
+            const mapUserById = keyBy(listUsers, 'userId');
+            const ownerEmail = mapUserById[params.ownerId || '']?.email;
+            const referenceUrl = window.location.href;
             handleCreateTicket({
                 ...params,
                 type,
                 imageDrew,
                 dataRecorded,
                 submitterId: Number(userId),
+                submitterEmail: ownerEmail,
+                referenceUrl,
             });
         }
     };
@@ -831,7 +843,7 @@ const Help = props => {
             }
         }
     };
-    const renderPopupLayout = (type) => (_jsxs(_Fragment, { children: [_jsx(Loading, { isLoading: isMainLoading, width: "100%", height: "100%" }), _jsx(WrapperHeader, { className: "cursor", children: _jsx(Header, { children: title }) }), _jsx(WrapperBody, { className: "popup-content", style: {
+    const renderPopupLayout = (type) => (_jsxs(_Fragment, { children: [_jsx(Loading, { isLoading: isMainLoading || isFetchingUsers, width: "100%", height: "100%" }), _jsx(WrapperHeader, { className: "cursor", children: _jsx(Header, { children: title }) }), _jsx(WrapperBody, { className: "popup-content", style: {
                     padding: type === REPORT_TYPES.CHAT ||
                         type === REPORT_TYPES.HELP ||
                         type === REPORT_TYPES.HELP_V1

package/es/components/organism/Help/queries/index.d.ts

@@ -0,0 +1 @@
+export * from './useGetListUser';

package/es/components/organism/Help/queries/index.js

@@ -0,0 +1 @@
+export * from './useGetListUser';

package/es/components/organism/Help/queries/useGetListUser.d.ts

@@ -0,0 +1,11 @@
+type Props = {
+    domain: string;
+    config: any;
+    userId: string;
+    token: string;
+};
+export declare const useGetListUser: ({ domain, config, userId, token }: Props) => {
+    listUsers: any;
+    isFetchingUsers: boolean;
+};
+export {};

package/es/components/organism/Help/queries/useGetListUser.js

@@ -0,0 +1,14 @@
+import { useQuery } from '@tanstack/react-query';
+import TicketService from '@antscorp/antsomi-ui/es/services/Ticket';
+const QUERY_KEY = 'GET_LIST_USER';
+const getListUserServices = async (params = {}, domain, token, config, userId) => {
+    const res = await TicketService.lookupInfo.callApi.c_user_id(params, domain, token, config, userId);
+    return res.data;
+};
+export const useGetListUser = ({ domain, config, userId, token }) => {
+    const { data, isFetching } = useQuery([QUERY_KEY, domain, token, config, userId], () => getListUserServices({}, domain, token, config, userId));
+    return {
+        listUsers: data || [],
+        isFetchingUsers: isFetching,
+    };
+};

package/es/components/organism/TicketEditorV2/Content.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-declare const _default: import("react").MemoExoticComponent<({ apiKey, domain, portalId, token, action, ticketId, listUsers, domainTicket, config, ticketDetails, listComment, userId, refetchComments, isLoadingComment, isLoadingDetails, isLoadingDataSouce, accountManage, timeZone, initOwnerId, isAllAccount, dataSelectInput, setDataSelectInput, email, domainUpload, }: {
+declare const _default: import("react").MemoExoticComponent<({ apiKey, domain, portalId, token, action, ticketId, listUsers, domainTicket, config, ticketDetails, listComment, userId, refetchComments, refetchTicket, isLoadingComment, isLoadingDetails, isLoadingDataSouce, accountManage, timeZone, initOwnerId, isAllAccount, dataSelectInput, setDataSelectInput, email, domainUpload, }: {
     apiKey: any;
     domain: any;
     portalId: any;
@@ -13,6 +13,7 @@ declare const _default: import("react").MemoExoticComponent<({ apiKey, domain, p
     listComment: any;
     userId: any;
     refetchComments: any;
+    refetchTicket: any;
     isLoadingComment: any;
     isLoadingDetails: any;
     isLoadingDataSouce: any;

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

@@ -24,7 +24,7 @@ const initValueInput = {
     isChanged: false,
     referenceUrl: window.location.href,
 };
-const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers, domainTicket, config, ticketDetails, listComment, userId, refetchComments, isLoadingComment, isLoadingDetails, isLoadingDataSouce, accountManage, timeZone, initOwnerId, isAllAccount, dataSelectInput, setDataSelectInput, email, domainUpload, }) => {
+const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers, domainTicket, config, ticketDetails, listComment, userId, refetchComments, refetchTicket, isLoadingComment, isLoadingDetails, isLoadingDataSouce, accountManage, timeZone, initOwnerId, isAllAccount, dataSelectInput, setDataSelectInput, email, domainUpload, }) => {
     const [isOpenToast, setIsOpenToast] = useState({
         isOpen: false,
         status: 'error',
@@ -118,8 +118,10 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
             .updateFollowers(params, domainTicket, token, config, userId, ticketId, portalId)
             .then(res => {
             setIsLoadingFollower(false);
+            refetchTicket();
         })
             .catch(err => {
+            refetchTicket();
             setIsLoadingFollower(false);
         });
     };
@@ -142,6 +144,7 @@ const Content = ({ apiKey, domain, portalId, token, action, ticketId, listUsers,
             });
         }
     }, [ticketDetails, listUsers, dataSelects]);
+    console.log('🚀 ~ listUsers:', listUsers);
     useEffect(() => {
         setIsLoading(true);
         getCustomFields();

package/es/components/organism/TicketEditorV2/TicketEditorV2.js

@@ -19,7 +19,7 @@ const defaultProps = {
 };
 export const TicketEditorV2 = props => {
     const { apiKey, portalId, token, domain, action, config: propsConfig, userId, ownerId, domainTicket, ticketId, domainAccount, email, domainUpload, } = props;
-    const { ticketDetails, isFetching: isFetchingDetails } = useGetDetailTicket({
+    const { ticketDetails, isFetching: isFetchingDetails, refetchTicket, } = useGetDetailTicket({
         ticketId,
         domainTicket,
         config: propsConfig,
@@ -51,7 +51,7 @@ export const TicketEditorV2 = props => {
     const handleConfirmModal = () => {
         setIsOpenModal(false);
     };
-    return (_jsxs(TicketEditorWrapper, { children: [_jsx(Content, { apiKey: apiKey, portalId: portalId, token: token, domain: domain, domainUpload: domainUpload, action: action, listUsers: listUsers, domainTicket: domainTicket, config: config, ticketDetails: ticketDetails, listComment: listComments, ticketId: ticketId, userId: userId, refetchComments: refetchComments, isLoadingComment: isFetchingComments, isLoadingDetails: isFetchingDetails, isLoadingDataSouce: isFetchingUsers, accountManage: accountManage, timeZone: timeZone, initOwnerId: ownerId, isAllAccount: isAllAccount, dataSelectInput: dataSelectInput, setDataSelectInput: setDataSelectInput, email: email }), _jsx(Modal, { open: isOpenModal, onCancel: () => setIsOpenModal(false), className: "modal", children: _jsxs("div", { className: "wrapperBody", children: [_jsx(WrapperModalHeader, { children: "Confirm deletion of this ticket" }), _jsx("div", { className: "modalBody", children: _jsx("span", { style: { fontSize: '12px', color: '#000' }, children: "Once you confirm cancel, this ticket will NOT be saved." }) }), _jsxs("div", { className: "modalFooter", children: [_jsx(Button, { style: {
+    return (_jsxs(TicketEditorWrapper, { children: [_jsx(Content, { apiKey: apiKey, portalId: portalId, token: token, domain: domain, domainUpload: domainUpload, action: action, listUsers: listUsers, domainTicket: domainTicket, config: config, ticketDetails: ticketDetails, listComment: listComments, ticketId: ticketId, userId: userId, refetchComments: refetchComments, refetchTicket: refetchTicket, isLoadingComment: isFetchingComments, isLoadingDetails: isFetchingDetails, isLoadingDataSouce: isFetchingUsers, accountManage: accountManage, timeZone: timeZone, initOwnerId: ownerId, isAllAccount: isAllAccount, dataSelectInput: dataSelectInput, setDataSelectInput: setDataSelectInput, email: email }), _jsx(Modal, { open: isOpenModal, onCancel: () => setIsOpenModal(false), className: "modal", children: _jsxs("div", { className: "wrapperBody", children: [_jsx(WrapperModalHeader, { children: "Confirm deletion of this ticket" }), _jsx("div", { className: "modalBody", children: _jsx("span", { style: { fontSize: '12px', color: '#000' }, children: "Once you confirm cancel, this ticket will NOT be saved." }) }), _jsxs("div", { className: "modalFooter", children: [_jsx(Button, { style: {
                                         height: '28px',
                                         background: '#1f5fac',
                                         color: '#fff',

package/es/components/organism/TicketEditorV2/queries/useGetDetailTicket.d.ts

@@ -8,5 +8,6 @@ type Props = {
 export declare const useGetDetailTicket: ({ domainTicket, config, userId, ticketId, networkId, }: Props) => {
     ticketDetails: any;
     isFetching: boolean;
+    refetchTicket: <TPageData>(options?: (import("@tanstack/react-query").RefetchOptions & import("@tanstack/react-query").RefetchQueryFilters<TPageData>) | undefined) => Promise<import("@tanstack/react-query").QueryObserverResult<any, unknown>>;
 };
 export {};

package/es/components/organism/TicketEditorV2/queries/useGetDetailTicket.js

@@ -2,7 +2,7 @@ import { useQuery } from '@tanstack/react-query';
 import { QUERY_KEYS } from '../constants/queryKeys';
 import Service from '../Service';
 export const useGetDetailTicket = ({ domainTicket, config, userId, ticketId, networkId, }) => {
-    const { data, isFetching } = useQuery({
+    const { data, isFetching, refetch } = useQuery({
         queryKey: [QUERY_KEYS.GET_TICKET_DETAIL, domainTicket, config, userId, ticketId, networkId],
         enabled: !!ticketId,
         queryFn: () => Service.tickets.callApi.getDetailsTicket({}, domainTicket, undefined, config, userId, ticketId, '', networkId),
@@ -10,5 +10,6 @@ export const useGetDetailTicket = ({ domainTicket, config, userId, ticketId, net
     return {
         ticketDetails: data?.data?.ticket || [],
         isFetching,
+        refetchTicket: refetch,
     };
 };

package/es/components/organism/TicketEditorV2/util.d.ts

@@ -1,3 +1,4 @@
+import dayjs from 'dayjs';
 export declare function getObjectPropSafely(fn: any, defaultValue?: string): any;
 export declare function isNumeric(num: any): boolean;
 export declare function getUserLocaleLanguage(config: any): any;
@@ -42,6 +43,6 @@ export declare const formatParams: (data: any) => {
 export declare const formatDatarender: (data: any, listSelect: any, listAccount: any) => any;
 export declare const handleValidateContent: (stringHTML: any) => string | undefined;
 export declare const compareArrays: (a: any, b: any) => boolean;
-export declare const convertDateToTimestamp: (time: any, timeZone: any) => string;
+export declare const convertDateToTimestamp: (time: string | number | Date | dayjs.Dayjs, timeZone: string) => string;
 export declare const postCustomEvent: (type: any, data: any) => void;
 export declare const generateAvatar: (text: any, foregroundColor?: string, backgroundColor?: string) => string;

package/es/components/organism/TicketEditorV2/util.js

@@ -347,7 +347,28 @@ export const handleValidateContent = stringHTML => {
     }
 };
 export const compareArrays = (a, b) => JSON.stringify(a) === JSON.stringify(b);
-export const convertDateToTimestamp = (time, timeZone) => dayjs(time).tz(timeZone).format('MMM DD YYYY hh:mm');
+const isValidTimezone = (timeZone) => {
+    try {
+        dayjs().tz(timeZone).format();
+        return true;
+    }
+    catch (e) {
+        return false;
+    }
+};
+export const convertDateToTimestamp = (time, timeZone) => {
+    try {
+        // Validate timezone first
+        if (!timeZone || !isValidTimezone(timeZone)) {
+            return dayjs(time).utc().format('MMM DD YYYY hh:mm');
+        }
+        return dayjs(time).tz(timeZone).format('MMM DD YYYY hh:mm');
+    }
+    catch (error) {
+        // Fallback to UTC in case of error
+        return dayjs(time).utc().format('MMM DD YYYY hh:mm');
+    }
+};
 export const postCustomEvent = (type, data) => {
     if (!type) {
         return;

package/es/components/template/Layout/Layout.js

@@ -164,7 +164,6 @@ export const Layout = memo(props => {
         helpConfig: {
             ...headerProps?.helpConfig,
             configs: {
-                ...headerProps?.helpConfig?.configs,
                 appCode: 'SANDBOX_MARKETING',
                 avatar: '//c0-platform.ants.tech/avatar/2021/09/17/0xgbkurioo.png',
                 config: {
@@ -174,6 +173,7 @@ export const Layout = memo(props => {
                     embeddedData: {},
                     INSIGHT_U_OGS: 'uogs',
                 },
+                ...headerProps?.helpConfig?.configs,
             },
         },
         accountSharingConfig: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "2.0.73",
+  "version": "2.0.75",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",