@boomerang-io/carbon-addons-boomerang-react 4.6.11-beta.3 → 4.6.11-beta.31
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.
- package/dist/cjs/components/AdvantageSideNav/AdvantageSideNav.js +153 -173
- package/dist/cjs/components/Feedback/Feedback.js +9 -12
- package/dist/cjs/components/Header/Header.js +18 -4
- package/dist/cjs/components/Header/HeaderAppSwitcher.js +2 -10
- package/dist/cjs/components/Header/HeaderTeamSwitcher.js +326 -0
- package/dist/cjs/components/UIShell/UIShell.js +9 -4
- package/dist/esm/components/AdvantageSideNav/AdvantageSideNav.js +155 -175
- package/dist/esm/components/Feedback/Feedback.js +9 -12
- package/dist/esm/components/Header/Header.js +18 -4
- package/dist/esm/components/Header/HeaderAppSwitcher.js +2 -10
- package/dist/esm/components/Header/HeaderTeamSwitcher.js +317 -0
- package/dist/esm/components/UIShell/UIShell.js +10 -5
- package/dist/types/index.d.ts +37 -6
- package/package.json +2 -2
- package/scss/components/AdvantageSideNav/_advantageSideNav.scss +0 -6
- package/scss/components/Header/_headerTeamSwitcher.scss +195 -0
- package/scss/global/index.scss +7 -8
|
@@ -0,0 +1,317 @@
|
|
|
1
|
+
import React, { useState, useEffect } from 'react';
|
|
2
|
+
import { useQueryClient, useMutation } from 'react-query';
|
|
3
|
+
import { InlineLoading, HeaderMenu, HeaderMenuItem } from '@carbon/react';
|
|
4
|
+
import { CheckmarkFilled, AddAlt, GroupAccount, ChevronDown } from '@carbon/react/icons';
|
|
5
|
+
import sortBy from 'lodash.sortby';
|
|
6
|
+
import HeaderMenu$1 from './HeaderMenu.js';
|
|
7
|
+
import { resolver, serviceUrl } from '../../config/servicesConfig.js';
|
|
8
|
+
import { prefix } from '../../internal/settings.js';
|
|
9
|
+
import { USER_PLATFORM_ROLE } from '../../constants/UserType.js';
|
|
10
|
+
|
|
11
|
+
/*
|
|
12
|
+
IBM Confidential
|
|
13
|
+
694970X, 69497O0
|
|
14
|
+
© Copyright IBM Corp. 2022, 2025
|
|
15
|
+
*/
|
|
16
|
+
const headerDropdownMenuContainerClassname = `${prefix}--header-dropdown-menu-container`;
|
|
17
|
+
const headerDropdownMenuLoadingClassname = `${prefix}--header-dropdown-menu-loading`;
|
|
18
|
+
const headerDropdownMenuSuccessClassname = `${prefix}--header-dropdown-menu-success`;
|
|
19
|
+
const headerDropdownMenuClassname = `${prefix}--header-dropdown-menu`;
|
|
20
|
+
const headerDropdownMenuListClassname = `${prefix}--bmrg-header-drop-down`;
|
|
21
|
+
const headerDropdownMenuItemContainerClassname = `${prefix}--header-dropdown-menu-item-container`;
|
|
22
|
+
const headerDropdownMenuItemClassname = `${prefix}--header-dropdown-menu-item`;
|
|
23
|
+
const headerDropdownMenuItemTextIconClassname = `${prefix}--header-dropdown-menu-item-text-icon`;
|
|
24
|
+
const headerDropdownMenuItemTextClassname = `${prefix}--header-dropdown-menu-item-text`;
|
|
25
|
+
const headerDropdownMenuItemIconClassname = `${prefix}--header-dropdown-menu-item-icon`;
|
|
26
|
+
const headerDropdownMenuItemAccountContainerClassname = `${prefix}--header-dropdown-menu-item-account-container`;
|
|
27
|
+
const headerDropdownMenuItemAccountClassname = `${prefix}--header-dropdown-menu-item-account`;
|
|
28
|
+
const headerDropdownMenuItemAccountIconsClassname = `${prefix}--header-dropdown-menu-item-account-icons`;
|
|
29
|
+
const headerDropdownMenuItemAccountGroupIconClassname = `${prefix}--header-dropdown-menu-item-account-group-icon`;
|
|
30
|
+
const headerDropdownMenuItemAccountChevronIconClassname = `${prefix}--header-dropdown-menu-item-account-chevron-icon`;
|
|
31
|
+
const headerDropdownMenuItemAccountSubmenuClassname = `${prefix}--header-dropdown-menu-item-account-submenu`;
|
|
32
|
+
const headerTeamSwitcherCreateTeamButtonContainerClassname = `${prefix}--header-team-switcher-create-team-button-container`;
|
|
33
|
+
const headerTeamSwitcherCreateTeamButtonClassname = `${prefix}--header-team-switcher-create-team-button`;
|
|
34
|
+
const headerTeamSwitcherCreateTeamButtonTextClassname = `${prefix}--header-team-switcher-create-team-button-text`;
|
|
35
|
+
const headerTeamSwitcherCreateTeamButtonIconClassname = `${prefix}--header-team-switcher-create-team-button-icon`;
|
|
36
|
+
function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamTrigger, history, isLaunchpad, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, menuAriaLabelRecord, menuButtonId, menuListId, navigationPlatform, teamsQuery, trackEvent, user, userTeams, }) {
|
|
37
|
+
const queryClient = useQueryClient();
|
|
38
|
+
const [selectedTeam, setSelectedTeam] = useState();
|
|
39
|
+
const [openAccountSubmenuId, setOpenAccountSubmenuId] = useState("");
|
|
40
|
+
const hasUserTeams = Boolean(userTeams);
|
|
41
|
+
const showSelectTeamPurpose = navigationPlatform?.requireTeamPurpose;
|
|
42
|
+
const createTeamButtonText = showSelectTeamPurpose ? "Create Team" : "Create or Join Team";
|
|
43
|
+
const userTeamInstanceSwitcherDefault = user?.teamInstanceSwitcherDefault;
|
|
44
|
+
const profileUrl = serviceUrl.resourceUserProfile({ baseServicesUrl });
|
|
45
|
+
const teamLink = ({ teamId }) => {
|
|
46
|
+
return `${navigationPlatform.baseEnvUrl}/launchpad/teams/${teamId}`;
|
|
47
|
+
};
|
|
48
|
+
const { mutateAsync: mutateUserProfile, isLoading: mutateUserProfileIsLoading } = useMutation(resolver.patchUserProfile, {
|
|
49
|
+
onSuccess: () => {
|
|
50
|
+
queryClient.invalidateQueries(profileUrl);
|
|
51
|
+
},
|
|
52
|
+
});
|
|
53
|
+
React.useEffect(() => {
|
|
54
|
+
let timer;
|
|
55
|
+
if (isSuccessTeamSwitcher && setIsSuccessTeamSwitcher) {
|
|
56
|
+
timer = setTimeout(() => {
|
|
57
|
+
setIsSuccessTeamSwitcher(false);
|
|
58
|
+
}, 3000);
|
|
59
|
+
}
|
|
60
|
+
return () => clearTimeout(timer);
|
|
61
|
+
}, [isSuccessTeamSwitcher, setIsSuccessTeamSwitcher]);
|
|
62
|
+
useEffect(() => {
|
|
63
|
+
let accountTeams, standardTeams, personalTeam = [];
|
|
64
|
+
if (hasUserTeams) {
|
|
65
|
+
accountTeams = userTeams?.data?.accountTeams ?? [];
|
|
66
|
+
standardTeams = userTeams?.data?.standardTeams ?? [];
|
|
67
|
+
personalTeam = userTeams?.data?.personalTeam ?? [];
|
|
68
|
+
}
|
|
69
|
+
else {
|
|
70
|
+
accountTeams = teamsQuery?.data?.accountTeams ?? [];
|
|
71
|
+
standardTeams = teamsQuery?.data?.standardTeams ?? [];
|
|
72
|
+
personalTeam = teamsQuery?.data?.personalTeam ?? [];
|
|
73
|
+
}
|
|
74
|
+
const userHasPersonalTeam = personalTeam.length > 0;
|
|
75
|
+
const userHasAccountTeams = accountTeams.length > 0;
|
|
76
|
+
const userHasStandardTeams = standardTeams.length > 0;
|
|
77
|
+
const userHasTeams = userHasPersonalTeam || userHasAccountTeams || userHasStandardTeams;
|
|
78
|
+
const handleSelectTeam = async ({ team }) => {
|
|
79
|
+
setSelectedTeam(team);
|
|
80
|
+
if (!userTeamInstanceSwitcherDefault) {
|
|
81
|
+
const body = {
|
|
82
|
+
teamInstanceSwitcherDefault: team.id,
|
|
83
|
+
};
|
|
84
|
+
await mutateUserProfile({ baseServicesUrl, body });
|
|
85
|
+
}
|
|
86
|
+
};
|
|
87
|
+
if (userHasTeams) {
|
|
88
|
+
if (!userTeamInstanceSwitcherDefault) {
|
|
89
|
+
if (userHasPersonalTeam) {
|
|
90
|
+
handleSelectTeam({ team: personalTeam[0] });
|
|
91
|
+
}
|
|
92
|
+
else if (userHasAccountTeams) {
|
|
93
|
+
const sortedAccounts = sortBy(accountTeams, [
|
|
94
|
+
(account) => (account.displayName ? account.displayName : account.name),
|
|
95
|
+
]);
|
|
96
|
+
handleSelectTeam({ team: sortedAccounts[0] });
|
|
97
|
+
}
|
|
98
|
+
else if (userHasStandardTeams) {
|
|
99
|
+
const sortedStandardTeams = sortBy(standardTeams, [
|
|
100
|
+
(standardTeam) => (standardTeam.displayName ? standardTeam.displayName : standardTeam.name),
|
|
101
|
+
]);
|
|
102
|
+
handleSelectTeam({ team: sortedStandardTeams[0] });
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
else if (selectedTeam?.id !== userTeamInstanceSwitcherDefault) {
|
|
106
|
+
let allProjectTeams = [];
|
|
107
|
+
if (userHasAccountTeams) {
|
|
108
|
+
accountTeams.forEach((team) => {
|
|
109
|
+
if (team.projectTeams && team.projectTeams.length > 0) {
|
|
110
|
+
allProjectTeams = allProjectTeams.concat(team.projectTeams);
|
|
111
|
+
}
|
|
112
|
+
});
|
|
113
|
+
}
|
|
114
|
+
const allTeams = personalTeam.concat(standardTeams, accountTeams, allProjectTeams);
|
|
115
|
+
const newSelectedTeam = allTeams.find((team) => team.id === userTeamInstanceSwitcherDefault);
|
|
116
|
+
handleSelectTeam({ team: newSelectedTeam });
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
}, [
|
|
120
|
+
baseServicesUrl,
|
|
121
|
+
hasUserTeams,
|
|
122
|
+
mutateUserProfile,
|
|
123
|
+
selectedTeam,
|
|
124
|
+
teamsQuery?.data?.accountTeams,
|
|
125
|
+
teamsQuery?.data?.personalTeam,
|
|
126
|
+
teamsQuery?.data?.standardTeams,
|
|
127
|
+
userTeamInstanceSwitcherDefault,
|
|
128
|
+
userTeams?.data?.accountTeams,
|
|
129
|
+
userTeams?.data?.personalTeam,
|
|
130
|
+
userTeams?.data?.standardTeams,
|
|
131
|
+
]);
|
|
132
|
+
const handleHeaderMenuClick = () => {
|
|
133
|
+
setOpenAccountSubmenuId("");
|
|
134
|
+
};
|
|
135
|
+
const handleTeamClick = ({ team, type }) => {
|
|
136
|
+
setOpenAccountSubmenuId("");
|
|
137
|
+
if (analyticsHelpers?.navigateEventHandler && trackEvent) {
|
|
138
|
+
analyticsHelpers.navigateEventHandler({
|
|
139
|
+
action: `Clicked ${team.name} in Team Switcher`,
|
|
140
|
+
category: "Team Switcher",
|
|
141
|
+
destinationPath: teamLink({ teamId: team.id }),
|
|
142
|
+
teamId: team.id,
|
|
143
|
+
teamType: type,
|
|
144
|
+
trackEvent,
|
|
145
|
+
});
|
|
146
|
+
}
|
|
147
|
+
if (isLaunchpad && Boolean(history)) {
|
|
148
|
+
history.push(`/teams/${team.id}`);
|
|
149
|
+
}
|
|
150
|
+
else {
|
|
151
|
+
window.open(teamLink({ teamId: team.id }), "_self");
|
|
152
|
+
}
|
|
153
|
+
};
|
|
154
|
+
const handleCreateJoinTeamClick = (e) => {
|
|
155
|
+
if (analyticsHelpers?.ctaEventHandler && trackEvent) {
|
|
156
|
+
analyticsHelpers.ctaEventHandler({
|
|
157
|
+
category: "Team Switcher",
|
|
158
|
+
CTA: "Create/Join team clicked",
|
|
159
|
+
pageName: "",
|
|
160
|
+
trackEvent,
|
|
161
|
+
});
|
|
162
|
+
}
|
|
163
|
+
if (createJoinTeamTrigger) {
|
|
164
|
+
createJoinTeamTrigger(e);
|
|
165
|
+
}
|
|
166
|
+
else {
|
|
167
|
+
window.open(`${navigationPlatform.baseEnvUrl}/launchpad?createJoinTeam=true`, "_self");
|
|
168
|
+
}
|
|
169
|
+
};
|
|
170
|
+
const handleOpenAccountSubmenu = ({ e, id }) => {
|
|
171
|
+
e.stopPropagation();
|
|
172
|
+
if (openAccountSubmenuId === id) {
|
|
173
|
+
setOpenAccountSubmenuId("");
|
|
174
|
+
}
|
|
175
|
+
else {
|
|
176
|
+
setOpenAccountSubmenuId(id);
|
|
177
|
+
}
|
|
178
|
+
};
|
|
179
|
+
if (userTeams?.isLoading || teamsQuery?.isLoading || mutateUserProfileIsLoading) {
|
|
180
|
+
return (React.createElement("div", { style: { display: "flex", alignItems: "center" } },
|
|
181
|
+
React.createElement(InlineLoading, null)));
|
|
182
|
+
}
|
|
183
|
+
if (userTeams?.data || teamsQuery?.data) {
|
|
184
|
+
let accountTeams, standardTeams, personalTeam = [];
|
|
185
|
+
if (hasUserTeams) {
|
|
186
|
+
accountTeams = userTeams?.data?.accountTeams ?? [];
|
|
187
|
+
standardTeams = userTeams?.data?.standardTeams ?? [];
|
|
188
|
+
personalTeam = userTeams?.data?.personalTeam ?? [];
|
|
189
|
+
}
|
|
190
|
+
else {
|
|
191
|
+
accountTeams = teamsQuery?.data?.accountTeams ?? [];
|
|
192
|
+
standardTeams = teamsQuery?.data?.standardTeams ?? [];
|
|
193
|
+
personalTeam = teamsQuery?.data?.personalTeam ?? [];
|
|
194
|
+
}
|
|
195
|
+
let sortedAccountTeamsWithNamesToDisplay = [];
|
|
196
|
+
let sortedStandardTeamsWithNamesToDisplay = [];
|
|
197
|
+
if (accountTeams?.length > 0) {
|
|
198
|
+
const newAccountTeams = accountTeams.map((team) => {
|
|
199
|
+
let newProjectTeams = [];
|
|
200
|
+
if (team.projectTeams && team.projectTeams.length > 0) {
|
|
201
|
+
newProjectTeams = team.projectTeams?.map((team) => ({
|
|
202
|
+
...team,
|
|
203
|
+
nameToDisplay: team.displayName ? team.displayName : team.name,
|
|
204
|
+
}));
|
|
205
|
+
}
|
|
206
|
+
return {
|
|
207
|
+
...team,
|
|
208
|
+
nameToDisplay: team.displayName ? team.displayName : team.name,
|
|
209
|
+
projectTeams: sortBy(newProjectTeams, ["nameToDisplay"]),
|
|
210
|
+
};
|
|
211
|
+
});
|
|
212
|
+
sortedAccountTeamsWithNamesToDisplay = sortBy(newAccountTeams, ["nameToDisplay"]);
|
|
213
|
+
}
|
|
214
|
+
if (standardTeams?.length > 0) {
|
|
215
|
+
const newStandardTeams = standardTeams.map((team) => {
|
|
216
|
+
return {
|
|
217
|
+
...team,
|
|
218
|
+
nameToDisplay: team.displayName ? team.displayName : team.name,
|
|
219
|
+
};
|
|
220
|
+
});
|
|
221
|
+
sortedStandardTeamsWithNamesToDisplay = sortBy(newStandardTeams, ["nameToDisplay"]);
|
|
222
|
+
}
|
|
223
|
+
let selectedTeamName = selectedTeam?.displayName ? selectedTeam.displayName : selectedTeam?.name;
|
|
224
|
+
if (selectedTeamName && selectedTeamName.length > 65) {
|
|
225
|
+
selectedTeamName = selectedTeamName.slice(0, 65) + "...";
|
|
226
|
+
}
|
|
227
|
+
const isPartnerUser = Boolean(user?.type === USER_PLATFORM_ROLE.Partner);
|
|
228
|
+
return (React.createElement("div", { className: headerDropdownMenuContainerClassname },
|
|
229
|
+
isLoadingTeamSwitcher ? (React.createElement("div", { className: headerDropdownMenuLoadingClassname },
|
|
230
|
+
React.createElement(InlineLoading, null))) : isSuccessTeamSwitcher ? (React.createElement("div", { className: headerDropdownMenuSuccessClassname },
|
|
231
|
+
React.createElement(CheckmarkFilled, null))) : null,
|
|
232
|
+
React.createElement(HeaderMenu, { id: "header-team-switcher-menu", "aria-label": menuAriaLabelRecord, className: headerDropdownMenuClassname, menuLinkName: selectedTeamName ? selectedTeamName : "No team selected", onClick: handleHeaderMenuClick, "data-testid": "header-team-switcher-menu" },
|
|
233
|
+
React.createElement(HeaderMenu$1, { "aria-labelledby": menuButtonId, className: headerDropdownMenuListClassname, id: menuListId },
|
|
234
|
+
!isPartnerUser && (React.createElement(HeaderMenuItem, { id: "header-team-switcher-create-join-team-button", className: headerTeamSwitcherCreateTeamButtonContainerClassname, onClick: handleCreateJoinTeamClick,
|
|
235
|
+
// eslint-disable-next-line no-script-url
|
|
236
|
+
href: "javascript:void(0)", role: "menuitem", "data-testid": "header-team-switcher-create-join-team-button" },
|
|
237
|
+
React.createElement("div", { className: headerTeamSwitcherCreateTeamButtonClassname },
|
|
238
|
+
React.createElement("span", { className: headerTeamSwitcherCreateTeamButtonTextClassname }, createTeamButtonText),
|
|
239
|
+
React.createElement(AddAlt, { className: headerTeamSwitcherCreateTeamButtonIconClassname })))),
|
|
240
|
+
personalTeam.length > 0
|
|
241
|
+
? personalTeam.map((team) => {
|
|
242
|
+
const teamName = team.displayName ? team.displayName : team.name;
|
|
243
|
+
const isTeamSelected = team.id === selectedTeam?.id;
|
|
244
|
+
return (React.createElement("div", { key: team.id, id: `${team.id}-personal-menu-item-id` },
|
|
245
|
+
React.createElement(HeaderMenuItem, { key: team.id, id: `${team.id}-personal-menu-item`, "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
246
|
+
handleTeamClick({ team, type: "personal" });
|
|
247
|
+
},
|
|
248
|
+
// eslint-disable-next-line no-script-url
|
|
249
|
+
href: "javascript:void(0)", "data-testid": "header-team-switcher-menu-item" },
|
|
250
|
+
React.createElement("div", { className: headerDropdownMenuItemClassname },
|
|
251
|
+
React.createElement("span", { title: teamName, className: headerDropdownMenuItemTextClassname }, teamName),
|
|
252
|
+
isTeamSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null))));
|
|
253
|
+
})
|
|
254
|
+
: null,
|
|
255
|
+
accountTeams.length > 0
|
|
256
|
+
? sortedAccountTeamsWithNamesToDisplay.map((team) => {
|
|
257
|
+
const isSubmenuOpen = team.id === openAccountSubmenuId;
|
|
258
|
+
const isProjectTeamSelected = team.projectTeams &&
|
|
259
|
+
team.projectTeams.length > 0 &&
|
|
260
|
+
team.projectTeams.some((team) => team.id === selectedTeam?.id);
|
|
261
|
+
const isTeamSelected = team.id === selectedTeam?.id;
|
|
262
|
+
const isMenuSelected = isTeamSelected || isProjectTeamSelected;
|
|
263
|
+
return (React.createElement("div", { key: team.id, id: `${team.id}-account-menu` },
|
|
264
|
+
React.createElement(HeaderMenuItem, { "aria-expanded": isSubmenuOpen, "aria-selected": isMenuSelected, className: headerDropdownMenuItemAccountContainerClassname, onClick: (e) => handleOpenAccountSubmenu({ e, id: team.id }),
|
|
265
|
+
// eslint-disable-next-line no-script-url
|
|
266
|
+
href: "javascript:void(0)", "data-testid": "header-team-switcher-menu-account-accordion" },
|
|
267
|
+
React.createElement("div", { className: headerDropdownMenuItemAccountClassname },
|
|
268
|
+
React.createElement("div", { className: headerDropdownMenuItemTextIconClassname },
|
|
269
|
+
React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
|
|
270
|
+
isMenuSelected ? (React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname })) : null),
|
|
271
|
+
React.createElement("div", { className: headerDropdownMenuItemAccountIconsClassname },
|
|
272
|
+
React.createElement(GroupAccount, { className: headerDropdownMenuItemAccountGroupIconClassname }),
|
|
273
|
+
React.createElement(ChevronDown, { className: headerDropdownMenuItemAccountChevronIconClassname })))),
|
|
274
|
+
React.createElement("div", { id: `${team.id}-account-submenu`, key: `${team.id}-account-submenu`, "aria-expanded": isSubmenuOpen, className: headerDropdownMenuItemAccountSubmenuClassname },
|
|
275
|
+
React.createElement(HeaderMenuItem, { key: `${team.id}-menu-item`, id: `${team.id}-account-menu-item`, "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
276
|
+
handleTeamClick({ team, type: "account" });
|
|
277
|
+
}, "data-testid": "header-team-switcher-menu-account-accordion-item",
|
|
278
|
+
// eslint-disable-next-line no-script-url
|
|
279
|
+
href: "javascript:void(0)" },
|
|
280
|
+
React.createElement("div", { className: headerDropdownMenuItemClassname, style: { paddingLeft: "1rem" } },
|
|
281
|
+
React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, "Account Page"),
|
|
282
|
+
isTeamSelected ? (React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname })) : null)),
|
|
283
|
+
team.projectTeams && team.projectTeams.length > 0
|
|
284
|
+
? team.projectTeams.map((team) => {
|
|
285
|
+
const isTeamSelected = team.id === selectedTeam?.id;
|
|
286
|
+
return (React.createElement("div", { key: team.id, id: `${team.id}-project-menu-item` },
|
|
287
|
+
React.createElement(HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
288
|
+
handleTeamClick({ team, type: "project" });
|
|
289
|
+
}, "data-testid": "header-team-switcher-menu-account-accordion-item",
|
|
290
|
+
// eslint-disable-next-line no-script-url
|
|
291
|
+
href: "javascript:void(0)" },
|
|
292
|
+
React.createElement("div", { className: headerDropdownMenuItemClassname, style: { paddingLeft: "1rem" } },
|
|
293
|
+
React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
|
|
294
|
+
isTeamSelected ? (React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname })) : null))));
|
|
295
|
+
})
|
|
296
|
+
: null)));
|
|
297
|
+
})
|
|
298
|
+
: null,
|
|
299
|
+
standardTeams.length > 0
|
|
300
|
+
? sortedStandardTeamsWithNamesToDisplay.map((team) => {
|
|
301
|
+
const isTeamSelected = team.id === selectedTeam?.id;
|
|
302
|
+
return (React.createElement("div", { key: team.id, id: `${team.id}-standard-menu-item` },
|
|
303
|
+
React.createElement(HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
304
|
+
handleTeamClick({ team, type: "standard" });
|
|
305
|
+
}, "data-testid": "header-team-switcher-menu-item",
|
|
306
|
+
// eslint-disable-next-line no-script-url
|
|
307
|
+
href: "javascript:void(0)" },
|
|
308
|
+
React.createElement("div", { className: headerDropdownMenuItemClassname },
|
|
309
|
+
React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
|
|
310
|
+
isTeamSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null))));
|
|
311
|
+
})
|
|
312
|
+
: null))));
|
|
313
|
+
}
|
|
314
|
+
return null;
|
|
315
|
+
}
|
|
316
|
+
|
|
317
|
+
export { HeaderTeamSwitcher as default };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { QueryClientProvider } from 'react-query';
|
|
3
|
-
import { Email, HelpDesk, Forum, ChatLaunch, Cognitive, Book } from '@carbon/react/icons';
|
|
3
|
+
import { Email, Document, HelpDesk, CatalogPublish, Policy, Forum, ChatLaunch, Cognitive, Book } from '@carbon/react/icons';
|
|
4
4
|
import Header from '../Header/Header.js';
|
|
5
5
|
import HeaderMenuItem from '../Header/HeaderMenuItem.js';
|
|
6
6
|
import PrivacyRedirect from '../PrivacyRedirect/PrivacyRedirect.js';
|
|
@@ -18,10 +18,11 @@ IBM Confidential
|
|
|
18
18
|
694970X, 69497O0
|
|
19
19
|
© Copyright IBM Corp. 2022, 2024
|
|
20
20
|
*/
|
|
21
|
-
function UIShell({ baseEnvUrl, carbonTheme = "g10", config, leftPanel, platformName, productName, profileMenuItems = [], supportMenuItems = [], renderPrivacyRedirect = true, renderPrivacyStatement = true, rightPanel, handleShowTutorial, skipToContentProps, templateMeteringEvent, triggerEvent, tutorialScreenToShow, user, userTeams, enableIcaMacs, }) {
|
|
21
|
+
function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme = "g10", config, createJoinTeamTrigger, history, isLaunchpad = false, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, leftPanel, platformName, productName, profileMenuItems = [], supportMenuItems = [], renderPrivacyRedirect = true, renderPrivacyStatement = true, rightPanel, handleShowTutorial, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, enableIcaMacs, }) {
|
|
22
22
|
// Support base header .e.g for an error state
|
|
23
23
|
if (!config) {
|
|
24
|
-
return (React.createElement(
|
|
24
|
+
return (React.createElement(QueryClientProvider, { client: queryClient },
|
|
25
|
+
React.createElement(Header, { baseEnvUrl: baseEnvUrl ?? "", baseServicesUrl: "", carbonTheme: carbonTheme, enableAppSwitcher: false, enableNotifications: false, enableNotificationsCount: false, productName: productName || platformName || "", user: user })));
|
|
25
26
|
}
|
|
26
27
|
const { features, navigation, platform, platformMessage } = config;
|
|
27
28
|
const names = getProductAndPlatformNames({ productName, platformName, platform });
|
|
@@ -61,15 +62,19 @@ function UIShell({ baseEnvUrl, carbonTheme = "g10", config, leftPanel, platformN
|
|
|
61
62
|
*/
|
|
62
63
|
const isPrivacyStatementDisabled = renderPrivacyStatement === false || features?.["consent.enabled"] === false;
|
|
63
64
|
return (React.createElement(QueryClientProvider, { client: queryClient },
|
|
64
|
-
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: [
|
|
65
|
+
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: [
|
|
65
66
|
isUserEnabled && (React.createElement(ProfileSettingsMenuItem, { key: "profile-settings", baseServicesUrl: platform.baseServicesUrl, src: `${platform.baseServicesUrl}/users/image/${user?.email}`, userName: user?.displayName ?? user?.name })),
|
|
66
67
|
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" })),
|
|
67
68
|
!isPrivacyStatementDisabled && (React.createElement(PrivacyStatementMenuItem, { key: "privacy-statement", baseServicesUrl: platform.baseServicesUrl, platformEmail: platform?.platformEmail })),
|
|
68
69
|
...profileMenuItems,
|
|
69
70
|
isSignOutEnabled && React.createElement(SignOutMenuItem, { key: "Sign Out", signOutLink: platform.signOutUrl }),
|
|
70
71
|
].filter(Boolean), supportMenuItems: [
|
|
72
|
+
!isPartnerUser && (React.createElement(HeaderMenuItem, { key: "docs", href: platform?.docs?.url, icon: React.createElement(Document, null), "data-testid": "docs", kind: "app", text: "Docs", type: "link" })),
|
|
71
73
|
isSupportEnabled &&
|
|
72
74
|
(supportFlagCheck || isPartnerUser ? (React.createElement(SupportCenterMenuItem, { key: "support-center", platformName: platform?.platformName, platformOrganization: platform?.platformOrganization, supportLink: supportLink, partnerEmailId: partnerEmailId, enablePartner: isPartnerUser, baseServicesUrl: platform.baseServicesUrl })) : (React.createElement(HeaderMenuItem, { key: "support-center", href: platform?.supportUrl, icon: React.createElement(HelpDesk, null), kind: "external", text: "Support Center", type: "link" }))),
|
|
75
|
+
React.createElement(HeaderMenuItem, { key: "release-notes", href: platform?.releaseNotesUrl, icon: React.createElement(CatalogPublish, null), "data-testid": "release-notes", kind: "app", text: "Release Notes", type: "link" }),
|
|
76
|
+
React.createElement(HeaderMenuItem, { key: "legal-terms", href: platform?.legalTermsUrl, icon: React.createElement(Policy, null), "data-testid": "legal-terms", kind: "app", text: "Legal Terms", type: "link" }),
|
|
77
|
+
React.createElement("span", { style: { borderBottom: "1px solid #b8c1c1" } }),
|
|
73
78
|
isCommunityEnabled && (React.createElement(HeaderMenuItem, { key: "community", href: platform?.communityUrl, icon: React.createElement(Forum, null), kind: "external", text: "Community", type: "link" })),
|
|
74
79
|
isFeedbackEnabled && (React.createElement(FeedbackMenuItem, { key: "feedback", platformName: platform?.platformName, platformOrganization: platform?.platformOrganization, sendIdeasUrl: sendIdeasUrl })),
|
|
75
80
|
!isPartnerUser && askICAEnabled ? (React.createElement(HeaderMenuItem, { key: "chat-launch", href: platform?.askICAUrl, icon: React.createElement(ChatLaunch, null), "data-testid": "askICA-chatlaunch", kind: "external", text: "AskICA", type: "link" })) : null,
|
|
@@ -77,7 +82,7 @@ function UIShell({ baseEnvUrl, carbonTheme = "g10", config, leftPanel, platformN
|
|
|
77
82
|
isAboutPlatformEnabled && (React.createElement(AboutPlatformMenuItem, { key: "about-platform", name: platform.name, baseServicesUrl: platform.baseServicesUrl })),
|
|
78
83
|
tutorialScreenToShow && handleShowTutorial && (React.createElement(HeaderMenuItem, { key: "launch-tutorial", onClick: handleShowTutorial, icon: React.createElement(Book, null), "data-testid": "launch-tutorial", text: "Launch Tutorial", type: "button" })),
|
|
79
84
|
...supportMenuItems,
|
|
80
|
-
].filter(Boolean), userTeams: userTeams }),
|
|
85
|
+
].filter(Boolean), history: history, isLaunchpad: isLaunchpad, isLoadingTeamSwitcher: isLoadingTeamSwitcher, isSuccessTeamSwitcher: isSuccessTeamSwitcher, setIsSuccessTeamSwitcher: setIsSuccessTeamSwitcher, trackEvent: trackEvent, user: user, userTeams: userTeams }),
|
|
81
86
|
isPrivacyModalRendered ? (React.createElement(PrivacyRedirect, { isOpen: true, baseEnvUrl: platform.baseEnvUrl, platformName: platform?.name, user: user })) : null));
|
|
82
87
|
}
|
|
83
88
|
/**
|
package/dist/types/index.d.ts
CHANGED
|
@@ -181,6 +181,7 @@ type User = {
|
|
|
181
181
|
firstLoginDate: string;
|
|
182
182
|
globalServices?: [any];
|
|
183
183
|
hasConsented: boolean;
|
|
184
|
+
defaultTeamHasAssistantsAccess: boolean;
|
|
184
185
|
id: string;
|
|
185
186
|
isFirstVisit: boolean | null;
|
|
186
187
|
isShowHelp: boolean | null;
|
|
@@ -223,6 +224,7 @@ type User = {
|
|
|
223
224
|
hasOpenPersonalTeamRequest?: boolean;
|
|
224
225
|
personalTeamAssistantsAccess?: boolean;
|
|
225
226
|
personalTeamAssistantsAccessRequested?: boolean;
|
|
227
|
+
teamInstanceSwitcherDefault?: string | null;
|
|
226
228
|
};
|
|
227
229
|
type UserTeams = {
|
|
228
230
|
accountTeams: {
|
|
@@ -259,25 +261,32 @@ type NavLink = {
|
|
|
259
261
|
};
|
|
260
262
|
|
|
261
263
|
type Props$I = {
|
|
262
|
-
accounts?: Array<SideNavAccount
|
|
264
|
+
accounts?: Array<SideNavAccount> | null;
|
|
263
265
|
app?: string;
|
|
264
266
|
appLink: any;
|
|
267
|
+
agentStudioPath?: string;
|
|
268
|
+
agenticAppsPath?: string;
|
|
265
269
|
regionalTeam?: any;
|
|
266
|
-
assistantLink?: string;
|
|
267
270
|
baseEnvUrl?: string;
|
|
268
271
|
className?: string;
|
|
269
272
|
defaultAssistantLink?: string;
|
|
270
273
|
enableChatButton?: boolean;
|
|
271
274
|
showChatButton?: boolean;
|
|
272
275
|
showSelectTeamPurpose?: boolean;
|
|
273
|
-
homeLink?: string;
|
|
274
276
|
joinCreateTrigger?: (props: any) => void;
|
|
275
277
|
isLoading?: boolean;
|
|
276
278
|
isOpen?: boolean;
|
|
277
279
|
navLinks?: NavLink[];
|
|
278
|
-
|
|
280
|
+
personalTeamEnabled?: boolean;
|
|
281
|
+
personalTeams?: Array<SideNavTeam> | null;
|
|
279
282
|
showChatTooltip?: boolean;
|
|
280
|
-
|
|
283
|
+
sideNavUrls?: {
|
|
284
|
+
key: string;
|
|
285
|
+
name: string;
|
|
286
|
+
url: string;
|
|
287
|
+
icon: string;
|
|
288
|
+
}[];
|
|
289
|
+
teams?: Array<SideNavTeam> | null;
|
|
281
290
|
templateMeteringEvent?: (props: any) => void;
|
|
282
291
|
tooltipMessage?: string;
|
|
283
292
|
triggerEvent?: (props: any) => void;
|
|
@@ -346,14 +355,21 @@ type Props$H = React.ComponentPropsWithoutRef<"img"> & {
|
|
|
346
355
|
declare function Avatar({ alt, className, size, src, style, title, userName, plainTooltip, ...rest }: Props$H): React.JSX.Element;
|
|
347
356
|
|
|
348
357
|
type Props$G = {
|
|
358
|
+
analyticsHelpers?: any;
|
|
349
359
|
baseServicesUrl?: string;
|
|
350
360
|
baseEnvUrl?: string;
|
|
351
361
|
carbonTheme?: "white" | "g10" | "g90" | "g100";
|
|
352
362
|
className?: string;
|
|
363
|
+
createJoinTeamTrigger?: Function;
|
|
353
364
|
enableAppSwitcher?: boolean;
|
|
354
365
|
instanceSwitcherEnabled?: boolean;
|
|
355
366
|
enableNotifications?: boolean;
|
|
356
367
|
enableNotificationsCount?: boolean;
|
|
368
|
+
history?: any;
|
|
369
|
+
isLaunchpad?: boolean;
|
|
370
|
+
isLoadingTeamSwitcher?: boolean;
|
|
371
|
+
isSuccessTeamSwitcher?: boolean;
|
|
372
|
+
setIsSuccessTeamSwitcher?: Function;
|
|
357
373
|
leftPanel?: (args: {
|
|
358
374
|
close: () => void;
|
|
359
375
|
isOpen: boolean;
|
|
@@ -381,7 +397,9 @@ type Props$G = {
|
|
|
381
397
|
supportMenuItems?: React.ReactNode[];
|
|
382
398
|
instanceSwitcherMenuItems?: React.ReactNode[];
|
|
383
399
|
templateMeteringEvent?: (props: any) => void;
|
|
400
|
+
trackEvent?: Function;
|
|
384
401
|
triggerEvent?: (props: any) => any;
|
|
402
|
+
user?: User;
|
|
385
403
|
userTeams?: {
|
|
386
404
|
data: any;
|
|
387
405
|
isLoading: boolean;
|
|
@@ -1354,7 +1372,9 @@ type Props$1 = {
|
|
|
1354
1372
|
declare function ToggleComponent({ helperText, id, invalid, invalidText, reversed, label, labelText, labelA, labelB, orientation, tooltipClassName, tooltipContent, tooltipProps, ...toggleProps }: Props$1): React.JSX.Element;
|
|
1355
1373
|
|
|
1356
1374
|
type Props = {
|
|
1375
|
+
analyticsHelpers?: any;
|
|
1357
1376
|
carbonTheme?: "white" | "g10" | "g90" | "g100";
|
|
1377
|
+
createJoinTeamTrigger?: Function;
|
|
1358
1378
|
baseEnvUrl?: string;
|
|
1359
1379
|
config?: {
|
|
1360
1380
|
features?: {
|
|
@@ -1376,6 +1396,8 @@ type Props = {
|
|
|
1376
1396
|
baseEnvUrl: string;
|
|
1377
1397
|
baseServicesUrl: string;
|
|
1378
1398
|
communityUrl?: string;
|
|
1399
|
+
releaseNotesUrl?: string;
|
|
1400
|
+
legalTermsUrl?: string;
|
|
1379
1401
|
feedbackUrl?: string;
|
|
1380
1402
|
name?: string;
|
|
1381
1403
|
platformEmail?: string;
|
|
@@ -1383,6 +1405,9 @@ type Props = {
|
|
|
1383
1405
|
platformVersion: string;
|
|
1384
1406
|
platformVersionError: boolean;
|
|
1385
1407
|
platformOrganization?: string;
|
|
1408
|
+
docs?: {
|
|
1409
|
+
url: string;
|
|
1410
|
+
};
|
|
1386
1411
|
privateTeams?: boolean;
|
|
1387
1412
|
sendIdeasUrl?: string;
|
|
1388
1413
|
sendMail?: boolean;
|
|
@@ -1399,6 +1424,11 @@ type Props = {
|
|
|
1399
1424
|
};
|
|
1400
1425
|
platformMessage?: any;
|
|
1401
1426
|
};
|
|
1427
|
+
history?: any;
|
|
1428
|
+
isLaunchpad?: boolean;
|
|
1429
|
+
isLoadingTeamSwitcher?: boolean;
|
|
1430
|
+
isSuccessTeamSwitcher?: boolean;
|
|
1431
|
+
setIsSuccessTeamSwitcher?: Function;
|
|
1402
1432
|
leftPanel?: (args: {
|
|
1403
1433
|
close: () => void;
|
|
1404
1434
|
isOpen: boolean;
|
|
@@ -1420,6 +1450,7 @@ type Props = {
|
|
|
1420
1450
|
};
|
|
1421
1451
|
supportMenuItems?: React.ReactNode[];
|
|
1422
1452
|
templateMeteringEvent?: (props: any) => void;
|
|
1453
|
+
trackEvent?: Function;
|
|
1423
1454
|
triggerEvent?: (props: any) => any;
|
|
1424
1455
|
user?: User;
|
|
1425
1456
|
userTeams?: {
|
|
@@ -1431,6 +1462,6 @@ type Props = {
|
|
|
1431
1462
|
handleShowTutorial?: Function;
|
|
1432
1463
|
tutorialScreenToShow?: string;
|
|
1433
1464
|
};
|
|
1434
|
-
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;
|
|
1465
|
+
declare function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme, config, createJoinTeamTrigger, history, isLaunchpad, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, leftPanel, platformName, productName, profileMenuItems, supportMenuItems, renderPrivacyRedirect, renderPrivacyStatement, rightPanel, handleShowTutorial, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, enableIcaMacs, }: Props): React.JSX.Element;
|
|
1435
1466
|
|
|
1436
1467
|
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
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@boomerang-io/carbon-addons-boomerang-react",
|
|
3
3
|
"description": "Carbon Addons for Boomerang apps",
|
|
4
|
-
"version": "4.6.11-beta.
|
|
4
|
+
"version": "4.6.11-beta.31",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "Tim Bula",
|
|
7
7
|
"email": "timrbula@gmail.com"
|
|
8
8
|
},
|
|
9
9
|
"license": "Apache-2",
|
|
10
|
-
"repository": {
|
|
10
|
+
"repository": {
|
|
11
11
|
"type": "git",
|
|
12
12
|
"url": "git@github.com:boomerang-io/carbon-addons-boomerang-react"
|
|
13
13
|
},
|