@boomerang-io/carbon-addons-boomerang-react 4.6.8-beta.22 → 4.6.8-beta.23

package/dist/esm/{components → src/components}/Header/Header.js

@@ -1,19 +1,22 @@
 import React from 'react';
+import { useQuery } from 'react-query';
 import { Theme, Header as Header$1, SkipToContent, HeaderName, HeaderNavigation, HeaderMenuItem, HeaderGlobalBar, HeaderPanel, HeaderMenuButton, SideNav, SideNavItems, SideNavLink } from '@carbon/react';
 import { Wikis, Checkmark, Collaborate, NotificationNew, Notification, Help, UserAvatar, Close, Switcher, OpenPanelFilledRight } from '@carbon/react/icons';
 import HeaderAppSwitcher from './HeaderAppSwitcher.js';
+import HeaderTeamSwitcher from './HeaderTeamSwitcher.js';
 import HeaderMenu from './HeaderMenu.js';
 import NotificationsContainer from '../Notifications/NotificationsContainer.js';
 import PlatformNotificationsContainer from '../PlatformNotifications/PlatformNotificationsContainer.js';
 import UserRequests from './UserRequests.js';
 import useHeaderMenu from '../../hooks/useHeaderMenu.js';
 import useWindowSize from '../../hooks/useWindowSize.js';
+import { resolver, serviceUrl } from '../../config/servicesConfig.js';
 import { prefix } from '../../internal/settings.js';
 
 /*
 IBM Confidential
 694970X, 69497O0
-© Copyright IBM Corp. 2022, 2024
+© Copyright IBM Corp. 2022, 2025
 */
 const MenuListId = {
     Notifcations: "header-notifications-dialog",
@@ -24,6 +27,7 @@ const MenuListId = {
     Support: "header-support-menu",
     instanceSwitcher: "header-instanceSwitcher-menu",
     Switcher: "header-switcher-menu",
+    TeamSwitcher: "header-team-switcher-menu",
 };
 const MenuButtonId = {
     Notifcations: "header-notifications-dialog-button",
@@ -34,6 +38,7 @@ const MenuButtonId = {
     Support: "header-support-menu-button",
     InstanceSwitcher: "header-instanceSwitcher-menu-button",
     Switcher: "header-switcher-menu-button",
+    TeamSwitcher: "header-team-switcher-menu-button",
 };
 const MenuAriaLabelRecord = {
     Notifcations: "Notifications dialog",
@@ -44,11 +49,19 @@ const MenuAriaLabelRecord = {
     instanceSwitcher: "Instance Switcher Menu",
     Support: "Support menu",
     Switcher: "Switcher menu",
+    TeamSwitcher: "Team Switcher menu",
 };
 const headerButtonClassNames = "cds--btn--icon-only cds--header__action cds--btn cds--btn--primary cds--btn--icon-only cds--btn cds--btn--primary";
 const instanceCheckMarkContainerClass = "instance-checkmark-style-container";
 function Header(props) {
-    const { productName, baseEnvUrl, baseServicesUrl, carbonTheme = "g10", className, navLinks, platform, prefixName = "", rightPanel, skipToContentProps, templateMeteringEvent, triggerEvent, userTeams, } = props;
+    const { analyticsHelpers, productName, baseEnvUrl, baseServicesUrl, carbonTheme = "g10", className, createJoinTeamTrigger, history, isLaunchpad = false, navLinks, platform, prefixName = "", rightPanel, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, user, userTeams, } = props;
+    const hasUserTeams = Boolean(userTeams);
+    const userTeamsUrl = serviceUrl.getUserTeamsServices({ baseServicesUrl });
+    const teamsQuery = useQuery({
+        queryKey: userTeamsUrl,
+        queryFn: resolver.query(userTeamsUrl, null),
+        enabled: !hasUserTeams,
+    });
     return (React.createElement(React.Fragment, null,
         React.createElement(Theme, { theme: carbonTheme },
             React.createElement(Header$1, { "aria-label": "App navigation header", className: className },
@@ -59,12 +72,13 @@ function Header(props) {
                     ? navLinks.map((link) => (React.createElement(HeaderMenuItem, { "aria-label": `Link for ${link.name}`, "data-testid": "header-menu-link", href: link.url, isCurrentPage: window?.location?.href && link.url ? window.location.href.startsWith(link.url) : false, key: link.name, target: link.isExternal ? "_blank" : undefined, rel: link.isExternal ? "noopener noreferrer" : undefined }, link.name)))
                     : null),
                 React.createElement(HeaderGlobalBar, null,
+                    React.createElement(HeaderTeamSwitcher, { analyticsHelpers: analyticsHelpers, baseServicesUrl: baseServicesUrl, createJoinTeamTrigger: createJoinTeamTrigger, history: history, isLaunchpad: isLaunchpad, menuAriaLabelRecord: MenuAriaLabelRecord.TeamSwitcher, menuButtonId: MenuButtonId.TeamSwitcher, menuListId: MenuListId.TeamSwitcher, navigationPlatform: platform, teamsQuery: teamsQuery, trackEvent: trackEvent, user: user, userTeams: userTeams }),
                     props?.instanceSwitcherEnabled && (React.createElement(InstanceSwitcherMenu, { enabled: Boolean(props.instanceSwitcherEnabled), menuItems: platform?.instances })),
                     React.createElement(RequestsMenu, { baseEnvUrl: baseEnvUrl, enabled: Boolean(props.requestSummary), summary: props.requestSummary }),
                     React.createElement(NotificationsMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: Boolean(props.enableNotifications), countEnabled: Boolean(props.enableNotificationsCount) }),
                     React.createElement(SupportMenu, { enabled: Array.isArray(props.supportMenuItems) && props.supportMenuItems.length > 0, menuItems: props.supportMenuItems }),
                     React.createElement(ProfileMenu, { enabled: Array.isArray(props.profileMenuItems) && props.profileMenuItems.length > 0, menuItems: props.profileMenuItems }),
-                    React.createElement(AppSwitcherMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: props.enableAppSwitcher, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent, userTeams: userTeams }),
+                    React.createElement(AppSwitcherMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: props.enableAppSwitcher, teamsQuery: teamsQuery, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent, userTeams: userTeams }),
                     React.createElement(RightPanelMenu, { enabled: Boolean(rightPanel && Object.keys(rightPanel).length), ...rightPanel })))),
         React.createElement(NotificationsContainer, { enableMultiContainer: true, containerId: `${prefix}--bmrg-header-notifications` })));
 }
@@ -145,7 +159,7 @@ function AppSwitcherMenu(props) {
     }
     return (React.createElement("div", { ref: ref },
         React.createElement("button", { "aria-controls": MenuListId.Switcher, "aria-expanded": isOpen, "aria-haspopup": "menu", "aria-label": MenuAriaLabelRecord.Switcher, className: headerButtonClassNames, "data-testid": "header-appswitcher-link", id: MenuButtonId.Switcher, onClick: toggleActive }, isOpen ? React.createElement(Close, { size: 20 }) : React.createElement(Switcher, { size: 20 })),
-        React.createElement(HeaderAppSwitcher, { baseEnvUrl: props.baseEnvUrl, baseServicesUrl: props.baseServicesUrl, id: MenuListId.Switcher, isOpen: isOpen, templateMeteringEvent: props.templateMeteringEvent, triggerEvent: props.triggerEvent, userTeams: props.userTeams })));
+        React.createElement(HeaderAppSwitcher, { baseEnvUrl: props.baseEnvUrl, baseServicesUrl: props.baseServicesUrl, id: MenuListId.Switcher, isOpen: isOpen, teamsQuery: props.teamsQuery, templateMeteringEvent: props.templateMeteringEvent, triggerEvent: props.triggerEvent, userTeams: props.userTeams })));
 }
 function RightPanelMenu(props) {
     const { isOpen, toggleActive, ref } = useHeaderMenu(MenuButtonId.RightPanel);

package/dist/esm/{components → src/components}/Header/HeaderAppSwitcher.js

@@ -1,10 +1,8 @@
 import React from 'react';
-import { useQuery } from 'react-query';
 import { HeaderPanel, SkeletonText, SwitcherDivider, SideNavMenu, SideNavMenuItem } from '@carbon/react';
 import { Launch } from '@carbon/react/icons';
 import Error from '../ErrorMessage/ErrorMessage.js';
 import cx from 'classnames';
-import { resolver, serviceUrl } from '../../config/servicesConfig.js';
 import { prefix } from '../../internal/settings.js';
 
 /*
@@ -19,14 +17,8 @@ const externalProps = {
 const panelClassName = `${prefix}--bmrg-header-switcher-panel`;
 const contentClassName = `${prefix}--bmrg-header-switcher`;
 const skeletonClassName = `${prefix}--bmrg-header-switcher__skeleton`;
-function HeaderAppSwitcher({ baseServicesUrl, baseEnvUrl, id, isOpen, templateMeteringEvent, triggerEvent, userTeams }) {
+function HeaderAppSwitcher({ baseServicesUrl, baseEnvUrl, id, isOpen, teamsQuery, templateMeteringEvent, triggerEvent, userTeams, }) {
     const hasUserTeams = Boolean(userTeams);
-    const userTeamsUrl = serviceUrl.getUserTeamsServices({ baseServicesUrl });
-    const teamsQuery = useQuery({
-        queryKey: userTeamsUrl,
-        queryFn: resolver.query(userTeamsUrl, null),
-        enabled: !hasUserTeams
-    });
     if (userTeams?.isLoading || teamsQuery?.isLoading) {
         return (React.createElement(HeaderPanel, { "aria-label": "App Switcher", className: panelClassName, expanded: isOpen, id: id, role: "menu" },
             React.createElement("div", { className: cx(contentClassName, "--is-loading", { "--is-hidden": !isOpen }) },
@@ -69,7 +61,7 @@ function HeaderAppSwitcher({ baseServicesUrl, baseEnvUrl, id, isOpen, templateMe
     }
     return null;
 }
-function TeamServiceListMenu({ baseEnvUrl, isAccount, isMember, team, templateMeteringEvent, triggerEvent }) {
+function TeamServiceListMenu({ baseEnvUrl, isAccount, isMember, team, templateMeteringEvent, triggerEvent, }) {
     const { name, displayName, services } = team;
     const nameToDisplay = displayName ? displayName : name;
     const isNameTruncated = nameToDisplay?.length > 30;

package/dist/esm/src/components/Header/HeaderTeamSwitcher.js

@@ -0,0 +1,261 @@
+import React, { useState, useEffect } from 'react';
+import { useQueryClient, useMutation } from 'react-query';
+import { InlineLoading, HeaderMenu, HeaderMenuItem } from '@carbon/react';
+import { AddAlt, CheckmarkFilled, GroupAccount, ChevronDown } from '@carbon/react/icons';
+import orderBy_1 from '../../../node_modules/.pnpm/lodash@4.17.21/node_modules/lodash/orderBy.js';
+import HeaderMenu$1 from './HeaderMenu.js';
+import { resolver, serviceUrl } from '../../config/servicesConfig.js';
+import { prefix } from '../../internal/settings.js';
+
+/*
+IBM Confidential
+694970X, 69497O0
+© Copyright IBM Corp. 2022, 2025
+*/
+const headerDropdownMenuClassname = `${prefix}--header-dropdown-menu`;
+const headerDropdownMenuListClassname = `${prefix}--bmrg-header-drop-down`;
+const headerDropdownMenuItemContainerClassname = `${prefix}--header-dropdown-menu-item-container`;
+const headerDropdownMenuItemClassname = `${prefix}--header-dropdown-menu-item`;
+const headerDropdownMenuItemTextIconClassname = `${prefix}--header-dropdown-menu-item-text-icon`;
+const headerDropdownMenuItemTextClassname = `${prefix}--header-dropdown-menu-item-text`;
+const headerDropdownMenuItemIconClassname = `${prefix}--header-dropdown-menu-item-icon`;
+const headerDropdownMenuItemAccountContainerClassname = `${prefix}--header-dropdown-menu-item-account-container`;
+const headerDropdownMenuItemAccountClassname = `${prefix}--header-dropdown-menu-item-account`;
+const headerDropdownMenuItemAccountIconsClassname = `${prefix}--header-dropdown-menu-item-account-icons`;
+const headerDropdownMenuItemAccountGroupIconClassname = `${prefix}--header-dropdown-menu-item-account-group-icon`;
+const headerDropdownMenuItemAccountChevronIconClassname = `${prefix}--header-dropdown-menu-item-account-chevron-icon`;
+const headerDropdownMenuItemAccountSubmenuClassname = `${prefix}--header-dropdown-menu-item-account-submenu`;
+const headerTeamSwitcherCreateTeamButtonContainerClassname = `${prefix}--header-team-switcher-create-team-button-container`;
+const headerTeamSwitcherCreateTeamButtonClassname = `${prefix}--header-team-switcher-create-team-button`;
+const headerTeamSwitcherCreateTeamButtonTextClassname = `${prefix}--header-team-switcher-create-team-button-text`;
+const headerTeamSwitcherCreateTeamButtonIconClassname = `${prefix}--header-team-switcher-create-team-button-icon`;
+function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamTrigger, history, isLaunchpad, menuAriaLabelRecord, menuButtonId, menuListId, navigationPlatform, teamsQuery, trackEvent, user, userTeams, }) {
+    const queryClient = useQueryClient();
+    const [selectedTeam, setSelectedTeam] = useState();
+    const [openAccountSubmenuId, setOpenAccountSubmenuId] = useState("");
+    const hasUserTeams = Boolean(userTeams);
+    const showSelectTeamPurpose = navigationPlatform?.requireTeamPurpose;
+    const createTeamButtonText = showSelectTeamPurpose ? "Create Team" : "Create or Join Team";
+    const userTeamInstanceSwitcherDefault = user?.teamInstanceSwitcherDefault;
+    const profileUrl = serviceUrl.resourceUserProfile({ baseServicesUrl });
+    const { mutateAsync: mutateUserProfile, isLoading: mutateUserProfileIsLoading } = useMutation(resolver.patchUserProfile, {
+        onSuccess: () => {
+            queryClient.invalidateQueries(profileUrl);
+        },
+    });
+    useEffect(() => {
+        let accountTeams, standardTeams, personalTeam = [];
+        if (hasUserTeams) {
+            accountTeams = userTeams?.data?.accountTeams ?? [];
+            standardTeams = userTeams?.data?.standardTeams ?? [];
+            personalTeam = userTeams?.data?.personalTeam ?? [];
+        }
+        else {
+            accountTeams = teamsQuery?.data?.accountTeams ?? [];
+            standardTeams = teamsQuery?.data?.standardTeams ?? [];
+            personalTeam = teamsQuery?.data?.personalTeam ?? [];
+        }
+        const userHasPersonalTeam = personalTeam.length > 0;
+        const userHasAccountTeams = accountTeams.length > 0;
+        const userHasStandardTeams = standardTeams.length > 0;
+        const userHasTeams = userHasPersonalTeam || userHasAccountTeams || userHasStandardTeams;
+        const handleSelectTeam = async ({ team }) => {
+            setSelectedTeam(team);
+            if (!userTeamInstanceSwitcherDefault) {
+                const body = {
+                    teamInstanceSwitcherDefault: team.id,
+                };
+                await mutateUserProfile({ baseServicesUrl, body });
+            }
+        };
+        if (userHasTeams) {
+            if (!userTeamInstanceSwitcherDefault) {
+                if (userHasPersonalTeam) {
+                    handleSelectTeam({ team: personalTeam[0] });
+                }
+                else if (userHasAccountTeams) {
+                    handleSelectTeam({ team: accountTeams[0] });
+                }
+                else if (userHasStandardTeams) {
+                    handleSelectTeam({ team: standardTeams[0] });
+                }
+            }
+            else if (selectedTeam?.id !== userTeamInstanceSwitcherDefault) {
+                let allProjectTeams = [];
+                if (userHasAccountTeams) {
+                    accountTeams.forEach((team) => {
+                        if (team.projectTeams && team.projectTeams.length > 0) {
+                            allProjectTeams = allProjectTeams.concat(team.projectTeams);
+                        }
+                    });
+                }
+                const allTeams = personalTeam.concat(standardTeams, accountTeams, allProjectTeams);
+                const newSelectedTeam = allTeams.find((team) => team.id === userTeamInstanceSwitcherDefault);
+                handleSelectTeam({ team: newSelectedTeam });
+            }
+        }
+    }, [
+        baseServicesUrl,
+        hasUserTeams,
+        mutateUserProfile,
+        selectedTeam,
+        teamsQuery?.data?.accountTeams,
+        teamsQuery?.data?.personalTeam,
+        teamsQuery?.data?.standardTeams,
+        userTeamInstanceSwitcherDefault,
+        userTeams?.data?.accountTeams,
+        userTeams?.data?.personalTeam,
+        userTeams?.data?.standardTeams,
+    ]);
+    const handleTeamClick = ({ team, type }) => {
+        if (analyticsHelpers?.navigateEventHandler && trackEvent) {
+            analyticsHelpers.navigateEventHandler({
+                action: `Clicked ${team.name} in Team Switcher`,
+                category: "Team Switcher",
+                destinationPath: `${navigationPlatform.baseEnvUrl}/launchpad/teams/${team.id}`,
+                teamId: team.id,
+                teamType: type,
+                trackEvent,
+            });
+        }
+        if (isLaunchpad && Boolean(history)) {
+            history.push(`/teams/${team.id}`);
+        }
+        else {
+            window.open(`${navigationPlatform.baseEnvUrl}/launchpad/teams/${team.id}`, "_self");
+        }
+    };
+    const handleCreateJoinTeamClick = (e) => {
+        if (analyticsHelpers?.ctaEventHandler && trackEvent) {
+            analyticsHelpers.ctaEventHandler({
+                category: "Team Switcher",
+                CTA: "Create/Join team clicked",
+                pageName: "",
+                trackEvent,
+            });
+        }
+        if (createJoinTeamTrigger) {
+            createJoinTeamTrigger(e);
+        }
+        else {
+            window.open(`${navigationPlatform.baseEnvUrl}/launchpad?createJoinTeam=true`, "_self");
+        }
+    };
+    const handleOpenAccountSubmenu = ({ e, id }) => {
+        e.stopPropagation();
+        if (openAccountSubmenuId === id) {
+            setOpenAccountSubmenuId("");
+        }
+        else {
+            setOpenAccountSubmenuId(id);
+        }
+    };
+    if (userTeams?.isLoading || teamsQuery?.isLoading || mutateUserProfileIsLoading) {
+        return (React.createElement("div", { style: { display: "flex", alignItems: "center" } },
+            React.createElement(InlineLoading, null)));
+    }
+    if (userTeams?.data || teamsQuery?.data) {
+        let accountTeams, standardTeams, personalTeam = [];
+        if (hasUserTeams) {
+            accountTeams = userTeams?.data?.accountTeams ?? [];
+            standardTeams = userTeams?.data?.standardTeams ?? [];
+            personalTeam = userTeams?.data?.personalTeam ?? [];
+        }
+        else {
+            accountTeams = teamsQuery?.data?.accountTeams ?? [];
+            standardTeams = teamsQuery?.data?.standardTeams ?? [];
+            personalTeam = teamsQuery?.data?.personalTeam ?? [];
+        }
+        let sortedAccountTeamsWithNamesToDisplay = [];
+        let sortedStandardTeamsWithNamesToDisplay = [];
+        if (accountTeams?.length > 0) {
+            sortedAccountTeamsWithNamesToDisplay = orderBy_1(accountTeams.map((team) => {
+                let newProjectTeams = [];
+                if (team.projectTeams && team.projectTeams.length > 0) {
+                    newProjectTeams = team.projectTeams?.map((team) => ({
+                        ...team,
+                        nameToDisplay: team.displayName ? team.displayName : team.name,
+                    }));
+                }
+                return {
+                    ...team,
+                    nameToDisplay: team.displayName ? team.displayName : team.name,
+                    projectTeams: orderBy_1(newProjectTeams, ["nameToDisplay"]),
+                };
+            }), ["nameToDisplay"]);
+        }
+        if (standardTeams?.length > 0) {
+            sortedStandardTeamsWithNamesToDisplay = orderBy_1(standardTeams.map((team) => {
+                return {
+                    ...team,
+                    nameToDisplay: team.displayName ? team.displayName : team.name,
+                };
+            }), ["nameToDisplay"]);
+        }
+        let selectedTeamName = selectedTeam?.displayName ? selectedTeam.displayName : selectedTeam?.name;
+        if (selectedTeamName && selectedTeamName.length > 42) {
+            selectedTeamName = selectedTeamName.slice(0, 42) + "...";
+        }
+        return (React.createElement(HeaderMenu, { "aria-label": menuAriaLabelRecord, className: headerDropdownMenuClassname, menuLinkName: selectedTeamName ? selectedTeamName : "No team selected", "data-testid": "header-team-switcher-menu" },
+            React.createElement(HeaderMenu$1, { "aria-labelledby": menuButtonId, className: headerDropdownMenuListClassname, id: menuListId },
+                React.createElement(HeaderMenuItem, { className: headerTeamSwitcherCreateTeamButtonContainerClassname, onClick: handleCreateJoinTeamClick },
+                    React.createElement("div", { className: headerTeamSwitcherCreateTeamButtonClassname },
+                        React.createElement("span", { className: headerTeamSwitcherCreateTeamButtonTextClassname }, createTeamButtonText),
+                        React.createElement(AddAlt, { className: headerTeamSwitcherCreateTeamButtonIconClassname }))),
+                personalTeam.length > 0
+                    ? personalTeam.map((team) => {
+                        const teamName = team.displayName ? team.displayName : team.name;
+                        const isTeamSelected = team.id === selectedTeam?.id;
+                        return (React.createElement(HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => handleTeamClick({ team, type: "personal" }) },
+                            React.createElement("div", { className: headerDropdownMenuItemClassname },
+                                React.createElement("span", { title: teamName, className: headerDropdownMenuItemTextClassname }, teamName),
+                                isTeamSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null)));
+                    })
+                    : null,
+                accountTeams.length > 0
+                    ? sortedAccountTeamsWithNamesToDisplay.map((team) => {
+                        const isSubmenuOpen = team.id === openAccountSubmenuId;
+                        const isProjectTeamSelected = team.projectTeams &&
+                            team.projectTeams.length > 0 &&
+                            team.projectTeams.some((team) => team.id === selectedTeam?.id);
+                        const isTeamSelected = team.id === selectedTeam?.id;
+                        const isMenuSelected = isTeamSelected || isProjectTeamSelected;
+                        return (React.createElement(React.Fragment, null,
+                            React.createElement(HeaderMenuItem, { "aria-expanded": isSubmenuOpen, "aria-selected": isMenuSelected, className: headerDropdownMenuItemAccountContainerClassname, onClick: (e) => handleOpenAccountSubmenu({ e, id: team.id }) },
+                                React.createElement("div", { className: headerDropdownMenuItemAccountClassname },
+                                    React.createElement("div", { className: headerDropdownMenuItemTextIconClassname },
+                                        React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
+                                        isMenuSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null),
+                                    React.createElement("div", { className: headerDropdownMenuItemAccountIconsClassname },
+                                        React.createElement(GroupAccount, { className: headerDropdownMenuItemAccountGroupIconClassname }),
+                                        React.createElement(ChevronDown, { className: headerDropdownMenuItemAccountChevronIconClassname })))),
+                            React.createElement("div", { "aria-expanded": isSubmenuOpen, className: headerDropdownMenuItemAccountSubmenuClassname },
+                                React.createElement(HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => handleTeamClick({ team, type: "account" }) },
+                                    React.createElement("div", { className: headerDropdownMenuItemClassname, style: { paddingLeft: "1rem" } },
+                                        React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, "Account Page"),
+                                        isTeamSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null)),
+                                team.projectTeams && team.projectTeams.length > 0
+                                    ? team.projectTeams.map((team) => {
+                                        const isTeamSelected = team.id === selectedTeam?.id;
+                                        return (React.createElement(HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => handleTeamClick({ team, type: "project" }) },
+                                            React.createElement("div", { className: headerDropdownMenuItemClassname, style: { paddingLeft: "1rem" } },
+                                                React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
+                                                isTeamSelected ? (React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname })) : null)));
+                                    })
+                                    : null)));
+                    })
+                    : null,
+                standardTeams.length > 0
+                    ? sortedStandardTeamsWithNamesToDisplay.map((team) => {
+                        const isTeamSelected = team.id === selectedTeam?.id;
+                        return (React.createElement(HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => handleTeamClick({ team, type: "standard" }) },
+                            React.createElement("div", { className: headerDropdownMenuItemClassname },
+                                React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
+                                isTeamSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null)));
+                    })
+                    : null)));
+    }
+    return null;
+}
+
+export { HeaderTeamSwitcher as default };

package/dist/esm/{components → src/components}/UIShell/UIShell.js

@@ -18,10 +18,11 @@ IBM Confidential
 694970X, 69497O0
 © Copyright IBM Corp. 2022, 2024
 */
-function UIShell({ baseEnvUrl, carbonTheme = "g10", config, leftPanel, platformName, productName, profileMenuItems = [], supportMenuItems = [], renderPrivacyRedirect = true, renderPrivacyStatement = true, rightPanel, handleShowTutorial, skipToContentProps, templateMeteringEvent, triggerEvent, tutorialScreenToShow, user, userTeams, enableIcaMacs, }) {
+function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme = "g10", config, createJoinTeamTrigger, history, isLaunchpad = false, leftPanel, platformName, productName, profileMenuItems = [], supportMenuItems = [], renderPrivacyRedirect = true, renderPrivacyStatement = true, rightPanel, handleShowTutorial, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, enableIcaMacs, }) {
     // Support base header .e.g for an error state
     if (!config) {
-        return (React.createElement(Header, { baseEnvUrl: baseEnvUrl ?? "", baseServicesUrl: "", carbonTheme: carbonTheme, enableAppSwitcher: false, enableNotifications: false, enableNotificationsCount: false, productName: productName || platformName || "" }));
+        return (React.createElement(QueryClientProvider, { client: queryClient },
+            React.createElement(Header, { baseEnvUrl: baseEnvUrl ?? "", baseServicesUrl: "", carbonTheme: carbonTheme, enableAppSwitcher: false, enableNotifications: false, enableNotificationsCount: false, productName: productName || platformName || "", user: user })));
     }
     const { features, navigation, platform, platformMessage } = config;
     const names = getProductAndPlatformNames({ productName, platformName, platform });
@@ -61,7 +62,7 @@ function UIShell({ baseEnvUrl, carbonTheme = "g10", config, leftPanel, platformN
      */
     const isPrivacyStatementDisabled = renderPrivacyStatement === false || features?.["consent.enabled"] === false;
     return (React.createElement(QueryClientProvider, { client: queryClient },
-        React.createElement(Header, { baseEnvUrl: platform.baseEnvUrl, baseServicesUrl: platform.baseServicesUrl, carbonTheme: carbonTheme, enableAppSwitcher: isAppSwitcherEnabled, instanceSwitcherEnabled: instanceSwitcherEnabled, enableNotifications: isNotificationsEnabled, enableNotificationsCount: isNotificationsCountEnabled, leftPanel: leftPanel, navLinks: navigation, platform: platform, platformMessage: platformMessage, prefixName: names.platformName, productName: names.productName, rightPanel: rightPanel, requestSummary: user?.requestSummary, skipToContentProps: skipToContentProps, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent, profileMenuItems: [
+        React.createElement(Header, { analyticsHelpers: analyticsHelpers, baseEnvUrl: platform.baseEnvUrl, baseServicesUrl: platform.baseServicesUrl, carbonTheme: carbonTheme, createJoinTeamTrigger: createJoinTeamTrigger, enableAppSwitcher: isAppSwitcherEnabled, instanceSwitcherEnabled: instanceSwitcherEnabled, enableNotifications: isNotificationsEnabled, enableNotificationsCount: isNotificationsCountEnabled, leftPanel: leftPanel, navLinks: navigation, platform: platform, platformMessage: platformMessage, prefixName: names.platformName, productName: names.productName, rightPanel: rightPanel, requestSummary: user?.requestSummary, skipToContentProps: skipToContentProps, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent, profileMenuItems: [
                 isUserEnabled && (React.createElement(ProfileSettingsMenuItem, { key: "profile-settings", baseServicesUrl: platform.baseServicesUrl, src: `${platform.baseServicesUrl}/users/image/${user?.email}`, userName: user?.displayName ?? user?.name })),
                 isSendMailEnabled && (React.createElement(HeaderMenuItem, { key: "email-preferences", href: `${platform.baseEnvUrl}/launchpad/email-preferences`, icon: React.createElement(Email, null), kind: "internal", text: "Email Preferences", type: "link" })),
                 !isPrivacyStatementDisabled && (React.createElement(PrivacyStatementMenuItem, { key: "privacy-statement", baseServicesUrl: platform.baseServicesUrl, platformEmail: platform?.platformEmail })),
@@ -77,7 +78,7 @@ function UIShell({ baseEnvUrl, carbonTheme = "g10", config, leftPanel, platformN
                 isAboutPlatformEnabled && (React.createElement(AboutPlatformMenuItem, { key: "about-platform", name: platform.name, baseServicesUrl: platform.baseServicesUrl })),
                 tutorialScreenToShow && handleShowTutorial && (React.createElement(HeaderMenuItem, { key: "launch-tutorial", onClick: handleShowTutorial, icon: React.createElement(Book, null), "data-testid": "launch-tutorial", text: "Launch Tutorial", type: "button" })),
                 ...supportMenuItems,
-            ].filter(Boolean), userTeams: userTeams }),
+            ].filter(Boolean), history: history, isLaunchpad: isLaunchpad, trackEvent: trackEvent, user: user, userTeams: userTeams }),
         isPrivacyModalRendered ? (React.createElement(PrivacyRedirect, { isOpen: true, baseEnvUrl: platform.baseEnvUrl, platformName: platform?.name, user: user })) : null));
 }
 /**

package/dist/types/index.d.ts

@@ -223,6 +223,7 @@ type User = {
     hasOpenPersonalTeamRequest?: boolean;
     personalTeamAssistantsAccess?: boolean;
     personalTeamAssistantsAccessRequested?: boolean;
+    teamInstanceSwitcherDefault?: string | null;
 };
 type UserTeams = {
     accountTeams: {
@@ -346,14 +347,18 @@ type Props$H = React.ComponentPropsWithoutRef<"img"> & {
 declare function Avatar({ alt, className, size, src, style, title, userName, plainTooltip, ...rest }: Props$H): React.JSX.Element;
 
 type Props$G = {
+    analyticsHelpers?: any;
     baseServicesUrl?: string;
     baseEnvUrl?: string;
     carbonTheme?: "white" | "g10" | "g90" | "g100";
     className?: string;
+    createJoinTeamTrigger?: Function;
     enableAppSwitcher?: boolean;
     instanceSwitcherEnabled?: boolean;
     enableNotifications?: boolean;
     enableNotificationsCount?: boolean;
+    history?: any;
+    isLaunchpad?: boolean;
     leftPanel?: (args: {
         close: () => void;
         isOpen: boolean;
@@ -381,7 +386,9 @@ type Props$G = {
     supportMenuItems?: React.ReactNode[];
     instanceSwitcherMenuItems?: React.ReactNode[];
     templateMeteringEvent?: (props: any) => void;
+    trackEvent?: Function;
     triggerEvent?: (props: any) => any;
+    user?: User;
     userTeams?: {
         data: any;
         isLoading: boolean;
@@ -1354,7 +1361,9 @@ type Props$1 = {
 declare function ToggleComponent({ helperText, id, invalid, invalidText, reversed, label, labelText, labelA, labelB, orientation, tooltipClassName, tooltipContent, tooltipProps, ...toggleProps }: Props$1): React.JSX.Element;
 
 type Props = {
+    analyticsHelpers?: any;
     carbonTheme?: "white" | "g10" | "g90" | "g100";
+    createJoinTeamTrigger?: Function;
     baseEnvUrl?: string;
     config?: {
         features?: {
@@ -1399,6 +1408,8 @@ type Props = {
         };
         platformMessage?: any;
     };
+    history?: any;
+    isLaunchpad?: boolean;
     leftPanel?: (args: {
         close: () => void;
         isOpen: boolean;
@@ -1420,6 +1431,7 @@ type Props = {
     };
     supportMenuItems?: React.ReactNode[];
     templateMeteringEvent?: (props: any) => void;
+    trackEvent?: Function;
     triggerEvent?: (props: any) => any;
     user?: User;
     userTeams?: {
@@ -1431,6 +1443,6 @@ type Props = {
     handleShowTutorial?: Function;
     tutorialScreenToShow?: string;
 };
-declare function UIShell({ baseEnvUrl, carbonTheme, config, leftPanel, platformName, productName, profileMenuItems, supportMenuItems, renderPrivacyRedirect, renderPrivacyStatement, rightPanel, handleShowTutorial, skipToContentProps, templateMeteringEvent, triggerEvent, tutorialScreenToShow, user, userTeams, enableIcaMacs, }: Props): React.JSX.Element;
+declare function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme, config, createJoinTeamTrigger, history, isLaunchpad, leftPanel, platformName, productName, profileMenuItems, supportMenuItems, renderPrivacyRedirect, renderPrivacyStatement, rightPanel, handleShowTutorial, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, enableIcaMacs, }: Props): React.JSX.Element;
 
 export { AdvantageSideNav, AutoSuggestBmrg as AutoSuggest, Avatar, CheckboxListComponent as CheckboxList, ComboBoxComponent as ComboBox, ComboBoxMultiSelect, ComposedModal, ConfirmModal, CreatableComponent as Creatable, DataDrivenInput, DateInputComponent as DateInput, DecisionButtons, DelayedRender, DynamicFormik, DynamicInput, Error, Error403, Error404, ErrorBoundary, ErrorDragon, ErrorFullPage, Error as ErrorMessage, ErrorPage, ErrorPageCore, FeatureHeader, FeatureHeaderSubtitle, FeatureHeaderTitle, FeatureNavTab, FeatureNavTabs, FeatureSideNav, FeatureSideNavFooter, FeatureSideNavHeader, FeatureSideNavLink, FeatureSideNavLinks, FlowModalContainer as FlowModal, FlowModalForm, FormInput, Header, _default as HeaderMenuItem, ImageModal, InputGovernor, Loading, MemberBar, Modal, ModalConfirmEdit, FlowModalContainer as ModalFlow, FlowModalForm as ModalFlowForm, ModalForm, ModalFunctionChildrenProps, ModalTrigger, NotificationsContainer, PlatformBanner, PlatformNotificationsContainer, Portal, PrivacyStatement, ProtectedRoute, RadioGroupComponent as RadioGroup, RichTextAreaComponent as RichTextArea, SimpleTeamService, Team, TextAreaComponent as TextArea, TextInputComponent as TextInput, ToastNotification, ToggleComponent as Toggle, TooltipHover, UIShell, User, UserTeams, notify };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@boomerang-io/carbon-addons-boomerang-react",
   "description": "Carbon Addons for Boomerang apps",
-  "version": "4.6.8-beta.22",
+  "version": "4.6.8-beta.23",
   "author": {
     "name": "Tim Bula",
     "email": "timrbula@gmail.com"