@antscorp/antsomi-ui 1.3.5-beta.707 → 1.3.5-beta.708

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

@@ -3,6 +3,7 @@ import { HideOptionTypes, TContentSourceGroup, UpdateGroupAction } from './types
 import { FallbackBO } from '@antscorp/antsomi-ui/es/models/FallbackBO';
 export type TProps = {
     groups: TContentSourceGroup[];
+    justOneGroup?: boolean;
     isLoadingListBO: boolean;
     listBO: any;
     hideOptionTypes?: HideOptionTypes;

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

@@ -18,6 +18,7 @@ import { THEME } from '@antscorp/antsomi-ui/es/constants';
 const defaultProps = {
     groups: [],
     isShowErrorAlert: false,
+    justOneGroup: false,
     journeySettings: {},
     isLoadingListBO: true,
     listFallbackBO: [],
@@ -25,7 +26,7 @@ const defaultProps = {
 };
 const Content = (props = defaultProps) => {
     // prettier-ignore
-    const { groups, isLoadingListBO, listBO, onChangeGroup, onChangeExpand, expanded, isShowErrorAlert, hideOptionTypes, listFallbackBO, journeySettings, onDeleteGroup } = props;
+    const { groups, isLoadingListBO, listBO, onChangeGroup, onChangeExpand, expanded, isShowErrorAlert, hideOptionTypes, listFallbackBO, journeySettings, justOneGroup, onDeleteGroup } = props;
     const { t } = i18nInstance;
     const mode = useSelectModeView();
     const isCDP = mode === 'CDP';
@@ -69,8 +70,8 @@ const Content = (props = defaultProps) => {
                 }, onClick: (e) => handleOnDeleteGroup(e, group.groupId), type: "icon-ants-outline-delete", size: 20 })));
     };
     return (React.createElement(Collapse, { ghost: true, bordered: true, activeKey: expanded, expandIconPosition: "end", onChange: handleOnChangeExpand, destroyInactivePanel: true, rootClassName: "no-border-top" }, groups.map((group, index) => {
-        const groupNode = (React.createElement(Group, { data: group, hideOptionTypes: hideOptionTypes, groupNames: groupNames, isLoadingSelectBO: isLoadingListBO, listBO: listBO, onChange: onChangeGroup, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, listFallbackBO: listFallbackBO }));
-        if (isCDP) {
+        const groupNode = (React.createElement(Group, { data: group, justOneGroup: justOneGroup, hideOptionTypes: hideOptionTypes, groupNames: groupNames, isLoadingSelectBO: isLoadingListBO, listBO: listBO, onChange: onChangeGroup, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, listFallbackBO: listFallbackBO }));
+        if (isCDP || justOneGroup) {
             return React.createElement(React.Fragment, { key: group.groupId }, groupNode);
         }
         return (React.createElement(React.Fragment, { key: group.groupId },

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

@@ -4,6 +4,7 @@ import { FallbackBO } from '@antscorp/antsomi-ui/es/models/FallbackBO';
 type TProps = {
     data: TContentSourceGroup;
     listBO: any[];
+    justOneGroup?: boolean;
     hideOptionTypes?: HideOptionTypes;
     isLoadingSelectBO: boolean;
     onChange?: (groupId: string, action: UpdateGroupAction) => void;

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

@@ -1,7 +1,7 @@
 import React, { useMemo } from 'react';
 import { cloneDeep, get, isEmpty } from 'lodash';
 // Molecules
-import { Space, Text } from '../../atoms';
+import { Divider, Space, Text } from '../../atoms';
 import { SelectV2 as Select } from '../../molecules';
 // Styled
 import { WrapperFallback } from './styled';
@@ -31,7 +31,7 @@ const cdpStyle = {
 };
 const Group = (props) => {
     var _a, _b;
-    const { data, isLoadingSelectBO, listBO, listFallbackBO, hideOptionTypes, isShowErrorAlert, journeySettings, onChange, } = props;
+    const { data, isLoadingSelectBO, listBO, listFallbackBO, hideOptionTypes, isShowErrorAlert, journeySettings, justOneGroup = false, onChange, } = props;
     const { itemTypeId, filters, level, itemTypeName } = data;
     const mode = useSelectModeView();
     const isCDP = mode === 'CDP';
@@ -105,10 +105,11 @@ const Group = (props) => {
         }
     }, [level, relationship]);
     return (React.createElement(Space, { size: 20, direction: "vertical" },
-        React.createElement(Select, { showSearch: true, loading: isLoadingSelectBO, required: isCDP, isReverseMask: isCDP, labelStyle: isCDP ? cdpStyle : {}, style: isCDP ? { width: '100%' } : {}, containerStyle: isCDP ? { flexDirection: 'row', alignItems: 'baseline' } : {}, label: React.createElement(Text, { type: "secondary", color: (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorText }, isCDP ? TRANSLATE_TEXT.csTitle : TRANSLATE_TEXT.selectCsTitle), options: options, placeholder: TRANSLATE_TEXT.selectAnItem, value: convertValue(listBO, itemTypeId), onChange: value => handleChange({
+        React.createElement(Select, { showSearch: true, loading: isLoadingSelectBO, required: isCDP, isReverseMask: isCDP, labelStyle: isCDP ? cdpStyle : {}, style: isCDP ? { width: '100%' } : {}, containerStyle: isCDP ? { flexDirection: 'row', alignItems: 'baseline' } : {}, label: React.createElement(Text, { type: "secondary", color: (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorText }, TRANSLATE_TEXT.csTitle), options: options, placeholder: TRANSLATE_TEXT.selectAnItem, value: convertValue(listBO, itemTypeId), onChange: value => handleChange({
                 type: 'BO_TYPE',
                 payload: { itemTypeId: value },
             }), errorArchive: isCheckBOArchiveDelete(listBO, itemTypeId) }),
+        justOneGroup && (React.createElement(Divider, { type: "horizontal", style: { margin: 0 }, rootClassName: "root-divider-bottom-cs", className: "divider-bottom-cs" })),
         isShowLevelSetting && (React.createElement(LevelSetting, { value: level || 'parent', levelOption: relationship.recommendation_level, onChange: e => {
                 handleChange({
                     type: 'LEVEL',

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

@@ -4,6 +4,7 @@ import type { ContentSourceModeView, HideOptionTypes, JourneySettings, TContentS
 interface SettingsProps {
     serviceAuth: TServiceAuth;
     mode: ContentSourceModeView;
+    justOneGroup?: boolean;
     hideOptionTypes?: HideOptionTypes;
     onChange: (contentSource: TContentSourceSettings) => void;
     onBOChange?: (item: {

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

@@ -36,7 +36,7 @@ import { deleteContentSourceGroup, setContentSourceGroup, setContentSourceGroupB
 import { handleError } from '@antscorp/antsomi-ui/es/utils';
 const PATH = 'src/components/organism/ContentSources/Settings.tsx';
 const Settings = (props) => {
-    const { serviceAuth, mode, isShowErrorAlert, initValue, journeySettings, hideOptionTypes, onChange, onBOChange, } = props;
+    const { serviceAuth, mode, isShowErrorAlert, initValue, justOneGroup = false, journeySettings, hideOptionTypes, onChange, onBOChange, } = props;
     const { url = '', userId, token, accountId } = serviceAuth;
     const { t } = i18nInstance;
     const boIdByGroupCS = useSelectBoIdByGroupFromCS();
@@ -56,7 +56,7 @@ const Settings = (props) => {
     }, {
         onSuccess(data) {
             if (!isInitDataCDPDone &&
-                isCDP &&
+                (isCDP || justOneGroup) &&
                 isArray(data) &&
                 contentSources.groups.length === 1 &&
                 contentSources.groups[0] &&
@@ -69,7 +69,7 @@ const Settings = (props) => {
                 let valueRanking = GET_TOP_RANKING_DEFAULT;
                 if (itemTypeId === PRODUCT_ITEM_TYPE_ID) {
                     valueRanking = PRODUCT_RANKING_DEFAULT;
-                    if (isCDP) {
+                    if (isCDP || justOneGroup) {
                         set(valueRanking, 'algorithms.sort', 'order');
                     }
                 }
@@ -109,7 +109,7 @@ const Settings = (props) => {
             let valueRanking = GET_TOP_RANKING_DEFAULT;
             if (id === PRODUCT_ITEM_TYPE_ID) {
                 valueRanking = PRODUCT_RANKING_DEFAULT;
-                if (isCDP) {
+                if (isCDP || justOneGroup) {
                     set(valueRanking, 'algorithms.sort', 'order');
                 }
             }
@@ -224,28 +224,28 @@ const Settings = (props) => {
     }, [mode, contentSourceDispatch]);
     // INIT group in case using CDP mode
     useLayoutEffect(() => {
-        if (isCDP && groups.length === 0) {
+        if ((isCDP || justOneGroup) && groups.length === 0) {
             contentSourceDispatch({
                 type: 'ADD_CONTENT_SOURCE',
                 payload: {},
             });
         }
-    }, [isCDP, contentSourceDispatch, groups.length]);
+    }, [isCDP, justOneGroup, contentSourceDispatch, groups.length]);
     // init data
     useDeepCompareEffect(() => {
         if (!isEmpty(initValue)) {
             contentSourceDispatch(updateContentSourceSettings(initValue));
-            if (isCDP) {
+            if (isCDP || justOneGroup) {
                 setIsInitDataCDPDone(true);
             }
         }
         else {
-            if (isCDP) {
+            if (isCDP || justOneGroup) {
                 refetchListBO();
                 setIsInitDataCDPDone(false);
             }
         }
-    }, [initValue, contentSourceDispatch, isCDP]);
+    }, [initValue, contentSourceDispatch, isCDP, justOneGroup]);
     useDeepCompareEffect(() => {
         let ignore = false;
         if (!isEmpty(boIdByGroupCS) && !isEmpty(serviceAuth)) {
@@ -284,7 +284,7 @@ const Settings = (props) => {
         }
     }, [contentSourcesDebounce]);
     return (React.createElement(ContentContainer, { className: "contentsource-container" },
-        React.createElement(Content, { isLoadingListBO: isLoadingListBO || isLoadingDataTableBO, hideOptionTypes: hideOptionTypes, listBO: listBO, groups: groups, expanded: expanded, onChangeExpand: expanded => {
+        React.createElement(Content, { isLoadingListBO: isLoadingListBO || isLoadingDataTableBO, hideOptionTypes: hideOptionTypes, justOneGroup: justOneGroup, listBO: listBO, groups: groups, expanded: expanded, onChangeExpand: expanded => {
                 contentSourceDispatch({
                     type: 'EXPANDED',
                     payload: {
@@ -294,7 +294,7 @@ const Settings = (props) => {
             }, onChangeGroup: (groupId, action) => {
                 handleChangeContentSourceGroup(groupId, action);
             }, onDeleteGroup: groupId => handleDeleteContentSourceGroup(groupId), journeySettings: journeySettings, isShowErrorAlert: isShowErrorAlert, listFallbackBO: listFallbackBO || [] }),
-        groups.length < MAX_NUM_OF_CONTENT_SOURCE && !isCDP && (React.createElement(Button, { type: "text", onClick: () => contentSourceDispatch({
+        groups.length < MAX_NUM_OF_CONTENT_SOURCE && !isCDP && !justOneGroup && (React.createElement(Button, { type: "text", onClick: () => contentSourceDispatch({
                 type: 'ADD_CONTENT_SOURCE',
                 payload: {},
             }) },

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

@@ -17,7 +17,10 @@ const LevelSetting = (props) => {
     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' } : {} },
+    return (React.createElement(SettingWrapper, { label: t(translations.level.title).toString(), labelStyle: {
+            fontWeight: isCDP ? 'normal' : 'bold',
+            width: isCDP ? LABEL_WIDTH : 'auto',
+        }, 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/index.d.ts

@@ -5,6 +5,7 @@ export interface ContentSourceProps {
     useQueryClient: boolean;
     serviceAuth: TServiceAuth;
     isShowErrorAlert: boolean;
+    justOneGroup?: boolean;
     hideOptionTypes?: HideOptionTypes;
     mode: ContentSourceModeView;
     initValue?: TContentSourceSettings;

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

@@ -11,6 +11,7 @@ import { JOURNEY_SETTINGS_DEFAULT } from './constants';
 const defaultProps = {
     useQueryClient: true,
     isShowErrorAlert: false,
+    justOneGroup: false,
     hideOptionTypes: {
         filter: false,
         level: false,
@@ -28,12 +29,12 @@ const defaultProps = {
     },
 };
 const ContentSource = (props) => {
-    const { useQueryClient, serviceAuth, mode, isShowErrorAlert, initValue, hideOptionTypes, journeySettings, onChange, onBOChange, } = props;
+    const { useQueryClient, serviceAuth, mode, isShowErrorAlert, justOneGroup, initValue, hideOptionTypes, journeySettings, onChange, onBOChange, } = props;
     if (!useQueryClient)
-        return (React.createElement(Settings, { mode: mode, initValue: initValue, hideOptionTypes: hideOptionTypes, serviceAuth: serviceAuth, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, onChange: onChange, onBOChange: onBOChange }));
+        return (React.createElement(Settings, { mode: mode, initValue: initValue, hideOptionTypes: hideOptionTypes, justOneGroup: justOneGroup, serviceAuth: serviceAuth, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, onChange: onChange, onBOChange: onBOChange }));
     return (React.createElement(QueryClientProviderAntsomiUI, { client: queryClientAntsomiUI },
         React.createElement(ContentSourceProvider, null,
-            React.createElement(Settings, { mode: mode, initValue: initValue, hideOptionTypes: hideOptionTypes, serviceAuth: serviceAuth, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, onChange: onChange, onBOChange: onBOChange }))));
+            React.createElement(Settings, { mode: mode, initValue: initValue, justOneGroup: justOneGroup, hideOptionTypes: hideOptionTypes, serviceAuth: serviceAuth, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, onChange: onChange, onBOChange: onBOChange }))));
 };
 ContentSource.defaultProps = defaultProps;
 export default memo(ContentSource);

package/es/test.js

@@ -11,7 +11,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import React, { useState } from 'react';
 import { createRoot } from 'react-dom/client';
 import '@antscorp/icons/main.css';
-import { TemplateSaveAsModal, useTemplateSave, Button, Layout, } from './components';
+import { TemplateSaveAsModal, useTemplateSave, Button, Layout, Login, ContentSources, } from './components';
 // Constants
 import { GET_LIST_TYPE, OBJECT_TYPES, PUBLIC_LEVEL } from './constants';
 // import { Slider } from 'antd';
@@ -107,6 +107,24 @@ export const App = () => {
     const callbackSlideBar = (type, data) => {
         console.log({ type, data });
     };
+    const d = {
+        loginDomain: 'https://iam.ants.tech/',
+    };
+    // const d = {
+    //   loginDomain: 'https://sandbox-aacm.ants.vn',
+    //   networkId: '76753',
+    //   theme: 'white',
+    //   u_ogs: 'uogs_sand_48956',
+    //   apiDomain: '//sandbox-permission.ants.vn',
+    // };
+    /* Login */
+    return (React.createElement(ContentSources, { mode: "MEDIA", useQueryClient: true, justOneGroup: true, serviceAuth: {
+            url: 'https://sandbox-media-template.antsomi.com/cdp/api/v1',
+            userId: '1600080515',
+            accountId: '1600083946',
+            token: '5474r2x214z254a4u2a4y454t4065406a434d4e4b4z5',
+        } }));
+    return React.createElement(Login, Object.assign({}, d));
     /* MatchesAnySelect */
     return React.createElement(MatchesAnySelectTest, null);
     /* Data Table */

package/package.json

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