@antscorp/antsomi-ui 1.3.5-beta.342 → 1.3.5-beta.344

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

@@ -65,6 +65,7 @@ export const useHomeMenu = () => {
     }, [auth, navigate, onClickCreateDashboard, replace, urlParams]);
     const onMenuClick = useCallback((key, _) => {
         const newPathName = getGeneratePath(HOME_REPORT_ROUTES.DETAIL, Object.assign(Object.assign({}, auth), { dashboardId: key }));
+        console.log('newPathName', newPathName);
         if (newPathName !== pathname) {
             navigate(newPathName);
         }

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

@@ -32,6 +32,7 @@ export const LeftMenu = memo(props => {
     }, [activeAppCode, isCustomized, state.hoverItem, onMenuItemClick]);
     const renderFeatureMenuItems = useCallback((item) => {
         const { menu_item_name, menu_item, icon_name, menu_item_code, menu_item_path, menu_item_domain, } = item;
+        console.log('🚀 ~ item:', item);
         const isActive = activeAppCode === menu_item_code;
         const isHover = state.hoverItem === menu_item_code;
         const renderLabel = () => (React.createElement("li", { role: "menuitem", className: classNames({ isActive, isHover }) },

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

@@ -11,7 +11,6 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 // Libraries
 import { cloneDeep, isArray, isEmpty, sortBy } from 'lodash';
-import { generatePath } from 'react-router-dom';
 // Constants
 import { APP_KEYS, MARKETING_CHANNEL_KEY, HOME_MENU_ITEMS, MARKETING_ROUTES, MENU_ITEM_TYPE, RENDER_OPTION, HOME_REPORT_ROUTES, SETTING_APP, } from '../constants';
 import { MARKETING_CHANNEL_CODE } from '../../../template/Layout/constants';
@@ -70,13 +69,24 @@ export const recursivePermissionMenu = (menuItems, MenuPermissions) => {
 export const getGeneratePath = (path, params) => {
     try {
         const { portalId, userId, dashboardId, channelId } = params || {};
-        return generatePath(path, {
+        // return generatePath(path, {
+        //   user_id: userId ?? '-1',
+        //   networkId: portalId ?? -1,
+        //   portalId: portalId ?? -1,
+        //   dashboardId: dashboardId ?? '-1',
+        //   channelId: channelId ?? -1,
+        // });
+        const paramsObjects = {
             user_id: userId !== null && userId !== void 0 ? userId : '-1',
             networkId: portalId !== null && portalId !== void 0 ? portalId : -1,
             portalId: portalId !== null && portalId !== void 0 ? portalId : -1,
             dashboardId: dashboardId !== null && dashboardId !== void 0 ? dashboardId : '-1',
             channelId: channelId !== null && channelId !== void 0 ? channelId : -1,
+        };
+        Object.keys(paramsObjects).forEach(key => {
+            path = path.replace(`:${key}`, paramsObjects[key]);
         });
+        return path;
     }
     catch (error) {
         handleError(error, {

package/es/components/template/TemplateListing/components/CategoryListing/index.js

@@ -27,7 +27,9 @@ import { handleError } from '@antscorp/antsomi-ui/es/utils';
 import { CATEGORY_DEBOUNCE, CATEGORY_LISTING_WITH } from '../../constants';
 const PATH = 'src/components/template/TemplateListing/components/CategoryListing/index.tsx';
 export const CategoryListing = memo(props => {
-    const { width = CATEGORY_LISTING_WITH, items = [], loading = false, show = true, checkedCategories = {}, emptyProps, debounceChangeMenu = CATEGORY_DEBOUNCE, header, footer, onMenuChange } = props, restOfProps = __rest(props, ["width", "items", "loading", "show", "checkedCategories", "emptyProps", "debounceChangeMenu", "header", "footer", "onMenuChange"]);
+    const { width = CATEGORY_LISTING_WITH, items = [], loading = false, show = true, checkedCategories = {}, emptyProps, debounceChangeMenu = CATEGORY_DEBOUNCE, header, footer, 
+    /* Wrapper */
+    wrapperClassName, wrapperStyle, onMenuChange } = props, restOfProps = __rest(props, ["width", "items", "loading", "show", "checkedCategories", "emptyProps", "debounceChangeMenu", "header", "footer", "wrapperClassName", "wrapperStyle", "onMenuChange"]);
     const [checkedState, setCheckedState] = useState({});
     useEffect(() => {
         setCheckedState(prev => (isEqual(prev, checkedCategories) ? prev : checkedCategories));
@@ -112,7 +114,7 @@ export const CategoryListing = memo(props => {
         });
         return menuItems;
     }, [getItem, items]);
-    return (show && !isEmpty(menuItems)) || header || loading ? (React.createElement(MenuWrapper, { "$width": width },
+    return (show && !isEmpty(menuItems)) || header || loading ? (React.createElement(MenuWrapper, { "$width": width, className: wrapperClassName, style: wrapperStyle },
         header,
         React.createElement(Scrollbars, { className: "category__listing" },
             React.createElement(Spin, { spinning: loading, wrapperClassName: "template-listing__loading" },

package/es/components/template/TemplateListing/constants/defaultProps.d.ts

@@ -1,7 +1,7 @@
 import { ThumbnailCardProps } from '../../../molecules';
 import { BlankTemplateProps, CategoryListingProps, TemplateListingProps, TemplatesProps } from '../types';
 import { EmptyProps } from '../types/Empty';
-export declare const CATEGORY_LISTING_WITH = 220;
+export declare const CATEGORY_LISTING_WITH = 230;
 export declare const THUMBNAIL_URL = "https://st-media-template.antsomi.com/base64-img/37563.png";
 export declare const LISTING_GAP_DEFAULT = 30;
 export declare const CATEGORY_DEBOUNCE = 400;

package/es/components/template/TemplateListing/constants/defaultProps.js

@@ -1,5 +1,5 @@
 /* Variables */
-export const CATEGORY_LISTING_WITH = 220;
+export const CATEGORY_LISTING_WITH = 230;
 export const THUMBNAIL_URL = 'https://st-media-template.antsomi.com/base64-img/37563.png';
 export const LISTING_GAP_DEFAULT = 30;
 export const CATEGORY_DEBOUNCE = 400;

package/es/components/template/TemplateListing/types/CategoryListing.d.ts

@@ -13,6 +13,8 @@ export interface CategoryListingProps extends MenuProps {
     emptyProps?: EmptyProps;
     header?: ReactNode;
     footer?: ReactNode;
+    wrapperClassName?: string;
+    wrapperStyle?: React.CSSProperties;
     onMenuChange?: (value: TCheckedCategories) => void;
 }
 export type TMenuItem = Required<MenuProps>['items'][number];

package/package.json

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