npm - @antscorp/antsomi-ui - Versions diffs - 1.3.5-beta.277 → 1.3.5-beta.278 - Mend

@antscorp/antsomi-ui 1.3.5-beta.277 → 1.3.5-beta.278

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/es/components/molecules/AccountSelection/AccountListing.js CHANGED Viewed

@@ -65,6 +65,6 @@ export const AccountListing = props => {
                     recentData.value.map(accountId => accountData === null || accountData === void 0 ? void 0 : accountData.find(account => account.userId === accountId)).filter(Boolean).map(account => (React.createElement(AccountItem, { key: account.userId, userName: account.userName, userId: account.userId, onClick: handleSelectAccount, isSelected: +currentAccount === account.userId }))))), accountData === null || accountData === void 0 ? void 0 :
                 accountData.filter(account => !(recentData === null || recentData === void 0 ? void 0 : recentData.value.includes(account.userId)) &&
                     searchStringQuery(account.userName, searchValue)).map(account => (React.createElement(AccountItem, { key: account.userId, userName: account.userName, userId: account.userId, onClick: handleSelectAccount, isSelected: +currentAccount === account.userId }))))),
-        showAllAccount ? (React.createElement(Text, { className: `all-account ${isAllAccount ? 'is-selected' : ''}`, onClick: () => handleSelectAccount('') },
+        showAllAccount ? (React.createElement(Text, { className: `all-account ${isAllAccount ? 'is-selected' : ''}`, onClick: () => handleSelectAccount('all') },
             React.createElement("strong", null, "All account"))) : null));
 };

package/es/components/molecules/HeaderV2/HeaderV2.js CHANGED Viewed

@@ -32,9 +32,9 @@ export const HeaderV2 = memo(props => {
     const { env = envContext, language = languageCode, userId = isNaN(Number(auth === null || auth === void 0 ? void 0 : auth.userId)) ? 0 : Number(auth === null || auth === void 0 ? void 0 : auth.userId), portalId = auth === null || auth === void 0 ? void 0 : auth.portalId, token = auth === null || auth === void 0 ? void 0 : auth.token, permissionDomain = PERMISSION_API, iamDomain = IAM_API, appCode = contextAppCode, menuCode = contextMenuCode, } = config || {};
     const { currentAccount, inputStyle = 'select', onSelectAccount } = accountSelection, accountSelectionProps = __rest(accountSelection, ["currentAccount", "inputStyle", "onSelectAccount"]);
     const urlParams = useMemo(() => new URLSearchParams(search), [search]);
-    const oidParam = (_a = urlParams.get('oid')) !== null && _a !== void 0 ? _a : '';
+    const oidParam = (_a = urlParams.get('oid')) !== null && _a !== void 0 ? _a : 'all';
     // States
-    const [selectedAccount, setSelectedAccount] = useState(`${useURLParam ? oidParam : `${(_b = currentAccount !== null && currentAccount !== void 0 ? currentAccount : userId) !== null && _b !== void 0 ? _b : ''}`}`);
+    const [selectedAccount, setSelectedAccount] = useState(`${useURLParam ? oidParam : `${(_b = currentAccount !== null && currentAccount !== void 0 ? currentAccount : userId) !== null && _b !== void 0 ? _b : 'all'}`}`);
     // Memo
     const accountSelectionDomain = useMemo(() => {
         var _a;
@@ -87,7 +87,7 @@ export const HeaderV2 = memo(props => {
     const handleChangeAccount = (userId) => {
         setSelectedAccount(userId);
         if (useURLParam) {
-            if (userId) {
+            if (userId === 'all') {
                 urlParams.set('oid', userId);
             }
             else {
@@ -99,7 +99,7 @@ export const HeaderV2 = memo(props => {
     };
     return (React.createElement(HeaderV2Styled, { className: className || '', style: style },
         React.createElement("div", { className: "left-side" },
-            React.createElement(AccountSelection, Object.assign({}, accountSelectionProps, { currentAccount: selectedAccount || 'all', apiConfig: accountSelectionApiConfig, onChange: handleChangeAccount, inputStyle: inputStyle })),
+            React.createElement(AccountSelection, Object.assign({}, accountSelectionProps, { currentAccount: selectedAccount, apiConfig: accountSelectionApiConfig, onChange: handleChangeAccount, inputStyle: inputStyle })),
             typeof pageTitle === 'string' ? React.createElement("div", { className: "page-title" }, pageTitle) : pageTitle),
         React.createElement("div", { className: "right-side" },
             showHelp ? React.createElement(Help, Object.assign({ configs: helpConfigProps }, helpProps)) : null,

package/es/components/organism/LeftMenu/components/HomeMenu/useHomeMenu.js CHANGED Viewed

@@ -1,28 +1,44 @@
 // Libraries
 import { useCallback, useMemo } from 'react';
-import { useHistory, useLocation } from 'react-router-dom';
+import { useHistory } from 'react-router-dom';
 // Constants
 import { CONFIG_OPTIONS } from './constants';
-import { HOME_REPORT_ROUTES } from '../../constants';
+import { HOME_REPORT_ROUTES, HOME_ROUTE } from '../../constants';
 // Utils
 import { getGeneratePath, getMenuItem } from '../../utils';
 // Types
 import { useLeftMenuStore } from '../../stores';
 export const useHomeMenu = () => {
     // Hooks
-    const { pathname } = useLocation();
+    const { pathname, hash, search } = window.location;
     const history = useHistory();
+    // Stores
     const appMenuChildren = useLeftMenuStore(store => store.state.appMenuChildren);
     const auth = useLeftMenuStore(store => { var _a; return (_a = store.state.appConfig) === null || _a === void 0 ? void 0 : _a.auth; });
     // Memos
+    const urlParams = useMemo(() => new URLSearchParams(search), [search]);
+    // Handlers
+    const handleSetSearchParams = useCallback((searchParam) => {
+        const url = `${pathname}${hash}`;
+        if (url.includes(getGeneratePath(HOME_ROUTE, Object.assign({}, auth)))) {
+            urlParams.set('type', searchParam);
+            history.replace({ search: urlParams.toString() });
+        }
+        else {
+            history.push(getGeneratePath(HOME_ROUTE, Object.assign({}, auth)));
+            urlParams.set('type', searchParam);
+            history.replace({ search: urlParams.toString() });
+        }
+    }, [auth, hash, history, pathname, urlParams]);
+    // Memos
     const onOptionCallback = useCallback((args) => {
         const { optionKey, menuItemKey } = args;
         switch (optionKey) {
             case CONFIG_OPTIONS.CONFIGURE.key: {
-                const newPathName = getGeneratePath(HOME_REPORT_ROUTES.CONFIGURE, Object.assign(Object.assign({}, auth), { dashboardId: menuItemKey }));
-                if (newPathName !== pathname) {
-                    history.push(newPathName);
-                }
+                const newPathName = getGeneratePath(HOME_REPORT_ROUTES.DETAIL, Object.assign(Object.assign({}, auth), { dashboardId: menuItemKey }));
+                history.push(newPathName);
+                urlParams.set('type', HOME_REPORT_ROUTES.CONFIGURE);
+                history.replace({ search: urlParams.toString() });
                 break;
             }
             case CONFIG_OPTIONS.REMOVE.key:
@@ -30,15 +46,17 @@ export const useHomeMenu = () => {
             default:
                 break;
         }
-    }, [auth, pathname, history]);
+    }, [auth, history, urlParams]);
     const customChildren = useMemo(() => appMenuChildren === null || appMenuChildren === void 0 ? void 0 : appMenuChildren.map(appMenuItem => {
         var _a;
         return getMenuItem(Object.assign(Object.assign({}, appMenuItem), { children: (_a = appMenuItem === null || appMenuItem === void 0 ? void 0 : appMenuItem.children) === null || _a === void 0 ? void 0 : _a.map(item => (Object.assign(Object.assign({}, item), { options: Object.values(CONFIG_OPTIONS), optionCallback: onOptionCallback }))) }));
     }), [appMenuChildren, onOptionCallback]);
     // Callbacks
     const onCreateNewReport = useCallback(() => {
-        history.push(getGeneratePath(HOME_REPORT_ROUTES.CREATE, auth));
-    }, [auth, history]);
+        history.push(getGeneratePath(HOME_ROUTE, auth));
+        urlParams.set('type', HOME_REPORT_ROUTES.CREATE);
+        history.replace({ search: urlParams.toString() });
+    }, [auth, history, urlParams]);
     const onMenuClick = useCallback((key, _) => {
         const newPathName = getGeneratePath(HOME_REPORT_ROUTES.DETAIL, Object.assign(Object.assign({}, auth), { dashboardId: key }));
         if (newPathName !== pathname) {

package/es/components/organism/LeftMenu/constants/variables.d.ts CHANGED Viewed

@@ -16,6 +16,7 @@ export declare const MENU_ITEM_TYPE: {
 };
 export declare const ICON_SIZE = 20;
 export declare const HOME_MENU_ITEMS: Record<string, TMenuFeatureItem>;
+export declare const HOME_ROUTE = "/gen2/:networkId/dashboard";
 export declare const HOME_REPORT_ROUTES: {
     DETAIL: string;
     CONFIGURE: string;

package/es/components/organism/LeftMenu/constants/variables.js CHANGED Viewed

@@ -32,11 +32,11 @@ export const HOME_MENU_ITEMS = {
         icon_name: null,
     },
 };
-const HOME_ROUTE = '/gen2/:networkId/dashboard';
+export const HOME_ROUTE = '/gen2/:networkId/dashboard';
 export const HOME_REPORT_ROUTES = {
     DETAIL: `${HOME_ROUTE}/detail/:dashboardId`,
-    CONFIGURE: `${HOME_ROUTE}/detail/:dashboardId/configure`,
-    CREATE: `${HOME_ROUTE}/create`,
+    CONFIGURE: `configure`,
+    CREATE: `create`,
 };
 /* MARKETING APP */
 export const MARKETING_ROUTES = {

package/es/components/organism/LeftMenu/hooks/useLeftMenu.js CHANGED Viewed

@@ -8,6 +8,8 @@ import { findActiveAppCodeByChild, findActiveAppCodeByUrl, findLastMatchedItemBy
 // Store
 import { useLeftMenuStore } from '../stores';
 import { POST_MESSAGE_TYPES } from '@antscorp/antsomi-ui/es/constants/postMessage';
+// Constants
+import { CDP_API, PERMISSION_API, PERMISSION_ENV_API } from '@antscorp/antsomi-ui/es/constants';
 const initialState = {
     hoverItem: '',
     isExpandMenu: true,
@@ -17,21 +19,22 @@ export const useLeftMenu = (props) => {
     const { objectType = 'OVERVIEW', objectId = 1, isGrouped = true, appConfig, customization, onActiveMenuCodeChange, } = props;
     const { isExpandable = true, isCustomized = false, items, activeKey } = customization || {};
     // Hooks
-    const { pathname, hash } = window.location;
+    const { pathname, hash, search } = window.location;
+    const urlParams = useMemo(() => new URLSearchParams(search), [search]);
     // Stores
     const activeAppCode = useLeftMenuStore(store => store.state.activeAppCode);
     const customActiveAppKey = useLeftMenuStore(store => store.state.customActiveAppKey);
     const setLeftMenuState = useLeftMenuStore(store => store.setState);
     // Destructuring variables
-    const { auth, languageCode } = appConfig || {};
+    const { auth, languageCode, env } = appConfig || {};
     // State
     const [state, setState] = useState(initialState);
     // Queries
     const { data: menuList } = useGetListMenu({
         args: {
             auth: {
-                token: '5474r2x214r2b4b4v2d4y444u2v5q2p5o4d4c4f424e4' || (auth === null || auth === void 0 ? void 0 : auth.token),
-                url: 'https://sandbox-permission.ants.vn',
+                token: env === 'production' ? auth === null || auth === void 0 ? void 0 : auth.token : '5474r2x214r2b4b4v2d4y444u2v5q2p5o4d4c4f424e4',
+                url: env ? PERMISSION_ENV_API[env] : '',
                 portalId: auth === null || auth === void 0 ? void 0 : auth.portalId,
                 userId: auth === null || auth === void 0 ? void 0 : auth.userId,
                 accountId: auth === null || auth === void 0 ? void 0 : auth.accountId,
@@ -44,10 +47,10 @@ export const useLeftMenu = (props) => {
     const { data: menuListPermission } = useGetListMenuPermission({
         args: {
             auth: {
-                token: '5474r2x214z284d4w2b4y454a4p5x2d4j4n4w2q4a4v5' || (auth === null || auth === void 0 ? void 0 : auth.token),
-                url: 'https://permission.antsomi.com',
-                userId: '1600083836' || (auth === null || auth === void 0 ? void 0 : auth.userId),
-                accountId: '1600083836' || (auth === null || auth === void 0 ? void 0 : auth.accountId),
+                token: auth === null || auth === void 0 ? void 0 : auth.token,
+                url: PERMISSION_API,
+                userId: auth === null || auth === void 0 ? void 0 : auth.userId,
+                accountId: auth === null || auth === void 0 ? void 0 : auth.accountId,
             },
             params: {
                 type: 'list-app',
@@ -61,7 +64,7 @@ export const useLeftMenu = (props) => {
         args: {
             auth: {
                 token: auth === null || auth === void 0 ? void 0 : auth.token,
-                url: 'https://sandbox-app.cdp.asia/hub',
+                url: env ? `${CDP_API.production}/hub` : '',
                 portalId: auth === null || auth === void 0 ? void 0 : auth.portalId,
                 userId: auth === null || auth === void 0 ? void 0 : auth.userId,
             },
@@ -76,9 +79,9 @@ export const useLeftMenu = (props) => {
     const { data: destinationChannel } = useGetDestinationChannel({
         args: {
             auth: {
-                token: '5474r2x214z2a46403e4y4749426s2v544r2i4u2k5t5' || (auth === null || auth === void 0 ? void 0 : auth.token),
-                url: 'https://sandbox-app.cdp.asia/hub',
-                userId: '1600085179' || (auth === null || auth === void 0 ? void 0 : auth.userId),
+                token: auth === null || auth === void 0 ? void 0 : auth.token,
+                url: env ? `${CDP_API[env]}/hub` : '',
+                userId: auth === null || auth === void 0 ? void 0 : auth.userId,
                 portalId: auth === null || auth === void 0 ? void 0 : auth.portalId,
             },
             params: {
@@ -165,35 +168,20 @@ export const useLeftMenu = (props) => {
         items,
         customActiveAppKey,
     ]);
-    /**
-     * Active App Item having code matching url
-     */
     useEffect(() => {
+        var _a;
         if (!isCustomized) {
             const url = `${pathname}${hash}`;
+            /**
+             * Active App Item having code matching url
+             */
             const matchAppCode = findActiveAppCodeByUrl({ url, menuItems: mappingChildrenMenu, auth });
             if (matchAppCode && matchAppCode !== activeAppCode) {
                 setLeftMenuState({ activeAppCode: matchAppCode });
             }
-        }
-    }, [
-        isCustomized,
-        activeAppCode,
-        appConfig === null || appConfig === void 0 ? void 0 : appConfig.auth,
-        auth,
-        hash,
-        mappingChildrenMenu,
-        pathname,
-        permissionMenu,
-        setLeftMenuState,
-    ]);
-    /**
-     * Callback function when url change
-     */
-    useEffect(() => {
-        var _a;
-        if (!isCustomized) {
-            const url = `${pathname}${hash}`;
+            /**
+             * Callback function when url change
+             */
             const matchedCode = (_a = findLastMatchedItemByUrl({
                 url,
                 menuItems: mappingChildrenMenu,
@@ -209,12 +197,16 @@ export const useLeftMenu = (props) => {
         }
     }, [
         isCustomized,
+        activeAppCode,
         auth,
-        flattenMenuPermission,
         hash,
         mappingChildrenMenu,
-        onActiveMenuCodeChange,
         pathname,
+        permissionMenu,
+        setLeftMenuState,
+        onActiveMenuCodeChange,
+        flattenMenuPermission,
+        urlParams,
     ]);
     /* Callbacks */
     const onToggleChildMenu = useCallback(() => {

package/es/components/organism/LeftMenu/styled.js CHANGED Viewed

@@ -170,7 +170,7 @@ export const FeatureMenuItem = styled.div `
     .popup-triangle {
       opacity: 0;
       visibility: hidden;
-      right: -4px;
+      right: -6px;
       position: absolute;
       width: 0;
       height: 0;

package/es/constants/api.d.ts CHANGED Viewed

@@ -20,6 +20,11 @@ export declare const APP_PERMISSION_DOMAIN: {
         production: string;
     };
 };
+export declare const PERMISSION_ENV_API: {
+    development: string;
+    sandbox: string;
+    production: string;
+};
 export declare const APP_IAM_DOMAIN: {
     [x: string]: {
         development: string;

package/es/constants/api.js CHANGED Viewed

@@ -17,18 +17,16 @@ export const PLATFORM_API = 'https://platform.ants.tech';
 export const PERMISSION_API = 'https://permission.antsomi.com';
 export const SOCKET_API = 'https://ws.ants.tech';
 export const IAM_API = 'https://iam.ants.tech';
+const PERMISSION_URLS = {
+    [ENV.DEV]: 'https://sandbox-permission.ants.vn',
+    [ENV.SANDBOX]: 'https://sandbox-permission.ants.vn',
+    [ENV.PROD]: 'https://permission.antsomi.com',
+};
 export const APP_PERMISSION_DOMAIN = {
-    [DATAFLOWS]: {
-        [ENV.DEV]: 'https://sandbox-permission.ants.vn',
-        [ENV.SANDBOX]: 'https://sandbox-permission.ants.vn',
-        [ENV.PROD]: 'https://permission.antsomi.com',
-    },
-    [APP_ANTALYSER]: {
-        [ENV.DEV]: 'https://sandbox-permission.ants.vn',
-        [ENV.SANDBOX]: 'https://sandbox-permission.ants.vn',
-        [ENV.PROD]: 'https://permission.antsomi.com',
-    },
+    [DATAFLOWS]: PERMISSION_URLS,
+    [APP_ANTALYSER]: PERMISSION_URLS,
 };
+export const PERMISSION_ENV_API = PERMISSION_URLS;
 export const APP_IAM_DOMAIN = {
     [DATAFLOWS]: {
         [ENV.DEV]: 'https://sandbox-aacm.ants.vn',

package/package.json CHANGED Viewed

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