@learningpool/ui 2.3.0 → 2.3.2

package/components/stream/AppSwitcher/AppSwitcher.d.ts

@@ -11,10 +11,5 @@ declare const AppSwitcher: {
         baseUrl: PropTypes.Requireable<string>;
         localization: PropTypes.Requireable<object>;
     };
-    defaultProps: {
-        layout: string;
-        baseUrl: "https://api.home.learningpool.com/";
-        localization: {};
-    };
 };
 export default AppSwitcher;

package/components/stream/AppSwitcher/AppSwitcher.js

@@ -14,20 +14,31 @@ import AppHub from '../AppHub/AppHub';
 import { Box, Typography } from '@mui/material';
 import { DrawerShadow } from '../../navigation/VerticalNavigation/VerticalNavigationStyles';
 const AppSwitcher = (props) => {
-    const { isAppSwitcherOpen, handleToggleAppSwitcher, isDrawerOpen, localization, dataAttributes, baseUrl, avatarName, hubDashboardData, apiKey = '', isStandalone = true } = props;
+    const { isAppSwitcherOpen, handleToggleAppSwitcher, isDrawerOpen, dataAttributes, avatarName, hubDashboardData, StreamHomeUrl, localization = {}, baseUrl = Constants.BaseUrl, apiKey = '', isStandalone = true } = props;
     let { token } = props;
+    let userId = props.userId ?? '';
+    // Use prop state when provided, otherwise use internal state for standalone mode
+    const [standaloneIsOpen, setStandaloneIsOpen] = useState(false);
+    const resolvedIsOpen = isAppSwitcherOpen !== undefined
+        ? isAppSwitcherOpen
+        : (isStandalone ? standaloneIsOpen : false);
     const [dashboardData, setDashboardData] = useState([]);
     const [hasPromotionalCampaigns, setHasPromotionalCampaigns] = useState(false);
     const [userOrg, setUserOrg] = useState('');
     const userFirstName = avatarName?.split(' ')[0];
     const messages = { ...Constants.DefaultMessages, ...localization };
     const dataIds = { ...defaultAttributes, ...dataAttributes };
-    let userId = props.userId ?? '';
     /**
      * Handles closing of the application dialog.
      */
     const handleDialogClose = () => {
-        handleToggleAppSwitcher();
+        if (isAppSwitcherOpen !== undefined && handleToggleAppSwitcher) {
+            handleToggleAppSwitcher();
+        }
+        else if (isStandalone) {
+            setStandaloneIsOpen(false);
+        }
+        // If neither condition is met, we can't close (should not happen in normal usage)
     };
     /**
      * Queries the Steam Home API to fetch dashboard data.
@@ -175,13 +186,13 @@ const AppSwitcher = (props) => {
         loadData().catch(console.error);
     }, [token, userId, hubDashboardData]);
     useEffect(() => {
-        if (isAppSwitcherOpen) {
+        if (resolvedIsOpen) {
             document.addEventListener('mousedown', handleAppSwitcherClose);
         }
         return () => {
             document.removeEventListener('mousedown', handleAppSwitcherClose);
         };
-    }, [isAppSwitcherOpen]);
+    }, [resolvedIsOpen]);
     useEffect(() => document.addEventListener('keydown', handleKeyDown));
     const handleAppSwitcherClose = (event) => {
         const appSwitcherButton = document.getElementById(defaultAttributes.VerticalNavigationAppSwitcherToggle);
@@ -193,7 +204,7 @@ const AppSwitcher = (props) => {
         handleDialogClose();
     };
     const handleKeyDown = (event) => {
-        if (isAppSwitcherOpen && event && event.type === EVENT_KEYS.Keydown) {
+        if (resolvedIsOpen && event && event.type === EVENT_KEYS.Keydown) {
             // Close AppSwitcher if Escape key is pressed
             if (event.key === EVENT_KEYS.Escape) {
                 handleDialogClose();
@@ -207,13 +218,13 @@ const AppSwitcher = (props) => {
     }
     const docTextDirection = window.document?.dir;
     return (_jsxs(_Fragment, { children: [_jsxs(AppSwitcherPanel, { id: "app-switcher-menu", style: {
-                    display: isAppSwitcherOpen ? 'block' : 'none',
+                    display: resolvedIsOpen ? 'block' : 'none',
                     left: isDrawerOpen ? Constants.DrawerWidth.Expanded : Constants.DrawerWidth.Collapsed - 3,
                     right: (docTextDirection === 'rtl' && isDrawerOpen) ? Constants.DrawerWidth.Expanded : Constants.DrawerWidth.Collapsed - 3
-                }, role: 'dialog', "aria-label": "App Switcher", onKeyDown: handleKeyDown, "data-id": dataIds.AppSwitcherContainer, onMouseDown: (event) => event.stopPropagation(), children: [_jsx(AppSwitcherHeaderPanel, { children: _jsx(AppSwitcherCloseButton, { onClick: handleDialogClose }) }), dashboardData.length > 0 && _jsx(Box, { sx: { marginBottom: '3rem' }, children: _jsx(AppHub, { data: dashboardData, hasPromotionalCampaigns: hasPromotionalCampaigns, isAppSwitcher: true, userName: userFirstName || avatarName, userOrganization: userOrg, hubApiUrl: baseUrl || Constants.BaseUrl, hubApiKey: apiKey, hubToken: token }) }), dashboardData.length === 0 && _jsx(Typography, { variant: 'h2', component: 'h4', sx: { marginTop: '1rem', justifySelf: 'anchor-center' }, children: messages['data-not-found'] }), _jsx(AppSwitcherFooterPanel, { children: _jsx(StyledHomeButton, { "aria-label": messages['go-to-hub'], endIcon: docTextDirection === 'rtl' ? _jsx(ChevronLeftIcon, { sx: { marginRight: '0.5em' } }) : _jsx(ChevronRightIcon, {}), onClick: e => window.open(props.StreamHomeUrl || Constants.DefaultStreamHomeUrl), children: messages['go-to-hub'] }) })] }), _jsx(AppSwitcherShadow, { style: {
-                    display: isAppSwitcherOpen ? 'block' : 'none',
+                }, role: 'dialog', "aria-label": "App Switcher", onKeyDown: handleKeyDown, "data-id": dataIds.AppSwitcherContainer, onMouseDown: (event) => event.stopPropagation(), children: [_jsx(AppSwitcherHeaderPanel, { children: _jsx(AppSwitcherCloseButton, { onClick: handleDialogClose }) }), dashboardData.length > 0 && _jsx(Box, { sx: { marginBottom: '3rem' }, children: _jsx(AppHub, { data: dashboardData, hasPromotionalCampaigns: hasPromotionalCampaigns, isAppSwitcher: true, userName: userFirstName || avatarName, userOrganization: userOrg, hubApiUrl: baseUrl || Constants.BaseUrl, hubApiKey: apiKey, hubToken: token }) }), dashboardData.length === 0 && _jsx(Typography, { variant: 'h2', component: 'h4', sx: { marginTop: '1rem', justifySelf: 'anchor-center' }, children: messages['data-not-found'] }), _jsx(AppSwitcherFooterPanel, { children: _jsx(StyledHomeButton, { "aria-label": messages['go-to-hub'], endIcon: docTextDirection === 'rtl' ? _jsx(ChevronLeftIcon, { sx: { marginRight: '0.5em' } }) : _jsx(ChevronRightIcon, {}), onClick: e => window.open(StreamHomeUrl || Constants.DefaultStreamHomeUrl), children: messages['go-to-hub'] }) })] }), _jsx(AppSwitcherShadow, { style: {
+                    display: resolvedIsOpen ? 'block' : 'none',
                     left: isDrawerOpen ? Constants.DrawerWidth.Expanded : Constants.DrawerWidth.Collapsed - 3
-                } }), isAppSwitcherOpen && !isStandalone &&
+                } }), resolvedIsOpen && !isStandalone &&
                 _jsx(DrawerShadow, { className: 'drawerShadow', "aria-hidden": 'true', sx: {
                         zIndex: -1
                     } })] }));
@@ -226,9 +237,4 @@ AppSwitcher.propTypes = {
     baseUrl: PropTypes.string,
     localization: PropTypes.object
 };
-AppSwitcher.defaultProps = {
-    layout: Constants.Layout.Vertical,
-    baseUrl: Constants.BaseUrl,
-    localization: {}
-};
 export default AppSwitcher;

package/package.json

@@ -9,7 +9,7 @@
     "components",
     "ui"
   ],
-  "version": "2.3.0",
+  "version": "2.3.2",
   "private": false,
   "main": "index.js",
   "module": "index.js",