@boomerang-io/carbon-addons-boomerang-react 4.6.21-beta.23 → 4.6.21-beta.24
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/Header/Header.js +3 -2
- package/dist/cjs/components/Header/HeaderTeamSwitcher.js +63 -44
- package/dist/cjs/components/ProfileSettings/ProfileSettings.js +22 -4
- package/dist/cjs/components/UIShell/UIShell.js +4 -4
- package/dist/cjs/constants/TeamTypes.js +15 -0
- package/dist/esm/components/Header/Header.js +3 -2
- package/dist/esm/components/Header/HeaderTeamSwitcher.js +63 -44
- package/dist/esm/components/ProfileSettings/ProfileSettings.js +22 -4
- package/dist/esm/components/UIShell/UIShell.js +4 -4
- package/dist/esm/constants/TeamTypes.js +13 -0
- package/dist/types/index.d.ts +4 -1
- package/package.json +1 -1
- package/scss/components/ProfileSettings/_profileSettings.scss +1 -0
|
@@ -62,7 +62,7 @@ const MenuAriaLabelRecord = {
|
|
|
62
62
|
const headerButtonClassNames = "cds--btn--icon-only cds--header__action cds--btn cds--btn--primary cds--btn--icon-only cds--btn cds--btn--primary";
|
|
63
63
|
const instanceCheckMarkContainerClass = "instance-checkmark-style-container";
|
|
64
64
|
function Header(props) {
|
|
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;
|
|
65
|
+
const { analyticsHelpers, productName, baseEnvUrl, baseServicesUrl, carbonTheme = "g10", className, createJoinTeamTrigger, enableTeamSwitcher = true, 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
67
|
const userTeamsUrl = servicesConfig.serviceUrl.getUserTeamsServices({ baseServicesUrl });
|
|
68
68
|
const teamsQuery = reactQuery.useQuery({
|
|
@@ -70,6 +70,7 @@ function Header(props) {
|
|
|
70
70
|
queryFn: servicesConfig.resolver.query(userTeamsUrl, null),
|
|
71
71
|
enabled: !hasUserTeams && Boolean(baseServicesUrl),
|
|
72
72
|
});
|
|
73
|
+
const showTeamSwitcher = enableTeamSwitcher && Boolean(user);
|
|
73
74
|
return (React__default.default.createElement(React__default.default.Fragment, null,
|
|
74
75
|
React__default.default.createElement(react.Theme, { theme: carbonTheme },
|
|
75
76
|
React__default.default.createElement(react.Header, { "aria-label": "App navigation header", className: className },
|
|
@@ -80,7 +81,7 @@ function Header(props) {
|
|
|
80
81
|
? navLinks.map((link) => (React__default.default.createElement(react.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)))
|
|
81
82
|
: null),
|
|
82
83
|
React__default.default.createElement(react.HeaderGlobalBar, null,
|
|
83
|
-
React__default.default.createElement(HeaderTeamSwitcher.default, { analyticsHelpers: analyticsHelpers, baseServicesUrl: baseServicesUrl, createJoinTeamTrigger: createJoinTeamTrigger, history: history, isLaunchpad: isLaunchpad, isLoadingTeamSwitcher: isLoadingTeamSwitcher, isSuccessTeamSwitcher: isSuccessTeamSwitcher, setIsSuccessTeamSwitcher: setIsSuccessTeamSwitcher, menuAriaLabelRecord: MenuAriaLabelRecord.TeamSwitcher, menuButtonId: MenuButtonId.TeamSwitcher, menuListId: MenuListId.TeamSwitcher, navigationPlatform: platform, refetchUser: refetchUser, refetchNavigation: refetchNavigation, teamsQuery: teamsQuery, trackEvent: trackEvent, user: user, userTeams: userTeams }),
|
|
84
|
+
showTeamSwitcher ? (React__default.default.createElement(HeaderTeamSwitcher.default, { analyticsHelpers: analyticsHelpers, baseServicesUrl: baseServicesUrl, createJoinTeamTrigger: createJoinTeamTrigger, history: history, isLaunchpad: isLaunchpad, isLoadingTeamSwitcher: isLoadingTeamSwitcher, isSuccessTeamSwitcher: isSuccessTeamSwitcher, setIsSuccessTeamSwitcher: setIsSuccessTeamSwitcher, menuAriaLabelRecord: MenuAriaLabelRecord.TeamSwitcher, menuButtonId: MenuButtonId.TeamSwitcher, menuListId: MenuListId.TeamSwitcher, navigationPlatform: platform, refetchUser: refetchUser, refetchNavigation: refetchNavigation, teamsQuery: teamsQuery, trackEvent: trackEvent, user: user, userTeams: userTeams })) : null,
|
|
84
85
|
props?.instanceSwitcherEnabled && (React__default.default.createElement(InstanceSwitcherMenu, { enabled: Boolean(props.instanceSwitcherEnabled), menuItems: platform?.instances })),
|
|
85
86
|
React__default.default.createElement(RequestsMenu, { baseEnvUrl: baseEnvUrl, enabled: Boolean(props.requestSummary), summary: props.requestSummary }),
|
|
86
87
|
React__default.default.createElement(NotificationsMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: Boolean(props.enableNotifications), countEnabled: Boolean(props.enableNotificationsCount) }),
|
|
@@ -11,6 +11,7 @@ var HeaderMenu = require('./HeaderMenu.js');
|
|
|
11
11
|
var servicesConfig = require('../../config/servicesConfig.js');
|
|
12
12
|
var settings = require('../../internal/settings.js');
|
|
13
13
|
var UserType = require('../../constants/UserType.js');
|
|
14
|
+
var TeamTypes = require('../../constants/TeamTypes.js');
|
|
14
15
|
|
|
15
16
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
17
|
|
|
@@ -147,6 +148,9 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
147
148
|
teamsQuery?.data?.personalTeam?.length === 0))) {
|
|
148
149
|
handleNoTeamsToSelect();
|
|
149
150
|
}
|
|
151
|
+
else if (userTeamInstanceSwitcherDefault === null) {
|
|
152
|
+
setSelectedTeam(null);
|
|
153
|
+
}
|
|
150
154
|
}, [
|
|
151
155
|
baseServicesUrl,
|
|
152
156
|
hasUserTeams,
|
|
@@ -223,33 +227,58 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
223
227
|
standardTeams = teamsQuery?.data?.standardTeams ?? [];
|
|
224
228
|
personalTeam = teamsQuery?.data?.personalTeam ?? [];
|
|
225
229
|
}
|
|
226
|
-
let
|
|
227
|
-
|
|
230
|
+
let newPersonalTeam = personalTeam.length > 0
|
|
231
|
+
? personalTeam.map((personalTeam) => ({
|
|
232
|
+
...personalTeam,
|
|
233
|
+
type: TeamTypes.TEAM_TYPES.PERSONAL,
|
|
234
|
+
nameToDisplay: personalTeam.displayName ? personalTeam.displayName : personalTeam.name,
|
|
235
|
+
}))
|
|
236
|
+
: [];
|
|
237
|
+
let newAccountTeams = [];
|
|
238
|
+
let newStandardTeams = [];
|
|
228
239
|
if (accountTeams?.length > 0) {
|
|
229
|
-
|
|
240
|
+
newAccountTeams = accountTeams.map((team) => {
|
|
230
241
|
let newProjectTeams = [];
|
|
231
242
|
if (team.projectTeams && team.projectTeams.length > 0) {
|
|
232
|
-
newProjectTeams = team.projectTeams?.map((
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
243
|
+
newProjectTeams = team.projectTeams?.map((projectTeam) => {
|
|
244
|
+
return {
|
|
245
|
+
...projectTeam,
|
|
246
|
+
nameToDisplay: projectTeam.displayName ? projectTeam.displayName : projectTeam.name,
|
|
247
|
+
};
|
|
248
|
+
});
|
|
236
249
|
}
|
|
237
250
|
return {
|
|
238
251
|
...team,
|
|
239
252
|
nameToDisplay: team.displayName ? team.displayName : team.name,
|
|
253
|
+
type: TeamTypes.TEAM_TYPES.ACCOUNT,
|
|
240
254
|
projectTeams: sortBy__default.default(newProjectTeams, ["nameToDisplay"]),
|
|
241
255
|
};
|
|
242
256
|
});
|
|
243
|
-
sortedAccountTeamsWithNamesToDisplay = sortBy__default.default(newAccountTeams, ["nameToDisplay"]);
|
|
244
257
|
}
|
|
245
258
|
if (standardTeams?.length > 0) {
|
|
246
|
-
|
|
259
|
+
newStandardTeams = standardTeams.map((team) => {
|
|
247
260
|
return {
|
|
248
261
|
...team,
|
|
262
|
+
type: TeamTypes.TEAM_TYPES.STANDARD,
|
|
249
263
|
nameToDisplay: team.displayName ? team.displayName : team.name,
|
|
250
264
|
};
|
|
251
265
|
});
|
|
252
|
-
|
|
266
|
+
}
|
|
267
|
+
let allTeams = newPersonalTeam.concat(newAccountTeams, newStandardTeams);
|
|
268
|
+
const order = { [TeamTypes.TEAM_TYPES.PERSONAL]: 1, [TeamTypes.TEAM_TYPES.ACCOUNT]: 2, [TeamTypes.TEAM_TYPES.STANDARD]: 3 };
|
|
269
|
+
allTeams = sortBy__default.default(allTeams, [(team) => order[team.type], "nameToDisplay"]);
|
|
270
|
+
if (selectedTeam) {
|
|
271
|
+
const selectedTeamIndex = allTeams.findIndex((team, index) => {
|
|
272
|
+
if (team.id === selectedTeam.id) {
|
|
273
|
+
return true;
|
|
274
|
+
}
|
|
275
|
+
else if (Array.isArray(team.projectTeams) && team.projectTeams?.length > 0) {
|
|
276
|
+
return team.projectTeams.some((projectTeam) => projectTeam.id === selectedTeam.id);
|
|
277
|
+
}
|
|
278
|
+
return false;
|
|
279
|
+
});
|
|
280
|
+
const [removedTeam] = allTeams.splice(selectedTeamIndex, 1);
|
|
281
|
+
allTeams.unshift(removedTeam);
|
|
253
282
|
}
|
|
254
283
|
let selectedTeamName = selectedTeam?.displayName
|
|
255
284
|
? selectedTeam.displayName
|
|
@@ -271,29 +300,22 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
271
300
|
React__default.default.createElement("div", { className: headerTeamSwitcherCreateTeamButtonClassname },
|
|
272
301
|
React__default.default.createElement("span", { className: headerTeamSwitcherCreateTeamButtonTextClassname }, createTeamButtonText),
|
|
273
302
|
React__default.default.createElement(icons.AddAlt, { className: headerTeamSwitcherCreateTeamButtonIconClassname })))),
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
const isTeamSelected = team.id === selectedTeam?.id;
|
|
278
|
-
return (React__default.default.createElement("div", { key: team.id, id: `${team.id}-personal-menu-item-id` },
|
|
279
|
-
React__default.default.createElement(react.HeaderMenuItem, { key: team.id, id: `${team.id}-personal-menu-item`, "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
280
|
-
handleTeamClick({ team, type: "personal" });
|
|
281
|
-
},
|
|
282
|
-
// eslint-disable-next-line no-script-url
|
|
283
|
-
href: "javascript:void(0)", "data-testid": "header-team-switcher-menu-item" },
|
|
284
|
-
React__default.default.createElement("div", { className: headerDropdownMenuItemClassname },
|
|
285
|
-
React__default.default.createElement("span", { title: teamName, className: headerDropdownMenuItemTextClassname }, teamName),
|
|
286
|
-
isTeamSelected ? React__default.default.createElement(icons.CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null))));
|
|
287
|
-
})
|
|
288
|
-
: null,
|
|
289
|
-
accountTeams.length > 0
|
|
290
|
-
? sortedAccountTeamsWithNamesToDisplay.map((team) => {
|
|
303
|
+
allTeams.map((team) => {
|
|
304
|
+
const isTeamSelected = team.id === selectedTeam?.id;
|
|
305
|
+
if (team.type === TeamTypes.TEAM_TYPES.ACCOUNT) {
|
|
291
306
|
const isSubmenuOpen = team.id === openAccountSubmenuId;
|
|
292
|
-
const
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
307
|
+
const projectTeams = team.projectTeams;
|
|
308
|
+
const existProjectTeams = Array.isArray(projectTeams) && projectTeams.length > 0;
|
|
309
|
+
let selectedProjectTeamIndex = -1;
|
|
310
|
+
if (existProjectTeams) {
|
|
311
|
+
selectedProjectTeamIndex = projectTeams.findIndex((team) => team.id === selectedTeam?.id);
|
|
312
|
+
}
|
|
313
|
+
const isProjectTeamSelected = selectedProjectTeamIndex >= 0;
|
|
296
314
|
const isMenuSelected = isTeamSelected || isProjectTeamSelected;
|
|
315
|
+
if (existProjectTeams && isProjectTeamSelected) {
|
|
316
|
+
const [removedTeam] = projectTeams.splice(selectedProjectTeamIndex, 1);
|
|
317
|
+
projectTeams.unshift(removedTeam);
|
|
318
|
+
}
|
|
297
319
|
return (React__default.default.createElement("div", { key: team.id, id: `${team.id}-account-menu` },
|
|
298
320
|
React__default.default.createElement(react.HeaderMenuItem, { "aria-expanded": isSubmenuOpen, "aria-selected": isMenuSelected, className: headerDropdownMenuItemAccountContainerClassname, onClick: (e) => handleOpenAccountSubmenu({ e, id: team.id }),
|
|
299
321
|
// eslint-disable-next-line no-script-url
|
|
@@ -301,7 +323,7 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
301
323
|
React__default.default.createElement("div", { className: headerDropdownMenuItemAccountClassname },
|
|
302
324
|
React__default.default.createElement("div", { className: headerDropdownMenuItemTextIconClassname },
|
|
303
325
|
React__default.default.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
|
|
304
|
-
isMenuSelected ?
|
|
326
|
+
isMenuSelected ? React__default.default.createElement(icons.CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null),
|
|
305
327
|
React__default.default.createElement("div", { className: headerDropdownMenuItemAccountIconsClassname },
|
|
306
328
|
React__default.default.createElement(icons.GroupAccount, { className: headerDropdownMenuItemAccountGroupIconClassname }),
|
|
307
329
|
React__default.default.createElement(icons.ChevronDown, { className: headerDropdownMenuItemAccountChevronIconClassname })))),
|
|
@@ -313,9 +335,9 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
313
335
|
href: "javascript:void(0)" },
|
|
314
336
|
React__default.default.createElement("div", { className: headerDropdownMenuItemClassname, style: { paddingLeft: "1rem" } },
|
|
315
337
|
React__default.default.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, "Account Page"),
|
|
316
|
-
isTeamSelected ?
|
|
317
|
-
|
|
318
|
-
?
|
|
338
|
+
isTeamSelected ? React__default.default.createElement(icons.CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null)),
|
|
339
|
+
projectTeams && projectTeams.length > 0
|
|
340
|
+
? projectTeams.map((team) => {
|
|
319
341
|
const isTeamSelected = team.id === selectedTeam?.id;
|
|
320
342
|
return (React__default.default.createElement("div", { key: team.id, id: `${team.id}-project-menu-item` },
|
|
321
343
|
React__default.default.createElement(react.HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
@@ -328,22 +350,19 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
328
350
|
isTeamSelected ? (React__default.default.createElement(icons.CheckmarkFilled, { className: headerDropdownMenuItemIconClassname })) : null))));
|
|
329
351
|
})
|
|
330
352
|
: null)));
|
|
331
|
-
}
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
? sortedStandardTeamsWithNamesToDisplay.map((team) => {
|
|
335
|
-
const isTeamSelected = team.id === selectedTeam?.id;
|
|
336
|
-
return (React__default.default.createElement("div", { key: team.id, id: `${team.id}-standard-menu-item` },
|
|
353
|
+
}
|
|
354
|
+
else {
|
|
355
|
+
return (React__default.default.createElement("div", { key: team.id, id: `${team.id}-${team.type}-menu-item` },
|
|
337
356
|
React__default.default.createElement(react.HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
338
|
-
handleTeamClick({ team, type: "
|
|
357
|
+
handleTeamClick({ team, type: team.type ?? "" });
|
|
339
358
|
}, "data-testid": "header-team-switcher-menu-item",
|
|
340
359
|
// eslint-disable-next-line no-script-url
|
|
341
360
|
href: "javascript:void(0)" },
|
|
342
361
|
React__default.default.createElement("div", { className: headerDropdownMenuItemClassname },
|
|
343
362
|
React__default.default.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
|
|
344
363
|
isTeamSelected ? React__default.default.createElement(icons.CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null))));
|
|
345
|
-
}
|
|
346
|
-
|
|
364
|
+
}
|
|
365
|
+
})))));
|
|
347
366
|
}
|
|
348
367
|
return null;
|
|
349
368
|
}
|
|
@@ -34,12 +34,13 @@ function determineIfConfigIsDifferent(teams, initialTeams) {
|
|
|
34
34
|
}
|
|
35
35
|
return isConfigDifferent;
|
|
36
36
|
}
|
|
37
|
-
function ProfileSettings({ baseServicesUrl, src, userName, isOpen, closeModal }) {
|
|
37
|
+
function ProfileSettings({ baseServicesUrl, refetchUser, refetchUserTeams, refetchNavigation, src, userName, isOpen, closeModal, }) {
|
|
38
38
|
const queryClient = reactQuery.useQueryClient();
|
|
39
39
|
const [initialTeams, setInitialTeams] = React.useState([]);
|
|
40
40
|
const [teams, setTeams] = React.useState([]);
|
|
41
41
|
const userUrl = servicesConfig.serviceUrl.getLaunchpadUser({ baseServicesUrl });
|
|
42
42
|
const profileUrl = servicesConfig.serviceUrl.resourceUserProfile({ baseServicesUrl });
|
|
43
|
+
const userTeamsUrl = servicesConfig.serviceUrl.getUserTeamsServices({ baseServicesUrl });
|
|
43
44
|
const { data: user, isLoading: userIsLoading, error: userError, } = reactQuery.useQuery({
|
|
44
45
|
queryKey: userUrl,
|
|
45
46
|
queryFn: servicesConfig.resolver.query(userUrl),
|
|
@@ -48,6 +49,22 @@ function ProfileSettings({ baseServicesUrl, src, userName, isOpen, closeModal })
|
|
|
48
49
|
onSuccess: () => {
|
|
49
50
|
queryClient.invalidateQueries(userUrl);
|
|
50
51
|
queryClient.invalidateQueries(profileUrl);
|
|
52
|
+
queryClient.invalidateQueries(userTeamsUrl);
|
|
53
|
+
if (refetchUser) {
|
|
54
|
+
setTimeout(() => {
|
|
55
|
+
refetchUser();
|
|
56
|
+
}, 1000);
|
|
57
|
+
}
|
|
58
|
+
if (refetchUserTeams) {
|
|
59
|
+
setTimeout(() => {
|
|
60
|
+
refetchUserTeams();
|
|
61
|
+
}, 1000);
|
|
62
|
+
}
|
|
63
|
+
if (refetchNavigation) {
|
|
64
|
+
setTimeout(() => {
|
|
65
|
+
refetchNavigation();
|
|
66
|
+
}, 1000);
|
|
67
|
+
}
|
|
51
68
|
},
|
|
52
69
|
});
|
|
53
70
|
// Only disable when we have a user and we know that there aren' any lower level groups to manage
|
|
@@ -63,6 +80,7 @@ function ProfileSettings({ baseServicesUrl, src, userName, isOpen, closeModal })
|
|
|
63
80
|
}
|
|
64
81
|
async function handleSubmit() {
|
|
65
82
|
const body = {
|
|
83
|
+
teamInstanceSwitcherDefault: null,
|
|
66
84
|
lowerLevelGroups: teams,
|
|
67
85
|
};
|
|
68
86
|
try {
|
|
@@ -104,9 +122,9 @@ function ProfileSettings({ baseServicesUrl, src, userName, isOpen, closeModal })
|
|
|
104
122
|
return (React__default.default.createElement(react.ComposedModal, { "aria-label": "Profile Settings", className: `${settings.prefix}--bmrg-profile-settings-container ${settings.prefix}--bmrg-header-modal`, open: isOpen, onClose: handleClose, preventCloseOnClickOutside: true },
|
|
105
123
|
React__default.default.createElement(react.ModalHeader, { closeModal: handleClose, title: `User profile - ${userName}` }),
|
|
106
124
|
React__default.default.createElement(react.ModalBody, { style: { maxHeight: "31.5rem" } },
|
|
107
|
-
React__default.default.createElement("p", { className: `${settings.prefix}--bmrg-profile-settings__title` }, "More user profile settings will be here eventually, but for now you can choose which Teams are shown in your
|
|
108
|
-
React__default.default.createElement("h2", { className: `${settings.prefix}--bmrg-profile-settings__subtitle` }, "Teams visible in Launchpad
|
|
109
|
-
React__default.default.createElement("p", { className: `${settings.prefix}--bmrg-profile-settings__description` }, "Choose Teams to show or hide in your Launchpad
|
|
125
|
+
React__default.default.createElement("p", { className: `${settings.prefix}--bmrg-profile-settings__title` }, "More user profile settings will be here eventually, but for now you can choose which Teams are shown in your team switcher in Launchpad."),
|
|
126
|
+
React__default.default.createElement("h2", { className: `${settings.prefix}--bmrg-profile-settings__subtitle` }, "Teams visible in Launchpad team switcher"),
|
|
127
|
+
React__default.default.createElement("p", { className: `${settings.prefix}--bmrg-profile-settings__description` }, "Choose Teams to show or hide in your Launchpad team switcher and Catalog (useful for sensitive demos). You will not be able to access or view unchecked Teams from the team switcher, and cannot add items to them from Catalog."),
|
|
110
128
|
userIsLoading ? (React__default.default.createElement(react.StructuredListSkeleton, null)) : userError ? (React__default.default.createElement(ErrorMessage.default, { style: { color: "#F2F4F8", padding: "1rem" } })) : teams?.length > 0 ? (React__default.default.createElement(react.StructuredListWrapper, { className: `${settings.prefix}--bmrg-profile-settings-list` },
|
|
111
129
|
React__default.default.createElement(react.StructuredListHead, null,
|
|
112
130
|
React__default.default.createElement(react.StructuredListRow, { head: true },
|
|
@@ -26,11 +26,11 @@ IBM Confidential
|
|
|
26
26
|
694970X, 69497O0
|
|
27
27
|
© Copyright IBM Corp. 2022, 2024
|
|
28
28
|
*/
|
|
29
|
-
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, refetchUser, refetchNavigation, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, userTeamsAssets, enableIcaMacs, }) {
|
|
29
|
+
function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme = "g10", config, createJoinTeamTrigger, enableTeamSwitcher = true, history, isLaunchpad = false, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, leftPanel, platformName, productName, profileMenuItems = [], supportMenuItems = [], renderPrivacyRedirect = true, renderPrivacyStatement = true, rightPanel, handleShowTutorial, refetchUser, refetchUserTeams, refetchNavigation, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, userTeamsAssets, enableIcaMacs, }) {
|
|
30
30
|
// Support base header .e.g for an error state
|
|
31
31
|
if (!config) {
|
|
32
32
|
return (React__default.default.createElement(reactQuery.QueryClientProvider, { client: servicesConfig.queryClient },
|
|
33
|
-
React__default.default.createElement(Header.default, { baseEnvUrl: baseEnvUrl ?? "", baseServicesUrl: "", carbonTheme: carbonTheme, enableAppSwitcher: false, enableNotifications: false, enableNotificationsCount: false, productName: productName || platformName || "", user: user })));
|
|
33
|
+
React__default.default.createElement(Header.default, { baseEnvUrl: baseEnvUrl ?? "", baseServicesUrl: "", carbonTheme: carbonTheme, enableAppSwitcher: false, enableNotifications: false, enableNotificationsCount: false, enableTeamSwitcher: enableTeamSwitcher, productName: productName || platformName || "", user: user })));
|
|
34
34
|
}
|
|
35
35
|
const { features, navigation, platform, platformMessage } = config;
|
|
36
36
|
const names = getProductAndPlatformNames({ productName, platformName, platform });
|
|
@@ -71,8 +71,8 @@ function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme = "g10", config, cr
|
|
|
71
71
|
*/
|
|
72
72
|
const isPrivacyStatementDisabled = renderPrivacyStatement === false || features?.["consent.enabled"] === false;
|
|
73
73
|
return (React__default.default.createElement(reactQuery.QueryClientProvider, { client: servicesConfig.queryClient },
|
|
74
|
-
React__default.default.createElement(Header.default, { 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: [
|
|
75
|
-
isUserEnabled && (React__default.default.createElement(ProfileSettings.ProfileSettingsMenuItem, { key: "profile-settings", baseServicesUrl: platform.baseServicesUrl, src: `${platform.baseServicesUrl}/users/image/${user?.email}`, userName: user?.displayName ?? user?.name })),
|
|
74
|
+
React__default.default.createElement(Header.default, { analyticsHelpers: analyticsHelpers, baseEnvUrl: platform.baseEnvUrl, baseServicesUrl: platform.baseServicesUrl, carbonTheme: carbonTheme, createJoinTeamTrigger: createJoinTeamTrigger, enableAppSwitcher: isAppSwitcherEnabled, instanceSwitcherEnabled: instanceSwitcherEnabled, enableNotifications: isNotificationsEnabled, enableNotificationsCount: isNotificationsCountEnabled, enableTeamSwitcher: enableTeamSwitcher, 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: [
|
|
75
|
+
isUserEnabled && (React__default.default.createElement(ProfileSettings.ProfileSettingsMenuItem, { key: "profile-settings", baseServicesUrl: platform.baseServicesUrl, src: `${platform.baseServicesUrl}/users/image/${user?.email}`, userName: user?.displayName ?? user?.name, refetchUser: refetchUser, refetchUserTeams: refetchUserTeams, refetchNavigation: refetchNavigation })),
|
|
76
76
|
isSendMailEnabled && (React__default.default.createElement(HeaderMenuItem.default, { key: "email-preferences", href: `${platform.baseEnvUrl}/launchpad/email-preferences`, icon: React__default.default.createElement(icons.Email, null), kind: "internal", text: "Email Preferences", type: "link" })),
|
|
77
77
|
!isPrivacyStatementDisabled && (React__default.default.createElement(PrivacyStatement.PrivacyStatementMenuItem, { key: "privacy-statement", baseServicesUrl: platform.baseServicesUrl, platformEmail: platform?.platformEmail })),
|
|
78
78
|
...profileMenuItems,
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
/*
|
|
4
|
+
IBM Confidential
|
|
5
|
+
694970X, 69497O0
|
|
6
|
+
© Copyright IBM Corp. 2022, 2024
|
|
7
|
+
*/
|
|
8
|
+
const TEAM_TYPES = {
|
|
9
|
+
ACCOUNT: "account",
|
|
10
|
+
PERSONAL: "personal",
|
|
11
|
+
PROJECT: "project",
|
|
12
|
+
STANDARD: "standard",
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
exports.TEAM_TYPES = TEAM_TYPES;
|
|
@@ -54,7 +54,7 @@ const MenuAriaLabelRecord = {
|
|
|
54
54
|
const headerButtonClassNames = "cds--btn--icon-only cds--header__action cds--btn cds--btn--primary cds--btn--icon-only cds--btn cds--btn--primary";
|
|
55
55
|
const instanceCheckMarkContainerClass = "instance-checkmark-style-container";
|
|
56
56
|
function Header(props) {
|
|
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;
|
|
57
|
+
const { analyticsHelpers, productName, baseEnvUrl, baseServicesUrl, carbonTheme = "g10", className, createJoinTeamTrigger, enableTeamSwitcher = true, 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
59
|
const userTeamsUrl = serviceUrl.getUserTeamsServices({ baseServicesUrl });
|
|
60
60
|
const teamsQuery = useQuery({
|
|
@@ -62,6 +62,7 @@ function Header(props) {
|
|
|
62
62
|
queryFn: resolver.query(userTeamsUrl, null),
|
|
63
63
|
enabled: !hasUserTeams && Boolean(baseServicesUrl),
|
|
64
64
|
});
|
|
65
|
+
const showTeamSwitcher = enableTeamSwitcher && Boolean(user);
|
|
65
66
|
return (React.createElement(React.Fragment, null,
|
|
66
67
|
React.createElement(Theme, { theme: carbonTheme },
|
|
67
68
|
React.createElement(Header$1, { "aria-label": "App navigation header", className: className },
|
|
@@ -72,7 +73,7 @@ function Header(props) {
|
|
|
72
73
|
? 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)))
|
|
73
74
|
: null),
|
|
74
75
|
React.createElement(HeaderGlobalBar, null,
|
|
75
|
-
React.createElement(HeaderTeamSwitcher, { analyticsHelpers: analyticsHelpers, baseServicesUrl: baseServicesUrl, createJoinTeamTrigger: createJoinTeamTrigger, history: history, isLaunchpad: isLaunchpad, isLoadingTeamSwitcher: isLoadingTeamSwitcher, isSuccessTeamSwitcher: isSuccessTeamSwitcher, setIsSuccessTeamSwitcher: setIsSuccessTeamSwitcher, menuAriaLabelRecord: MenuAriaLabelRecord.TeamSwitcher, menuButtonId: MenuButtonId.TeamSwitcher, menuListId: MenuListId.TeamSwitcher, navigationPlatform: platform, refetchUser: refetchUser, refetchNavigation: refetchNavigation, teamsQuery: teamsQuery, trackEvent: trackEvent, user: user, userTeams: userTeams }),
|
|
76
|
+
showTeamSwitcher ? (React.createElement(HeaderTeamSwitcher, { analyticsHelpers: analyticsHelpers, baseServicesUrl: baseServicesUrl, createJoinTeamTrigger: createJoinTeamTrigger, history: history, isLaunchpad: isLaunchpad, isLoadingTeamSwitcher: isLoadingTeamSwitcher, isSuccessTeamSwitcher: isSuccessTeamSwitcher, setIsSuccessTeamSwitcher: setIsSuccessTeamSwitcher, menuAriaLabelRecord: MenuAriaLabelRecord.TeamSwitcher, menuButtonId: MenuButtonId.TeamSwitcher, menuListId: MenuListId.TeamSwitcher, navigationPlatform: platform, refetchUser: refetchUser, refetchNavigation: refetchNavigation, teamsQuery: teamsQuery, trackEvent: trackEvent, user: user, userTeams: userTeams })) : null,
|
|
76
77
|
props?.instanceSwitcherEnabled && (React.createElement(InstanceSwitcherMenu, { enabled: Boolean(props.instanceSwitcherEnabled), menuItems: platform?.instances })),
|
|
77
78
|
React.createElement(RequestsMenu, { baseEnvUrl: baseEnvUrl, enabled: Boolean(props.requestSummary), summary: props.requestSummary }),
|
|
78
79
|
React.createElement(NotificationsMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: Boolean(props.enableNotifications), countEnabled: Boolean(props.enableNotificationsCount) }),
|
|
@@ -7,6 +7,7 @@ import HeaderMenu$1 from './HeaderMenu.js';
|
|
|
7
7
|
import { resolver } from '../../config/servicesConfig.js';
|
|
8
8
|
import { prefix } from '../../internal/settings.js';
|
|
9
9
|
import { USER_PLATFORM_ROLE } from '../../constants/UserType.js';
|
|
10
|
+
import { TEAM_TYPES } from '../../constants/TeamTypes.js';
|
|
10
11
|
|
|
11
12
|
/*
|
|
12
13
|
IBM Confidential
|
|
@@ -138,6 +139,9 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
138
139
|
teamsQuery?.data?.personalTeam?.length === 0))) {
|
|
139
140
|
handleNoTeamsToSelect();
|
|
140
141
|
}
|
|
142
|
+
else if (userTeamInstanceSwitcherDefault === null) {
|
|
143
|
+
setSelectedTeam(null);
|
|
144
|
+
}
|
|
141
145
|
}, [
|
|
142
146
|
baseServicesUrl,
|
|
143
147
|
hasUserTeams,
|
|
@@ -214,33 +218,58 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
214
218
|
standardTeams = teamsQuery?.data?.standardTeams ?? [];
|
|
215
219
|
personalTeam = teamsQuery?.data?.personalTeam ?? [];
|
|
216
220
|
}
|
|
217
|
-
let
|
|
218
|
-
|
|
221
|
+
let newPersonalTeam = personalTeam.length > 0
|
|
222
|
+
? personalTeam.map((personalTeam) => ({
|
|
223
|
+
...personalTeam,
|
|
224
|
+
type: TEAM_TYPES.PERSONAL,
|
|
225
|
+
nameToDisplay: personalTeam.displayName ? personalTeam.displayName : personalTeam.name,
|
|
226
|
+
}))
|
|
227
|
+
: [];
|
|
228
|
+
let newAccountTeams = [];
|
|
229
|
+
let newStandardTeams = [];
|
|
219
230
|
if (accountTeams?.length > 0) {
|
|
220
|
-
|
|
231
|
+
newAccountTeams = accountTeams.map((team) => {
|
|
221
232
|
let newProjectTeams = [];
|
|
222
233
|
if (team.projectTeams && team.projectTeams.length > 0) {
|
|
223
|
-
newProjectTeams = team.projectTeams?.map((
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
234
|
+
newProjectTeams = team.projectTeams?.map((projectTeam) => {
|
|
235
|
+
return {
|
|
236
|
+
...projectTeam,
|
|
237
|
+
nameToDisplay: projectTeam.displayName ? projectTeam.displayName : projectTeam.name,
|
|
238
|
+
};
|
|
239
|
+
});
|
|
227
240
|
}
|
|
228
241
|
return {
|
|
229
242
|
...team,
|
|
230
243
|
nameToDisplay: team.displayName ? team.displayName : team.name,
|
|
244
|
+
type: TEAM_TYPES.ACCOUNT,
|
|
231
245
|
projectTeams: sortBy(newProjectTeams, ["nameToDisplay"]),
|
|
232
246
|
};
|
|
233
247
|
});
|
|
234
|
-
sortedAccountTeamsWithNamesToDisplay = sortBy(newAccountTeams, ["nameToDisplay"]);
|
|
235
248
|
}
|
|
236
249
|
if (standardTeams?.length > 0) {
|
|
237
|
-
|
|
250
|
+
newStandardTeams = standardTeams.map((team) => {
|
|
238
251
|
return {
|
|
239
252
|
...team,
|
|
253
|
+
type: TEAM_TYPES.STANDARD,
|
|
240
254
|
nameToDisplay: team.displayName ? team.displayName : team.name,
|
|
241
255
|
};
|
|
242
256
|
});
|
|
243
|
-
|
|
257
|
+
}
|
|
258
|
+
let allTeams = newPersonalTeam.concat(newAccountTeams, newStandardTeams);
|
|
259
|
+
const order = { [TEAM_TYPES.PERSONAL]: 1, [TEAM_TYPES.ACCOUNT]: 2, [TEAM_TYPES.STANDARD]: 3 };
|
|
260
|
+
allTeams = sortBy(allTeams, [(team) => order[team.type], "nameToDisplay"]);
|
|
261
|
+
if (selectedTeam) {
|
|
262
|
+
const selectedTeamIndex = allTeams.findIndex((team, index) => {
|
|
263
|
+
if (team.id === selectedTeam.id) {
|
|
264
|
+
return true;
|
|
265
|
+
}
|
|
266
|
+
else if (Array.isArray(team.projectTeams) && team.projectTeams?.length > 0) {
|
|
267
|
+
return team.projectTeams.some((projectTeam) => projectTeam.id === selectedTeam.id);
|
|
268
|
+
}
|
|
269
|
+
return false;
|
|
270
|
+
});
|
|
271
|
+
const [removedTeam] = allTeams.splice(selectedTeamIndex, 1);
|
|
272
|
+
allTeams.unshift(removedTeam);
|
|
244
273
|
}
|
|
245
274
|
let selectedTeamName = selectedTeam?.displayName
|
|
246
275
|
? selectedTeam.displayName
|
|
@@ -262,29 +291,22 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
262
291
|
React.createElement("div", { className: headerTeamSwitcherCreateTeamButtonClassname },
|
|
263
292
|
React.createElement("span", { className: headerTeamSwitcherCreateTeamButtonTextClassname }, createTeamButtonText),
|
|
264
293
|
React.createElement(AddAlt, { className: headerTeamSwitcherCreateTeamButtonIconClassname })))),
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
const isTeamSelected = team.id === selectedTeam?.id;
|
|
269
|
-
return (React.createElement("div", { key: team.id, id: `${team.id}-personal-menu-item-id` },
|
|
270
|
-
React.createElement(HeaderMenuItem, { key: team.id, id: `${team.id}-personal-menu-item`, "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
271
|
-
handleTeamClick({ team, type: "personal" });
|
|
272
|
-
},
|
|
273
|
-
// eslint-disable-next-line no-script-url
|
|
274
|
-
href: "javascript:void(0)", "data-testid": "header-team-switcher-menu-item" },
|
|
275
|
-
React.createElement("div", { className: headerDropdownMenuItemClassname },
|
|
276
|
-
React.createElement("span", { title: teamName, className: headerDropdownMenuItemTextClassname }, teamName),
|
|
277
|
-
isTeamSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null))));
|
|
278
|
-
})
|
|
279
|
-
: null,
|
|
280
|
-
accountTeams.length > 0
|
|
281
|
-
? sortedAccountTeamsWithNamesToDisplay.map((team) => {
|
|
294
|
+
allTeams.map((team) => {
|
|
295
|
+
const isTeamSelected = team.id === selectedTeam?.id;
|
|
296
|
+
if (team.type === TEAM_TYPES.ACCOUNT) {
|
|
282
297
|
const isSubmenuOpen = team.id === openAccountSubmenuId;
|
|
283
|
-
const
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
298
|
+
const projectTeams = team.projectTeams;
|
|
299
|
+
const existProjectTeams = Array.isArray(projectTeams) && projectTeams.length > 0;
|
|
300
|
+
let selectedProjectTeamIndex = -1;
|
|
301
|
+
if (existProjectTeams) {
|
|
302
|
+
selectedProjectTeamIndex = projectTeams.findIndex((team) => team.id === selectedTeam?.id);
|
|
303
|
+
}
|
|
304
|
+
const isProjectTeamSelected = selectedProjectTeamIndex >= 0;
|
|
287
305
|
const isMenuSelected = isTeamSelected || isProjectTeamSelected;
|
|
306
|
+
if (existProjectTeams && isProjectTeamSelected) {
|
|
307
|
+
const [removedTeam] = projectTeams.splice(selectedProjectTeamIndex, 1);
|
|
308
|
+
projectTeams.unshift(removedTeam);
|
|
309
|
+
}
|
|
288
310
|
return (React.createElement("div", { key: team.id, id: `${team.id}-account-menu` },
|
|
289
311
|
React.createElement(HeaderMenuItem, { "aria-expanded": isSubmenuOpen, "aria-selected": isMenuSelected, className: headerDropdownMenuItemAccountContainerClassname, onClick: (e) => handleOpenAccountSubmenu({ e, id: team.id }),
|
|
290
312
|
// eslint-disable-next-line no-script-url
|
|
@@ -292,7 +314,7 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
292
314
|
React.createElement("div", { className: headerDropdownMenuItemAccountClassname },
|
|
293
315
|
React.createElement("div", { className: headerDropdownMenuItemTextIconClassname },
|
|
294
316
|
React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
|
|
295
|
-
isMenuSelected ?
|
|
317
|
+
isMenuSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null),
|
|
296
318
|
React.createElement("div", { className: headerDropdownMenuItemAccountIconsClassname },
|
|
297
319
|
React.createElement(GroupAccount, { className: headerDropdownMenuItemAccountGroupIconClassname }),
|
|
298
320
|
React.createElement(ChevronDown, { className: headerDropdownMenuItemAccountChevronIconClassname })))),
|
|
@@ -304,9 +326,9 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
304
326
|
href: "javascript:void(0)" },
|
|
305
327
|
React.createElement("div", { className: headerDropdownMenuItemClassname, style: { paddingLeft: "1rem" } },
|
|
306
328
|
React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, "Account Page"),
|
|
307
|
-
isTeamSelected ?
|
|
308
|
-
|
|
309
|
-
?
|
|
329
|
+
isTeamSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null)),
|
|
330
|
+
projectTeams && projectTeams.length > 0
|
|
331
|
+
? projectTeams.map((team) => {
|
|
310
332
|
const isTeamSelected = team.id === selectedTeam?.id;
|
|
311
333
|
return (React.createElement("div", { key: team.id, id: `${team.id}-project-menu-item` },
|
|
312
334
|
React.createElement(HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
@@ -319,22 +341,19 @@ function HeaderTeamSwitcher({ analyticsHelpers, baseServicesUrl, createJoinTeamT
|
|
|
319
341
|
isTeamSelected ? (React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname })) : null))));
|
|
320
342
|
})
|
|
321
343
|
: null)));
|
|
322
|
-
}
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
? sortedStandardTeamsWithNamesToDisplay.map((team) => {
|
|
326
|
-
const isTeamSelected = team.id === selectedTeam?.id;
|
|
327
|
-
return (React.createElement("div", { key: team.id, id: `${team.id}-standard-menu-item` },
|
|
344
|
+
}
|
|
345
|
+
else {
|
|
346
|
+
return (React.createElement("div", { key: team.id, id: `${team.id}-${team.type}-menu-item` },
|
|
328
347
|
React.createElement(HeaderMenuItem, { "aria-selected": isTeamSelected, className: headerDropdownMenuItemContainerClassname, onClick: () => {
|
|
329
|
-
handleTeamClick({ team, type: "
|
|
348
|
+
handleTeamClick({ team, type: team.type ?? "" });
|
|
330
349
|
}, "data-testid": "header-team-switcher-menu-item",
|
|
331
350
|
// eslint-disable-next-line no-script-url
|
|
332
351
|
href: "javascript:void(0)" },
|
|
333
352
|
React.createElement("div", { className: headerDropdownMenuItemClassname },
|
|
334
353
|
React.createElement("span", { title: team.nameToDisplay, className: headerDropdownMenuItemTextClassname }, team.nameToDisplay),
|
|
335
354
|
isTeamSelected ? React.createElement(CheckmarkFilled, { className: headerDropdownMenuItemIconClassname }) : null))));
|
|
336
|
-
}
|
|
337
|
-
|
|
355
|
+
}
|
|
356
|
+
})))));
|
|
338
357
|
}
|
|
339
358
|
return null;
|
|
340
359
|
}
|
|
@@ -25,12 +25,13 @@ function determineIfConfigIsDifferent(teams, initialTeams) {
|
|
|
25
25
|
}
|
|
26
26
|
return isConfigDifferent;
|
|
27
27
|
}
|
|
28
|
-
function ProfileSettings({ baseServicesUrl, src, userName, isOpen, closeModal }) {
|
|
28
|
+
function ProfileSettings({ baseServicesUrl, refetchUser, refetchUserTeams, refetchNavigation, src, userName, isOpen, closeModal, }) {
|
|
29
29
|
const queryClient = useQueryClient();
|
|
30
30
|
const [initialTeams, setInitialTeams] = useState([]);
|
|
31
31
|
const [teams, setTeams] = useState([]);
|
|
32
32
|
const userUrl = serviceUrl.getLaunchpadUser({ baseServicesUrl });
|
|
33
33
|
const profileUrl = serviceUrl.resourceUserProfile({ baseServicesUrl });
|
|
34
|
+
const userTeamsUrl = serviceUrl.getUserTeamsServices({ baseServicesUrl });
|
|
34
35
|
const { data: user, isLoading: userIsLoading, error: userError, } = useQuery({
|
|
35
36
|
queryKey: userUrl,
|
|
36
37
|
queryFn: resolver.query(userUrl),
|
|
@@ -39,6 +40,22 @@ function ProfileSettings({ baseServicesUrl, src, userName, isOpen, closeModal })
|
|
|
39
40
|
onSuccess: () => {
|
|
40
41
|
queryClient.invalidateQueries(userUrl);
|
|
41
42
|
queryClient.invalidateQueries(profileUrl);
|
|
43
|
+
queryClient.invalidateQueries(userTeamsUrl);
|
|
44
|
+
if (refetchUser) {
|
|
45
|
+
setTimeout(() => {
|
|
46
|
+
refetchUser();
|
|
47
|
+
}, 1000);
|
|
48
|
+
}
|
|
49
|
+
if (refetchUserTeams) {
|
|
50
|
+
setTimeout(() => {
|
|
51
|
+
refetchUserTeams();
|
|
52
|
+
}, 1000);
|
|
53
|
+
}
|
|
54
|
+
if (refetchNavigation) {
|
|
55
|
+
setTimeout(() => {
|
|
56
|
+
refetchNavigation();
|
|
57
|
+
}, 1000);
|
|
58
|
+
}
|
|
42
59
|
},
|
|
43
60
|
});
|
|
44
61
|
// Only disable when we have a user and we know that there aren' any lower level groups to manage
|
|
@@ -54,6 +71,7 @@ function ProfileSettings({ baseServicesUrl, src, userName, isOpen, closeModal })
|
|
|
54
71
|
}
|
|
55
72
|
async function handleSubmit() {
|
|
56
73
|
const body = {
|
|
74
|
+
teamInstanceSwitcherDefault: null,
|
|
57
75
|
lowerLevelGroups: teams,
|
|
58
76
|
};
|
|
59
77
|
try {
|
|
@@ -95,9 +113,9 @@ function ProfileSettings({ baseServicesUrl, src, userName, isOpen, closeModal })
|
|
|
95
113
|
return (React.createElement(ComposedModal, { "aria-label": "Profile Settings", className: `${prefix}--bmrg-profile-settings-container ${prefix}--bmrg-header-modal`, open: isOpen, onClose: handleClose, preventCloseOnClickOutside: true },
|
|
96
114
|
React.createElement(ModalHeader, { closeModal: handleClose, title: `User profile - ${userName}` }),
|
|
97
115
|
React.createElement(ModalBody, { style: { maxHeight: "31.5rem" } },
|
|
98
|
-
React.createElement("p", { className: `${prefix}--bmrg-profile-settings__title` }, "More user profile settings will be here eventually, but for now you can choose which Teams are shown in your
|
|
99
|
-
React.createElement("h2", { className: `${prefix}--bmrg-profile-settings__subtitle` }, "Teams visible in Launchpad
|
|
100
|
-
React.createElement("p", { className: `${prefix}--bmrg-profile-settings__description` }, "Choose Teams to show or hide in your Launchpad
|
|
116
|
+
React.createElement("p", { className: `${prefix}--bmrg-profile-settings__title` }, "More user profile settings will be here eventually, but for now you can choose which Teams are shown in your team switcher in Launchpad."),
|
|
117
|
+
React.createElement("h2", { className: `${prefix}--bmrg-profile-settings__subtitle` }, "Teams visible in Launchpad team switcher"),
|
|
118
|
+
React.createElement("p", { className: `${prefix}--bmrg-profile-settings__description` }, "Choose Teams to show or hide in your Launchpad team switcher and Catalog (useful for sensitive demos). You will not be able to access or view unchecked Teams from the team switcher, and cannot add items to them from Catalog."),
|
|
101
119
|
userIsLoading ? (React.createElement(StructuredListSkeleton, null)) : userError ? (React.createElement(Error, { style: { color: "#F2F4F8", padding: "1rem" } })) : teams?.length > 0 ? (React.createElement(StructuredListWrapper, { className: `${prefix}--bmrg-profile-settings-list` },
|
|
102
120
|
React.createElement(StructuredListHead, null,
|
|
103
121
|
React.createElement(StructuredListRow, { head: true },
|
|
@@ -18,11 +18,11 @@ IBM Confidential
|
|
|
18
18
|
694970X, 69497O0
|
|
19
19
|
© Copyright IBM Corp. 2022, 2024
|
|
20
20
|
*/
|
|
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, refetchUser, refetchNavigation, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, userTeamsAssets, enableIcaMacs, }) {
|
|
21
|
+
function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme = "g10", config, createJoinTeamTrigger, enableTeamSwitcher = true, history, isLaunchpad = false, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, leftPanel, platformName, productName, profileMenuItems = [], supportMenuItems = [], renderPrivacyRedirect = true, renderPrivacyStatement = true, rightPanel, handleShowTutorial, refetchUser, refetchUserTeams, refetchNavigation, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, userTeamsAssets, enableIcaMacs, }) {
|
|
22
22
|
// Support base header .e.g for an error state
|
|
23
23
|
if (!config) {
|
|
24
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
|
+
React.createElement(Header, { baseEnvUrl: baseEnvUrl ?? "", baseServicesUrl: "", carbonTheme: carbonTheme, enableAppSwitcher: false, enableNotifications: false, enableNotificationsCount: false, enableTeamSwitcher: enableTeamSwitcher, productName: productName || platformName || "", user: user })));
|
|
26
26
|
}
|
|
27
27
|
const { features, navigation, platform, platformMessage } = config;
|
|
28
28
|
const names = getProductAndPlatformNames({ productName, platformName, platform });
|
|
@@ -63,8 +63,8 @@ function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme = "g10", config, cr
|
|
|
63
63
|
*/
|
|
64
64
|
const isPrivacyStatementDisabled = renderPrivacyStatement === false || features?.["consent.enabled"] === false;
|
|
65
65
|
return (React.createElement(QueryClientProvider, { client: queryClient },
|
|
66
|
-
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: [
|
|
67
|
-
isUserEnabled && (React.createElement(ProfileSettingsMenuItem, { key: "profile-settings", baseServicesUrl: platform.baseServicesUrl, src: `${platform.baseServicesUrl}/users/image/${user?.email}`, userName: user?.displayName ?? user?.name })),
|
|
66
|
+
React.createElement(Header, { analyticsHelpers: analyticsHelpers, baseEnvUrl: platform.baseEnvUrl, baseServicesUrl: platform.baseServicesUrl, carbonTheme: carbonTheme, createJoinTeamTrigger: createJoinTeamTrigger, enableAppSwitcher: isAppSwitcherEnabled, instanceSwitcherEnabled: instanceSwitcherEnabled, enableNotifications: isNotificationsEnabled, enableNotificationsCount: isNotificationsCountEnabled, enableTeamSwitcher: enableTeamSwitcher, 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: [
|
|
67
|
+
isUserEnabled && (React.createElement(ProfileSettingsMenuItem, { key: "profile-settings", baseServicesUrl: platform.baseServicesUrl, src: `${platform.baseServicesUrl}/users/image/${user?.email}`, userName: user?.displayName ?? user?.name, refetchUser: refetchUser, refetchUserTeams: refetchUserTeams, refetchNavigation: refetchNavigation })),
|
|
68
68
|
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" })),
|
|
69
69
|
!isPrivacyStatementDisabled && (React.createElement(PrivacyStatementMenuItem, { key: "privacy-statement", baseServicesUrl: platform.baseServicesUrl, platformEmail: platform?.platformEmail })),
|
|
70
70
|
...profileMenuItems,
|
package/dist/types/index.d.ts
CHANGED
|
@@ -367,6 +367,7 @@ type Props$G = {
|
|
|
367
367
|
className?: string;
|
|
368
368
|
createJoinTeamTrigger?: Function;
|
|
369
369
|
enableAppSwitcher?: boolean;
|
|
370
|
+
enableTeamSwitcher?: boolean;
|
|
370
371
|
instanceSwitcherEnabled?: boolean;
|
|
371
372
|
enableNotifications?: boolean;
|
|
372
373
|
enableNotificationsCount?: boolean;
|
|
@@ -1437,6 +1438,7 @@ type Props = {
|
|
|
1437
1438
|
};
|
|
1438
1439
|
platformMessage?: any;
|
|
1439
1440
|
};
|
|
1441
|
+
enableTeamSwitcher?: boolean;
|
|
1440
1442
|
history?: any;
|
|
1441
1443
|
isLaunchpad?: boolean;
|
|
1442
1444
|
isLoadingTeamSwitcher?: boolean;
|
|
@@ -1458,6 +1460,7 @@ type Props = {
|
|
|
1458
1460
|
};
|
|
1459
1461
|
refetchUser?: Function;
|
|
1460
1462
|
refetchNavigation?: Function;
|
|
1463
|
+
refetchUserTeams?: Function;
|
|
1461
1464
|
skipToContentProps?: {
|
|
1462
1465
|
href?: string;
|
|
1463
1466
|
children?: string;
|
|
@@ -1482,6 +1485,6 @@ type Props = {
|
|
|
1482
1485
|
handleShowTutorial?: Function;
|
|
1483
1486
|
tutorialScreenToShow?: string;
|
|
1484
1487
|
};
|
|
1485
|
-
declare function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme, config, createJoinTeamTrigger, history, isLaunchpad, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, leftPanel, platformName, productName, profileMenuItems, supportMenuItems, renderPrivacyRedirect, renderPrivacyStatement, rightPanel, handleShowTutorial, refetchUser, refetchNavigation, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, userTeamsAssets, enableIcaMacs, }: Props): React.JSX.Element;
|
|
1488
|
+
declare function UIShell({ analyticsHelpers, baseEnvUrl, carbonTheme, config, createJoinTeamTrigger, enableTeamSwitcher, history, isLaunchpad, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, leftPanel, platformName, productName, profileMenuItems, supportMenuItems, renderPrivacyRedirect, renderPrivacyStatement, rightPanel, handleShowTutorial, refetchUser, refetchUserTeams, refetchNavigation, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, tutorialScreenToShow, user, userTeams, userTeamsAssets, enableIcaMacs, }: Props): React.JSX.Element;
|
|
1486
1489
|
|
|
1487
1490
|
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