@antscorp/antsomi-ui 2.0.107 → 2.0.108

package/es/components/molecules/UnsubscribePreview/utils.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Masks an email address to show only the first and last characters of the local part and the first and last characters of the domain.
+ * @param {string} [email=''] - the email address to mask
+ * @returns {string} the masked email address
+ * @example
+ * maskEmail('user@example.com') // 'u**r@e**mple.com'
+ */
+export declare const maskEmail: (email?: string) => string;
+export declare const maskPhone: (phone?: string) => string;

package/es/components/molecules/UnsubscribePreview/utils.js

@@ -0,0 +1,27 @@
+/**
+ * Masks an email address to show only the first and last characters of the local part and the first and last characters of the domain.
+ * @param {string} [email=''] - the email address to mask
+ * @returns {string} the masked email address
+ * @example
+ * maskEmail('user@example.com') // 'u**r@e**mple.com'
+ */
+export const maskEmail = (email = '') => {
+    if (!email.includes('@'))
+        return 'Invalid email';
+    const [local, domain] = email.split('@');
+    const localLength = local.length;
+    const domainLength = domain.length;
+    if (localLength < 2 || domainLength < 3)
+        return 'Invalid email';
+    const maskedLocal = `${local[0]}${'*'.repeat(localLength - 2)}${local[localLength - 1]}`;
+    const maskedDomain = `${domain[0]}${'*'.repeat(domainLength - 2)}${domain[domainLength - 1]}`;
+    return `${maskedLocal}@${maskedDomain}`;
+};
+export const maskPhone = (phone = '') => {
+    const digits = phone.replace(/\D/g, '');
+    if (digits.length < 6)
+        return 'Invalid phone';
+    const end = digits.slice(-3);
+    const masked = '*'.repeat(digits.length - end.length);
+    return `${masked}${end}`;
+};

package/es/components/molecules/UploadImage/index.d.ts

@@ -129,6 +129,10 @@ export interface UploadImageProps extends AntdUploadProps {
      * Indicates if the input is currently focused.
      */
     focused?: boolean;
+    /**
+     * Whether to disable the remove button.
+     */
+    disableRemove?: boolean;
 }
 interface UploadMediaObject {
     url: string;

package/es/components/molecules/UploadImage/index.js

@@ -44,7 +44,7 @@ const SORT_OPTIONS = {
     },
 };
 export const UploadImage = props => {
-    const { labelHeadingModal, labelButtonSelect, labelModalDelete, searchPlaceholder, onRemoveImage, onChangeImage: onChangeMedia, isOpen, isInputMode, width, placeholder, extensions, maxSize, title, showImageURL: showMediaURL, selectedImage: selectedMediaProp, required, focused, domainMedia, slug, paramConfigs, errors, iconName, mode, } = props;
+    const { labelHeadingModal, labelButtonSelect, labelModalDelete, searchPlaceholder, onRemoveImage, onChangeImage: onChangeMedia, isOpen, isInputMode, width, placeholder, extensions, maxSize, title, showImageURL: showMediaURL, selectedImage: selectedMediaProp, required, focused, domainMedia, slug, paramConfigs, errors, iconName, mode, disableRemove, } = props;
     const { Dragger } = Upload;
     const [selectedMedia, setSelectedMedia] = useState(selectedMediaProp || { url: '' });
     const [isModalOpen, setIsModalOpen] = useState(isOpen);
@@ -237,7 +237,7 @@ export const UploadImage = props => {
                                     zIndex: 1,
                                     marginLeft: 25,
                                     color: THEME.token?.colorIcon,
-                                } })) : null, _jsxs("div", { style: flexStyleCenter, children: [_jsxs(Button, { onClick: showModal, style: { backgroundColor: '#ffffff' }, children: ["Browse ", mode === 'video' ? 'Video' : 'Image'] }), selectedMedia && selectedMedia.url ? (_jsx(Button, { onClick: handleRemoveMedia, style: { backgroundColor: '#ffffff' }, children: _jsx(Icon, { type: "icon-ants-remove-trash", size: 15, style: { color: THEME.token?.colorPrimary } }) })) : null] })] }), _jsxs("div", { className: "upload-file-info", style: { marginTop: 12 }, children: [_jsxs(Text, { children: ["File type: ", extensions?.join(', ')] }), _jsxs(Text, { children: ["File size: under ", maxSize, "MB"] })] }), showMediaURL && (_jsx(Space, { size: 5, direction: "vertical", style: { marginTop: 12 }, children: _jsx(Input, { label: mode === 'video' ? 'Video URL' : 'Image URL', required: required, placeholder: placeholder, value: selectedMedia.url ? selectedMedia.url : '', focused: focused, onAfterChange: value => handleSelectMedia({
+                                } })) : null, _jsxs("div", { style: flexStyleCenter, children: [_jsxs(Button, { onClick: showModal, style: { backgroundColor: '#ffffff' }, children: ["Browse ", mode === 'video' ? 'Video' : 'Image'] }), !disableRemove && selectedMedia && selectedMedia.url ? (_jsx(Button, { onClick: handleRemoveMedia, style: { backgroundColor: '#ffffff' }, children: _jsx(Icon, { type: "icon-ants-remove-trash", size: 15, style: { color: THEME.token?.colorPrimary } }) })) : null] })] }), _jsxs("div", { className: "upload-file-info", style: { marginTop: 12 }, children: [_jsxs(Text, { children: ["File type: ", extensions?.join(', ')] }), _jsxs(Text, { children: ["File size: Under ", maxSize, "MB"] })] }), showMediaURL && (_jsx(Space, { size: 5, direction: "vertical", style: { marginTop: 12 }, children: _jsx(Input, { label: mode === 'video' ? 'Video URL' : 'Image URL', required: required, placeholder: placeholder, value: selectedMedia.url ? selectedMedia.url : '', focused: focused, maxLength: 255, onAfterChange: value => handleSelectMedia({
                                 url: value,
                             }) }) }))] })), _jsx(Modal, { title: labelModalDelete, open: isOpenConfirmDelete, onOk: () => handleRemoveUploadedMedia(deleteMediaRef.current, false), onCancel: () => setOpenConfirmDelete(prev => !prev), okText: "OK", cancelText: "Cancel", destroyOnClose: true, children: _jsxs("p", { children: ["Are you sure you want to delete ", deleteMediaRef.current?.name, "?"] }) }), _jsxs(Modal, { wrapClassName: "icons-selection-modal", title: _jsxs("div", { style: { display: 'flex', gap: '8px', alignItems: 'center' }, children: [_jsx(Icon, { type: `icon-ants-${iconName}`, size: 20 }), labelHeadingModal] }), centered: true, headerStyle: {
                     padding: '20px 20px 0',

package/es/components/molecules/index.d.ts

@@ -51,6 +51,8 @@ export { SearchPopover, PopoverAddField, PopoverSelect } from './SearchPopover';
 export { CalendarSelection, CalendarSelectionConstants, CalendarSelectionUtils, } from './CalendarSelection';
 export { RequestAccess } from './RequestAccess';
 export { EditingList } from './EditingList';
+export { UnsubscribePreferences } from './UnsubscribePreferences';
+export { UnsubscribePreview } from './UnsubscribePreview';
 export * from './EmptyData';
 export * from './PreviewModal';
 export * from './DrawerDetail';
@@ -94,3 +96,5 @@ export type { EditorTabItem } from './EditorTab';
 export type { CalendarSelectionValue } from './CalendarSelection';
 export type { EditingListProps } from './EditingList';
 export type { ImagePreviewProps } from './ImagePreview';
+export type { TUnsubscribePreferencesProps } from './UnsubscribePreferences';
+export type { TUnsubscribePreviewProps } from './UnsubscribePreview';

package/es/components/molecules/index.js

@@ -51,6 +51,8 @@ export { SearchPopover, PopoverAddField, PopoverSelect } from './SearchPopover';
 export { CalendarSelection, CalendarSelectionConstants, CalendarSelectionUtils, } from './CalendarSelection';
 export { RequestAccess } from './RequestAccess';
 export { EditingList } from './EditingList';
+export { UnsubscribePreferences } from './UnsubscribePreferences';
+export { UnsubscribePreview } from './UnsubscribePreview';
 export * from './EmptyData';
 export * from './PreviewModal';
 export * from './DrawerDetail';

package/es/components/organism/PreviewCollections/WhatsappMessage/FooterMessage/index.js

@@ -43,6 +43,8 @@ export default memo((props) => {
                                     break;
                                 }
                             }
-                            return (_jsx(Button, { icon: icon, type: "link", href: isURL ? btn.url : undefined, target: "_blank", style: { gap: 5 }, children: _jsx(Typography.Text, { ellipsis: { tooltip: true }, style: { color: '#1670A8' }, children: btn.text }) }, btnIdx));
+                            return (_jsx(Button, { icon: icon, type: "link", 
+                                // href={isURL ? btn.url : undefined}
+                                target: "_blank", style: { gap: 5 }, children: _jsx(Typography.Text, { ellipsis: { tooltip: true }, style: { color: '#1670A8' }, children: btn.text }) }, btnIdx));
                         }) })] })) : null] }));
 });

package/es/constants/index.d.ts

@@ -12,3 +12,4 @@ export * from './theme';
 export * from './postMessage';
 export * from './condition';
 export * from './portal';
+export * from './unsubscribe';

package/es/constants/index.js

@@ -12,3 +12,4 @@ export * from './theme';
 export * from './postMessage';
 export * from './condition';
 export * from './portal';
+export * from './unsubscribe';

package/es/constants/queries.d.ts

@@ -38,4 +38,9 @@ export declare const QUERY_KEYS: {
     GET_MATCHES_ANY_LIST: string;
     GET_INFINITE_MATCHES_ANY_LIST: string;
     GET_LOGGED_USER: string;
+    GET_UNSUBSCRIBE_PREFERENCES: string;
+    GET_UNSUBSCRIBE_LIST_BY_IDENTIFIER: string;
+    UPDATE_UNSUBSCRIBE_PREFERENCES_LIST: string;
+    GET_UNSUBSCRIBE_LIST: string;
+    GET_UNSUBSCRIBE_LIST_PERMISSION: string;
 };

package/es/constants/queries.js

@@ -52,4 +52,10 @@ export const QUERY_KEYS = {
     GET_INFINITE_MATCHES_ANY_LIST: 'GET_INFINITE_MATCHES_ANY_LIST',
     // USER
     GET_LOGGED_USER: 'GET_LOGGED_USER',
+    // UNSUBSCRIBE
+    GET_UNSUBSCRIBE_PREFERENCES: 'GET_UNSUBSCRIBE_PREFERENCES',
+    GET_UNSUBSCRIBE_LIST_BY_IDENTIFIER: 'GET_UNSUBSCRIBE_LIST_BY_IDENTIFIER',
+    UPDATE_UNSUBSCRIBE_PREFERENCES_LIST: 'UPDATE_UNSUBSCRIBE_PREFERENCES_LIST',
+    GET_UNSUBSCRIBE_LIST: 'GET_UNSUBSCRIBE_LIST',
+    GET_UNSUBSCRIBE_LIST_PERMISSION: 'GET_UNSUBSCRIBE_LIST_PERMISSION',
 };

package/es/constants/unsubscribe.d.ts

@@ -0,0 +1,56 @@
+import { TUnsubscribeList } from '@antscorp/antsomi-ui/es/types';
+export declare const SEARCH_PARAM_KEYS: {
+    IDENTIFIER: string;
+    PAGE: string;
+    JOURNEY_ID: string;
+    CAMPAIGN_ID: string;
+    STORY_ID: string;
+    VARIANT_ID: string;
+    CUSTOMER_ID: string;
+    UID: string;
+    PROP_ID: string;
+    IS_CLICK_UNSUBSCRIBE: string;
+    IS_PREVIEW: string;
+    PORTAL_ID: string;
+    TYPE: string;
+    IDENTIFIER_SHORT: string;
+    PAGE_SHORT: string;
+    JOURNEY_ID_SHORT: string;
+    CAMPAIGN_ID_SHORT: string;
+    STORY_ID_SHORT: string;
+    VARIANT_ID_SHORT: string;
+    CUSTOMER_ID_SHORT: string;
+    UID_SHORT: string;
+    PROP_ID_SHORT: string;
+    IS_CLICK_UNSUBSCRIBE_SHORT: string;
+    IS_PREVIEW_SHORT: string;
+    PORTAL_ID_SHORT: string;
+    TYPE_SHORT: string;
+};
+export declare const RESULT_PAGE_TYPES: {
+    RESUBSCRIBED: string;
+    OPT_OUT: string;
+};
+export declare const RESULT_PAGE_MESSAGES: {
+    [x: string]: {
+        email: {
+            title: string;
+            description: string;
+        };
+        whatsapp: {
+            title: string;
+            description: string;
+        };
+    };
+};
+export declare const LANDING_PAGE_TYPE: {
+    UNSUBSCRIBE: string;
+    PREFERENCES: string;
+    RESULT: string;
+};
+export declare const GLOBAL_UNSUBSCRIBED_LIST: TUnsubscribeList;
+export declare const GLOBAL_UNSUBSCRIBED_WHATSAPP: TUnsubscribeList;
+export declare const UNSUBSCRIBE_STATUS: {
+    readonly UNSUBSCRIBE: "unsubscribe";
+    readonly RESUBSCRIBE: "resubscribe";
+};

package/es/constants/unsubscribe.js

@@ -0,0 +1,77 @@
+export const SEARCH_PARAM_KEYS = {
+    IDENTIFIER: 'identifier',
+    PAGE: 'page',
+    JOURNEY_ID: 'journeyId',
+    CAMPAIGN_ID: 'campaignId',
+    STORY_ID: 'storyId',
+    VARIANT_ID: 'variantId',
+    CUSTOMER_ID: 'customerId',
+    UID: 'uid',
+    PROP_ID: 'propId',
+    IS_CLICK_UNSUBSCRIBE: 'isClickUnsubscribe',
+    IS_PREVIEW: 'isPreview',
+    PORTAL_ID: 'portalId',
+    TYPE: 'type',
+    IDENTIFIER_SHORT: 'id',
+    PAGE_SHORT: 'p',
+    JOURNEY_ID_SHORT: 'j',
+    CAMPAIGN_ID_SHORT: 'c',
+    STORY_ID_SHORT: 's',
+    VARIANT_ID_SHORT: 'v',
+    CUSTOMER_ID_SHORT: 'u',
+    UID_SHORT: 'uid',
+    PROP_ID_SHORT: 'pid',
+    IS_CLICK_UNSUBSCRIBE_SHORT: 'icu',
+    IS_PREVIEW_SHORT: 'ip',
+    PORTAL_ID_SHORT: 'poid',
+    TYPE_SHORT: 't',
+};
+export const RESULT_PAGE_TYPES = {
+    RESUBSCRIBED: 'resubscribed',
+    OPT_OUT: 'opt-out',
+};
+export const RESULT_PAGE_MESSAGES = {
+    [RESULT_PAGE_TYPES.RESUBSCRIBED]: {
+        email: {
+            title: 'Success!',
+            description: 'Thank you for signing up.',
+        },
+        whatsapp: {
+            title: 'Success!',
+            description: 'Thank you for signing up.',
+        },
+    },
+    [RESULT_PAGE_TYPES.OPT_OUT]: {
+        email: {
+            title: '',
+            description: 'You will no longer receive any emails from us.',
+        },
+        whatsapp: {
+            title: '',
+            description: 'You will no longer receive WhatsApp messages from us.',
+        },
+    },
+};
+export const LANDING_PAGE_TYPE = {
+    UNSUBSCRIBE: 'unsubscribed',
+    PREFERENCES: 'preferences',
+    RESULT: 'result',
+};
+export const GLOBAL_UNSUBSCRIBED_LIST = {
+    list_id: '-1',
+    description: '',
+    list_name: 'Global unsubscribed list',
+    status: '1',
+    type: '1',
+};
+export const GLOBAL_UNSUBSCRIBED_WHATSAPP = {
+    list_id: '-3',
+    list_name: 'Global unsubscribed WhatsApp',
+    status: '1',
+    type: '3',
+    description: '',
+};
+export const UNSUBSCRIBE_STATUS = {
+    UNSUBSCRIBE: 'unsubscribe',
+    RESUBSCRIBE: 'resubscribe',
+};

package/es/queries/Unsubscribe/index.d.ts

@@ -0,0 +1,5 @@
+import { useGetUnsubscribeListByIdentifier } from './useGetUnsubscribeListByIdentifier';
+import { useGetUnsubscribeList } from './useGetUnsubscribeList';
+import { useGetUnsubscribePreferences } from './useGetUnsubscribePreferences';
+import { useGetUnsubscribeListPermission } from './useGetUnsubscribeListPermission';
+export { useGetUnsubscribeListByIdentifier, useGetUnsubscribePreferences, useGetUnsubscribeList, useGetUnsubscribeListPermission, };

package/es/queries/Unsubscribe/index.js

@@ -0,0 +1,5 @@
+import { useGetUnsubscribeListByIdentifier } from './useGetUnsubscribeListByIdentifier';
+import { useGetUnsubscribeList } from './useGetUnsubscribeList';
+import { useGetUnsubscribePreferences } from './useGetUnsubscribePreferences';
+import { useGetUnsubscribeListPermission } from './useGetUnsubscribeListPermission';
+export { useGetUnsubscribeListByIdentifier, useGetUnsubscribePreferences, useGetUnsubscribeList, useGetUnsubscribeListPermission, };

package/es/queries/Unsubscribe/useGetUnsubscribeList.d.ts

@@ -0,0 +1,8 @@
+import { UseQueryOptions } from '@tanstack/react-query';
+import { TGetUnsubscribeListArgs, TUnsubscribePayloadInfo } from '../../services/Unsubscribe';
+interface UseGetUnsubscribeListProps {
+    args: TGetUnsubscribeListArgs;
+    options?: UseQueryOptions<any, Error, any>;
+}
+export declare const useGetUnsubscribeList: ({ args, options }: UseGetUnsubscribeListProps, infos: TUnsubscribePayloadInfo) => import("@tanstack/react-query").UseQueryResult<any, Error>;
+export {};

package/es/queries/Unsubscribe/useGetUnsubscribeList.js

@@ -0,0 +1,18 @@
+// Libraries
+import { useQuery } from '@tanstack/react-query';
+// Services
+// import { TGetUnsubscribeListArgs, unsubscribeServices } from 'app/services/Unsubscribe';
+import { unsubscribeServices, } from '../../services/Unsubscribe';
+// Constants
+import { QUERY_KEYS } from '../../constants';
+export const useGetUnsubscribeList = ({ args, options }, infos) => useQuery({
+    queryKey: [QUERY_KEYS.GET_UNSUBSCRIBE_LIST, args, options, infos],
+    queryFn: async () => unsubscribeServices.getUnsubscribeList(args, infos),
+    onSuccess: data => {
+        if (!data)
+            return [];
+        const unsubscribedList = data?.entries[0] || [];
+        return unsubscribedList.sort((a, b) => Number(a.list_id) - Number(b.list_id));
+    },
+    ...options,
+});

package/es/queries/Unsubscribe/useGetUnsubscribeListByIdentifier.d.ts

@@ -0,0 +1,8 @@
+import { UseQueryOptions } from '@tanstack/react-query';
+import { TGetUnsubscribeListByIdentifierArgs, TUnsubscribePayloadInfo } from '../../services/Unsubscribe';
+interface UseGetUnsubscribeListByIdentifierProps {
+    args: TGetUnsubscribeListByIdentifierArgs;
+    options?: UseQueryOptions<any, Error, any>;
+}
+export declare const useGetUnsubscribeListByIdentifier: ({ args, options }: UseGetUnsubscribeListByIdentifierProps, infos: TUnsubscribePayloadInfo) => import("@tanstack/react-query").UseQueryResult<any, Error>;
+export {};

package/es/queries/Unsubscribe/useGetUnsubscribeListByIdentifier.js

@@ -0,0 +1,11 @@
+// Libraries
+import { useQuery } from '@tanstack/react-query';
+// Services
+import { unsubscribeServices, } from '../../services/Unsubscribe';
+// Constants
+import { QUERY_KEYS } from '../../constants';
+export const useGetUnsubscribeListByIdentifier = ({ args, options }, infos) => useQuery({
+    queryKey: [QUERY_KEYS.GET_UNSUBSCRIBE_LIST_BY_IDENTIFIER, args, options, infos],
+    queryFn: () => unsubscribeServices.getUnsubscribeListByIdentifier(args, infos),
+    ...options,
+});

package/es/queries/Unsubscribe/useGetUnsubscribeListPermission.d.ts

@@ -0,0 +1,8 @@
+import { UseQueryOptions } from '@tanstack/react-query';
+import { TGetUnsubscribeListPermissionArgs, TUnsubscribePayloadInfo } from '../../services/Unsubscribe';
+interface UseGetUnsubscribeListPermissionProps {
+    args: TGetUnsubscribeListPermissionArgs;
+    options?: UseQueryOptions<any, Error, any>;
+}
+export declare const useGetUnsubscribeListPermission: ({ args, options }: UseGetUnsubscribeListPermissionProps, infos: TUnsubscribePayloadInfo) => import("@tanstack/react-query").UseQueryResult<any, Error>;
+export {};

package/es/queries/Unsubscribe/useGetUnsubscribeListPermission.js

@@ -0,0 +1,17 @@
+// Libraries
+import { useQuery } from '@tanstack/react-query';
+// Services
+import { unsubscribeServices, } from '../../services/Unsubscribe';
+// Constants
+import { QUERY_KEYS } from '../../constants';
+export const useGetUnsubscribeListPermission = ({ args, options }, infos) => useQuery({
+    queryKey: [QUERY_KEYS.GET_UNSUBSCRIBE_LIST_PERMISSION, args, options, infos],
+    queryFn: async () => unsubscribeServices.getUnsubscribeListPermission(args, infos),
+    onSuccess: data => {
+        if (!data)
+            return [];
+        const unsubscribedList = data?.entries[0] || [];
+        return unsubscribedList.sort((a, b) => Number(a.list_id) - Number(b.list_id));
+    },
+    ...options,
+});

package/es/queries/Unsubscribe/useGetUnsubscribePreferences.d.ts

@@ -0,0 +1,23 @@
+import { UseQueryOptions } from '@tanstack/react-query';
+import { GetUnsubscribePreferencesArgs, TUnsubscribePayloadInfo } from '../../services/Unsubscribe';
+interface UseGetUnsubscribePreferencesProps {
+    args: GetUnsubscribePreferencesArgs;
+    options?: UseQueryOptions<any, Error, any>;
+}
+/**
+ * React Query hook to get unsubscribe preferences by given identifier
+ *
+ * @example
+ * const { data, isLoading } = useGetUnsubscribePreferences({
+ *   args: {
+ *     id: '1234567890',
+ *   },
+ * });
+ *
+ * @param {UseGetUnsubscribePreferencesProps} props
+ * @param {GetUnsubscribePreferencesArgs} props.args - Arguments to get unsubscribe preferences
+ * @param {UseQueryOptions<any, Error, any>} [props.options] - Options for React Query
+ * @returns {UseQueryResult<any, Error>} - Response data and meta data
+ */
+export declare const useGetUnsubscribePreferences: ({ args, options }: UseGetUnsubscribePreferencesProps, infos: TUnsubscribePayloadInfo) => import("@tanstack/react-query").UseQueryResult<any, Error>;
+export {};

package/es/queries/Unsubscribe/useGetUnsubscribePreferences.js

@@ -0,0 +1,26 @@
+// Libraries
+import { useQuery } from '@tanstack/react-query';
+// Services
+import { unsubscribeServices, } from '../../services/Unsubscribe';
+// Constants
+import { QUERY_KEYS } from '../../constants';
+/**
+ * React Query hook to get unsubscribe preferences by given identifier
+ *
+ * @example
+ * const { data, isLoading } = useGetUnsubscribePreferences({
+ *   args: {
+ *     id: '1234567890',
+ *   },
+ * });
+ *
+ * @param {UseGetUnsubscribePreferencesProps} props
+ * @param {GetUnsubscribePreferencesArgs} props.args - Arguments to get unsubscribe preferences
+ * @param {UseQueryOptions<any, Error, any>} [props.options] - Options for React Query
+ * @returns {UseQueryResult<any, Error>} - Response data and meta data
+ */
+export const useGetUnsubscribePreferences = ({ args, options }, infos) => useQuery({
+    queryKey: [QUERY_KEYS.GET_UNSUBSCRIBE_PREFERENCES],
+    queryFn: () => unsubscribeServices.getUnsubscribePreferences(args, infos),
+    ...options,
+});

package/es/services/Unsubscribe/index.d.ts

@@ -0,0 +1,41 @@
+import { PayloadInfo } from '../../types';
+export type GetUnsubscribePreferencesArgs = {
+    id: string;
+};
+export type TGetUnsubscribeListByIdentifierArgs = {
+    data: {
+        identifier: string;
+        type: 'email' | 'phone';
+        portalId: number;
+        listId: (number | string)[];
+    };
+};
+export type TUpdateUnsubscribePreferencesListArgs = {
+    data: {
+        identifier: string;
+        type: 'email' | 'phone';
+        portalId: number;
+        journeyId: number;
+        campaignId: number;
+        variantId: number;
+        config: {
+            listId: number;
+            status: 'resubscribe' | 'unsubscribe';
+        }[];
+    };
+};
+export type TGetUnsubscribeListArgs = {
+    data: {
+        type: 'email' | 'sms' | 'whatsapp';
+        portalId: number;
+    };
+};
+export type TGetUnsubscribeListPermissionArgs = TGetUnsubscribeListArgs;
+export type TUnsubscribePayloadInfo = Required<PayloadInfo>;
+export declare const unsubscribeServices: {
+    getUnsubscribePreferences: ({ id }: GetUnsubscribePreferencesArgs, infos: TUnsubscribePayloadInfo) => Promise<any>;
+    getUnsubscribeListByIdentifier: ({ data }: TGetUnsubscribeListByIdentifierArgs, infos: TUnsubscribePayloadInfo) => Promise<any>;
+    updateUnsubscribePreferencesList: ({ data }: TUpdateUnsubscribePreferencesListArgs, infos: TUnsubscribePayloadInfo) => Promise<any>;
+    getUnsubscribeList: ({ data }: TGetUnsubscribeListArgs, infos: TUnsubscribePayloadInfo) => Promise<any>;
+    getUnsubscribeListPermission: ({ data }: TGetUnsubscribeListPermissionArgs, infos: TUnsubscribePayloadInfo) => Promise<any>;
+};

package/es/services/Unsubscribe/index.js

@@ -0,0 +1,78 @@
+// Libraries
+import { services } from '..';
+const UNSUBSCRIBE_URL = `/email-template/unsubscribe`;
+export const unsubscribeServices = {
+    getUnsubscribePreferences: async ({ id }, infos) => {
+        try {
+            const response = await services.mediaTemplateDesign.get({
+                API_HOST: `${infos.url}${UNSUBSCRIBE_URL}/get-detail`,
+                id,
+            }, infos);
+            if (response) {
+                return response.data?.data || {};
+            }
+            return {};
+        }
+        catch (error) {
+            return new Promise((_, reject) => {
+                reject(error);
+            });
+        }
+    },
+    getUnsubscribeListByIdentifier: async ({ data }, infos) => {
+        try {
+            const response = await services.mediaTemplateDesign.create({
+                API_HOST: `${infos.url}${UNSUBSCRIBE_URL}/get-by-identifier`,
+                ...data,
+            }, infos);
+            return response.data?.data || [];
+        }
+        catch (error) {
+            return new Promise((_, reject) => {
+                reject(error);
+            });
+        }
+    },
+    updateUnsubscribePreferencesList: async ({ data }, infos) => {
+        try {
+            const response = await services.mediaTemplateDesign.create({
+                API_HOST: `${infos.url}${UNSUBSCRIBE_URL}/save`,
+                ...data,
+            }, infos);
+            return response.data?.data || [];
+        }
+        catch (error) {
+            return new Promise((_, reject) => {
+                reject(error);
+            });
+        }
+    },
+    getUnsubscribeList: async ({ data }, infos) => {
+        try {
+            const response = await services.mediaTemplateDesign.getList({
+                API_HOST: `${infos.url}${UNSUBSCRIBE_URL}/get-unsubscribe-list`,
+                ...data,
+            }, infos);
+            return response.data?.data || [];
+        }
+        catch (error) {
+            return new Promise((_, reject) => {
+                reject(error);
+            });
+        }
+    },
+    getUnsubscribeListPermission: async ({ data }, infos) => {
+        try {
+            const response = await services.mediaTemplateDesign.getList({
+                API_HOST: `${infos.url}${UNSUBSCRIBE_URL}/get-unsubscribe-list-permissions`,
+                ...data,
+            }, infos);
+            return response.data?.data || [];
+        }
+        catch (error) {
+            return new Promise((_, reject) => {
+                reject(error);
+            });
+        }
+    },
+};

package/es/types/index.d.ts

@@ -26,6 +26,7 @@ export * from './condition';
 export * from './api';
 export * from './date';
 export * from './auth';
+export * from './unsubscribe';
 export type PayloadInfo = {
     url?: string;
     userId?: string;

package/es/types/index.js

@@ -10,3 +10,4 @@ export * from './condition';
 export * from './api';
 export * from './date';
 export * from './auth';
+export * from './unsubscribe';

package/es/types/unsubscribe.d.ts

@@ -0,0 +1,25 @@
+export type TTab = {
+    activePanel?: string;
+    onChangeActivePanel?: (panelKey: any) => void;
+};
+export type TUnsubscribeList = {
+    status: string;
+    list_name: string;
+    type: string;
+    list_id: string;
+    description: string;
+};
+export type TUnsubscribeType = 'email' | 'sms' | 'whatsapp';
+export type TUnsubscribeSettings = {
+    unsubscribePreferences: {
+        landingPageType?: string;
+        segmentId: number | string | null;
+        unsubscribeListId: number | string | null;
+        logo: string;
+        title: string;
+        description: string;
+        customLink: string;
+        haveResubscribeButton?: boolean;
+        preferenceListIds: string[] | undefined;
+    };
+};

package/es/types/unsubscribe.js

@@ -0,0 +1 @@
+export {};

package/es/utils/common.d.ts

@@ -166,3 +166,4 @@ export declare function numberWithCommas(n: number): string;
 export declare const multiPercentageValue: (value?: string) => string;
 export declare const antsomiClsx: (componentName: string) => (className: string) => string;
 export declare function arrayToMapByProperty<T extends object, K extends keyof T>(array: T[], propertyName: K): Map<T[K], T>;
+export declare function compareStrings(a: any, b: any): number;

package/es/utils/common.js

@@ -757,3 +757,6 @@ export function arrayToMapByProperty(array, propertyName) {
     // new Map() có thể nhận mảng này để khởi tạo Map
     return new Map(Object.entries(keyedObject));
 }
+export function compareStrings(a, b) {
+    return String(a).localeCompare(String(b));
+}

package/package.json

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