awing-library 2.1.2-dev.99 → 2.1.2-preview.1

package/dist/Layouts/Toolbar/LanguageBox/Container.js

@@ -0,0 +1,131 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { capitalize } from "lodash";
+import { KeyboardArrowDown } from "@mui/icons-material";
+import { Button, ListItemIcon, Menu, MenuItem, NoSsr, Stack, Tooltip } from "@mui/material";
+import gb from "../flag/gb.js";
+import id from "../flag/id.js";
+import vn from "../flag/vn.js";
+import th from "../flag/th.js";
+const LanguageBox = (props)=>{
+    const { t, i18n } = useTranslation();
+    const { languages = [
+        {
+            lang: 'en',
+            icon: /*#__PURE__*/ jsx(gb, {})
+        },
+        {
+            lang: 'vi',
+            icon: /*#__PURE__*/ jsx(vn, {})
+        },
+        {
+            lang: 'th',
+            icon: /*#__PURE__*/ jsx(th, {}),
+            translateBy: 'AI'
+        },
+        {
+            lang: 'id',
+            icon: /*#__PURE__*/ jsx(id, {}),
+            translateBy: 'AI'
+        }
+    ] } = props;
+    const [languageMenu, setLanguageMenu] = useState(null);
+    const handleLanguageIconClick = (event)=>{
+        setLanguageMenu(event.currentTarget);
+    };
+    const handleLanguageMenuClose = (event)=>{
+        if ('A' === event.currentTarget.nodeName) document.cookie = `userLanguage=${event.currentTarget.lang};path=/;max-age=31536000`;
+        setLanguageMenu(null);
+    };
+    const handleChangeLanguage = (lang)=>{
+        i18n.changeLanguage(lang);
+        setLanguageMenu(null);
+    };
+    const getDefaultFlag = ()=>{
+        const tmpLang = i18n.language;
+        const crLang = languages.find((l)=>l.lang === tmpLang);
+        if (crLang) return crLang.icon;
+        return /*#__PURE__*/ jsx(gb, {});
+    };
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsx(Tooltip, {
+                title: t('Common.ChangeLanguage').toString(),
+                enterDelay: 300,
+                children: /*#__PURE__*/ jsx(Button, {
+                    id: "language-button",
+                    color: "inherit",
+                    size: "small",
+                    "aria-haspopup": "true",
+                    "aria-owns": languageMenu ? 'language-menu' : void 0,
+                    onClick: handleLanguageIconClick,
+                    endIcon: /*#__PURE__*/ jsx(KeyboardArrowDown, {}),
+                    children: /*#__PURE__*/ jsx(Stack, {
+                        style: {
+                            display: 'flex',
+                            alignItems: 'center',
+                            width: '25px',
+                            height: '17px'
+                        },
+                        sx: {
+                            '& > svg': {
+                                width: '100%',
+                                boxShadow: ' rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px; '
+                            }
+                        },
+                        children: getDefaultFlag()
+                    })
+                })
+            }),
+            /*#__PURE__*/ jsx(NoSsr, {
+                defer: true,
+                children: /*#__PURE__*/ jsx(Menu, {
+                    id: "language-menu",
+                    anchorEl: languageMenu,
+                    open: Boolean(languageMenu),
+                    onClose: handleLanguageMenuClose,
+                    anchorOrigin: {
+                        vertical: 'bottom',
+                        horizontal: 'center'
+                    },
+                    transformOrigin: {
+                        vertical: 'top',
+                        horizontal: 'center'
+                    },
+                    children: languages.map((l, index)=>/*#__PURE__*/ jsxs(MenuItem, {
+                            id: l.lang,
+                            selected: i18n.language === l.lang,
+                            onClick: ()=>handleChangeLanguage(l.lang),
+                            children: [
+                                /*#__PURE__*/ jsx(ListItemIcon, {
+                                    children: /*#__PURE__*/ jsx(Stack, {
+                                        style: {
+                                            display: 'flex',
+                                            alignItems: 'center',
+                                            width: '25px',
+                                            height: '17px'
+                                        },
+                                        sx: {
+                                            '& > svg': {
+                                                width: '100%',
+                                                boxShadow: ' rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px; '
+                                            }
+                                        },
+                                        children: l.icon
+                                    })
+                                }),
+                                t(`Language.${capitalize(l.lang)}`),
+                                ' ',
+                                l.translateBy ? t("Language.TranslateBy", {
+                                    author: l.translateBy
+                                }) : null
+                            ]
+                        }, index))
+                })
+            })
+        ]
+    });
+};
+const Container = LanguageBox;
+export { Container as default };

package/dist/Layouts/Toolbar/LanguageBox/Container.test.js

@@ -0,0 +1,89 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { fireEvent, render, screen } from "@testing-library/react";
+import Container from "./Container.js";
+jest.mock('../flag/gb', ()=>({
+        __esModule: true,
+        default: ()=>'EnglandFlag'
+    }));
+jest.mock('../flag/id', ()=>({
+        __esModule: true,
+        default: ()=>'IndonesiaFlag'
+    }));
+jest.mock('../flag/vn', ()=>({
+        __esModule: true,
+        default: ()=>'VietnamFlag'
+    }));
+jest.mock('../flag/th', ()=>({
+        __esModule: true,
+        default: ()=>'VietnamFlag'
+    }));
+jest.mock('@mui/material', ()=>({
+        ...jest.requireActual('@mui/material'),
+        Button: ({ children, onClick })=>/*#__PURE__*/ jsx("button", {
+                onClick: onClick,
+                "data-testid": "Material-Button",
+                children: children
+            }),
+        Menu: ({ children, open, onClose })=>/*#__PURE__*/ jsxs("div", {
+                "data-testid": "Material-Menu",
+                children: [
+                    open ? /*#__PURE__*/ jsx("div", {
+                        children: children
+                    }) : null,
+                    /*#__PURE__*/ jsx("button", {
+                        onClick: onClose,
+                        "data-testid": "Material-Menu-onClose",
+                        children: "Close"
+                    })
+                ]
+            }),
+        MenuItem: ({ id, children, onClick })=>/*#__PURE__*/ jsxs("div", {
+                "data-testid": `Material-MenuItem-${id}`,
+                children: [
+                    children,
+                    /*#__PURE__*/ jsx("button", {
+                        onClick: onClick,
+                        "data-testid": `Material-MenuItem-${id}-onClick`,
+                        children: "MenuItem"
+                    })
+                ]
+            })
+    }));
+const getRender = ()=>{
+    render(/*#__PURE__*/ jsx(Container, {}));
+};
+const Container_test_link = /*#__PURE__*/ jsx("a", {
+    href: "#",
+    children: "ClickMe"
+});
+describe('Render & Actions', ()=>{
+    it('should render button flag', ()=>{
+        getRender();
+        expect(screen.getByTestId('Material-Button')).toBeInTheDocument();
+    });
+    it('should show menu when click button flag', ()=>{
+        getRender();
+        fireEvent.click(screen.getByTestId('Material-Button'), {
+            currentTarget: '<button>ClickMe</button>'
+        });
+        expect(screen.getByTestId('Material-Menu')).toBeInTheDocument();
+        fireEvent.click(screen.getByTestId('Material-MenuItem-vi-onClick'));
+        expect(screen.queryByTestId('Material-MenuItem-vi-onClick')).not.toBeInTheDocument();
+        fireEvent.click(screen.getByTestId('Material-Button'), {
+            currentTarget: '<button>ClickMe</button>'
+        });
+        fireEvent.click(screen.getByTestId('Material-MenuItem-en-onClick'));
+        expect(screen.queryByTestId('Material-MenuItem-en-onClick')).not.toBeInTheDocument();
+    });
+    it('should call onClose', ()=>{
+        getRender();
+        fireEvent.click(screen.getByTestId('Material-Button'), {
+            currentTarget: '<button>ClickMe</button>'
+        });
+        expect(screen.getByTestId('Material-Menu')).toBeInTheDocument();
+        fireEvent.click(screen.getByTestId('Material-Menu-onClose'), {
+            currentTarget: Container_test_link
+        });
+        expect(screen.queryByTestId('Material-MenuItem-en-onClick')).not.toBeInTheDocument();
+    });
+});

package/dist/Layouts/Toolbar/LanguageBox/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Container';
+//# sourceMappingURL=index.d.ts.map

package/dist/Layouts/Toolbar/LanguageBox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/Layouts/Toolbar/LanguageBox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC"}

package/dist/Layouts/Toolbar/LanguageBox/index.js

@@ -0,0 +1,2 @@
+import Container from "./Container.js";
+export { Container as default };

package/dist/Layouts/Toolbar/Notifications/Container.d.ts

@@ -0,0 +1,4 @@
+/** Component Notifications */
+declare function Container(): import("react/jsx-runtime").JSX.Element;
+export default Container;
+//# sourceMappingURL=Container.d.ts.map

package/dist/Layouts/Toolbar/Notifications/Container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.d.ts","sourceRoot":"","sources":["../../../../src/Layouts/Toolbar/Notifications/Container.tsx"],"names":[],"mappings":"AAMA,8BAA8B;AAC9B,iBAAS,SAAS,4CAyBjB;AAED,eAAe,SAAS,CAAC"}

package/dist/Layouts/Toolbar/Notifications/Container.js

@@ -0,0 +1,28 @@
+import { jsx } from "react/jsx-runtime";
+import Notifications from "@mui/icons-material/Notifications";
+import { NotificationPopover } from "../../../Features/COMMON/Notifications/index.js";
+import { IconButton } from "@mui/material";
+import { useGetToolbarContext } from "../context.js";
+import { useState } from "react";
+function Container_Container() {
+    const { services } = useGetToolbarContext();
+    const [numberNotification, setnumberNotification] = useState(0);
+    const handleClick = (count)=>{
+        setnumberNotification(count);
+    };
+    return services ? /*#__PURE__*/ jsx(NotificationPopover, {
+        numberNotification: numberNotification,
+        service: {
+            notificationsCountUnreadMessages: services.notificationsCountUnreadMessages,
+            notificationsPaging: services.notificationsPaging,
+            notificationsRead: services.notificationsRead,
+            notificationsReadAll: services.notificationsReadAll,
+            notificationsUnread: services.notificationsUnread
+        },
+        onNotificationClick: handleClick
+    }) : /*#__PURE__*/ jsx(IconButton, {
+        children: /*#__PURE__*/ jsx(Notifications, {})
+    });
+}
+const Container = Container_Container;
+export { Container as default };

package/dist/Layouts/Toolbar/Notifications/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Container';
+//# sourceMappingURL=index.d.ts.map

package/dist/Layouts/Toolbar/Notifications/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/Layouts/Toolbar/Notifications/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC"}

package/dist/Layouts/Toolbar/Notifications/index.js

@@ -0,0 +1,2 @@
+import Container from "./Container.js";
+export { Container as default };

package/dist/Layouts/Toolbar/Services.d.ts

@@ -0,0 +1,25 @@
+import { Workspace } from '../../Features/SYSTEM/types';
+import { NotificationService } from '../../Features/COMMON/Notifications/Services';
+import { CurrentUser } from './Types';
+export type ToolbarServices = NotificationService & {
+    getAllWorkSpaceByUserPermission: (p: {
+        userId: number;
+    }) => Promise<{
+        items: Workspace[];
+        totalCount: number;
+    }>;
+    getWorkspaceById?: (p: {
+        id: number;
+    }) => Promise<Workspace>;
+    getFavoriteWorkspaces: (p: {
+        totalDefaultFavoriteWorkspace: number;
+        workspaceIds: number[];
+    }) => Promise<{
+        items: Workspace[];
+        totalCount: number;
+    }>;
+    getCurrentUser: () => Promise<CurrentUser>;
+    onLogout: () => Promise<void>;
+    onChangeWorkspace?: () => Promise<void>;
+};
+//# sourceMappingURL=Services.d.ts.map

package/dist/Layouts/Toolbar/Services.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Services.d.ts","sourceRoot":"","sources":["../../../src/Layouts/Toolbar/Services.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAAG;IAEhD,+BAA+B,EAAE,CAAC,CAAC,EAAE;QAAE,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC;QAAE,KAAK,EAAE,SAAS,EAAE,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAEhH,gBAAgB,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,SAAS,CAAC,CAAC;IAE7D,qBAAqB,EAAE,CAAC,CAAC,EAAE;QACvB,6BAA6B,EAAE,MAAM,CAAC;QACtC,YAAY,EAAE,MAAM,EAAE,CAAC;KAC1B,KAAK,OAAO,CAAC;QAAE,KAAK,EAAE,SAAS,EAAE,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAE1D,cAAc,EAAE,MAAM,OAAO,CAAC,WAAW,CAAC,CAAC;IAE3C,QAAQ,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAE9B,iBAAiB,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC3C,CAAC"}

package/dist/Layouts/Toolbar/Types.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+export type Workspace = {
+    customerId?: number;
+    contactPhoneNumber?: string;
+    customizeCustomerFormPath?: string;
+    customerType?: string;
+    description?: string;
+    id?: number;
+    isJoinNetwork?: boolean;
+    name?: string;
+    type?: string;
+    url?: string;
+    workspaceClassId?: number;
+    icons?: ReactNode;
+};
+export type CurrentUser = {
+    id: number;
+    name?: string;
+    username?: string;
+    description?: string;
+    gender?: number;
+    image?: string;
+};
+//# sourceMappingURL=Types.d.ts.map

package/dist/Layouts/Toolbar/Types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Types.d.ts","sourceRoot":"","sources":["../../../src/Layouts/Toolbar/Types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,SAAS,GAAG;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC"}

package/dist/Layouts/Toolbar/UserBox/Container.d.ts

@@ -0,0 +1,3 @@
+declare const UserBox: () => import("react/jsx-runtime").JSX.Element;
+export default UserBox;
+//# sourceMappingURL=Container.d.ts.map

package/dist/Layouts/Toolbar/UserBox/Container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.d.ts","sourceRoot":"","sources":["../../../../src/Layouts/Toolbar/UserBox/Container.tsx"],"names":[],"mappings":"AAWA,QAAA,MAAM,OAAO,+CAkHZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/Layouts/Toolbar/UserBox/Container.js

@@ -0,0 +1,147 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Logout, Person, Settings } from "@mui/icons-material";
+import { useAtomValue } from "jotai";
+import { Avatar, Divider, IconButton, ListItemIcon, Menu, MenuItem, Tooltip } from "@mui/material";
+import { Constants } from "../../../Commons/Constant.js";
+import { useAppHelper } from "../../../Context/index.js";
+import { currentUserState } from "../Atom.js";
+import { useGetToolbarContext } from "../context.js";
+const UserBox = ()=>{
+    const { t } = useTranslation();
+    const { snackbar } = useAppHelper();
+    const { services } = useGetToolbarContext();
+    const currentUser = useAtomValue(currentUserState);
+    const [anchorEl, setAnchorEl] = useState(null);
+    const open = Boolean(anchorEl);
+    const handleClick = (event)=>{
+        setAnchorEl(event.currentTarget);
+    };
+    const handleClose = ()=>{
+        setAnchorEl(null);
+    };
+    const handleComingSoon = ()=>{
+        snackbar('warning', t('Common.CommingSoon'));
+        setAnchorEl(null);
+    };
+    const getFirstLetterFromString = (str)=>str.substring(0, 1);
+    const handleLogout = async ()=>{
+        setAnchorEl(null);
+        if (services) await services.onLogout();
+    };
+    const handleProfileDetail = ()=>{
+        const profileUrl = `${Constants.ID_DOMAIN}/${Constants.PROFILE_PATH}/${Constants.USER_PROFILE_INFO}`;
+        window.location.href = profileUrl;
+        setAnchorEl(null);
+    };
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsx(Tooltip, {
+                title: t('Common.UserProfile').toString(),
+                children: /*#__PURE__*/ jsx(IconButton, {
+                    id: "user-profile-button",
+                    "aria-controls": "user-profile-menu",
+                    "aria-haspopup": "true",
+                    "aria-expanded": open ? 'true' : void 0,
+                    onClick: handleClick,
+                    sx: {
+                        ml: 1
+                    },
+                    children: /*#__PURE__*/ jsx(Avatar, {
+                        sx: {
+                            width: 32,
+                            height: 32
+                        },
+                        children: getFirstLetterFromString(currentUser?.username ?? t('User.Username'))?.toLocaleUpperCase()
+                    })
+                })
+            }),
+            /*#__PURE__*/ jsxs(Menu, {
+                id: "user-profile-menu",
+                "aria-labelledby": "user-profile-button",
+                anchorEl: anchorEl,
+                open: open,
+                onClose: handleClose,
+                onClick: handleClose,
+                slotProps: {
+                    paper: {
+                        elevation: 0,
+                        sx: {
+                            overflow: 'visible',
+                            filter: 'drop-shadow(0px 2px 8px rgba(0,0,0,0.32))',
+                            mt: 1.5,
+                            '& .MuiAvatar-root': {
+                                width: 32,
+                                height: 32,
+                                ml: -0.5,
+                                mr: 1
+                            },
+                            '&:before': {
+                                content: '""',
+                                display: 'block',
+                                position: 'absolute',
+                                top: 0,
+                                right: 14,
+                                width: 10,
+                                height: 10,
+                                bgcolor: 'background.paper',
+                                transform: 'translateY(-50%) rotate(45deg)',
+                                zIndex: 0
+                            }
+                        }
+                    }
+                },
+                transformOrigin: {
+                    horizontal: 'right',
+                    vertical: 'top'
+                },
+                anchorOrigin: {
+                    horizontal: 'right',
+                    vertical: 'bottom'
+                },
+                children: [
+                    /*#__PURE__*/ jsxs(MenuItem, {
+                        about: "name",
+                        onClick: handleProfileDetail,
+                        children: [
+                            /*#__PURE__*/ jsx(ListItemIcon, {
+                                children: /*#__PURE__*/ jsx(Person, {
+                                    fontSize: "small"
+                                })
+                            }),
+                            currentUser?.name ?? t('User.Name')
+                        ]
+                    }),
+                    /*#__PURE__*/ jsx(Divider, {}),
+                    /*#__PURE__*/ jsxs(MenuItem, {
+                        about: "setting",
+                        onClick: handleComingSoon,
+                        children: [
+                            /*#__PURE__*/ jsx(ListItemIcon, {
+                                children: /*#__PURE__*/ jsx(Settings, {
+                                    fontSize: "small"
+                                })
+                            }),
+                            t('Common.Settings')
+                        ]
+                    }),
+                    /*#__PURE__*/ jsxs(MenuItem, {
+                        about: "logout",
+                        onClick: handleLogout,
+                        children: [
+                            /*#__PURE__*/ jsx(ListItemIcon, {
+                                children: /*#__PURE__*/ jsx(Logout, {
+                                    fontSize: "small"
+                                })
+                            }),
+                            t('Common.Logout')
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
+};
+const Container = UserBox;
+export { Container as default };

package/dist/Layouts/Toolbar/UserBox/Container.test.js

@@ -0,0 +1,129 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { fireEvent, render, screen } from "@testing-library/react";
+import Container from "./Container.js";
+import { useAtomValue } from "jotai";
+import { currentUserState } from "../Atom.js";
+import { useGetToolbarContext } from "../context.js";
+import { useAppHelper } from "../../../Context/index.js";
+const getRender = ()=>{
+    render(/*#__PURE__*/ jsx(Container, {}));
+};
+jest.mock('react-i18next', ()=>({
+        useTranslation: ()=>({
+                t: (key)=>key
+            })
+    }));
+jest.mock('jotai', ()=>({
+        useAtomValue: jest.fn(),
+        atom: jest.fn(()=>({}))
+    }));
+jest.mock('@mui/material', ()=>({
+        ...jest.requireActual('@mui/material'),
+        IconButton: ({ onClick, children })=>/*#__PURE__*/ jsx("button", {
+                "data-testid": "IconButton",
+                onClick: onClick,
+                children: children
+            }),
+        Menu: ({ children, open, onClose })=>/*#__PURE__*/ jsxs("div", {
+                "data-testid": "Material-Menu",
+                children: [
+                    open ? /*#__PURE__*/ jsx("div", {
+                        children: children
+                    }) : null,
+                    /*#__PURE__*/ jsx("button", {
+                        onClick: onClose,
+                        "data-testid": "Material-Menu-onClose",
+                        children: "Close"
+                    })
+                ]
+            }),
+        MenuItem: ({ about, children, onClick })=>/*#__PURE__*/ jsxs("div", {
+                "data-testid": `Material-MenuItem-${about}`,
+                children: [
+                    children,
+                    /*#__PURE__*/ jsx("button", {
+                        onClick: onClick,
+                        "data-testid": `Material-MenuItem-${about}-onClick`,
+                        children: "MenuItem"
+                    })
+                ]
+            })
+    }));
+jest.mock('Commons/Constant', ()=>({
+        Constants: {
+            ID_DOMAIN: 'http://localhost',
+            PROFILE_PATH: 'profile',
+            USER_PROFILE_INFO: 'user'
+        }
+    }));
+jest.mock('../context', ()=>({
+        useGetToolbarContext: jest.fn()
+    }));
+jest.mock('Context', ()=>({
+        useAppHelper: jest.fn()
+    }));
+describe('Render and Actions', ()=>{
+    const mockSnackbar = jest.fn();
+    beforeEach(()=>{
+        useAppHelper.mockReturnValue({
+            snackbar: mockSnackbar,
+            alert: jest.fn()
+        });
+        useAtomValue.mockImplementation((atom)=>{
+            if (atom === currentUserState) return {
+                id: 1,
+                name: 'Admin',
+                username: 'admin'
+            };
+        });
+        useGetToolbarContext.mockReturnValue({
+            services: {
+                onLogout: jest.fn()
+            }
+        });
+    });
+    afterEach(()=>{
+        jest.clearAllMocks();
+    });
+    it('should render', ()=>{
+        getRender();
+        expect(screen.getByTestId('IconButton')).toBeInTheDocument();
+    });
+    it('should render without username', ()=>{
+        useAtomValue.mockImplementation((atom)=>{
+            if (atom === currentUserState) return {
+                id: 1
+            };
+        });
+        getRender();
+        expect(screen.getByText('U')).toBeInTheDocument();
+    });
+    it('should show/hidden menu', ()=>{
+        getRender();
+        fireEvent.click(screen.getByTestId('IconButton'));
+        expect(screen.getByTestId('Material-MenuItem-name-onClick')).toBeInTheDocument();
+        fireEvent.click(screen.getByTestId('Material-Menu-onClose'));
+        expect(screen.queryByTestId('Material-MenuItem-name-onClick')).not.toBeInTheDocument();
+    });
+    it('should call show profile', ()=>{
+        getRender();
+        fireEvent.click(screen.getByTestId('IconButton'));
+        expect(screen.getByTestId('Material-MenuItem-name-onClick')).toBeInTheDocument();
+        fireEvent.click(screen.getByTestId('Material-MenuItem-name-onClick'));
+        expect(screen.queryByTestId('Material-MenuItem-name-onClick')).not.toBeInTheDocument();
+    });
+    it('should call show setting', ()=>{
+        getRender();
+        fireEvent.click(screen.getByTestId('IconButton'));
+        expect(screen.getByTestId('Material-MenuItem-setting-onClick')).toBeInTheDocument();
+        fireEvent.click(screen.getByTestId('Material-MenuItem-setting-onClick'));
+        expect(screen.queryByTestId('Material-MenuItem-setting-onClick')).not.toBeInTheDocument();
+    });
+    it('should call show logout', ()=>{
+        getRender();
+        fireEvent.click(screen.getByTestId('IconButton'));
+        expect(screen.getByTestId('Material-MenuItem-logout-onClick')).toBeInTheDocument();
+        fireEvent.click(screen.getByTestId('Material-MenuItem-logout-onClick'));
+        expect(screen.queryByTestId('Material-MenuItem-logout-onClick')).not.toBeInTheDocument();
+    });
+});

package/dist/Layouts/Toolbar/UserBox/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './Container';
+//# sourceMappingURL=index.d.ts.map

package/dist/Layouts/Toolbar/UserBox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/Layouts/Toolbar/UserBox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC"}

package/dist/Layouts/Toolbar/UserBox/index.js

@@ -0,0 +1,2 @@
+import Container from "./Container.js";
+export { Container as default };

package/dist/Layouts/Toolbar/WorkplaceBox/AllWorkSpace.d.ts

@@ -0,0 +1,10 @@
+import { Workspace } from '../Types';
+export type AllWorkSpaceProps = {
+    isOpen?: boolean;
+    allWorkSpace: Workspace[];
+    onClose: () => void;
+    setCurrentWorkspace: (item: Workspace) => void;
+};
+declare function AllWorkSpace(props: AllWorkSpaceProps): import("react/jsx-runtime").JSX.Element;
+export default AllWorkSpace;
+//# sourceMappingURL=AllWorkSpace.d.ts.map

package/dist/Layouts/Toolbar/WorkplaceBox/AllWorkSpace.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AllWorkSpace.d.ts","sourceRoot":"","sources":["../../../../src/Layouts/Toolbar/WorkplaceBox/AllWorkSpace.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,MAAM,MAAM,iBAAiB,GAAG;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,SAAS,EAAE,CAAC;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,mBAAmB,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,iBAAS,YAAY,CAAC,KAAK,EAAE,iBAAiB,2CA4D7C;AAED,eAAe,YAAY,CAAC"}