@antscorp/antsomi-ui 1.3.5-beta.380 → 1.3.5-beta.382

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

@@ -20,7 +20,7 @@ import { useLeftMenuContext } from '../../contexts';
 import { useLayoutStore } from '@antscorp/antsomi-ui/es/components/template';
 import { useCustomRouter } from '@antscorp/antsomi-ui/es/hooks';
 // Queries
-import { useUpdateTask } from '@antscorp/antsomi-ui/es/queries/LeftMenu';
+import { useRemoveDashboard } from '@antscorp/antsomi-ui/es/queries/LeftMenu';
 export const useHomeMenu = () => {
     const { pathname, search } = window.location;
     const { navigate, replace } = useCustomRouter();
@@ -32,7 +32,7 @@ export const useHomeMenu = () => {
     const onClickCreateDashboard = useLayoutStore(store => store.state.leftMenu.onClickCreateDashboard);
     const [removedDashboardId, setRemovedDashboardId] = useState('');
     const urlParams = useMemo(() => new URLSearchParams(search), [search]);
-    const { mutateAsync: removeDashboard, isLoading: isDashboardRemoving } = useUpdateTask();
+    const { mutateAsync: removeDashboard, isLoading: isDashboardRemoving } = useRemoveDashboard();
     const onOptionCallback = useCallback((args) => {
         const { optionKey, menuItemKey } = args;
         switch (optionKey) {

package/es/components/organism/LeftMenu/components/common/ChildMenu/styled.js

@@ -14,6 +14,7 @@ export const LabelWrapper = styled(Flex) `
     flex-shrink: 0;
     width: fit-content;
     display: none;
+    text-decoration-line: none !important;
 
     i {
       font-size: 15px !important;
@@ -26,6 +27,7 @@ export const LabelWrapper = styled(Flex) `
 
   &:hover {
     .icon-link {
+      color: inherit !important;
       display: flex;
     }
   }

package/es/components/organism/LeftMenu/utils/index.d.ts

@@ -19,7 +19,7 @@ export declare const flattenMenuArray: <T>(menuItems: T[], childKey: string) =>
  * Recursively filters menu items based on permissions.
  * check permission if menu item has menu_type of @alias MENU_ITEM_TYPE.MENU
  */
-export declare const recursivePermissionMenu: (menuItems: TFeatureMenu[], MenuPermissions: FeatureMenuPermission[]) => TFeatureMenu[];
+export declare const recursivePermissionMenu: (menuItems: TFeatureMenu[], menuPermissions: FeatureMenuPermission[]) => TFeatureMenu[];
 /**
  * Generate a new path by replacing parameters in the given path.
  * @returns {string} The generated path with replaced parameters.

package/es/components/organism/LeftMenu/utils/index.js

@@ -49,16 +49,16 @@ export const flattenMenuArray = (menuItems, childKey) => {
  * Recursively filters menu items based on permissions.
  * check permission if menu item has menu_type of @alias MENU_ITEM_TYPE.MENU
  */
-export const recursivePermissionMenu = (menuItems, MenuPermissions) => {
+export const recursivePermissionMenu = (menuItems, menuPermissions) => {
     var _a, _b;
     const menu = (_b = (_a = menuItems === null || menuItems === void 0 ? void 0 : menuItems.filter(({ permission_code, menu_item_type }) => {
-        if (menu_item_type !== MENU_ITEM_TYPE.MENU) {
+        if (Number(menu_item_type) !== MENU_ITEM_TYPE.MENU) {
             return true;
         }
-        return MenuPermissions === null || MenuPermissions === void 0 ? void 0 : MenuPermissions.find(({ app_code = '', menu_code = '' }) => !!permission_code && [app_code, menu_code].includes(permission_code));
+        return menuPermissions === null || menuPermissions === void 0 ? void 0 : menuPermissions.find(({ app_code = '', menu_code = '' }) => !!permission_code && [app_code, menu_code].includes(permission_code));
     })) === null || _a === void 0 ? void 0 : _a.map(item => (Object.assign(Object.assign({}, item), (isArray(item.children)
         ? {
-            children: recursivePermissionMenu(sortBy(item.children || [], ['level_position']), MenuPermissions),
+            children: recursivePermissionMenu(sortBy(item.children || [], ['level_position']), menuPermissions),
         }
         : {}))))) === null || _b === void 0 ? void 0 : _b.filter(item => !(isArray(item.children) && isEmpty(item.children)));
     return menu;

package/es/components/template/Layout/components/RecommendationWorkspace/components/MenuMapping/components/OldLeftMenu/index.d.ts

@@ -2,7 +2,6 @@ import React from 'react';
 import { AppConfigProviderProps } from '@antscorp/antsomi-ui/es/providers';
 interface OldLeftMenuProps {
     activeKey: string;
-    activeKeyPath: string[];
     appConfig?: AppConfigProviderProps;
     onMenuItemClick?: (key: string, keyPath: string[]) => void;
 }

package/es/components/template/Layout/components/RecommendationWorkspace/components/MenuMapping/index.js

@@ -11,16 +11,14 @@ import { OldLeftMenu } from './components';
 import { AppConfigContext } from '@antscorp/antsomi-ui/es/providers';
 export const MenuMapping = () => {
     const [activeKey, setActiveKey] = useState('DASHBOARD');
-    const [activeKeyPath, setActiveKeyPath] = useState(['DASHBOARD']);
-    const onMenuItemClick = useCallback((key, keyPath) => {
+    const onMenuItemClick = useCallback((key, _keyPath) => {
         setActiveKey(key);
-        setActiveKeyPath(keyPath);
     }, []);
     const appConfig = useContextSelector(AppConfigContext, state => state);
     return (React.createElement(MenuMappingWrapper, null,
         React.createElement(MenuMappingContainer, null,
             React.createElement("div", { className: "old-menu-wrapper" },
-                React.createElement(OldLeftMenu, { activeKey: activeKey, activeKeyPath: activeKeyPath, appConfig: appConfig, onMenuItemClick: onMenuItemClick })),
+                React.createElement(OldLeftMenu, { activeKey: activeKey, appConfig: appConfig, onMenuItemClick: onMenuItemClick })),
             React.createElement(Icon, { type: "icon-ants-arrow-forward" }),
             React.createElement("div", { className: "new-menu-wrapper" },
                 React.createElement(LeftMenu, { appConfig: appConfig, showLogo: false, style: { maxHeight: '100%' }, customization: { isRecommendation: true, activeKey, onMenuItemClick } })))));

package/es/components/template/Layout/components/RecommendationWorkspace/components/RecommendationImage/index.js

@@ -1,12 +1,9 @@
 import React from 'react';
-import { Typography } from '../../../../../../atoms';
+import { Flex, Typography } from '../../../../../../atoms';
 // Assets
-// import recommendationHumanImage from '../../../../../../../assets/images/components/Layout/recommendation-human.png';
 import recommendationHumanImage from '@antscorp/antsomi-ui/es/assets/images/components/Layout/recommendation-human.png';
-// import recommendationHumanImage from '@antscorp/antsomi-ui/es/assets/images/components/Layout/recommendation-human.png';
-// import recommendationHumanImage from '/images/recommendation-human.png';
-import { ImageWrapper, MessageWrapper, RecommendationImageWrapper } from './styled';
-export const RecommendationImage = () => (React.createElement(RecommendationImageWrapper, null,
+import { ImageWrapper, MessageWrapper } from './styled';
+export const RecommendationImage = () => (React.createElement(Flex, { gap: 40, vertical: true },
     React.createElement(MessageWrapper, null,
         React.createElement(Typography.Paragraph, null, `Having Trouble Navigating the New Menus? Let's Map Functions Together!`),
         React.createElement("div", { className: "arrow-triangle-down" })),

package/es/components/template/Layout/components/RecommendationWorkspace/components/RecommendationImage/styled.d.ts

@@ -1,4 +1,2 @@
-/// <reference types="react" />
 export declare const MessageWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ImageWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RecommendationImageWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;

package/es/components/template/Layout/components/RecommendationWorkspace/components/RecommendationImage/styled.js

@@ -1,5 +1,4 @@
 import styled from 'styled-components';
-import { Flex } from '../../../../../../atoms';
 export const MessageWrapper = styled.div `
   padding: 30px;
   width: 395px;
@@ -30,6 +29,7 @@ export const MessageWrapper = styled.div `
 export const ImageWrapper = styled.div `
   width: 215px;
   height: auto;
+  min-height: 505px;
 
   img {
     width: 100%;
@@ -37,10 +37,3 @@ export const ImageWrapper = styled.div `
     object-fit: contain;
   }
 `;
-export const RecommendationImageWrapper = styled(Flex) `
-  padding: 56.5px 38px;
-`;
-RecommendationImageWrapper.defaultProps = {
-    gap: 40,
-    vertical: true,
-};

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

@@ -1,9 +1,17 @@
-import React from 'react';
+// Libraries
+import React, { useLayoutEffect } from 'react';
+// Components
 import { MenuMapping, RecommendationImage } from './components';
 import { Flex } from '../../../../atoms';
+import { useLayoutStore } from '../../stores';
 export const RecommendationWorkspace = () => {
-    const a = 1;
-    return (React.createElement(Flex, { style: { paddingTop: '10px' } },
+    const setHeaderState = useLayoutStore(store => store.setHeaderState);
+    useLayoutEffect(() => {
+        setHeaderState({
+            pageTitle: 'Recommendation',
+        });
+    }, [setHeaderState]);
+    return (React.createElement(Flex, { gap: 220, align: "center", justify: "center", style: { height: '100%' } },
         React.createElement(RecommendationImage, null),
         React.createElement(MenuMapping, null)));
 };

package/es/constants/theme.js

@@ -117,6 +117,7 @@ THEME.components = {
         borderRadiusXS: 0,
         optionActiveBg: '#F2F9FF',
         optionSelectedBg: (_m = THEME.token) === null || _m === void 0 ? void 0 : _m.blue1_1,
+        optionSelectedFontWeight: 400,
         colorBorder: (_o = THEME.token) === null || _o === void 0 ? void 0 : _o.blue1,
         controlItemBgActive: '#E0EBF7',
         colorBgContainerDisabled: (_p = THEME.token) === null || _p === void 0 ? void 0 : _p.bw2,

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

@@ -18,7 +18,7 @@ export type TGetDestinationChannel = {
     options?: UseQueryOptions<any, any, TDestinationChannelResponse, any[]>;
 };
 export declare const useGetDashboard: (params: TGetDashboard) => import("@tanstack/react-query").UseQueryResult<TDashboardResponse, any>;
-export declare const useUpdateTask: () => import("@tanstack/react-query").UseMutationResult<any, unknown, import("../../services/LeftMenu").TRemoveDashboardArgs, unknown>;
+export declare const useRemoveDashboard: () => import("@tanstack/react-query").UseMutationResult<any, unknown, import("../../services/LeftMenu").TRemoveDashboardArgs, unknown>;
 export declare const useGetListMenu: (params: TGetListMenu) => import("@tanstack/react-query").UseQueryResult<TFeatureMenuResponse, any>;
 export declare const useGetListMenuPermission: (params: TGetListMenuPermission) => import("@tanstack/react-query").UseQueryResult<FeatureMenuPermission[], any>;
 export declare const useGetDestinationChannel: (params: TGetDestinationChannel) => import("@tanstack/react-query").UseQueryResult<TDestinationChannelResponse, any>;

package/es/queries/LeftMenu/index.js

@@ -10,7 +10,7 @@ export const useGetDashboard = (params) => {
     const { options, args } = params;
     return useQuery(Object.assign({ queryKey: [QUERY_KEYS.GET_DASHBOARD, args.params, args.auth], queryFn: () => getDashboard(params.args), onSuccess() { } }, options));
 };
-export const useUpdateTask = () => {
+export const useRemoveDashboard = () => {
     const queryClient = useQueryClient();
     return useMutation(removeDashboard, {
         onSuccess: data => {

package/es/services/LeftMenu/index.js

@@ -61,7 +61,7 @@ export const leftMenuServices = {
                 headers,
                 params: {
                     _user_id: auth.userId,
-                    _owner_id: (auth === null || auth === void 0 ? void 0 : auth.accountId) || (auth === null || auth === void 0 ? void 0 : auth.userId),
+                    _owner_id: !(auth === null || auth === void 0 ? void 0 : auth.accountId) || auth.accountId === 'all' ? auth === null || auth === void 0 ? void 0 : auth.userId : auth.accountId,
                     portalId: auth.portalId,
                     languageCode,
                     isGrouped,

package/package.json

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