@antscorp/antsomi-ui 1.3.5-beta.21 → 1.3.5-beta.211

package/es/components/organism/ContentSources/components/LevelSetting/index.js

@@ -0,0 +1,23 @@
+// Libs
+import React from 'react';
+import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
+// Molecules
+import { RadioGroup, SettingWrapper } from '@antscorp/antsomi-ui/es/components/molecules';
+// Constants
+import { LEVEL_OPTIONS } from './constants';
+import { THEME } from '@antscorp/antsomi-ui/es/constants';
+import { LABEL_WIDTH } from '../../constants';
+// Locale
+import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
+// Selectors
+import { useSelectModeView } from '../../provider';
+const LevelSetting = (props) => {
+    var _a;
+    const { t } = i18nInstance;
+    const { onChange, levelOption, value } = props;
+    const mode = useSelectModeView();
+    const isCDP = mode === 'CDP';
+    return (React.createElement(SettingWrapper, { label: t(translations.level.title).toString(), labelStyle: { fontWeight: mode === 'CDP' ? 'normal' : 'bold', width: LABEL_WIDTH }, labelColor: isCDP ? (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorText : undefined, containerStyle: isCDP ? { justifyContent: 'flex-start' } : {} },
+        React.createElement(RadioGroup, { options: LEVEL_OPTIONS[levelOption], defaultValue: value, value: value, onChange: onChange })));
+};
+export default React.memo(LevelSetting);

package/es/components/organism/ContentSources/constants.d.ts

@@ -0,0 +1,7 @@
+import type { JourneySettings, TContentSourceSettings, TRanking } from './types';
+export declare const MAX_NUM_OF_CONTENT_SOURCE = 2;
+export declare const LABEL_WIDTH = 200;
+export declare const GET_TOP_RANKING_DEFAULT: TRanking;
+export declare const CONTENT_SOURCES_SETTINGS_DEFAULT: TContentSourceSettings;
+export declare const ARTICLE_RANKING_DEFAULT: TRanking;
+export declare const JOURNEY_SETTINGS_DEFAULT: JourneySettings;

package/es/components/organism/ContentSources/constants.js

@@ -0,0 +1,46 @@
+export const MAX_NUM_OF_CONTENT_SOURCE = 2;
+export const LABEL_WIDTH = 200;
+export const GET_TOP_RANKING_DEFAULT = {
+    type: 'algorithms',
+    algorithms: {
+        sort: 'mix',
+        value: [
+            {
+                value: 'get_top',
+                quantity: 5,
+                sort_type: 'desc',
+                sort_by: 'last_updated',
+            },
+        ],
+        filters: [],
+    },
+    custom: '',
+};
+export const CONTENT_SOURCES_SETTINGS_DEFAULT = {
+    groups: [],
+    expanded: [],
+    isLoadingDataBO: false,
+};
+export const ARTICLE_RANKING_DEFAULT = {
+    type: 'algorithms',
+    algorithms: {
+        sort: 'mix',
+        value: [
+            {
+                value: 'seen_products',
+                quantity: 5,
+            },
+        ],
+        filters: [],
+    },
+    custom: '',
+};
+export const JOURNEY_SETTINGS_DEFAULT = {
+    unsubscribeSegmentType: 'customer',
+    triggerType: 'event_based',
+    triggerEvent: {
+        eventActionId: '',
+        eventCategoryId: '',
+        insightPropertyIds: [],
+    },
+};

package/es/components/organism/ContentSources/index.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { TServiceAuth } from '@antscorp/antsomi-ui/es/types';
+import { ContentSourceModeView, JourneySettings, TContentSourceSettings } from './types';
+export interface ContentSourceProps {
+    useQueryClient: boolean;
+    serviceAuth: TServiceAuth;
+    isShowErrorAlert: boolean;
+    mode: ContentSourceModeView;
+    initValue?: TContentSourceSettings;
+    onChange: (contentSource: TContentSourceSettings) => void;
+    journeySettings: JourneySettings;
+}
+declare const _default: React.MemoExoticComponent<{
+    (props: ContentSourceProps): React.JSX.Element;
+    defaultProps: ContentSourceProps;
+}>;
+export default _default;

package/es/components/organism/ContentSources/index.js

@@ -0,0 +1,33 @@
+// Libraries
+import React, { memo } from 'react';
+// Query config
+import { queryClientAntsomiUI, QueryClientProviderAntsomiUI, } from '@antscorp/antsomi-ui/es/queries/configs';
+// Components
+import Settings from './Settings';
+// Providers
+import { ContentSourceProvider } from './provider';
+// Constants
+import { JOURNEY_SETTINGS_DEFAULT } from './constants';
+const defaultProps = {
+    useQueryClient: true,
+    isShowErrorAlert: false,
+    journeySettings: JOURNEY_SETTINGS_DEFAULT,
+    mode: 'CDP',
+    onChange: () => { },
+    serviceAuth: {
+        url: '',
+        token: '',
+        userId: '',
+        accountId: '',
+    },
+};
+const ContentSource = (props) => {
+    const { useQueryClient, serviceAuth, mode, isShowErrorAlert, initValue, journeySettings, onChange, } = props;
+    if (!useQueryClient)
+        return (React.createElement(Settings, { mode: mode, initValue: initValue, serviceAuth: serviceAuth, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, onChange: onChange }));
+    return (React.createElement(QueryClientProviderAntsomiUI, { client: queryClientAntsomiUI },
+        React.createElement(ContentSourceProvider, null,
+            React.createElement(Settings, { mode: mode, initValue: initValue, serviceAuth: serviceAuth, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, onChange: onChange }))));
+};
+ContentSource.defaultProps = defaultProps;
+export default memo(ContentSource);

package/es/components/organism/ContentSources/provider.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { ContentSourceState } from './reducer';
+import type { UpdateGroupAction } from './types';
+export declare const ContentSourceContext: React.Context<ContentSourceState>;
+export declare const ContentSourceDispatchContext: React.Context<React.Dispatch<UpdateGroupAction>>;
+export interface ContentSourceProviderProps {
+    children: React.ReactNode;
+}
+export declare const ContentSourceProvider: ({ children }: ContentSourceProviderProps) => React.JSX.Element;
+export declare const useContentSourceState: () => ContentSourceState;
+export declare const useContentSourceDispatch: () => React.Dispatch<UpdateGroupAction>;
+export declare const useSelectServiceAuth: () => import("@antscorp/antsomi-ui/es/types").PayloadInfo;
+export declare const useSelectContentSources: () => import("./types").TContentSourceSettings;
+export declare const useSelectModeView: () => import("./types").ContentSourceModeView;

package/es/components/organism/ContentSources/provider.js

@@ -0,0 +1,27 @@
+// Libraries
+import React, { createContext, useContext, useMemo, useReducer } from 'react';
+// Reducer
+import { contentSourceReducer, initialContentSourceState } from './reducer';
+export const ContentSourceContext = createContext(initialContentSourceState);
+export const ContentSourceDispatchContext = createContext(() => { });
+export const ContentSourceProvider = ({ children }) => {
+    const [contentSourceState, dispatch] = useReducer(contentSourceReducer, initialContentSourceState);
+    return (React.createElement(ContentSourceContext.Provider, { value: contentSourceState },
+        React.createElement(ContentSourceDispatchContext.Provider, { value: dispatch }, children)));
+};
+// Hooks
+export const useContentSourceState = () => useContext(ContentSourceContext);
+export const useContentSourceDispatch = () => useContext(ContentSourceDispatchContext);
+// Selectors
+export const useSelectServiceAuth = () => {
+    const { serviceAuth } = useContentSourceState();
+    return useMemo(() => serviceAuth, [serviceAuth]);
+};
+export const useSelectContentSources = () => {
+    const { contentSources } = useContentSourceState();
+    return useMemo(() => contentSources, [contentSources]);
+};
+export const useSelectModeView = () => {
+    const { mode } = useContentSourceState();
+    return useMemo(() => mode, [mode]);
+};

package/es/components/organism/ContentSources/reducer.d.ts

@@ -0,0 +1,17 @@
+import { TServiceAuth } from '@antscorp/antsomi-ui/es/types';
+import { UpdateGroupAction, TContentSourceSettings, TContentSourceGroup, ActionSetContentSourceGroup, ActionDeleteContentSourceGroup, ContentSourceModeView, ActionUpdateModeView, ActionUpdateContentSourceSettings } from './types';
+export interface ContentSourceState {
+    serviceAuth: TServiceAuth;
+    mode: ContentSourceModeView;
+    contentSources: TContentSourceSettings;
+}
+export declare const initialContentSourceState: ContentSourceState;
+export declare const contentSourceReducer: (state: ContentSourceState, action: UpdateGroupAction) => ContentSourceState;
+export declare const setContentSourceGroup: (payload: {
+    groupId: string;
+    values: Partial<TContentSourceGroup>;
+    ignoreUndoAction?: boolean;
+}) => ActionSetContentSourceGroup;
+export declare const deleteContentSourceGroup: (groupId: string) => ActionDeleteContentSourceGroup;
+export declare const updateModeView: (mode: ContentSourceModeView) => ActionUpdateModeView;
+export declare const updateContentSourceSettings: (contentSources: TContentSourceSettings) => ActionUpdateContentSourceSettings;

package/es/components/organism/ContentSources/reducer.js

@@ -0,0 +1,87 @@
+// Libraries
+import produce from 'immer';
+// Utils
+import { initGroup as initContentSourceGroup } from './utils';
+// Constants
+import { CONTENT_SOURCES_SETTINGS_DEFAULT } from './constants';
+export const initialContentSourceState = {
+    serviceAuth: {},
+    mode: 'CDP',
+    contentSources: CONTENT_SOURCES_SETTINGS_DEFAULT,
+};
+export const contentSourceReducer = (state, action) => produce(state, draft => {
+    switch (action.type) {
+        case 'SERVICE_AUTH': {
+            const { serviceAuth } = action.payload;
+            draft.serviceAuth = serviceAuth;
+            break;
+        }
+        case 'MODE_VIEW': {
+            const { mode } = action.payload;
+            draft.mode = mode;
+            break;
+        }
+        case 'UPDATE_CONTENT_SOURCE_SETTINGS': {
+            const { contentSources } = action.payload;
+            draft.contentSources = contentSources;
+            break;
+        }
+        case 'EXPANDED': {
+            const { expanded } = action.payload;
+            draft.contentSources.expanded = expanded;
+            break;
+        }
+        case 'ADD_CONTENT_SOURCE': {
+            let i = 1;
+            let groupName = `Group ${i}`;
+            while (state.contentSources.groups.some(g => g.groupName === groupName)) {
+                ++i;
+                groupName = `Group ${i}`;
+            }
+            const initContentSource = initContentSourceGroup(groupName);
+            draft.contentSources.groups.push(initContentSource);
+            draft.contentSources.expanded.push(initContentSource.groupId);
+            break;
+        }
+        case 'SET_CONTENT_SOURCE_GROUP': {
+            const { groupId, values } = action.payload;
+            const index = state.contentSources.groups.findIndex(g => g.groupId === groupId);
+            if (index !== -1) {
+                const group = state.contentSources.groups[index];
+                draft.contentSources.groups[index] = Object.assign(Object.assign({}, group), values);
+            }
+            break;
+        }
+        case 'DELETE_CONTENT_SOURCE_GROUP': {
+            const { groupId } = action.payload;
+            const index = state.contentSources.groups.findIndex(g => g.groupId === groupId);
+            if (index !== -1) {
+                draft.contentSources.groups.splice(index, 1);
+                draft.contentSources.expanded = state.contentSources.expanded.filter(id => id !== groupId);
+            }
+            break;
+        }
+        default: {
+            return state;
+        }
+    }
+});
+// Action Creators
+export const setContentSourceGroup = (payload) => ({
+    type: 'SET_CONTENT_SOURCE_GROUP',
+    payload,
+});
+export const deleteContentSourceGroup = (groupId) => ({
+    type: 'DELETE_CONTENT_SOURCE_GROUP',
+    payload: { groupId },
+});
+export const updateModeView = (mode) => ({
+    type: 'MODE_VIEW',
+    payload: { mode },
+});
+export const updateContentSourceSettings = (contentSources) => ({
+    type: 'UPDATE_CONTENT_SOURCE_SETTINGS',
+    payload: {
+        contentSources,
+    },
+});

package/es/components/organism/ContentSources/styled.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { ContentSourceModeView } from './types';
+export declare const ContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const WrapperPanelHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledCollapsePanel: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/collapse/CollapsePanel").CollapsePanelProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+export declare const WrapperFallback: import("styled-components").StyledComponent<"div", any, {
+    mode: ContentSourceModeView;
+}, never>;

package/es/components/organism/ContentSources/styled.js

@@ -0,0 +1,58 @@
+import CollapsePanel from 'antd/es/collapse/CollapsePanel';
+import styled, { css } from 'styled-components';
+export const ContentContainer = styled.div `
+  .no-border-top.antsomi-collapse {
+    border-block-start: none;
+  }
+
+  .input__wrapper .input-custom-size {
+    font-weight: bold;
+    font-size: 14px;
+  }
+`;
+export const WrapperPanelHeader = styled.div `
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-right: 32px;
+  gap: 32px;
+  width: 100%;
+`;
+export const StyledCollapsePanel = styled(CollapsePanel) `
+  border-bottom: none !important;
+
+  .ant-collapse-header {
+    flex-wrap: wrap !important;
+    padding: 12px 0px !important;
+
+    .ant-collapse-arrow {
+      margin-right: 0px !important;
+      right: 0px !important;
+    }
+  }
+
+  .ant-collapse-content {
+    border-top: none !important;
+    border-bottom: none !important;
+
+    .ant-collapse-content-box {
+      padding: 8px 0px 16px;
+    }
+  }
+
+  i[type='icon-antsomi-expand-more'] {
+    top: 27px !important;
+  }
+`;
+export const WrapperFallback = styled.div `
+  display: flex;
+
+  ${props => props.mode === 'CDP'
+    ? css `
+          align-items: center;
+        `
+    : css `
+          flex-direction: column;
+          gap: 12px;
+        `}
+`;

package/es/components/organism/ContentSources/types.d.ts

@@ -0,0 +1,134 @@
+import { TServiceAuth } from '@antscorp/antsomi-ui/es/types';
+import { TFilters } from '../../atoms/InputDynamic/types';
+export interface JourneySettings {
+    unsubscribeSegmentType?: string | null;
+    triggerType?: string | null;
+    triggerEvent?: {
+        eventActionId: number | string;
+        eventCategoryId: number | string;
+        insightPropertyIds: any[];
+    };
+}
+export type ContentSourceModeView = 'CDP' | 'MEDIA';
+export type TRanking = {
+    type: 'algorithms' | 'custom';
+    algorithms: {
+        sort: 'mix' | 'order';
+        value: {
+            value: string;
+            quantity: number;
+            by?: string;
+            last?: number;
+            to?: string;
+            sort_type?: 'desc' | 'asc';
+            [key: string]: any;
+        }[];
+        filters: string[];
+    };
+    custom: string;
+};
+export type TContentSourceGroup = {
+    groupId: string;
+    groupName: string;
+    filters: TFilters;
+    ranking: TRanking;
+    itemTypeId: number | null;
+    itemTypeName: string | null;
+    itemTypeDisplay: string | null;
+    fallback: string;
+    level?: string;
+    data?: Record<string, any>[];
+};
+export type TContentSourceSettings = {
+    groups: TContentSourceGroup[];
+    expanded: string[];
+    isLoadingDataBO: boolean;
+};
+export type TRelationship = {
+    enabled: 1 | 0;
+    parent_attr: string;
+    recommendation_level: string;
+};
+interface Action {
+    type: string;
+    payload: any;
+}
+interface ActionServiceAuth extends Action {
+    type: 'SERVICE_AUTH';
+    payload: {
+        serviceAuth: TServiceAuth;
+    };
+}
+interface ActionUpdateSource extends Action {
+    type: 'BO_TYPE';
+    payload: {
+        itemTypeId: TContentSourceGroup['itemTypeId'];
+    };
+}
+interface ActionUpdateExpanded extends Action {
+    type: 'EXPANDED';
+    payload: {
+        expanded: string[];
+    };
+}
+interface ActionUpdateFilter extends Action {
+    type: 'FILTER';
+    payload: {
+        conditions: TContentSourceGroup['filters'];
+    };
+}
+interface ActionUpdateFallback extends Action {
+    type: 'FALLBACK';
+    payload: {
+        fallback: TContentSourceGroup['fallback'];
+    };
+}
+interface ActionUpdateName extends Action {
+    type: 'NAME';
+    payload: {
+        name: string;
+    };
+}
+interface ActionUpdateAlgorithms extends Action {
+    type: 'ALGORITHMS';
+    payload: {
+        ranking: TRanking;
+    };
+}
+interface ActionUpdateLevel extends Action {
+    type: 'LEVEL';
+    payload: {
+        level?: string;
+    };
+}
+interface ActionAddContentSource extends Action {
+    type: 'ADD_CONTENT_SOURCE';
+}
+export interface ActionSetContentSourceGroup extends Action {
+    type: 'SET_CONTENT_SOURCE_GROUP';
+    payload: {
+        groupId: string;
+        values: Partial<TContentSourceGroup>;
+        ignoreUndoAction?: boolean;
+    };
+}
+export interface ActionDeleteContentSourceGroup extends Action {
+    type: 'DELETE_CONTENT_SOURCE_GROUP';
+    payload: {
+        groupId: string;
+    };
+}
+export interface ActionUpdateModeView extends Action {
+    type: 'MODE_VIEW';
+    payload: {
+        mode: ContentSourceModeView;
+    };
+}
+export interface ActionUpdateContentSourceSettings extends Action {
+    type: 'UPDATE_CONTENT_SOURCE_SETTINGS';
+    payload: {
+        contentSources: TContentSourceSettings;
+    };
+}
+export type UpdateGroupAction = ActionUpdateContentSourceSettings | ActionServiceAuth | ActionAddContentSource | ActionUpdateModeView | ActionDeleteContentSourceGroup | ActionSetContentSourceGroup | ActionUpdateSource | ActionUpdateFilter | ActionUpdateFallback | ActionUpdateName | ActionUpdateAlgorithms | ActionUpdateExpanded | ActionUpdateLevel;
+export {};

package/es/components/organism/ContentSources/types.js

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

package/es/components/organism/ContentSources/utils.d.ts

@@ -0,0 +1,29 @@
+import { TContentSourceGroup } from './types';
+export declare const initGroup: (groupName: string) => TContentSourceGroup;
+export declare const TRANSLATE_TEXT: {
+    group: string;
+    selectCsTitle: string;
+    csTitle: string;
+    selectAnItem: string;
+    addGroup: string;
+    fallback: string;
+    groupName: string;
+};
+export declare const buildOptionArchive: (list: any[], selected: any) => any[];
+export declare const convertValue: (listBO: any, itemTypeId: any) => any;
+export declare const isCheckBOArchiveDelete: (listBO: any, itemTypeId: any) => string;
+export declare const isCheckStatusAttr: (listBO: any, itemTypeId: any, listAttribute: any, field: any) => {
+    errorMessage: string;
+    isDisable: boolean;
+};
+export declare const checkStatusCollection: ({ listBO, itemTypeId, listCollection, field, checkDisable, }: {
+    listBO?: any[] | undefined;
+    itemTypeId?: number | null | undefined;
+    listCollection?: any[] | undefined;
+    field?: string | undefined;
+    checkDisable?: boolean | undefined;
+}) => {
+    errorMessage: string;
+    isDisable: boolean;
+};
+export declare const optionNotExitsValue: (options: any, value: any) => any;

package/es/components/organism/ContentSources/utils.js

@@ -0,0 +1,150 @@
+// Locales
+import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
+import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
+// Utils
+import { random } from '@antscorp/antsomi-ui/es/utils';
+// Constants
+import { FILTERS_DEFAULT, PRODUCT_RANKING_DEFAULT, FALLBACK_SELECTION, } from '@antscorp/antsomi-ui/es/constants/contentSource';
+import { ATTRIBUTE_STATUS, BO_STATUS, COLLECTION_STATUS, } from '../../molecules/AddDynamicContent/constants';
+export const initGroup = (groupName) => ({
+    groupId: `csg${random(5)}`,
+    groupName,
+    itemTypeId: null,
+    itemTypeName: null,
+    itemTypeDisplay: null,
+    filters: FILTERS_DEFAULT,
+    ranking: PRODUCT_RANKING_DEFAULT,
+    fallback: FALLBACK_SELECTION.MOST_SEEN.value,
+    level: undefined,
+    data: [],
+});
+const { t } = i18nInstance;
+export const TRANSLATE_TEXT = {
+    group: t(translations.group.title, 'Group'),
+    selectCsTitle: t(translations.selectContentSource.title, 'Content source'),
+    csTitle: t(translations.contentSource.title, 'Content Source'),
+    selectAnItem: t(translations.selectAnItem.title, 'Select an item'),
+    addGroup: t(translations.addGroup.title, 'Add Group'),
+    fallback: t(translations.fallback.title, 'Fallback'),
+    groupName: t(translations.groupName.title, 'Group Name'),
+};
+export const buildOptionArchive = (list, selected) => {
+    const arrSelected = Array.isArray(selected) ? selected : [selected];
+    const result = (list === null || list === void 0 ? void 0 : list.filter(each => parseInt(each.status) !== 4 || arrSelected.includes(each.value))) || [];
+    return result;
+};
+export const convertValue = (listBO, itemTypeId) => {
+    if (itemTypeId) {
+        const selected = listBO === null || listBO === void 0 ? void 0 : listBO.find((bo) => bo.value === itemTypeId);
+        if (!selected) {
+            return `[ID - ${itemTypeId}]`;
+        }
+    }
+    return itemTypeId;
+};
+export const isCheckBOArchiveDelete = (listBO, itemTypeId) => {
+    let errorMessage = '';
+    if (itemTypeId) {
+        const selected = listBO === null || listBO === void 0 ? void 0 : listBO.find((bo) => bo.value === itemTypeId);
+        if (selected) {
+            if (BO_STATUS[selected.model.status]) {
+                errorMessage = BO_STATUS[selected.model.status].errorMessage;
+            }
+        }
+        else {
+            errorMessage = BO_STATUS.DELETE.errorMessage;
+        }
+    }
+    return errorMessage;
+};
+export const isCheckStatusAttr = (listBO, itemTypeId, listAttribute, field) => {
+    let errorMessage = '';
+    let isDisable = false;
+    const isEmptyField = !field || (Array.isArray(field) && !field.length);
+    // If field is empty then return empty errorMessage
+    if (isEmptyField || !(listAttribute === null || listAttribute === void 0 ? void 0 : listAttribute.length)) {
+        return {
+            errorMessage: '',
+            isDisable: false,
+        };
+    }
+    const selected = listBO === null || listBO === void 0 ? void 0 : listBO.find((bo) => bo.value === itemTypeId);
+    const selectedAttr = listAttribute === null || listAttribute === void 0 ? void 0 : listAttribute.find((bo) => Array.isArray(field) ? field.includes(bo.value) : bo.value === field);
+    // TH1 : BO is Archive or Delete
+    if (itemTypeId) {
+        if (selected) {
+            if (BO_STATUS[selected.model.status]) {
+                errorMessage = BO_STATUS[selected.model.status].errorMessage;
+                isDisable = true;
+            }
+            else if (selectedAttr) {
+                if (ATTRIBUTE_STATUS[selectedAttr.status]) {
+                    errorMessage = ATTRIBUTE_STATUS[selectedAttr.status].errorMessage;
+                }
+            }
+            else {
+                errorMessage = field ? ATTRIBUTE_STATUS.DELETE.errorMessage : '';
+            }
+        }
+        else {
+            errorMessage = BO_STATUS.DELETE.errorMessage;
+            isDisable = true;
+        }
+    }
+    return { errorMessage, isDisable };
+};
+export const checkStatusCollection = ({ listBO, itemTypeId, listCollection, field, checkDisable, }) => {
+    let errorMessage = '';
+    let isDisable = false;
+    const isEmptyField = !field || (Array.isArray(field) && !field.length);
+    // If field is empty, listAttribute is empty array then return empty errorMessage
+    if (isEmptyField || !(listCollection === null || listCollection === void 0 ? void 0 : listCollection.length)) {
+        return {
+            errorMessage: '',
+            isDisable: false,
+        };
+    }
+    const selectedAttrs = listCollection === null || listCollection === void 0 ? void 0 : listCollection.filter(bo => Array.isArray(field) ? field.includes(bo.value) : bo.value === field);
+    if (!(selectedAttrs === null || selectedAttrs === void 0 ? void 0 : selectedAttrs.length)) {
+        errorMessage = COLLECTION_STATUS.DELETE.errorMessage;
+    }
+    else {
+        const selectedAttrError = selectedAttrs.find(selectedAttr => COLLECTION_STATUS[selectedAttr.status]);
+        if (selectedAttrError) {
+            switch (true) {
+                case selectedAttrError.status === COLLECTION_STATUS[4].value:
+                    errorMessage = COLLECTION_STATUS[4].errorMessage;
+                    break;
+                case selectedAttrError.status === COLLECTION_STATUS[2].value && checkDisable:
+                    errorMessage = COLLECTION_STATUS[2].errorMessage;
+                    break;
+                default:
+                    break;
+            }
+        }
+    }
+    if (Array.isArray(listBO) && !!itemTypeId) {
+        const selectedBO = listBO === null || listBO === void 0 ? void 0 : listBO.find(bo => bo.value === itemTypeId);
+        if (!selectedBO) {
+            errorMessage = BO_STATUS.DELETE.errorMessage;
+            isDisable = true;
+        }
+        else {
+            if (BO_STATUS[selectedBO.status]) {
+                errorMessage = BO_STATUS[selectedBO.status].errorMessage;
+                isDisable = true;
+            }
+        }
+    }
+    return { errorMessage, isDisable };
+};
+export const optionNotExitsValue = (options, value) => {
+    const arrValue = Array.isArray(value) ? value : [value];
+    if (value) {
+        const selected = options === null || options === void 0 ? void 0 : options.find((item) => arrValue.includes(item.value));
+        if (!selected) {
+            return `[ID - ${value}]`;
+        }
+    }
+    return value;
+};

package/es/components/organism/FilterSetting/components/common/InputArray/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface InputArrayProps {
+    value: string[];
+    onChange: (v: InputArrayProps['value']) => void;
+    required?: boolean;
+    focused?: boolean;
+}
+export declare const InputArray: React.FC<InputArrayProps>;
+export {};