@boomerang-io/carbon-addons-boomerang-react 4.6.11-beta.2 → 4.6.11-beta.20
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 +140 -169
- 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 +324 -0
- package/dist/cjs/components/UIShell/UIShell.js +9 -4
- package/dist/esm/components/AdvantageSideNav/AdvantageSideNav.js +142 -171
- 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 +315 -0
- package/dist/esm/components/UIShell/UIShell.js +10 -5
- package/dist/types/index.d.ts +113 -1
- 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
|
@@ -21,25 +21,46 @@ IBM Confidential
|
|
|
21
21
|
© Copyright IBM Corp. 2022, 2024
|
|
22
22
|
*/
|
|
23
23
|
function AdvantageSideNav(props) {
|
|
24
|
-
const { app, appLink, regionalTeam, enableChatButton = true, showChatButton = true, showSelectTeamPurpose = false, homeLink, assistantLink, defaultAssistantLink, joinCreateTrigger, isLoading, isOpen, teams = [], triggerEvent, accounts = [], baseEnvUrl, className, navLinks, personalTeams = [], user, showChatTooltip, templateMeteringEvent, tooltipMessage, isLaunchpad = false,
|
|
25
|
-
const [activeSubmenu, setActiveSubmenu] = React__default.default.useState("");
|
|
24
|
+
const { app, appLink, regionalTeam, enableChatButton = true, showChatButton = true, showSelectTeamPurpose = false, homeLink, agentAssistantStudioLink, agentAssistantLibraryLink, assistantLink, defaultAssistantLink, documentCollectionsLink, settingsLink, toolsLink, joinCreateTrigger, isLoading, isOpen, teams = [], triggerEvent, accounts = [], baseEnvUrl, className, navLinks, navigation, personalTeams = [], user, showChatTooltip, templateMeteringEvent, tooltipMessage, isLaunchpad = false, history, children, ...rest } = props;
|
|
26
25
|
const [activeMenu, setActiveMenu] = React__default.default.useState(false);
|
|
27
|
-
|
|
28
|
-
const [regionalModalIsOpen, setRegionalModalIsOpen] =
|
|
29
|
-
|
|
26
|
+
React__default.default.useState(null);
|
|
27
|
+
// const [regionalModalIsOpen, setRegionalModalIsOpen] = React.useState(false);
|
|
28
|
+
React__default.default.useState(null);
|
|
30
29
|
const isMenuOpen = isOpen || activeMenu;
|
|
31
30
|
const windowLocation = window.location;
|
|
32
31
|
const isPartnerUser = user?.type === UserType.USER_PLATFORM_ROLE.Partner;
|
|
33
32
|
const joinButtontitle = showSelectTeamPurpose ? "Create Team" : "Create or Join Team";
|
|
34
|
-
const standardTeamsList = [...personalTeams.map((pteams) => ({ ...pteams, isPersonal: true })), ...teams];
|
|
35
|
-
const teamsMenuRef = React__default.default.useRef(null);
|
|
36
|
-
const accountsMenuRef = React__default.default.useRef(null);
|
|
37
33
|
const hamburguerMenu = document.getElementById("header-sidenav-menu-button");
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
34
|
+
// get current selected team
|
|
35
|
+
let teamSwitcherTeam = null;
|
|
36
|
+
if (personalTeams.length > 0) {
|
|
37
|
+
personalTeams.forEach((team) => {
|
|
38
|
+
if (team.id === user?.teamInstanceSwitcherDefault) {
|
|
39
|
+
teamSwitcherTeam = { ...team, isPersonal: true };
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
if (teams.length > 0) {
|
|
44
|
+
teams.forEach((team) => {
|
|
45
|
+
if (team.id === user?.teamInstanceSwitcherDefault) {
|
|
46
|
+
teamSwitcherTeam = { ...team, isStandard: true };
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
if (accounts.length > 0) {
|
|
51
|
+
accounts.forEach((account) => {
|
|
52
|
+
if (account.id === user?.teamInstanceSwitcherDefault) {
|
|
53
|
+
teamSwitcherTeam = { ...account, isAccount: true };
|
|
54
|
+
}
|
|
55
|
+
else if (account.projectTeams && account.projectTeams?.length > 0) {
|
|
56
|
+
account.projectTeams.forEach((projectTeam) => {
|
|
57
|
+
if (projectTeam.id === user?.teamInstanceSwitcherDefault) {
|
|
58
|
+
teamSwitcherTeam = { ...projectTeam, isProject: true };
|
|
59
|
+
}
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
}
|
|
43
64
|
// Functions to track IBM Instrumentation on Segment
|
|
44
65
|
const handleHomeClick = () => {
|
|
45
66
|
triggerEvent &&
|
|
@@ -49,24 +70,57 @@ function AdvantageSideNav(props) {
|
|
|
49
70
|
destinationPath: homeLink,
|
|
50
71
|
});
|
|
51
72
|
};
|
|
52
|
-
const
|
|
53
|
-
|
|
54
|
-
|
|
73
|
+
const handleToolsClick = () => {
|
|
74
|
+
triggerEvent &&
|
|
75
|
+
triggerEvent({
|
|
76
|
+
action: "Clicked on SideNav Tools link",
|
|
77
|
+
category: "Sidenav",
|
|
78
|
+
destinationPath: toolsLink,
|
|
79
|
+
});
|
|
80
|
+
};
|
|
81
|
+
const handleAgentAssistantStudioClick = () => {
|
|
82
|
+
triggerEvent &&
|
|
83
|
+
triggerEvent({
|
|
84
|
+
action: "Clicked on SideNav Agent & Assistant Studio link",
|
|
85
|
+
category: "Sidenav",
|
|
86
|
+
destinationPath: agentAssistantStudioLink,
|
|
87
|
+
});
|
|
88
|
+
};
|
|
89
|
+
const handleAgentAssistantLibraryClick = () => {
|
|
90
|
+
triggerEvent &&
|
|
91
|
+
triggerEvent({
|
|
92
|
+
action: "Clicked on SideNav Agent & Assistant Library link",
|
|
93
|
+
category: "Sidenav",
|
|
94
|
+
destinationPath: agentAssistantLibraryLink,
|
|
95
|
+
});
|
|
96
|
+
};
|
|
97
|
+
const handleDocumentCollectionsClick = () => {
|
|
98
|
+
triggerEvent &&
|
|
99
|
+
triggerEvent({
|
|
100
|
+
action: "Clicked on SideNav Document Collections link",
|
|
101
|
+
category: "Sidenav",
|
|
102
|
+
destinationPath: documentCollectionsLink,
|
|
103
|
+
});
|
|
104
|
+
};
|
|
105
|
+
const handleSettingsClick = () => {
|
|
106
|
+
triggerEvent &&
|
|
107
|
+
triggerEvent({
|
|
108
|
+
action: "Clicked on SideNav Settings link",
|
|
109
|
+
category: "Sidenav",
|
|
110
|
+
destinationPath: settingsLink,
|
|
111
|
+
});
|
|
55
112
|
};
|
|
56
113
|
const handleAssistantClick = () => {
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
id: team.id,
|
|
61
|
-
name: team.name,
|
|
62
|
-
})));
|
|
63
|
-
}
|
|
114
|
+
console.log("assistantLink checking", assistantLink);
|
|
115
|
+
let redirectLink = `${appLink.newChatRedirect()}?teamName=${teamSwitcherTeam.name}&teamId=${teamSwitcherTeam.id}`;
|
|
116
|
+
console.log("redirectLink checking", redirectLink);
|
|
64
117
|
triggerEvent &&
|
|
65
118
|
triggerEvent({
|
|
66
119
|
action: "Clicked on SideNav Assistant link",
|
|
67
120
|
category: "Sidenav",
|
|
68
|
-
destinationPath: assistantLink,
|
|
69
121
|
});
|
|
122
|
+
console.log("asddasd", assistantLink);
|
|
123
|
+
// window.open(assistantLink, "_self", "noopener,noreferrer");
|
|
70
124
|
};
|
|
71
125
|
const handleCreateJoinClick = () => {
|
|
72
126
|
triggerEvent &&
|
|
@@ -87,60 +141,35 @@ function AdvantageSideNav(props) {
|
|
|
87
141
|
teamType: type,
|
|
88
142
|
});
|
|
89
143
|
};
|
|
90
|
-
const handleServiceClick = ({ service, team }) => {
|
|
91
|
-
if (templateMeteringEvent) {
|
|
92
|
-
templateMeteringEvent({ service, team });
|
|
93
|
-
}
|
|
94
|
-
triggerEvent &&
|
|
95
|
-
triggerEvent({
|
|
96
|
-
action: "Clicked on SideNav Service link",
|
|
97
|
-
category: "Sidenav",
|
|
98
|
-
destinationPath: service.url,
|
|
99
|
-
});
|
|
100
|
-
};
|
|
101
144
|
const handleLaunchpadLink = (event) => {
|
|
102
145
|
event.preventDefault();
|
|
103
|
-
// remediation to close menu, submenu and accordion when select a team on Launchpad
|
|
104
|
-
//@ts-ignore
|
|
105
|
-
if (Boolean(teamsMenuRef.current?.ariaExpanded === "true")) {
|
|
106
|
-
//@ts-ignore
|
|
107
|
-
teamsMenuRef.current.click();
|
|
108
|
-
}
|
|
109
|
-
//@ts-ignore
|
|
110
|
-
if (Boolean(accountsMenuRef.current?.ariaExpanded === "true")) {
|
|
111
|
-
//@ts-ignore
|
|
112
|
-
accountsMenuRef.current.click();
|
|
113
|
-
}
|
|
114
146
|
//@ts-ignore
|
|
115
147
|
if (Boolean(hamburguerMenu) && hamburguerMenu.className.includes("active")) {
|
|
116
148
|
//@ts-ignore
|
|
117
149
|
Boolean(hamburguerMenu) && hamburguerMenu?.click();
|
|
118
150
|
}
|
|
119
151
|
setActiveMenu(false);
|
|
120
|
-
setActiveSubmenu("");
|
|
121
152
|
};
|
|
122
|
-
// add or remove refs
|
|
123
|
-
if (teamsRef.current.length !== standardTeamsList?.length) {
|
|
124
|
-
//@ts-ignore
|
|
125
|
-
teamsRef.current = Array(standardTeamsList?.length).fill().map((_, i) => teamsRef.current[i] || React__default.default.createRef());
|
|
126
|
-
}
|
|
127
|
-
if (accountsRef.current.length !== accounts?.length) {
|
|
128
|
-
//@ts-ignore
|
|
129
|
-
accountsRef.current = Array(accounts?.length).fill().map((_, i) => accountsRef.current[i] || React__default.default.createRef());
|
|
130
|
-
}
|
|
131
153
|
const assistantSideNavLink = (
|
|
132
|
-
// assistantLink &&
|
|
133
|
-
React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-assistant-link", className: !enableChatButton ? `${settings.prefix}--bmrg-advantage-sidenav__inactive-link` : "", disabled: Boolean(!enableChatButton),
|
|
154
|
+
// assistantLink &&
|
|
155
|
+
React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-assistant-link", className: !enableChatButton ? `${settings.prefix}--bmrg-advantage-sidenav__inactive-link` : "", disabled: Boolean(!enableChatButton),
|
|
156
|
+
// isActive={assistantLink }
|
|
157
|
+
renderIcon: icons.ChatBot,
|
|
158
|
+
// href={enableChatButton}
|
|
159
|
+
onClick: enableChatButton ? handleAssistantClick : (e) => e.preventDefault() }, "Chat d"));
|
|
160
|
+
const catalogNavlink = navigation?.platform?.catalog?.url;
|
|
161
|
+
const adminNavlink = navigation?.platform?.admin?.url;
|
|
162
|
+
const showSecondDivider = (!isPartnerUser && showChatButton) ||
|
|
163
|
+
toolsLink ||
|
|
164
|
+
agentAssistantStudioLink ||
|
|
165
|
+
agentAssistantLibraryLink ||
|
|
166
|
+
documentCollectionsLink;
|
|
134
167
|
return (React__default.default.createElement(react.SideNav, { "aria-label": "sidenav-container", className: cx__default.default(`${settings.prefix}--bmrg-advantage-sidenav-container`, className, {
|
|
135
168
|
"--closed": !isMenuOpen,
|
|
136
|
-
}), "data-testid": "sidenav-container", isRail: true, expanded: isMenuOpen,
|
|
169
|
+
}), "data-testid": "sidenav-container", isRail: true, expanded: isMenuOpen, onMouseEnter: () => setActiveMenu(true), onMouseLeave: () => {
|
|
137
170
|
setActiveMenu(false);
|
|
138
|
-
setActiveSubmenu("");
|
|
139
171
|
}, ...rest }, React__default.default.createElement(react.SideNavItems, null,
|
|
140
|
-
|
|
141
|
-
navLinks.map((link) => (React__default.default.createElement(react.SideNavLink, { href: link.url, target: link.isExternal ? "_blank" : undefined, rel: link.isExternal ? "noopener noreferrer" : undefined }, link.name))),
|
|
142
|
-
React__default.default.createElement(react.SideNavDivider, null))) : null,
|
|
143
|
-
React__default.default.createElement("div", { onMouseEnter: () => setActiveSubmenu("") },
|
|
172
|
+
React__default.default.createElement("div", null,
|
|
144
173
|
homeLink ? (React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-home-link", isActive: `${baseEnvUrl}/${app}/`.includes(windowLocation.href), renderIcon: icons.Home, href: homeLink, onClick: (e) => {
|
|
145
174
|
if (isLaunchpad) {
|
|
146
175
|
handleLaunchpadLink(e);
|
|
@@ -148,115 +177,57 @@ function AdvantageSideNav(props) {
|
|
|
148
177
|
}
|
|
149
178
|
handleHomeClick();
|
|
150
179
|
} }, "Home")) : null,
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
}
|
|
169
|
-
} }, "Continue"))),
|
|
170
|
-
!isPartnerUser && joinCreateTrigger ? (React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-create-join-trigger", renderIcon: icons.AddAlt, onClick: (e) => {
|
|
180
|
+
teamSwitcherTeam ? (React__default.default.createElement(react.SideNavLink, { title: teamSwitcherTeam.isAccount ? "Account Page" : "Team Page", name: teamSwitcherTeam.name, "data-testid": "sidenav-team-link", id: teamSwitcherTeam.id, isActive: windowLocation.href.includes(teamSwitcherTeam.id), className: `${settings.prefix}--bmrg-advantage-sidenav-team`, renderIcon: icons.UserMultiple, href: `${baseEnvUrl}/${app}/teams/${teamSwitcherTeam.id}`, onClick: (e) => {
|
|
181
|
+
if (isLaunchpad) {
|
|
182
|
+
handleLaunchpadLink(e);
|
|
183
|
+
history.push(`/teams/${teamSwitcherTeam.id}`);
|
|
184
|
+
}
|
|
185
|
+
handleTeamClick({
|
|
186
|
+
team: teamSwitcherTeam,
|
|
187
|
+
type: teamSwitcherTeam.isPersonal
|
|
188
|
+
? "personal"
|
|
189
|
+
: teamSwitcherTeam.isAccount
|
|
190
|
+
? "account"
|
|
191
|
+
: teamSwitcherTeam.isproject
|
|
192
|
+
? "project"
|
|
193
|
+
: "standard",
|
|
194
|
+
});
|
|
195
|
+
} },
|
|
196
|
+
React__default.default.createElement("p", { className: `${settings.prefix}--bmrg-advantage-sidenav-teams__title` }, teamSwitcherTeam.isAccount ? "Account Page" : "Team Page"))) : !isPartnerUser && joinCreateTrigger ? (React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-create-join-trigger", renderIcon: icons.AddAlt, onClick: (e) => {
|
|
171
197
|
joinCreateTrigger(e);
|
|
172
198
|
handleCreateJoinClick();
|
|
173
|
-
} }, joinButtontitle)) : null
|
|
174
|
-
children ? (React__default.default.createElement(React__default.default.Fragment, null,
|
|
175
|
-
React__default.default.createElement(react.SideNavDivider, null),
|
|
176
|
-
children)) : null,
|
|
177
|
-
userTeamsLoading && isMenuOpen ? (React__default.default.createElement(React__default.default.Fragment, null,
|
|
199
|
+
} }, joinButtontitle)) : null,
|
|
178
200
|
React__default.default.createElement(react.SideNavDivider, null),
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
React__default.default.createElement(
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
React__default.default.createElement(
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
"--open": team.id === activeSubmenu,
|
|
208
|
-
}), style: { top: `${window.scrollY + topPosition}px` } },
|
|
209
|
-
React__default.default.createElement("li", { className: `${settings.prefix}--bmrg-advantage-sidenav-submenu-wrapper` },
|
|
210
|
-
React__default.default.createElement("ul", { className: `${settings.prefix}--bmrg-advantage-sidenav-services-submenu` },
|
|
211
|
-
React__default.default.createElement(react.SideNavLink, { title: "Team Page", className: `${settings.prefix}--bmrg-advantage-sidenav-submenu-link`, "data-testid": "sidenav-team-submenu-link", href: `${baseEnvUrl}/${app}/teams/${team.id}`, onClick: (e) => {
|
|
212
|
-
if (isLaunchpad) {
|
|
213
|
-
handleLaunchpadLink(e);
|
|
214
|
-
history.push(`/teams/${team.id}`);
|
|
215
|
-
}
|
|
216
|
-
handleTeamClick({ team, type: team.isPersonal ? "personal" : "standard" });
|
|
217
|
-
} }, "Team Page"),
|
|
218
|
-
team.services?.map((service) => (React__default.default.createElement(react.SideNavLink, { title: service.name, className: `${settings.prefix}--bmrg-advantage-sidenav-submenu-link`, "data-testid": "sidenav-service-submenu-link", href: service.url, onClick: () => handleServiceClick({ service, team }) }, service.name))) ?? null)))) : null)));
|
|
219
|
-
})
|
|
220
|
-
: null))) : null,
|
|
221
|
-
Boolean(accounts?.length) ? (React__default.default.createElement(React__default.default.Fragment, null,
|
|
201
|
+
// assistantLink &&
|
|
202
|
+
showChatButton &&
|
|
203
|
+
(showChatTooltip ? (React__default.default.createElement(TooltipHover.default, { className: `${settings.prefix}--bmrg-side-nav__tooltip`, content: tooltipMessage, direction: "right" },
|
|
204
|
+
React__default.default.createElement("span", null, assistantSideNavLink))) : (assistantSideNavLink)),
|
|
205
|
+
toolsLink ? (React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-tools-link", renderIcon: icons.Api, href: toolsLink, onClick: (e) => {
|
|
206
|
+
handleToolsClick();
|
|
207
|
+
} }, "Tools")) : null,
|
|
208
|
+
agentAssistantStudioLink ? (React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-agent-assistant-studio-link", isActive: windowLocation.href.includes(`/launchpad/agent-assistant-studio`) ||
|
|
209
|
+
windowLocation.href.includes(`/launchpad/agenticapps`), renderIcon: icons.IntentRequestCreate, href: agentAssistantStudioLink, onClick: (e) => {
|
|
210
|
+
if (isLaunchpad) {
|
|
211
|
+
handleLaunchpadLink(e);
|
|
212
|
+
history.push(agentAssistantStudioLink);
|
|
213
|
+
}
|
|
214
|
+
handleAgentAssistantStudioClick();
|
|
215
|
+
} }, "Agent & Assistant Studio")) : null,
|
|
216
|
+
agentAssistantLibraryLink ? (React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-agent-assistant-library-link", renderIcon: icons.Folders, href: agentAssistantLibraryLink, onClick: (e) => {
|
|
217
|
+
handleAgentAssistantLibraryClick();
|
|
218
|
+
} }, "Agent & Assistant Library")) : null,
|
|
219
|
+
documentCollectionsLink ? (React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-document-collections-link", renderIcon: icons.DocumentMultiple_02, href: documentCollectionsLink, onClick: (e) => {
|
|
220
|
+
handleDocumentCollectionsClick();
|
|
221
|
+
} }, "Document Collections")) : null,
|
|
222
|
+
showSecondDivider ? React__default.default.createElement(react.SideNavDivider, null) : null,
|
|
223
|
+
catalogNavlink ? (React__default.default.createElement(react.SideNavLink, { href: catalogNavlink, renderIcon: icons.Catalog }, "Catalog")) : null,
|
|
224
|
+
settingsLink ? (React__default.default.createElement(react.SideNavLink, { "data-testid": "sidenav-settings-link", renderIcon: icons.Settings, href: settingsLink, onClick: (e) => {
|
|
225
|
+
handleSettingsClick();
|
|
226
|
+
} }, "Settings")) : null,
|
|
227
|
+
adminNavlink ? (React__default.default.createElement(react.SideNavLink, { href: adminNavlink, renderIcon: icons.LicenseThirdParty }, "Admin")) : null),
|
|
228
|
+
children ? (React__default.default.createElement(React__default.default.Fragment, null,
|
|
222
229
|
React__default.default.createElement(react.SideNavDivider, null),
|
|
223
|
-
|
|
224
|
-
"--active-closed": !isMenuOpen &&
|
|
225
|
-
accounts.some((t) => {
|
|
226
|
-
const pIds = t?.projectTeams?.map((project) => project.id) ?? [];
|
|
227
|
-
return windowLocation.href.includes(t.id) || pIds.some((id) => windowLocation.href.includes(id));
|
|
228
|
-
}),
|
|
229
|
-
}), renderIcon: icons.GroupAccount, title: "Accounts", "data-testid": "sidenav-accounts", id: "sidenav-accounts", ref: accountsMenuRef, "aria-expanded": isMenuOpen, isSideNavExpanded: isMenuOpen }, isMenuOpen
|
|
230
|
-
? accounts?.map((team, i) => {
|
|
231
|
-
const topPosition = document?.getElementById(team.id)?.getBoundingClientRect()?.top ?? 0;
|
|
232
|
-
const teamDisplayName = Boolean(team.displayName) ? team.displayName : team.name;
|
|
233
|
-
const projectIds = team?.projectTeams?.map((project) => project.id) ?? [];
|
|
234
|
-
const isAccountActive = windowLocation.href.includes(team.id) ||
|
|
235
|
-
projectIds.some((id) => windowLocation.href.includes(id));
|
|
236
|
-
return (React__default.default.createElement(React__default.default.Fragment, null,
|
|
237
|
-
React__default.default.createElement("li", { className: `${settings.prefix}--bmrg-advantage-sidenav-team-item` },
|
|
238
|
-
React__default.default.createElement(react.SideNavLink, { title: teamDisplayName, id: team.id, isActive: isAccountActive, ref: accountsRef.current[i], className: `${settings.prefix}--bmrg-advantage-sidenav-account`, href: `${baseEnvUrl}/${app}/teams/${team.id}`, onMouseEnter: () => setActiveSubmenu(team.id), onFocus: () => setActiveSubmenu(team.id), onClick: (e) => {
|
|
239
|
-
if (isLaunchpad) {
|
|
240
|
-
handleLaunchpadLink(e);
|
|
241
|
-
history.push(`/teams/${team.id}`);
|
|
242
|
-
}
|
|
243
|
-
handleTeamClick({ team, type: "account" });
|
|
244
|
-
} },
|
|
245
|
-
React__default.default.createElement("p", { className: `${settings.prefix}--bmrg-advantage-sidenav-teams__title` }, teamDisplayName),
|
|
246
|
-
Boolean(team?.projectTeams?.length) ? React__default.default.createElement(icons.ChevronRight, null) : null),
|
|
247
|
-
Boolean(team?.projectTeams?.length) && team.id === activeSubmenu ? (React__default.default.createElement("ul", { className: cx__default.default(`${settings.prefix}--bmrg-advantage-sidenav-submenu`, {
|
|
248
|
-
"--open": team.id === activeSubmenu,
|
|
249
|
-
}), style: { top: `${window.scrollY + topPosition}px` } },
|
|
250
|
-
React__default.default.createElement("li", { className: `${settings.prefix}--bmrg-advantage-sidenav-submenu-wrapper` },
|
|
251
|
-
React__default.default.createElement("ul", { className: `${settings.prefix}--bmrg-advantage-sidenav-services-submenu` }, team.projectTeams?.map((accTeam) => (React__default.default.createElement(react.SideNavLink, { title: accTeam.name, className: `${settings.prefix}--bmrg-advantage-sidenav-submenu-link`, "data-testid": "sidenav-account-submenu-link", href: `${baseEnvUrl}/${app}/teams/${accTeam.id}`, onClick: (e) => {
|
|
252
|
-
if (isLaunchpad) {
|
|
253
|
-
handleLaunchpadLink(e);
|
|
254
|
-
history.push(`/teams/${accTeam.id}`);
|
|
255
|
-
}
|
|
256
|
-
handleTeamClick({ team: accTeam, type: "project" });
|
|
257
|
-
} }, accTeam.name))) ?? null)))) : null)));
|
|
258
|
-
})
|
|
259
|
-
: null))) : null)));
|
|
230
|
+
children)) : null)));
|
|
260
231
|
}
|
|
261
232
|
|
|
262
233
|
exports.AdvantageSideNav = AdvantageSideNav;
|
|
@@ -3,15 +3,18 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
+
var reactQuery = require('react-query');
|
|
6
7
|
var react = require('@carbon/react');
|
|
7
8
|
var icons = require('@carbon/react/icons');
|
|
8
9
|
var HeaderAppSwitcher = require('./HeaderAppSwitcher.js');
|
|
10
|
+
var HeaderTeamSwitcher = require('./HeaderTeamSwitcher.js');
|
|
9
11
|
var HeaderMenu = require('./HeaderMenu.js');
|
|
10
12
|
var NotificationsContainer = require('../Notifications/NotificationsContainer.js');
|
|
11
13
|
var PlatformNotificationsContainer = require('../PlatformNotifications/PlatformNotificationsContainer.js');
|
|
12
14
|
var UserRequests = require('./UserRequests.js');
|
|
13
15
|
var useHeaderMenu = require('../../hooks/useHeaderMenu.js');
|
|
14
16
|
var useWindowSize = require('../../hooks/useWindowSize.js');
|
|
17
|
+
var servicesConfig = require('../../config/servicesConfig.js');
|
|
15
18
|
var settings = require('../../internal/settings.js');
|
|
16
19
|
|
|
17
20
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -21,7 +24,7 @@ var React__default = /*#__PURE__*/_interopDefault(React);
|
|
|
21
24
|
/*
|
|
22
25
|
IBM Confidential
|
|
23
26
|
694970X, 69497O0
|
|
24
|
-
© Copyright IBM Corp. 2022,
|
|
27
|
+
© Copyright IBM Corp. 2022, 2025
|
|
25
28
|
*/
|
|
26
29
|
const MenuListId = {
|
|
27
30
|
Notifcations: "header-notifications-dialog",
|
|
@@ -32,6 +35,7 @@ const MenuListId = {
|
|
|
32
35
|
Support: "header-support-menu",
|
|
33
36
|
instanceSwitcher: "header-instanceSwitcher-menu",
|
|
34
37
|
Switcher: "header-switcher-menu",
|
|
38
|
+
TeamSwitcher: "header-team-switcher-menu",
|
|
35
39
|
};
|
|
36
40
|
const MenuButtonId = {
|
|
37
41
|
Notifcations: "header-notifications-dialog-button",
|
|
@@ -42,6 +46,7 @@ const MenuButtonId = {
|
|
|
42
46
|
Support: "header-support-menu-button",
|
|
43
47
|
InstanceSwitcher: "header-instanceSwitcher-menu-button",
|
|
44
48
|
Switcher: "header-switcher-menu-button",
|
|
49
|
+
TeamSwitcher: "header-team-switcher-menu-button",
|
|
45
50
|
};
|
|
46
51
|
const MenuAriaLabelRecord = {
|
|
47
52
|
Notifcations: "Notifications dialog",
|
|
@@ -52,11 +57,19 @@ const MenuAriaLabelRecord = {
|
|
|
52
57
|
instanceSwitcher: "Instance Switcher Menu",
|
|
53
58
|
Support: "Support menu",
|
|
54
59
|
Switcher: "Switcher menu",
|
|
60
|
+
TeamSwitcher: "Team Switcher menu",
|
|
55
61
|
};
|
|
56
62
|
const headerButtonClassNames = "cds--btn--icon-only cds--header__action cds--btn cds--btn--primary cds--btn--icon-only cds--btn cds--btn--primary";
|
|
57
63
|
const instanceCheckMarkContainerClass = "instance-checkmark-style-container";
|
|
58
64
|
function Header(props) {
|
|
59
|
-
const { productName, baseEnvUrl, baseServicesUrl, carbonTheme = "g10", className, navLinks, platform, prefixName = "", rightPanel, skipToContentProps, templateMeteringEvent, triggerEvent, userTeams, } = props;
|
|
65
|
+
const { analyticsHelpers, productName, baseEnvUrl, baseServicesUrl, carbonTheme = "g10", className, createJoinTeamTrigger, history, isLaunchpad = false, isLoadingTeamSwitcher, isSuccessTeamSwitcher, setIsSuccessTeamSwitcher, navLinks, platform, prefixName = "", rightPanel, skipToContentProps, templateMeteringEvent, trackEvent, triggerEvent, user, userTeams, } = props;
|
|
66
|
+
const hasUserTeams = Boolean(userTeams);
|
|
67
|
+
const userTeamsUrl = servicesConfig.serviceUrl.getUserTeamsServices({ baseServicesUrl });
|
|
68
|
+
const teamsQuery = reactQuery.useQuery({
|
|
69
|
+
queryKey: userTeamsUrl,
|
|
70
|
+
queryFn: servicesConfig.resolver.query(userTeamsUrl, null),
|
|
71
|
+
enabled: !hasUserTeams && Boolean(baseServicesUrl),
|
|
72
|
+
});
|
|
60
73
|
return (React__default.default.createElement(React__default.default.Fragment, null,
|
|
61
74
|
React__default.default.createElement(react.Theme, { theme: carbonTheme },
|
|
62
75
|
React__default.default.createElement(react.Header, { "aria-label": "App navigation header", className: className },
|
|
@@ -67,12 +80,13 @@ function Header(props) {
|
|
|
67
80
|
? 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)))
|
|
68
81
|
: null),
|
|
69
82
|
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, teamsQuery: teamsQuery, trackEvent: trackEvent, user: user, userTeams: userTeams }),
|
|
70
84
|
props?.instanceSwitcherEnabled && (React__default.default.createElement(InstanceSwitcherMenu, { enabled: Boolean(props.instanceSwitcherEnabled), menuItems: platform?.instances })),
|
|
71
85
|
React__default.default.createElement(RequestsMenu, { baseEnvUrl: baseEnvUrl, enabled: Boolean(props.requestSummary), summary: props.requestSummary }),
|
|
72
86
|
React__default.default.createElement(NotificationsMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: Boolean(props.enableNotifications), countEnabled: Boolean(props.enableNotificationsCount) }),
|
|
73
87
|
React__default.default.createElement(SupportMenu, { enabled: Array.isArray(props.supportMenuItems) && props.supportMenuItems.length > 0, menuItems: props.supportMenuItems }),
|
|
74
88
|
React__default.default.createElement(ProfileMenu, { enabled: Array.isArray(props.profileMenuItems) && props.profileMenuItems.length > 0, menuItems: props.profileMenuItems }),
|
|
75
|
-
React__default.default.createElement(AppSwitcherMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: props.enableAppSwitcher, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent, userTeams: userTeams }),
|
|
89
|
+
React__default.default.createElement(AppSwitcherMenu, { baseEnvUrl: baseEnvUrl, baseServicesUrl: baseServicesUrl, enabled: props.enableAppSwitcher, teamsQuery: teamsQuery, templateMeteringEvent: templateMeteringEvent, triggerEvent: triggerEvent, userTeams: userTeams }),
|
|
76
90
|
React__default.default.createElement(RightPanelMenu, { enabled: Boolean(rightPanel && Object.keys(rightPanel).length), ...rightPanel })))),
|
|
77
91
|
React__default.default.createElement(NotificationsContainer.default, { enableMultiContainer: true, containerId: `${settings.prefix}--bmrg-header-notifications` })));
|
|
78
92
|
}
|
|
@@ -153,7 +167,7 @@ function AppSwitcherMenu(props) {
|
|
|
153
167
|
}
|
|
154
168
|
return (React__default.default.createElement("div", { ref: ref },
|
|
155
169
|
React__default.default.createElement("button", { "aria-controls": MenuListId.Switcher, "aria-expanded": isOpen, "aria-haspopup": "menu", "aria-label": MenuAriaLabelRecord.Switcher, className: headerButtonClassNames, "data-testid": "header-appswitcher-link", id: MenuButtonId.Switcher, onClick: toggleActive }, isOpen ? React__default.default.createElement(icons.Close, { size: 20 }) : React__default.default.createElement(icons.Switcher, { size: 20 })),
|
|
156
|
-
React__default.default.createElement(HeaderAppSwitcher.default, { baseEnvUrl: props.baseEnvUrl, baseServicesUrl: props.baseServicesUrl, id: MenuListId.Switcher, isOpen: isOpen, templateMeteringEvent: props.templateMeteringEvent, triggerEvent: props.triggerEvent, userTeams: props.userTeams })));
|
|
170
|
+
React__default.default.createElement(HeaderAppSwitcher.default, { baseEnvUrl: props.baseEnvUrl, baseServicesUrl: props.baseServicesUrl, id: MenuListId.Switcher, isOpen: isOpen, teamsQuery: props.teamsQuery, templateMeteringEvent: props.templateMeteringEvent, triggerEvent: props.triggerEvent, userTeams: props.userTeams })));
|
|
157
171
|
}
|
|
158
172
|
function RightPanelMenu(props) {
|
|
159
173
|
const { isOpen, toggleActive, ref } = useHeaderMenu.default(MenuButtonId.RightPanel);
|
|
@@ -3,12 +3,10 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
-
var reactQuery = require('react-query');
|
|
7
6
|
var react = require('@carbon/react');
|
|
8
7
|
var icons = require('@carbon/react/icons');
|
|
9
8
|
var ErrorMessage = require('../ErrorMessage/ErrorMessage.js');
|
|
10
9
|
var cx = require('classnames');
|
|
11
|
-
var servicesConfig = require('../../config/servicesConfig.js');
|
|
12
10
|
var settings = require('../../internal/settings.js');
|
|
13
11
|
|
|
14
12
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -28,14 +26,8 @@ const externalProps = {
|
|
|
28
26
|
const panelClassName = `${settings.prefix}--bmrg-header-switcher-panel`;
|
|
29
27
|
const contentClassName = `${settings.prefix}--bmrg-header-switcher`;
|
|
30
28
|
const skeletonClassName = `${settings.prefix}--bmrg-header-switcher__skeleton`;
|
|
31
|
-
function HeaderAppSwitcher({ baseServicesUrl, baseEnvUrl, id, isOpen, templateMeteringEvent, triggerEvent, userTeams }) {
|
|
29
|
+
function HeaderAppSwitcher({ baseServicesUrl, baseEnvUrl, id, isOpen, teamsQuery, templateMeteringEvent, triggerEvent, userTeams, }) {
|
|
32
30
|
const hasUserTeams = Boolean(userTeams);
|
|
33
|
-
const userTeamsUrl = servicesConfig.serviceUrl.getUserTeamsServices({ baseServicesUrl });
|
|
34
|
-
const teamsQuery = reactQuery.useQuery({
|
|
35
|
-
queryKey: userTeamsUrl,
|
|
36
|
-
queryFn: servicesConfig.resolver.query(userTeamsUrl, null),
|
|
37
|
-
enabled: !hasUserTeams
|
|
38
|
-
});
|
|
39
31
|
if (userTeams?.isLoading || teamsQuery?.isLoading) {
|
|
40
32
|
return (React__default.default.createElement(react.HeaderPanel, { "aria-label": "App Switcher", className: panelClassName, expanded: isOpen, id: id, role: "menu" },
|
|
41
33
|
React__default.default.createElement("div", { className: cx__default.default(contentClassName, "--is-loading", { "--is-hidden": !isOpen }) },
|
|
@@ -78,7 +70,7 @@ function HeaderAppSwitcher({ baseServicesUrl, baseEnvUrl, id, isOpen, templateMe
|
|
|
78
70
|
}
|
|
79
71
|
return null;
|
|
80
72
|
}
|
|
81
|
-
function TeamServiceListMenu({ baseEnvUrl, isAccount, isMember, team, templateMeteringEvent, triggerEvent }) {
|
|
73
|
+
function TeamServiceListMenu({ baseEnvUrl, isAccount, isMember, team, templateMeteringEvent, triggerEvent, }) {
|
|
82
74
|
const { name, displayName, services } = team;
|
|
83
75
|
const nameToDisplay = displayName ? displayName : name;
|
|
84
76
|
const isNameTruncated = nameToDisplay?.length > 30;
|