@boomerang-io/carbon-addons-boomerang-react 4.6.11-beta.41 → 4.6.11-beta.43
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -64,19 +64,12 @@ const instanceCheckMarkContainerClass = "instance-checkmark-style-container";
|
|
|
64
64
|
function Header(props) {
|
|
65
65
|
const { analyticsHelpers, productName, baseEnvUrl, baseServicesUrl, carbonTheme = "g10", className, createJoinTeamTrigger, history, isLaunchpad = false, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, navLinks, platform, prefixName = "", refetchUser, refetchNavigation, rightPanel, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, user, userTeams, userTeamsAssets, } = props;
|
|
66
66
|
const hasUserTeams = Boolean(userTeams);
|
|
67
|
-
const hasUserTeamsAssets = Boolean(userTeamsAssets);
|
|
68
67
|
const userTeamsUrl = servicesConfig.serviceUrl.getUserTeamsServices({ baseServicesUrl });
|
|
69
|
-
const userTeamsAssetsUrl = servicesConfig.serviceUrl.getUserTeamsServicesAssets({ baseServicesUrl });
|
|
70
68
|
const teamsQuery = reactQuery.useQuery({
|
|
71
69
|
queryKey: userTeamsUrl,
|
|
72
70
|
queryFn: servicesConfig.resolver.query(userTeamsUrl, null),
|
|
73
71
|
enabled: !hasUserTeams && Boolean(baseServicesUrl),
|
|
74
72
|
});
|
|
75
|
-
const teamsAssetsQuery = reactQuery.useQuery({
|
|
76
|
-
queryKey: userTeamsAssetsUrl,
|
|
77
|
-
queryFn: servicesConfig.resolver.query(userTeamsAssetsUrl, null),
|
|
78
|
-
enabled: !hasUserTeamsAssets && Boolean(baseServicesUrl),
|
|
79
|
-
});
|
|
80
73
|
return (React__default.default.createElement(React__default.default.Fragment, null,
|
|
81
74
|
React__default.default.createElement(react.Theme, { theme: carbonTheme },
|
|
82
75
|
React__default.default.createElement(react.Header, { "aria-label": "App navigation header", className: className },
|
|
@@ -93,7 +86,7 @@ function Header(props) {
|
|
|
93
86
|
React__default.default.createElement(NotificationsMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: Boolean(props.enableNotifications), countEnabled: Boolean(props.enableNotificationsCount) }),
|
|
94
87
|
React__default.default.createElement(SupportMenu, { enabled: Array.isArray(props.supportMenuItems) && props.supportMenuItems.length > 0, menuItems: props.supportMenuItems }),
|
|
95
88
|
React__default.default.createElement(ProfileMenu, { enabled: Array.isArray(props.profileMenuItems) && props.profileMenuItems.length > 0, menuItems: props.profileMenuItems }),
|
|
96
|
-
React__default.default.createElement(AppSwitcherMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: props.enableAppSwitcher,
|
|
89
|
+
React__default.default.createElement(AppSwitcherMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: props.enableAppSwitcher, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent, userTeams: userTeamsAssets }),
|
|
97
90
|
React__default.default.createElement(RightPanelMenu, { enabled: Boolean(rightPanel && Object.keys(rightPanel).length), ...rightPanel })))),
|
|
98
91
|
React__default.default.createElement(NotificationsContainer.default, { enableMultiContainer: true, containerId: `${settings.prefix}--bmrg-header-notifications` })));
|
|
99
92
|
}
|
|
@@ -169,12 +162,20 @@ function ProfileMenu(props) {
|
|
|
169
162
|
}
|
|
170
163
|
function AppSwitcherMenu(props) {
|
|
171
164
|
const { isOpen, toggleActive, ref } = useHeaderMenu.default(MenuButtonId.Switcher);
|
|
165
|
+
const hasUserTeamsAssets = Boolean(props.userTeams);
|
|
166
|
+
const userTeamsAssetsUrl = servicesConfig.serviceUrl.getUserTeamsServicesAssets({ baseServicesUrl: props.baseServicesUrl });
|
|
167
|
+
const queryEnabled = isOpen && props.enabled && !hasUserTeamsAssets && Boolean(props.baseServicesUrl);
|
|
168
|
+
const teamsAssetsQuery = reactQuery.useQuery({
|
|
169
|
+
queryKey: userTeamsAssetsUrl,
|
|
170
|
+
queryFn: servicesConfig.resolver.query(userTeamsAssetsUrl, null),
|
|
171
|
+
enabled: queryEnabled,
|
|
172
|
+
});
|
|
172
173
|
if (!props.enabled || !props.baseServicesUrl) {
|
|
173
174
|
return null;
|
|
174
175
|
}
|
|
175
176
|
return (React__default.default.createElement("div", { ref: ref },
|
|
176
177
|
React__default.default.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__default.default.createElement(icons.Close, { size: 20 }) : React__default.default.createElement(icons.Switcher, { size: 20 })),
|
|
177
|
-
React__default.default.createElement(HeaderAppSwitcher.default, { baseEnvUrl: props.baseEnvUrl, baseServicesUrl: props.baseServicesUrl, id: MenuListId.Switcher, isOpen: isOpen, teamsQuery:
|
|
178
|
+
React__default.default.createElement(HeaderAppSwitcher.default, { baseEnvUrl: props.baseEnvUrl, baseServicesUrl: props.baseServicesUrl, id: MenuListId.Switcher, isOpen: isOpen, teamsQuery: teamsAssetsQuery, templateMeteringEvent: props.templateMeteringEvent, triggerEvent: props.triggerEvent, userTeams: props.userTeams })));
|
|
178
179
|
}
|
|
179
180
|
function RightPanelMenu(props) {
|
|
180
181
|
const { isOpen, toggleActive, ref } = useHeaderMenu.default(MenuButtonId.RightPanel);
|
|
@@ -71,17 +71,17 @@ function HeaderAppSwitcher({ baseServicesUrl, baseEnvUrl, id, isOpen, teamsQuery
|
|
|
71
71
|
return null;
|
|
72
72
|
}
|
|
73
73
|
function TeamServiceListMenu({ baseEnvUrl, isAccount, isMember, team, templateMeteringEvent, triggerEvent, }) {
|
|
74
|
-
const { name, displayName, services } = team;
|
|
74
|
+
const { id, name, displayName, services } = team;
|
|
75
75
|
const nameToDisplay = displayName ? displayName : name;
|
|
76
76
|
const isNameTruncated = nameToDisplay?.length > 30;
|
|
77
77
|
if (!isMember) {
|
|
78
|
-
return (React__default.default.createElement("div", { className: `${settings.prefix}--side-nav__item`, title: isNameTruncated ? nameToDisplay : undefined },
|
|
78
|
+
return (React__default.default.createElement("div", { id: id, className: `${settings.prefix}--side-nav__item`, title: isNameTruncated ? nameToDisplay : undefined },
|
|
79
79
|
React__default.default.createElement("button", { disabled: true, className: `${settings.prefix}--side-nav__submenu`, "data-testid": "header-app-switcher-service" },
|
|
80
80
|
React__default.default.createElement("span", { className: `${settings.prefix}--side-nav__submenu-title` }, nameToDisplay))));
|
|
81
81
|
}
|
|
82
82
|
return (
|
|
83
83
|
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
|
|
84
|
-
React__default.default.createElement("ul", { className: `${settings.prefix}--bmrg-header-team`, title: isNameTruncated ? nameToDisplay : undefined },
|
|
84
|
+
React__default.default.createElement("ul", { id: id, className: `${settings.prefix}--bmrg-header-team`, title: isNameTruncated ? nameToDisplay : undefined },
|
|
85
85
|
React__default.default.createElement(react.SideNavMenu, { title: nameToDisplay },
|
|
86
86
|
React__default.default.createElement(ServiceList, { baseEnvUrl: baseEnvUrl, isAccount: isAccount, servicesData: services, team: team, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent }))));
|
|
87
87
|
}
|
|
@@ -98,7 +98,7 @@ function ServiceList(props) {
|
|
|
98
98
|
return (React__default.default.createElement(React__default.default.Fragment, null, servicesData.map((service) => {
|
|
99
99
|
const isExternalLink = typeof service?.url?.includes === "function" && !service.url.includes(baseEnvUrl);
|
|
100
100
|
const isNameTruncated = isExternalLink ? service.name.length > 28 : service.name.length > 32;
|
|
101
|
-
return (React__default.default.createElement(react.SideNavMenuItem, { key: service.
|
|
101
|
+
return (React__default.default.createElement(react.SideNavMenuItem, { id: service.id, key: service.id, href: service.url, title: isNameTruncated ? service.name : undefined, onClick: () => handleLinkClick(service), "data-testid": "header-app-switcher-service", ...(isExternalLink ? externalProps : undefined) },
|
|
102
102
|
React__default.default.createElement("span", null, service.name),
|
|
103
103
|
isExternalLink ? React__default.default.createElement(icons.Launch, { size: 16, title: "Opens page in new tab" }) : undefined));
|
|
104
104
|
})));
|
|
@@ -56,19 +56,12 @@ const instanceCheckMarkContainerClass = "instance-checkmark-style-container";
|
|
|
56
56
|
function Header(props) {
|
|
57
57
|
const { analyticsHelpers, productName, baseEnvUrl, baseServicesUrl, carbonTheme = "g10", className, createJoinTeamTrigger, history, isLaunchpad = false, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, navLinks, platform, prefixName = "", refetchUser, refetchNavigation, rightPanel, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, user, userTeams, userTeamsAssets, } = props;
|
|
58
58
|
const hasUserTeams = Boolean(userTeams);
|
|
59
|
-
const hasUserTeamsAssets = Boolean(userTeamsAssets);
|
|
60
59
|
const userTeamsUrl = serviceUrl.getUserTeamsServices({ baseServicesUrl });
|
|
61
|
-
const userTeamsAssetsUrl = serviceUrl.getUserTeamsServicesAssets({ baseServicesUrl });
|
|
62
60
|
const teamsQuery = useQuery({
|
|
63
61
|
queryKey: userTeamsUrl,
|
|
64
62
|
queryFn: resolver.query(userTeamsUrl, null),
|
|
65
63
|
enabled: !hasUserTeams && Boolean(baseServicesUrl),
|
|
66
64
|
});
|
|
67
|
-
const teamsAssetsQuery = useQuery({
|
|
68
|
-
queryKey: userTeamsAssetsUrl,
|
|
69
|
-
queryFn: resolver.query(userTeamsAssetsUrl, null),
|
|
70
|
-
enabled: !hasUserTeamsAssets && Boolean(baseServicesUrl),
|
|
71
|
-
});
|
|
72
65
|
return (React.createElement(React.Fragment, null,
|
|
73
66
|
React.createElement(Theme, { theme: carbonTheme },
|
|
74
67
|
React.createElement(Header$1, { "aria-label": "App navigation header", className: className },
|
|
@@ -85,7 +78,7 @@ function Header(props) {
|
|
|
85
78
|
React.createElement(NotificationsMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: Boolean(props.enableNotifications), countEnabled: Boolean(props.enableNotificationsCount) }),
|
|
86
79
|
React.createElement(SupportMenu, { enabled: Array.isArray(props.supportMenuItems) && props.supportMenuItems.length > 0, menuItems: props.supportMenuItems }),
|
|
87
80
|
React.createElement(ProfileMenu, { enabled: Array.isArray(props.profileMenuItems) && props.profileMenuItems.length > 0, menuItems: props.profileMenuItems }),
|
|
88
|
-
React.createElement(AppSwitcherMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: props.enableAppSwitcher,
|
|
81
|
+
React.createElement(AppSwitcherMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: props.enableAppSwitcher, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent, userTeams: userTeamsAssets }),
|
|
89
82
|
React.createElement(RightPanelMenu, { enabled: Boolean(rightPanel && Object.keys(rightPanel).length), ...rightPanel })))),
|
|
90
83
|
React.createElement(NotificationsContainer, { enableMultiContainer: true, containerId: `${prefix}--bmrg-header-notifications` })));
|
|
91
84
|
}
|
|
@@ -161,12 +154,20 @@ function ProfileMenu(props) {
|
|
|
161
154
|
}
|
|
162
155
|
function AppSwitcherMenu(props) {
|
|
163
156
|
const { isOpen, toggleActive, ref } = useHeaderMenu(MenuButtonId.Switcher);
|
|
157
|
+
const hasUserTeamsAssets = Boolean(props.userTeams);
|
|
158
|
+
const userTeamsAssetsUrl = serviceUrl.getUserTeamsServicesAssets({ baseServicesUrl: props.baseServicesUrl });
|
|
159
|
+
const queryEnabled = isOpen && props.enabled && !hasUserTeamsAssets && Boolean(props.baseServicesUrl);
|
|
160
|
+
const teamsAssetsQuery = useQuery({
|
|
161
|
+
queryKey: userTeamsAssetsUrl,
|
|
162
|
+
queryFn: resolver.query(userTeamsAssetsUrl, null),
|
|
163
|
+
enabled: queryEnabled,
|
|
164
|
+
});
|
|
164
165
|
if (!props.enabled || !props.baseServicesUrl) {
|
|
165
166
|
return null;
|
|
166
167
|
}
|
|
167
168
|
return (React.createElement("div", { ref: ref },
|
|
168
169
|
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 })),
|
|
169
|
-
React.createElement(HeaderAppSwitcher, { baseEnvUrl: props.baseEnvUrl, baseServicesUrl: props.baseServicesUrl, id: MenuListId.Switcher, isOpen: isOpen, teamsQuery:
|
|
170
|
+
React.createElement(HeaderAppSwitcher, { baseEnvUrl: props.baseEnvUrl, baseServicesUrl: props.baseServicesUrl, id: MenuListId.Switcher, isOpen: isOpen, teamsQuery: teamsAssetsQuery, templateMeteringEvent: props.templateMeteringEvent, triggerEvent: props.triggerEvent, userTeams: props.userTeams })));
|
|
170
171
|
}
|
|
171
172
|
function RightPanelMenu(props) {
|
|
172
173
|
const { isOpen, toggleActive, ref } = useHeaderMenu(MenuButtonId.RightPanel);
|
|
@@ -62,17 +62,17 @@ function HeaderAppSwitcher({ baseServicesUrl, baseEnvUrl, id, isOpen, teamsQuery
|
|
|
62
62
|
return null;
|
|
63
63
|
}
|
|
64
64
|
function TeamServiceListMenu({ baseEnvUrl, isAccount, isMember, team, templateMeteringEvent, triggerEvent, }) {
|
|
65
|
-
const { name, displayName, services } = team;
|
|
65
|
+
const { id, name, displayName, services } = team;
|
|
66
66
|
const nameToDisplay = displayName ? displayName : name;
|
|
67
67
|
const isNameTruncated = nameToDisplay?.length > 30;
|
|
68
68
|
if (!isMember) {
|
|
69
|
-
return (React.createElement("div", { className: `${prefix}--side-nav__item`, title: isNameTruncated ? nameToDisplay : undefined },
|
|
69
|
+
return (React.createElement("div", { id: id, className: `${prefix}--side-nav__item`, title: isNameTruncated ? nameToDisplay : undefined },
|
|
70
70
|
React.createElement("button", { disabled: true, className: `${prefix}--side-nav__submenu`, "data-testid": "header-app-switcher-service" },
|
|
71
71
|
React.createElement("span", { className: `${prefix}--side-nav__submenu-title` }, nameToDisplay))));
|
|
72
72
|
}
|
|
73
73
|
return (
|
|
74
74
|
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
|
|
75
|
-
React.createElement("ul", { className: `${prefix}--bmrg-header-team`, title: isNameTruncated ? nameToDisplay : undefined },
|
|
75
|
+
React.createElement("ul", { id: id, className: `${prefix}--bmrg-header-team`, title: isNameTruncated ? nameToDisplay : undefined },
|
|
76
76
|
React.createElement(SideNavMenu, { title: nameToDisplay },
|
|
77
77
|
React.createElement(ServiceList, { baseEnvUrl: baseEnvUrl, isAccount: isAccount, servicesData: services, team: team, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent }))));
|
|
78
78
|
}
|
|
@@ -89,7 +89,7 @@ function ServiceList(props) {
|
|
|
89
89
|
return (React.createElement(React.Fragment, null, servicesData.map((service) => {
|
|
90
90
|
const isExternalLink = typeof service?.url?.includes === "function" && !service.url.includes(baseEnvUrl);
|
|
91
91
|
const isNameTruncated = isExternalLink ? service.name.length > 28 : service.name.length > 32;
|
|
92
|
-
return (React.createElement(SideNavMenuItem, { key: service.
|
|
92
|
+
return (React.createElement(SideNavMenuItem, { id: service.id, key: service.id, href: service.url, title: isNameTruncated ? service.name : undefined, onClick: () => handleLinkClick(service), "data-testid": "header-app-switcher-service", ...(isExternalLink ? externalProps : undefined) },
|
|
93
93
|
React.createElement("span", null, service.name),
|
|
94
94
|
isExternalLink ? React.createElement(Launch, { size: 16, title: "Opens page in new tab" }) : undefined));
|
|
95
95
|
})));
|
package/dist/types/index.d.ts
CHANGED
|
@@ -78,11 +78,15 @@ type SimpleIdNameMap = {
|
|
|
78
78
|
privateTeam?: boolean;
|
|
79
79
|
displayName?: string;
|
|
80
80
|
services?: Array<{
|
|
81
|
+
id: string;
|
|
82
|
+
templateId: string;
|
|
81
83
|
name: string;
|
|
82
84
|
url: string;
|
|
83
85
|
}>;
|
|
84
86
|
};
|
|
85
87
|
type SimpleTeamService = {
|
|
88
|
+
id: string;
|
|
89
|
+
templateId: string;
|
|
86
90
|
name: string;
|
|
87
91
|
url: string;
|
|
88
92
|
};
|
package/package.json
CHANGED