@antscorp/antsomi-ui 1.3.5-beta.295 → 1.3.5-beta.297

package/es/components/atoms/Scrollbars/Scrollbars.js

@@ -19,7 +19,7 @@ const THUMB_SIZE = 4;
 const MARGIN = 3;
 export const Scrollbars = props => {
     // Props
-    const { autoHide = true, autoHeightMax = 0 } = props, restProps = __rest(props, ["autoHide", "autoHeightMax"]);
+    const { autoHide = true, autoHeightMax = 0, className } = props, restProps = __rest(props, ["autoHide", "autoHeightMax", "className"]);
     // Refs
     const ref = useRef(null);
     /**
@@ -52,7 +52,7 @@ export const Scrollbars = props => {
             ref.current.thumbHorizontal.style.transform = `translateX(${thumbHorizontalPosition}px)`;
         }
     };
-    return (React.createElement(CustomScrollbars, Object.assign({ className: "custom-scrollbars", ref: ref, autoHide: autoHide, autoHeightMax: autoHeightMax, renderThumbVertical: props => React.createElement(ThumbBar, Object.assign({ className: "thumb-vertical" }, props)), renderThumbHorizontal: props => React.createElement(ThumbBar, Object.assign({ className: "thumb-horizontal" }, props)), renderTrackVertical: (_a) => {
+    return (React.createElement(CustomScrollbars, Object.assign({ className: `custom-scrollbars ${className || ''}`, ref: ref, autoHide: autoHide, autoHeightMax: autoHeightMax, renderThumbVertical: props => React.createElement(ThumbBar, Object.assign({ className: "thumb-vertical" }, props)), renderThumbHorizontal: props => React.createElement(ThumbBar, Object.assign({ className: "thumb-horizontal" }, props)), renderTrackVertical: (_a) => {
             var { style } = _a, restOfProps = __rest(_a, ["style"]);
             return (React.createElement(VerticalTrack, Object.assign({ className: "scrollbar-track" }, restOfProps, { style: Object.assign(Object.assign({}, style), { display: 'block' }) })));
         }, renderTrackHorizontal: (_a) => {

package/es/components/molecules/AccountSelection/AccountListing.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { AccountRecent } from '@antscorp/antsomi-ui/es/models/AccountListing';
 export interface AccountListingProps {
     className?: string;
     apiConfig: {
@@ -22,7 +23,7 @@ interface AccountData {
 }
 export interface AccountListingHandle {
     getUsers: () => {
-        recentData: any;
+        recentData?: AccountRecent;
         accountData: Array<AccountData>;
     };
 }

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

@@ -1,59 +1,19 @@
 import Icon from '@antscorp/icons';
-import React, { useCallback, useImperativeHandle, useMemo, useState } from 'react';
-import { Divider, Input } from 'antd';
+import React, { useCallback, useImperativeHandle, useState } from 'react';
 import { Scrollbars, Text } from '@antscorp/antsomi-ui/es/components/atoms';
+import { Divider, Input } from 'antd';
 import { AccountItem } from './components';
 import { AccountSelectionStyled } from './styled';
-import { PORTALS_IDS, THEME } from '@antscorp/antsomi-ui/es/constants';
+import { THEME } from '@antscorp/antsomi-ui/es/constants';
 import { searchStringQuery } from '@antscorp/antsomi-ui/es/utils';
-import { useGetAccountList, useGetPermissionAccountList, useGetRecentAccount } from '../../..';
+import { useAccountSelection } from './hooks';
 export const AccountListing = React.forwardRef((props, ref) => {
     var _a, _b, _c;
     const { className, apiConfig, showAllAccount = true, currentAccount = '', onChange } = props;
-    const { domain, token, userId, appCode, menuCode, portalId } = apiConfig;
     // States
     const [searchValue, setSearchValue] = useState('');
-    // Queries
-    const { data } = useGetAccountList({
-        apiConfig,
-        options: {
-            enabled: portalId !== PORTALS_IDS.SANDBOX_76753,
-        },
-    });
-    const { data: permissionAccountList } = useGetPermissionAccountList({
-        args: {
-            _account_id: userId,
-            _user_id: userId,
-            _app_code: appCode || '',
-            _token: token,
-            domain,
-            appCode: appCode || '',
-            fullParent: true,
-            menuCode: menuCode || appCode || '',
-        },
-        options: {
-            enabled: portalId === PORTALS_IDS.SANDBOX_76753,
-        },
-    });
-    const { data: recentData } = useGetRecentAccount({
-        apiConfig,
-        options: {
-            enabled: portalId !== PORTALS_IDS.SANDBOX_76753,
-        },
-    });
+    const { accountData, recentData } = useAccountSelection(apiConfig);
     const isAllAccount = currentAccount === 'all';
-    // Memos
-    const accountData = useMemo(() => {
-        if (portalId === PORTALS_IDS.SANDBOX_76753) {
-            return ((permissionAccountList === null || permissionAccountList === void 0 ? void 0 : permissionAccountList.map(account => ({
-                email: account.email,
-                userId: account.user_id,
-                userName: account.full_name,
-                status: 1,
-            }))) || []);
-        }
-        return (data === null || data === void 0 ? void 0 : data.entries) || [];
-    }, [data === null || data === void 0 ? void 0 : data.entries, permissionAccountList, portalId]);
     useImperativeHandle(ref, () => ({
         getUsers() {
             return { recentData, accountData };

package/es/components/molecules/AccountSelection/AccountSelection.js

@@ -11,57 +11,22 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 // Libraries
 import Icon from '@antscorp/icons';
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 // Styled
 import { PopoverFieldStyled } from './styled';
 // Components
-import { Tooltip } from 'antd';
 import { Popover } from '@antscorp/antsomi-ui/es/components/atoms';
+import { Tooltip } from 'antd';
 import { AccountListing } from './AccountListing';
-import { useGetAccountList, useGetPermissionAccountList } from '../../..';
 // Constants
-import { PORTALS_IDS } from '@antscorp/antsomi-ui/es/constants';
+import { useAccountSelection } from './hooks';
 export const AccountSelection = props => {
     const { show = true, inputStyle = 'input', inputClassName, onChange, getPopupContainer, zIndex } = props, accountListingProps = __rest(props, ["show", "inputStyle", "inputClassName", "onChange", "getPopupContainer", "zIndex"]);
     const { apiConfig, currentAccount = '' } = props;
-    const { domain, token, userId, appCode, portalId } = apiConfig;
     // States
     const [inputLabel, setInputLabel] = useState('');
     const [open, setOpen] = useState(false);
-    // Queries
-    const { data } = useGetAccountList({
-        apiConfig,
-        options: {
-            enabled: portalId !== PORTALS_IDS.SANDBOX_76753,
-        },
-    });
-    const { data: permissionAccountList } = useGetPermissionAccountList({
-        args: {
-            _account_id: userId,
-            _user_id: userId,
-            _app_code: appCode || '',
-            _token: token,
-            domain,
-            appCode: appCode || '',
-            fullParent: true,
-            menuCode: appCode || '',
-        },
-        options: {
-            enabled: portalId === PORTALS_IDS.SANDBOX_76753,
-        },
-    });
-    // Memos
-    const accountData = useMemo(() => {
-        if (portalId === PORTALS_IDS.SANDBOX_76753) {
-            return ((permissionAccountList === null || permissionAccountList === void 0 ? void 0 : permissionAccountList.map(account => ({
-                email: account.email,
-                userId: account.user_id,
-                userName: account.full_name,
-                status: 1,
-            }))) || []);
-        }
-        return (data === null || data === void 0 ? void 0 : data.entries) || [];
-    }, [data === null || data === void 0 ? void 0 : data.entries, permissionAccountList, portalId]);
+    const { accountData } = useAccountSelection(apiConfig);
     // Side Effects
     useEffect(() => {
         var _a;

package/es/components/molecules/AccountSelection/hooks/index.d.ts

@@ -0,0 +1 @@
+export { useAccountSelection } from './useAccountSelection';

package/es/components/molecules/AccountSelection/hooks/index.js

@@ -0,0 +1 @@
+export { useAccountSelection } from './useAccountSelection';

package/es/components/molecules/AccountSelection/hooks/useAccountSelection.d.ts

@@ -0,0 +1,20 @@
+import { AccountRecent } from '@antscorp/antsomi-ui/es/models/AccountListing';
+interface AccountData {
+    email: any;
+    userId: any;
+    userName: any;
+    status: number;
+}
+export declare const useAccountSelection: (apiConfig: {
+    domain: string;
+    token: string;
+    userId: number;
+    portalId?: number;
+    languageCode?: string;
+    appCode?: string;
+    menuCode?: string;
+}) => {
+    recentData?: AccountRecent | undefined;
+    accountData: Array<AccountData>;
+};
+export {};

package/es/components/molecules/AccountSelection/hooks/useAccountSelection.js

@@ -0,0 +1,49 @@
+// Libraries
+import { useMemo } from 'react';
+// Queries
+import { useGetAccountList, useGetPermissionAccountList, useGetRecentAccount, } from '@antscorp/antsomi-ui/es/queries';
+// Constant
+import { PORTALS_IDS } from '@antscorp/antsomi-ui/es/constants';
+export const useAccountSelection = (apiConfig) => {
+    const { domain, token, userId, appCode, menuCode, portalId } = apiConfig;
+    const { data } = useGetAccountList({
+        apiConfig,
+        options: {
+            enabled: portalId !== PORTALS_IDS.SANDBOX_76753,
+        },
+    });
+    const { data: permissionAccountList } = useGetPermissionAccountList({
+        args: {
+            _account_id: userId,
+            _user_id: userId,
+            _app_code: appCode || '',
+            _token: token,
+            domain,
+            appCode: appCode || '',
+            fullParent: true,
+            menuCode: menuCode || appCode || '',
+        },
+        options: {
+            enabled: portalId === PORTALS_IDS.SANDBOX_76753,
+        },
+    });
+    const { data: recentData } = useGetRecentAccount({
+        apiConfig,
+        options: {
+            enabled: portalId !== PORTALS_IDS.SANDBOX_76753,
+        },
+    });
+    // Memos
+    const accountData = useMemo(() => {
+        if (portalId === PORTALS_IDS.SANDBOX_76753) {
+            return ((permissionAccountList === null || permissionAccountList === void 0 ? void 0 : permissionAccountList.map(account => ({
+                email: account.email,
+                userId: account.user_id,
+                userName: account.full_name,
+                status: 1,
+            }))) || []);
+        }
+        return (data === null || data === void 0 ? void 0 : data.entries) || [];
+    }, [data === null || data === void 0 ? void 0 : data.entries, permissionAccountList, portalId]);
+    return { recentData, accountData };
+};

package/es/components/molecules/AccountSelection/index.d.ts

@@ -1,2 +1,3 @@
 export { AccountSelection, type AccountSelectionProps } from './AccountSelection';
 export { AccountListing, AccountListingHandle } from './AccountListing';
+export { useAccountSelection } from './hooks';

package/es/components/molecules/AccountSelection/index.js

@@ -1,2 +1,3 @@
 export { AccountSelection } from './AccountSelection';
 export { AccountListing } from './AccountListing';
+export { useAccountSelection } from './hooks';

package/es/components/molecules/index.d.ts

@@ -1,4 +1,4 @@
-export { AccountSelection, AccountListing } from './AccountSelection';
+export { AccountSelection, AccountListing, useAccountSelection } from './AccountSelection';
 export { Cascader } from './Cascader';
 export { Dropdown } from './Dropdown';
 export { Modal } from './Modal';

package/es/components/molecules/index.js

@@ -1,4 +1,4 @@
-export { AccountSelection, AccountListing } from './AccountSelection';
+export { AccountSelection, AccountListing, useAccountSelection } from './AccountSelection';
 export { Cascader } from './Cascader';
 export { Dropdown } from './Dropdown';
 export { Modal } from './Modal';

package/package.json

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