@backstage/plugin-user-settings 0.3.10 → 0.3.14
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/CHANGELOG.md +38 -0
- package/dist/index.d.ts +7 -3
- package/dist/index.esm.js +58 -34
- package/dist/index.esm.js.map +1 -1
- package/package.json +13 -13
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,43 @@
|
|
|
1
1
|
# @backstage/plugin-user-settings
|
|
2
2
|
|
|
3
|
+
## 0.3.14
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 2a374057f5: Fix undefined identity bug in UserSettingsProfileCard caused by using deprecated methods of the IdentityApi
|
|
8
|
+
- Updated dependencies
|
|
9
|
+
- @backstage/core-plugin-api@0.4.0
|
|
10
|
+
- @backstage/core-components@0.8.2
|
|
11
|
+
|
|
12
|
+
## 0.3.13
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- cd450844f6: Moved React dependencies to `peerDependencies` and allow both React v16 and v17 to be used.
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
- @backstage/core-components@0.8.0
|
|
19
|
+
- @backstage/core-plugin-api@0.3.0
|
|
20
|
+
|
|
21
|
+
## 0.3.12
|
|
22
|
+
|
|
23
|
+
### Patch Changes
|
|
24
|
+
|
|
25
|
+
- 9a1c8e92eb: The theme switcher now renders the title of themes instead of their variant
|
|
26
|
+
- Updated dependencies
|
|
27
|
+
- @backstage/core-components@0.7.6
|
|
28
|
+
- @backstage/theme@0.2.14
|
|
29
|
+
- @backstage/core-plugin-api@0.2.2
|
|
30
|
+
|
|
31
|
+
## 0.3.11
|
|
32
|
+
|
|
33
|
+
### Patch Changes
|
|
34
|
+
|
|
35
|
+
- a125278b81: Refactor out the deprecated path and icon from RouteRefs
|
|
36
|
+
- 274a4fc633: Add Props Icon for Sidebar Item SidebarSearchField and Settings
|
|
37
|
+
- Updated dependencies
|
|
38
|
+
- @backstage/core-components@0.7.4
|
|
39
|
+
- @backstage/core-plugin-api@0.2.0
|
|
40
|
+
|
|
3
41
|
## 0.3.10
|
|
4
42
|
|
|
5
43
|
### Patch Changes
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import * as _backstage_core_plugin_api from '@backstage/core-plugin-api';
|
|
3
|
-
import { IconComponent, ApiRef, SessionApi } from '@backstage/core-plugin-api';
|
|
3
|
+
import { IconComponent, ApiRef, SessionApi, ProfileInfo } from '@backstage/core-plugin-api';
|
|
4
4
|
|
|
5
5
|
declare const userSettingsPlugin: _backstage_core_plugin_api.BackstagePlugin<{
|
|
6
6
|
settingsPage: _backstage_core_plugin_api.RouteRef<undefined>;
|
|
@@ -9,7 +9,10 @@ declare const UserSettingsPage: ({ providerSettings }: {
|
|
|
9
9
|
providerSettings?: JSX.Element | undefined;
|
|
10
10
|
}) => JSX.Element;
|
|
11
11
|
|
|
12
|
-
declare
|
|
12
|
+
declare type SettingsProps = {
|
|
13
|
+
icon?: IconComponent;
|
|
14
|
+
};
|
|
15
|
+
declare const Settings: (props: SettingsProps) => JSX.Element;
|
|
13
16
|
|
|
14
17
|
declare type Props$4 = {
|
|
15
18
|
providerSettings?: JSX.Element;
|
|
@@ -54,8 +57,9 @@ declare const UserSettingsPinToggle: () => JSX.Element;
|
|
|
54
57
|
declare const UserSettingsFeatureFlags: () => JSX.Element;
|
|
55
58
|
|
|
56
59
|
declare const useUserProfile: () => {
|
|
57
|
-
profile:
|
|
60
|
+
profile: ProfileInfo;
|
|
58
61
|
displayName: string;
|
|
62
|
+
loading: boolean;
|
|
59
63
|
};
|
|
60
64
|
|
|
61
65
|
export { DefaultProviderSettings, ProviderSettingsItem, SettingsPage as Router, Settings, UserSettingsAppearanceCard, UserSettingsAuthProviders, UserSettingsFeatureFlags, UserSettingsGeneral, UserSettingsMenu, UserSettingsPage, UserSettingsPinToggle, UserSettingsProfileCard, UserSettingsSignInAvatar, UserSettingsThemeToggle, userSettingsPlugin as plugin, useUserProfile, userSettingsPlugin };
|
package/dist/index.esm.js
CHANGED
|
@@ -1,20 +1,19 @@
|
|
|
1
|
-
import { createRouteRef, createPlugin, createRoutableExtension, useApi, SessionState, googleAuthApiRef, microsoftAuthApiRef, githubAuthApiRef, gitlabAuthApiRef, auth0AuthApiRef, oktaAuthApiRef, bitbucketAuthApiRef, atlassianAuthApiRef, oauth2ApiRef, configApiRef, featureFlagsApiRef, FeatureFlagState, identityApiRef, appThemeApiRef } from '@backstage/core-plugin-api';
|
|
1
|
+
import { createRouteRef, createPlugin, createRoutableExtension, useRouteRef, useApi, SessionState, googleAuthApiRef, microsoftAuthApiRef, githubAuthApiRef, gitlabAuthApiRef, auth0AuthApiRef, oktaAuthApiRef, bitbucketAuthApiRef, atlassianAuthApiRef, oauth2ApiRef, configApiRef, featureFlagsApiRef, FeatureFlagState, identityApiRef, alertApiRef, appThemeApiRef } from '@backstage/core-plugin-api';
|
|
2
2
|
import React, { useState, useEffect, useCallback, useContext, cloneElement } from 'react';
|
|
3
3
|
import SettingsIcon from '@material-ui/icons/Settings';
|
|
4
4
|
import { SidebarItem, EmptyState, CodeSnippet, InfoCard, sidebarConfig, SidebarPinStateContext, Page, Header, TabbedLayout } from '@backstage/core-components';
|
|
5
5
|
import { Typography, Button, ListItem, ListItemIcon, ListItemText, Tooltip, ListItemSecondaryAction, List, Switch, Grid, TextField, IconButton, makeStyles, Avatar, Menu, MenuItem } from '@material-ui/core';
|
|
6
6
|
import Star from '@material-ui/icons/Star';
|
|
7
7
|
import ClearIcon from '@material-ui/icons/Clear';
|
|
8
|
+
import { useAsync, useObservable } from 'react-use';
|
|
8
9
|
import SignOutIcon from '@material-ui/icons/MeetingRoom';
|
|
9
10
|
import MoreVertIcon from '@material-ui/icons/MoreVert';
|
|
10
|
-
import { useObservable } from 'react-use';
|
|
11
11
|
import AutoIcon from '@material-ui/icons/BrightnessAuto';
|
|
12
12
|
import ToggleButton from '@material-ui/lab/ToggleButton';
|
|
13
13
|
import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';
|
|
14
14
|
|
|
15
15
|
const settingsRouteRef = createRouteRef({
|
|
16
|
-
|
|
17
|
-
title: "Settings"
|
|
16
|
+
id: "user-settings"
|
|
18
17
|
});
|
|
19
18
|
const userSettingsPlugin = createPlugin({
|
|
20
19
|
id: "user-settings",
|
|
@@ -28,11 +27,13 @@ const UserSettingsPage = userSettingsPlugin.provide(createRoutableExtension({
|
|
|
28
27
|
mountPoint: settingsRouteRef
|
|
29
28
|
}));
|
|
30
29
|
|
|
31
|
-
const Settings = () => {
|
|
30
|
+
const Settings = (props) => {
|
|
31
|
+
const routePath = useRouteRef(settingsRouteRef);
|
|
32
|
+
const Icon = props.icon ? props.icon : SettingsIcon;
|
|
32
33
|
return /* @__PURE__ */ React.createElement(SidebarItem, {
|
|
33
34
|
text: "Settings",
|
|
34
|
-
to:
|
|
35
|
-
icon:
|
|
35
|
+
to: routePath(),
|
|
36
|
+
icon: Icon
|
|
36
37
|
});
|
|
37
38
|
};
|
|
38
39
|
|
|
@@ -54,7 +55,7 @@ const EmptyProviders = () => /* @__PURE__ */ React.createElement(EmptyState, {
|
|
|
54
55
|
language: "yaml",
|
|
55
56
|
showLineNumbers: true,
|
|
56
57
|
highlightedNumbers: [3, 4, 5, 6, 7, 8],
|
|
57
|
-
customStyle: {background: "inherit", fontSize: "115%"}
|
|
58
|
+
customStyle: { background: "inherit", fontSize: "115%" }
|
|
58
59
|
}), /* @__PURE__ */ React.createElement(Button, {
|
|
59
60
|
variant: "contained",
|
|
60
61
|
color: "primary",
|
|
@@ -89,7 +90,7 @@ const ProviderSettingsItem = ({
|
|
|
89
90
|
arrow: true,
|
|
90
91
|
title: description
|
|
91
92
|
}, /* @__PURE__ */ React.createElement("span", null, description)),
|
|
92
|
-
secondaryTypographyProps: {noWrap: true, style: {width: "80%"}}
|
|
93
|
+
secondaryTypographyProps: { noWrap: true, style: { width: "80%" } }
|
|
93
94
|
}), /* @__PURE__ */ React.createElement(ListItemSecondaryAction, null, /* @__PURE__ */ React.createElement(Tooltip, {
|
|
94
95
|
placement: "top",
|
|
95
96
|
arrow: true,
|
|
@@ -101,7 +102,7 @@ const ProviderSettingsItem = ({
|
|
|
101
102
|
}, signedIn ? `Sign out` : `Sign in`))));
|
|
102
103
|
};
|
|
103
104
|
|
|
104
|
-
const DefaultProviderSettings = ({configuredProviders}) => /* @__PURE__ */ React.createElement(React.Fragment, null, configuredProviders.includes("google") && /* @__PURE__ */ React.createElement(ProviderSettingsItem, {
|
|
105
|
+
const DefaultProviderSettings = ({ configuredProviders }) => /* @__PURE__ */ React.createElement(React.Fragment, null, configuredProviders.includes("google") && /* @__PURE__ */ React.createElement(ProviderSettingsItem, {
|
|
105
106
|
title: "Google",
|
|
106
107
|
description: "Provides authentication towards Google APIs and identities",
|
|
107
108
|
apiRef: googleAuthApiRef,
|
|
@@ -148,7 +149,7 @@ const DefaultProviderSettings = ({configuredProviders}) => /* @__PURE__ */ React
|
|
|
148
149
|
icon: Star
|
|
149
150
|
}));
|
|
150
151
|
|
|
151
|
-
const UserSettingsAuthProviders = ({providerSettings}) => {
|
|
152
|
+
const UserSettingsAuthProviders = ({ providerSettings }) => {
|
|
152
153
|
const configApi = useApi(configApiRef);
|
|
153
154
|
const providersConfig = configApi.getOptionalConfig("auth.providers");
|
|
154
155
|
const configuredProviders = (providersConfig == null ? void 0 : providersConfig.keys()) || [];
|
|
@@ -185,7 +186,7 @@ const EmptyFlags = () => /* @__PURE__ */ React.createElement(EmptyState, {
|
|
|
185
186
|
language: "typescript",
|
|
186
187
|
showLineNumbers: true,
|
|
187
188
|
highlightedNumbers: [6],
|
|
188
|
-
customStyle: {background: "inherit", fontSize: "115%"}
|
|
189
|
+
customStyle: { background: "inherit", fontSize: "115%" }
|
|
189
190
|
}), /* @__PURE__ */ React.createElement(Button, {
|
|
190
191
|
variant: "contained",
|
|
191
192
|
color: "primary",
|
|
@@ -193,7 +194,7 @@ const EmptyFlags = () => /* @__PURE__ */ React.createElement(EmptyState, {
|
|
|
193
194
|
}, "Read More"))
|
|
194
195
|
});
|
|
195
196
|
|
|
196
|
-
const FlagItem = ({flag, enabled, toggleHandler}) => /* @__PURE__ */ React.createElement(ListItem, {
|
|
197
|
+
const FlagItem = ({ flag, enabled, toggleHandler }) => /* @__PURE__ */ React.createElement(ListItem, {
|
|
197
198
|
divider: true,
|
|
198
199
|
button: true,
|
|
199
200
|
onClick: () => toggleHandler(flag.name)
|
|
@@ -213,14 +214,14 @@ const FlagItem = ({flag, enabled, toggleHandler}) => /* @__PURE__ */ React.creat
|
|
|
213
214
|
const UserSettingsFeatureFlags = () => {
|
|
214
215
|
const featureFlagsApi = useApi(featureFlagsApiRef);
|
|
215
216
|
const featureFlags = featureFlagsApi.getRegisteredFlags();
|
|
216
|
-
const initialFlagState = Object.fromEntries(featureFlags.map(({name}) => [name, featureFlagsApi.isActive(name)]));
|
|
217
|
+
const initialFlagState = Object.fromEntries(featureFlags.map(({ name }) => [name, featureFlagsApi.isActive(name)]));
|
|
217
218
|
const [state, setState] = useState(initialFlagState);
|
|
218
219
|
const [filterInput, setFilterInput] = useState("");
|
|
219
220
|
const inputRef = React.useRef();
|
|
220
221
|
const toggleFlag = useCallback((flagName) => {
|
|
221
222
|
const newState = featureFlagsApi.isActive(flagName) ? FeatureFlagState.None : FeatureFlagState.Active;
|
|
222
223
|
featureFlagsApi.save({
|
|
223
|
-
states: {[flagName]: newState},
|
|
224
|
+
states: { [flagName]: newState },
|
|
224
225
|
merge: true
|
|
225
226
|
});
|
|
226
227
|
setState((prevState) => ({
|
|
@@ -241,7 +242,7 @@ const UserSettingsFeatureFlags = () => {
|
|
|
241
242
|
filterInputParts.forEach((part) => filteredFeatureFlags = filteredFeatureFlags.filter((featureFlag) => featureFlag.name.toLocaleLowerCase("en-US").includes(part)));
|
|
242
243
|
const Header = () => /* @__PURE__ */ React.createElement(Grid, {
|
|
243
244
|
container: true,
|
|
244
|
-
style: {justifyContent: "space-between"}
|
|
245
|
+
style: { justifyContent: "space-between" }
|
|
245
246
|
}, /* @__PURE__ */ React.createElement(Grid, {
|
|
246
247
|
item: true,
|
|
247
248
|
xs: 6,
|
|
@@ -254,7 +255,7 @@ const UserSettingsFeatureFlags = () => {
|
|
|
254
255
|
md: 4
|
|
255
256
|
}, /* @__PURE__ */ React.createElement(TextField, {
|
|
256
257
|
label: "Filter",
|
|
257
|
-
style: {display: "flex", justifyContent: "flex-end"},
|
|
258
|
+
style: { display: "flex", justifyContent: "flex-end" },
|
|
258
259
|
inputRef: (ref) => ref && ref.focus(),
|
|
259
260
|
InputProps: {
|
|
260
261
|
...filterInput.length && {
|
|
@@ -286,24 +287,47 @@ const UserSettingsFeatureFlags = () => {
|
|
|
286
287
|
const useUserProfile = () => {
|
|
287
288
|
var _a;
|
|
288
289
|
const identityApi = useApi(identityApiRef);
|
|
289
|
-
const
|
|
290
|
-
const
|
|
291
|
-
|
|
292
|
-
|
|
290
|
+
const alertApi = useApi(alertApiRef);
|
|
291
|
+
const { value, loading, error } = useAsync(async () => {
|
|
292
|
+
return {
|
|
293
|
+
profile: await identityApi.getProfileInfo(),
|
|
294
|
+
identity: await identityApi.getBackstageIdentity()
|
|
295
|
+
};
|
|
296
|
+
}, []);
|
|
297
|
+
useEffect(() => {
|
|
298
|
+
if (error) {
|
|
299
|
+
alertApi.post({
|
|
300
|
+
message: `Failed to load user identity: ${error}`,
|
|
301
|
+
severity: "error"
|
|
302
|
+
});
|
|
303
|
+
}
|
|
304
|
+
}, [error, alertApi]);
|
|
305
|
+
if (loading || error) {
|
|
306
|
+
return {
|
|
307
|
+
profile: {},
|
|
308
|
+
displayName: "",
|
|
309
|
+
loading
|
|
310
|
+
};
|
|
311
|
+
}
|
|
312
|
+
return {
|
|
313
|
+
profile: value.profile,
|
|
314
|
+
displayName: (_a = value.profile.displayName) != null ? _a : value.identity.userEntityRef,
|
|
315
|
+
loading
|
|
316
|
+
};
|
|
293
317
|
};
|
|
294
318
|
|
|
295
319
|
const useStyles$1 = makeStyles((theme) => ({
|
|
296
320
|
avatar: {
|
|
297
|
-
width: ({size}) => size,
|
|
298
|
-
height: ({size}) => size,
|
|
299
|
-
fontSize: ({size}) => size * 0.7,
|
|
321
|
+
width: ({ size }) => size,
|
|
322
|
+
height: ({ size }) => size,
|
|
323
|
+
fontSize: ({ size }) => size * 0.7,
|
|
300
324
|
border: `1px solid ${theme.palette.textSubtle}`
|
|
301
325
|
}
|
|
302
326
|
}));
|
|
303
|
-
const UserSettingsSignInAvatar = ({size}) => {
|
|
304
|
-
const {iconSize} = sidebarConfig;
|
|
305
|
-
const classes = useStyles$1(size ? {size} : {size: iconSize});
|
|
306
|
-
const {profile} = useUserProfile();
|
|
327
|
+
const UserSettingsSignInAvatar = ({ size }) => {
|
|
328
|
+
const { iconSize } = sidebarConfig;
|
|
329
|
+
const classes = useStyles$1(size ? { size } : { size: iconSize });
|
|
330
|
+
const { profile } = useUserProfile();
|
|
307
331
|
return /* @__PURE__ */ React.createElement(Avatar, {
|
|
308
332
|
src: profile.picture,
|
|
309
333
|
className: classes.avatar
|
|
@@ -337,7 +361,7 @@ const UserSettingsMenu = () => {
|
|
|
337
361
|
};
|
|
338
362
|
|
|
339
363
|
const UserSettingsProfileCard = () => {
|
|
340
|
-
const {profile, displayName} = useUserProfile();
|
|
364
|
+
const { profile, displayName } = useUserProfile();
|
|
341
365
|
return /* @__PURE__ */ React.createElement(InfoCard, {
|
|
342
366
|
title: "Profile",
|
|
343
367
|
variant: "gridItem"
|
|
@@ -374,7 +398,7 @@ const UserSettingsProfileCard = () => {
|
|
|
374
398
|
};
|
|
375
399
|
|
|
376
400
|
const UserSettingsPinToggle = () => {
|
|
377
|
-
const {isPinned, toggleSidebarPinState} = useContext(SidebarPinStateContext);
|
|
401
|
+
const { isPinned, toggleSidebarPinState } = useContext(SidebarPinStateContext);
|
|
378
402
|
return /* @__PURE__ */ React.createElement(ListItem, null, /* @__PURE__ */ React.createElement(ListItemText, {
|
|
379
403
|
primary: "Pin Sidebar",
|
|
380
404
|
secondary: "Prevent the sidebar from collapsing"
|
|
@@ -387,11 +411,11 @@ const UserSettingsPinToggle = () => {
|
|
|
387
411
|
checked: isPinned,
|
|
388
412
|
onChange: () => toggleSidebarPinState(),
|
|
389
413
|
name: "pin",
|
|
390
|
-
inputProps: {"aria-label": "Pin Sidebar Switch"}
|
|
414
|
+
inputProps: { "aria-label": "Pin Sidebar Switch" }
|
|
391
415
|
}))));
|
|
392
416
|
};
|
|
393
417
|
|
|
394
|
-
const ThemeIcon = ({id, activeId, icon}) => icon ? cloneElement(icon, {
|
|
418
|
+
const ThemeIcon = ({ id, activeId, icon }) => icon ? cloneElement(icon, {
|
|
395
419
|
color: activeId === id ? "primary" : void 0
|
|
396
420
|
}) : /* @__PURE__ */ React.createElement(AutoIcon, {
|
|
397
421
|
color: activeId === id ? "primary" : void 0
|
|
@@ -463,7 +487,7 @@ const UserSettingsThemeToggle = () => {
|
|
|
463
487
|
key: theme.id,
|
|
464
488
|
title: `Select ${theme.title}`,
|
|
465
489
|
value: theme.id
|
|
466
|
-
}, /* @__PURE__ */ React.createElement(React.Fragment, null, theme.
|
|
490
|
+
}, /* @__PURE__ */ React.createElement(React.Fragment, null, theme.title, "\xA0", /* @__PURE__ */ React.createElement(ThemeIcon, {
|
|
467
491
|
id: theme.id,
|
|
468
492
|
icon: themeIcon,
|
|
469
493
|
activeId: themeId
|
|
@@ -503,7 +527,7 @@ const UserSettingsGeneral = () => {
|
|
|
503
527
|
}, /* @__PURE__ */ React.createElement(UserSettingsAppearanceCard, null)));
|
|
504
528
|
};
|
|
505
529
|
|
|
506
|
-
const SettingsPage = ({providerSettings}) => {
|
|
530
|
+
const SettingsPage = ({ providerSettings }) => {
|
|
507
531
|
return /* @__PURE__ */ React.createElement(Page, {
|
|
508
532
|
themeId: "home"
|
|
509
533
|
}, /* @__PURE__ */ React.createElement(Header, {
|
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":["../src/plugin.ts","../src/components/Settings.tsx","../src/components/AuthProviders/EmptyProviders.tsx","../src/components/AuthProviders/ProviderSettingsItem.tsx","../src/components/AuthProviders/DefaultProviderSettings.tsx","../src/components/AuthProviders/UserSettingsAuthProviders.tsx","../src/components/FeatureFlags/EmptyFlags.tsx","../src/components/FeatureFlags/FeatureFlagsItem.tsx","../src/components/FeatureFlags/UserSettingsFeatureFlags.tsx","../src/components/useUserProfileInfo.ts","../src/components/General/UserSettingsSignInAvatar.tsx","../src/components/General/UserSettingsMenu.tsx","../src/components/General/UserSettingsProfileCard.tsx","../src/components/General/UserSettingsPinToggle.tsx","../src/components/General/UserSettingsThemeToggle.tsx","../src/components/General/UserSettingsAppearanceCard.tsx","../src/components/General/UserSettingsGeneral.tsx","../src/components/SettingsPage.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n createPlugin,\n createRoutableExtension,\n createRouteRef,\n} from '@backstage/core-plugin-api';\n\nexport const settingsRouteRef = createRouteRef({\n path: '/settings',\n title: 'Settings',\n});\n\nexport const userSettingsPlugin = createPlugin({\n id: 'user-settings',\n routes: {\n settingsPage: settingsRouteRef,\n },\n});\n\nexport const UserSettingsPage = userSettingsPlugin.provide(\n createRoutableExtension({\n name: 'UserSettingsPage',\n component: () =>\n import('./components/SettingsPage').then(m => m.SettingsPage),\n mountPoint: settingsRouteRef,\n }),\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport { settingsRouteRef } from '../plugin';\nimport { SidebarItem } from '@backstage/core-components';\n\nexport const Settings = () => {\n return (\n <SidebarItem\n text=\"Settings\"\n to={settingsRouteRef.path}\n icon={SettingsIcon}\n />\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { Button, Typography } from '@material-ui/core';\nimport { CodeSnippet, EmptyState } from '@backstage/core-components';\n\nconst EXAMPLE = `auth:\n providers:\n google:\n development:\n clientId: \\${AUTH_GOOGLE_CLIENT_ID}\n clientSecret: \\${AUTH_GOOGLE_CLIENT_SECRET}\n`;\n\nexport const EmptyProviders = () => (\n <EmptyState\n missing=\"content\"\n title=\"No Authentication Providers\"\n description=\"You can add Authentication Providers to Backstage which allows you to use these providers to authenticate yourself.\"\n action={\n <>\n <Typography variant=\"body1\">\n Open <code>app-config.yaml</code> and make the changes as highlighted\n below:\n </Typography>\n <CodeSnippet\n text={EXAMPLE}\n language=\"yaml\"\n showLineNumbers\n highlightedNumbers={[3, 4, 5, 6, 7, 8]}\n customStyle={{ background: 'inherit', fontSize: '115%' }}\n />\n <Button\n variant=\"contained\"\n color=\"primary\"\n href=\"https://backstage.io/docs/auth/add-auth-provider\"\n >\n Read More\n </Button>\n </>\n }\n />\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React, { useEffect, useState } from 'react';\nimport {\n Button,\n ListItem,\n ListItemIcon,\n ListItemSecondaryAction,\n ListItemText,\n Tooltip,\n} from '@material-ui/core';\nimport {\n ApiRef,\n SessionApi,\n useApi,\n IconComponent,\n SessionState,\n} from '@backstage/core-plugin-api';\n\ntype Props = {\n title: string;\n description: string;\n icon: IconComponent;\n apiRef: ApiRef<SessionApi>;\n};\n\nexport const ProviderSettingsItem = ({\n title,\n description,\n icon: Icon,\n apiRef,\n}: Props) => {\n const api = useApi(apiRef);\n const [signedIn, setSignedIn] = useState(false);\n\n useEffect(() => {\n let didCancel = false;\n\n const subscription = api\n .sessionState$()\n .subscribe((sessionState: SessionState) => {\n if (!didCancel) {\n setSignedIn(sessionState === SessionState.SignedIn);\n }\n });\n\n return () => {\n didCancel = true;\n subscription.unsubscribe();\n };\n }, [api]);\n\n return (\n <ListItem>\n <ListItemIcon>\n <Icon />\n </ListItemIcon>\n <ListItemText\n primary={title}\n secondary={\n <Tooltip placement=\"top\" arrow title={description}>\n <span>{description}</span>\n </Tooltip>\n }\n secondaryTypographyProps={{ noWrap: true, style: { width: '80%' } }}\n />\n <ListItemSecondaryAction>\n <Tooltip\n placement=\"top\"\n arrow\n title={signedIn ? `Sign out from ${title}` : `Sign in to ${title}`}\n >\n <Button\n variant=\"outlined\"\n color=\"primary\"\n onClick={() => (signedIn ? api.signOut() : api.signIn())}\n >\n {signedIn ? `Sign out` : `Sign in`}\n </Button>\n </Tooltip>\n </ListItemSecondaryAction>\n </ListItem>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport Star from '@material-ui/icons/Star';\nimport React from 'react';\nimport { ProviderSettingsItem } from './ProviderSettingsItem';\nimport {\n auth0AuthApiRef,\n githubAuthApiRef,\n gitlabAuthApiRef,\n googleAuthApiRef,\n oauth2ApiRef,\n oktaAuthApiRef,\n microsoftAuthApiRef,\n bitbucketAuthApiRef,\n atlassianAuthApiRef,\n} from '@backstage/core-plugin-api';\n\ntype Props = {\n configuredProviders: string[];\n};\n\nexport const DefaultProviderSettings = ({ configuredProviders }: Props) => (\n <>\n {configuredProviders.includes('google') && (\n <ProviderSettingsItem\n title=\"Google\"\n description=\"Provides authentication towards Google APIs and identities\"\n apiRef={googleAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('microsoft') && (\n <ProviderSettingsItem\n title=\"Microsoft\"\n description=\"Provides authentication towards Microsoft APIs and identities\"\n apiRef={microsoftAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('github') && (\n <ProviderSettingsItem\n title=\"GitHub\"\n description=\"Provides authentication towards GitHub APIs\"\n apiRef={githubAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('gitlab') && (\n <ProviderSettingsItem\n title=\"GitLab\"\n description=\"Provides authentication towards GitLab APIs\"\n apiRef={gitlabAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('auth0') && (\n <ProviderSettingsItem\n title=\"Auth0\"\n description=\"Provides authentication towards Auth0 APIs\"\n apiRef={auth0AuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('okta') && (\n <ProviderSettingsItem\n title=\"Okta\"\n description=\"Provides authentication towards Okta APIs\"\n apiRef={oktaAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('bitbucket') && (\n <ProviderSettingsItem\n title=\"Bitbucket\"\n description=\"Provides authentication towards Bitbucket APIs\"\n apiRef={bitbucketAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('atlassian') && (\n <ProviderSettingsItem\n title=\"Atlassian\"\n description=\"Provides authentication towards Atlassian APIs\"\n apiRef={atlassianAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('oauth2') && (\n <ProviderSettingsItem\n title=\"YourOrg\"\n description=\"Example of how to use oauth2 custom provider\"\n apiRef={oauth2ApiRef}\n icon={Star}\n />\n )}\n </>\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { List } from '@material-ui/core';\nimport { EmptyProviders } from './EmptyProviders';\nimport { DefaultProviderSettings } from './DefaultProviderSettings';\n\nimport { configApiRef, useApi } from '@backstage/core-plugin-api';\nimport { InfoCard } from '@backstage/core-components';\n\ntype Props = {\n providerSettings?: JSX.Element;\n};\n\nexport const UserSettingsAuthProviders = ({ providerSettings }: Props) => {\n const configApi = useApi(configApiRef);\n const providersConfig = configApi.getOptionalConfig('auth.providers');\n const configuredProviders = providersConfig?.keys() || [];\n const providers = providerSettings ?? (\n <DefaultProviderSettings configuredProviders={configuredProviders} />\n );\n\n if (!providerSettings && !configuredProviders?.length) {\n return <EmptyProviders />;\n }\n\n return (\n <InfoCard title=\"Available Providers\">\n <List dense>{providers}</List>\n </InfoCard>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { Button, Typography } from '@material-ui/core';\nimport { CodeSnippet, EmptyState } from '@backstage/core-components';\n\nconst EXAMPLE = `import { createPlugin } from '@backstage/core-plugin-api';\n\nexport default createPlugin({\n id: 'plugin-name',\n register({ router, featureFlags }) {\n featureFlags.register('enable-example-feature');\n },\n});\n`;\n\nexport const EmptyFlags = () => (\n <EmptyState\n missing=\"content\"\n title=\"No Feature Flags\"\n description=\"Feature Flags make it possible for plugins to register features in Backstage for users to opt into. You can use this to split out logic in your code for manual A/B testing, etc.\"\n action={\n <>\n <Typography variant=\"body1\">\n An example for how to add a feature flag is highlighted below:\n </Typography>\n <CodeSnippet\n text={EXAMPLE}\n language=\"typescript\"\n showLineNumbers\n highlightedNumbers={[6]}\n customStyle={{ background: 'inherit', fontSize: '115%' }}\n />\n <Button\n variant=\"contained\"\n color=\"primary\"\n href=\"https://backstage.io/docs/api/utility-apis\"\n >\n Read More\n </Button>\n </>\n }\n />\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n ListItem,\n ListItemText,\n ListItemIcon,\n Switch,\n Tooltip,\n} from '@material-ui/core';\nimport { FeatureFlag } from '@backstage/core-plugin-api';\n\ntype Props = {\n flag: FeatureFlag;\n enabled: boolean;\n toggleHandler: Function;\n};\n\nexport const FlagItem = ({ flag, enabled, toggleHandler }: Props) => (\n <ListItem divider button onClick={() => toggleHandler(flag.name)}>\n <ListItemIcon>\n <Tooltip placement=\"top\" arrow title={enabled ? 'Disable' : 'Enable'}>\n <Switch color=\"primary\" checked={enabled} name={flag.name} />\n </Tooltip>\n </ListItemIcon>\n <ListItemText\n primary={flag.name}\n secondary={`Registered in ${flag.pluginId} plugin`}\n />\n </ListItem>\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useCallback, useState } from 'react';\nimport {\n List,\n TextField,\n IconButton,\n Grid,\n Typography,\n} from '@material-ui/core';\nimport { EmptyFlags } from './EmptyFlags';\nimport { FlagItem } from './FeatureFlagsItem';\n\nimport {\n featureFlagsApiRef,\n FeatureFlagState,\n useApi,\n} from '@backstage/core-plugin-api';\nimport { InfoCard } from '@backstage/core-components';\nimport ClearIcon from '@material-ui/icons/Clear';\n\nexport const UserSettingsFeatureFlags = () => {\n const featureFlagsApi = useApi(featureFlagsApiRef);\n const featureFlags = featureFlagsApi.getRegisteredFlags();\n\n const initialFlagState = Object.fromEntries(\n featureFlags.map(({ name }) => [name, featureFlagsApi.isActive(name)]),\n );\n\n const [state, setState] = useState<Record<string, boolean>>(initialFlagState);\n const [filterInput, setFilterInput] = useState<string>('');\n const inputRef = React.useRef<HTMLElement>();\n\n const toggleFlag = useCallback(\n (flagName: string) => {\n const newState = featureFlagsApi.isActive(flagName)\n ? FeatureFlagState.None\n : FeatureFlagState.Active;\n\n featureFlagsApi.save({\n states: { [flagName]: newState },\n merge: true,\n });\n\n setState(prevState => ({\n ...prevState,\n [flagName]: newState === FeatureFlagState.Active,\n }));\n },\n [featureFlagsApi],\n );\n\n if (!featureFlags.length) {\n return <EmptyFlags />;\n }\n\n const clearFilterInput = () => {\n setFilterInput('');\n inputRef?.current?.focus();\n };\n\n let filteredFeatureFlags = Array.from(featureFlags);\n\n const filterInputParts = filterInput\n .split(/\\s/)\n .map(part => part.trim().toLocaleLowerCase('en-US'));\n\n filterInputParts.forEach(\n part =>\n (filteredFeatureFlags = filteredFeatureFlags.filter(featureFlag =>\n featureFlag.name.toLocaleLowerCase('en-US').includes(part),\n )),\n );\n\n const Header = () => (\n <Grid container style={{ justifyContent: 'space-between' }}>\n <Grid item xs={6} md={8}>\n <Typography variant=\"h5\">Feature Flags</Typography>\n </Grid>\n {featureFlags.length >= 10 && (\n <Grid item xs={6} md={4}>\n <TextField\n label=\"Filter\"\n style={{ display: 'flex', justifyContent: 'flex-end' }}\n inputRef={ref => ref && ref.focus()}\n InputProps={{\n ...(filterInput.length && {\n endAdornment: (\n <IconButton\n aria-label=\"Clear filter\"\n onClick={clearFilterInput}\n edge=\"end\"\n >\n <ClearIcon />\n </IconButton>\n ),\n }),\n }}\n onChange={e => setFilterInput(e.target.value)}\n value={filterInput}\n />\n </Grid>\n )}\n </Grid>\n );\n\n return (\n <InfoCard title={<Header />}>\n <List dense>\n {filteredFeatureFlags.map(featureFlag => {\n const enabled = Boolean(state[featureFlag.name]);\n\n return (\n <FlagItem\n key={featureFlag.name}\n flag={featureFlag}\n enabled={enabled}\n toggleHandler={toggleFlag}\n />\n );\n })}\n </List>\n </InfoCard>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useApi, identityApiRef } from '@backstage/core-plugin-api';\n\nexport const useUserProfile = () => {\n const identityApi = useApi(identityApiRef);\n const userId = identityApi.getUserId();\n const profile = identityApi.getProfile();\n const displayName = profile.displayName ?? userId;\n\n return { profile, displayName };\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { BackstageTheme } from '@backstage/theme';\nimport { makeStyles, Avatar } from '@material-ui/core';\nimport { useUserProfile } from '../useUserProfileInfo';\nimport { sidebarConfig } from '@backstage/core-components';\n\nconst useStyles = makeStyles<BackstageTheme, { size: number }>(theme => ({\n avatar: {\n width: ({ size }) => size,\n height: ({ size }) => size,\n fontSize: ({ size }) => size * 0.7,\n border: `1px solid ${theme.palette.textSubtle}`,\n },\n}));\n\ntype Props = { size?: number };\n\nexport const UserSettingsSignInAvatar = ({ size }: Props) => {\n const { iconSize } = sidebarConfig;\n const classes = useStyles(size ? { size } : { size: iconSize });\n const { profile } = useUserProfile();\n\n return <Avatar src={profile.picture} className={classes.avatar} />;\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { IconButton, ListItemIcon, Menu, MenuItem } from '@material-ui/core';\nimport SignOutIcon from '@material-ui/icons/MeetingRoom';\nimport MoreVertIcon from '@material-ui/icons/MoreVert';\nimport { identityApiRef, useApi } from '@backstage/core-plugin-api';\n\nexport const UserSettingsMenu = () => {\n const identityApi = useApi(identityApiRef);\n const [open, setOpen] = React.useState(false);\n const [anchorEl, setAnchorEl] = React.useState<undefined | HTMLElement>(\n undefined,\n );\n\n const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\n setAnchorEl(event.currentTarget);\n setOpen(true);\n };\n\n const handleClose = () => {\n setAnchorEl(undefined);\n setOpen(false);\n };\n\n return (\n <>\n <IconButton\n data-testid=\"user-settings-menu\"\n aria-label=\"more\"\n onClick={handleOpen}\n >\n <MoreVertIcon />\n </IconButton>\n <Menu anchorEl={anchorEl} open={open} onClose={handleClose}>\n <MenuItem data-testid=\"sign-out\" onClick={() => identityApi.signOut()}>\n <ListItemIcon>\n <SignOutIcon />\n </ListItemIcon>\n Sign Out\n </MenuItem>\n </Menu>\n </>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { Grid, Typography } from '@material-ui/core';\nimport React from 'react';\nimport { UserSettingsSignInAvatar } from './UserSettingsSignInAvatar';\nimport { UserSettingsMenu } from './UserSettingsMenu';\nimport { useUserProfile } from '../useUserProfileInfo';\nimport { InfoCard } from '@backstage/core-components';\n\nexport const UserSettingsProfileCard = () => {\n const { profile, displayName } = useUserProfile();\n\n return (\n <InfoCard title=\"Profile\" variant=\"gridItem\">\n <Grid container spacing={6}>\n <Grid item>\n <UserSettingsSignInAvatar size={96} />\n </Grid>\n <Grid item xs={12} sm container>\n <Grid item xs container direction=\"column\" spacing={2}>\n <Grid item xs>\n <Typography variant=\"subtitle1\" gutterBottom>\n {displayName}\n </Typography>\n <Typography variant=\"body2\" color=\"textSecondary\">\n {profile.email}\n </Typography>\n </Grid>\n </Grid>\n <Grid item>\n <UserSettingsMenu />\n </Grid>\n </Grid>\n </Grid>\n </InfoCard>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useContext } from 'react';\nimport {\n ListItem,\n ListItemSecondaryAction,\n ListItemText,\n Switch,\n Tooltip,\n} from '@material-ui/core';\nimport { SidebarPinStateContext } from '@backstage/core-components';\n\nexport const UserSettingsPinToggle = () => {\n const { isPinned, toggleSidebarPinState } = useContext(\n SidebarPinStateContext,\n );\n\n return (\n <ListItem>\n <ListItemText\n primary=\"Pin Sidebar\"\n secondary=\"Prevent the sidebar from collapsing\"\n />\n <ListItemSecondaryAction>\n <Tooltip\n placement=\"top\"\n arrow\n title={`${isPinned ? 'Unpin' : 'Pin'} Sidebar`}\n >\n <Switch\n color=\"primary\"\n checked={isPinned}\n onChange={() => toggleSidebarPinState()}\n name=\"pin\"\n inputProps={{ 'aria-label': 'Pin Sidebar Switch' }}\n />\n </Tooltip>\n </ListItemSecondaryAction>\n </ListItem>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { cloneElement } from 'react';\nimport { useObservable } from 'react-use';\nimport AutoIcon from '@material-ui/icons/BrightnessAuto';\nimport ToggleButton from '@material-ui/lab/ToggleButton';\nimport ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';\nimport {\n ListItem,\n ListItemText,\n ListItemSecondaryAction,\n Tooltip,\n makeStyles,\n} from '@material-ui/core';\nimport { appThemeApiRef, useApi } from '@backstage/core-plugin-api';\n\ntype ThemeIconProps = {\n id: string;\n activeId: string | undefined;\n icon: JSX.Element | undefined;\n};\n\nconst ThemeIcon = ({ id, activeId, icon }: ThemeIconProps) =>\n icon ? (\n cloneElement(icon, {\n color: activeId === id ? 'primary' : undefined,\n })\n ) : (\n <AutoIcon color={activeId === id ? 'primary' : undefined} />\n );\n\ntype TooltipToggleButtonProps = {\n children: JSX.Element;\n title: string;\n value: string;\n};\n\nconst useStyles = makeStyles(theme => ({\n list: {\n [theme.breakpoints.down('xs')]: {\n padding: `0 0 12px`,\n },\n },\n listItemText: {\n [theme.breakpoints.down('xs')]: {\n paddingRight: 0,\n paddingLeft: 0,\n },\n },\n listItemSecondaryAction: {\n [theme.breakpoints.down('xs')]: {\n width: '100%',\n top: 'auto',\n right: 'auto',\n position: 'relative',\n transform: 'unset',\n },\n },\n}));\n\n// ToggleButtonGroup uses React.children.map instead of context\n// so wrapping with Tooltip breaks ToggleButton functionality.\nconst TooltipToggleButton = ({\n children,\n title,\n value,\n ...props\n}: TooltipToggleButtonProps) => (\n <Tooltip placement=\"top\" arrow title={title}>\n <ToggleButton value={value} {...props}>\n {children}\n </ToggleButton>\n </Tooltip>\n);\n\nexport const UserSettingsThemeToggle = () => {\n const classes = useStyles();\n const appThemeApi = useApi(appThemeApiRef);\n const themeId = useObservable(\n appThemeApi.activeThemeId$(),\n appThemeApi.getActiveThemeId(),\n );\n\n const themeIds = appThemeApi.getInstalledThemes();\n\n const handleSetTheme = (\n _event: React.MouseEvent<HTMLElement>,\n newThemeId: string | undefined,\n ) => {\n if (themeIds.some(t => t.id === newThemeId)) {\n appThemeApi.setActiveThemeId(newThemeId);\n } else {\n appThemeApi.setActiveThemeId(undefined);\n }\n };\n\n return (\n <ListItem className={classes.list}>\n <ListItemText\n className={classes.listItemText}\n primary=\"Theme\"\n secondary=\"Change the theme mode\"\n />\n <ListItemSecondaryAction className={classes.listItemSecondaryAction}>\n <ToggleButtonGroup\n exclusive\n size=\"small\"\n value={themeId ?? 'auto'}\n onChange={handleSetTheme}\n >\n {themeIds.map(theme => {\n const themeIcon = themeIds.find(t => t.id === theme.id)?.icon;\n return (\n <TooltipToggleButton\n key={theme.id}\n title={`Select ${theme.title}`}\n value={theme.id}\n >\n <>\n {theme.variant} \n <ThemeIcon\n id={theme.id}\n icon={themeIcon}\n activeId={themeId}\n />\n </>\n </TooltipToggleButton>\n );\n })}\n <Tooltip placement=\"top\" arrow title=\"Select auto theme\">\n <ToggleButton value=\"auto\" selected={themeId === undefined}>\n Auto \n <AutoIcon color={themeId === undefined ? 'primary' : undefined} />\n </ToggleButton>\n </Tooltip>\n </ToggleButtonGroup>\n </ListItemSecondaryAction>\n </ListItem>\n );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\nimport { List } from '@material-ui/core';\nimport { InfoCard } from '@backstage/core-components';\nimport { UserSettingsPinToggle } from './UserSettingsPinToggle';\nimport { UserSettingsThemeToggle } from './UserSettingsThemeToggle';\n\nexport const UserSettingsAppearanceCard = () => (\n <InfoCard title=\"Appearance\" variant=\"gridItem\">\n <List dense>\n <UserSettingsThemeToggle />\n <UserSettingsPinToggle />\n </List>\n </InfoCard>\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { Grid } from '@material-ui/core';\nimport React from 'react';\nimport { UserSettingsProfileCard } from './UserSettingsProfileCard';\nimport { UserSettingsAppearanceCard } from './UserSettingsAppearanceCard';\n\nexport const UserSettingsGeneral = () => {\n return (\n <Grid container direction=\"row\" spacing={3}>\n <Grid item sm={12} md={6}>\n <UserSettingsProfileCard />\n </Grid>\n <Grid item sm={12} md={6}>\n <UserSettingsAppearanceCard />\n </Grid>\n </Grid>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { UserSettingsAuthProviders } from './AuthProviders';\nimport { UserSettingsFeatureFlags } from './FeatureFlags';\nimport { UserSettingsGeneral } from './General';\nimport { Header, Page, TabbedLayout } from '@backstage/core-components';\n\ntype Props = {\n providerSettings?: JSX.Element;\n};\n\nexport const SettingsPage = ({ providerSettings }: Props) => {\n return (\n <Page themeId=\"home\">\n <Header title=\"Settings\" />\n\n <TabbedLayout>\n <TabbedLayout.Route path=\"general\" title=\"General\">\n <UserSettingsGeneral />\n </TabbedLayout.Route>\n <TabbedLayout.Route\n path=\"auth-providers\"\n title=\"Authentication Providers\"\n >\n <UserSettingsAuthProviders providerSettings={providerSettings} />\n </TabbedLayout.Route>\n <TabbedLayout.Route path=\"feature-flags\" title=\"Feature Flags\">\n <UserSettingsFeatureFlags />\n </TabbedLayout.Route>\n </TabbedLayout>\n </Page>\n );\n};\n"],"names":["EXAMPLE","useStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../src/plugin.ts","../src/components/Settings.tsx","../src/components/AuthProviders/EmptyProviders.tsx","../src/components/AuthProviders/ProviderSettingsItem.tsx","../src/components/AuthProviders/DefaultProviderSettings.tsx","../src/components/AuthProviders/UserSettingsAuthProviders.tsx","../src/components/FeatureFlags/EmptyFlags.tsx","../src/components/FeatureFlags/FeatureFlagsItem.tsx","../src/components/FeatureFlags/UserSettingsFeatureFlags.tsx","../src/components/useUserProfileInfo.ts","../src/components/General/UserSettingsSignInAvatar.tsx","../src/components/General/UserSettingsMenu.tsx","../src/components/General/UserSettingsProfileCard.tsx","../src/components/General/UserSettingsPinToggle.tsx","../src/components/General/UserSettingsThemeToggle.tsx","../src/components/General/UserSettingsAppearanceCard.tsx","../src/components/General/UserSettingsGeneral.tsx","../src/components/SettingsPage.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n createPlugin,\n createRoutableExtension,\n createRouteRef,\n} from '@backstage/core-plugin-api';\n\nexport const settingsRouteRef = createRouteRef({\n id: 'user-settings',\n});\n\nexport const userSettingsPlugin = createPlugin({\n id: 'user-settings',\n routes: {\n settingsPage: settingsRouteRef,\n },\n});\n\nexport const UserSettingsPage = userSettingsPlugin.provide(\n createRoutableExtension({\n name: 'UserSettingsPage',\n component: () =>\n import('./components/SettingsPage').then(m => m.SettingsPage),\n mountPoint: settingsRouteRef,\n }),\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport { settingsRouteRef } from '../plugin';\nimport { SidebarItem } from '@backstage/core-components';\nimport { useRouteRef, IconComponent } from '@backstage/core-plugin-api';\n\ntype SettingsProps = {\n icon?: IconComponent;\n};\n\nexport const Settings = (props: SettingsProps) => {\n const routePath = useRouteRef(settingsRouteRef);\n const Icon = props.icon ? props.icon : SettingsIcon;\n return <SidebarItem text=\"Settings\" to={routePath()} icon={Icon} />;\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { Button, Typography } from '@material-ui/core';\nimport { CodeSnippet, EmptyState } from '@backstage/core-components';\n\nconst EXAMPLE = `auth:\n providers:\n google:\n development:\n clientId: \\${AUTH_GOOGLE_CLIENT_ID}\n clientSecret: \\${AUTH_GOOGLE_CLIENT_SECRET}\n`;\n\nexport const EmptyProviders = () => (\n <EmptyState\n missing=\"content\"\n title=\"No Authentication Providers\"\n description=\"You can add Authentication Providers to Backstage which allows you to use these providers to authenticate yourself.\"\n action={\n <>\n <Typography variant=\"body1\">\n Open <code>app-config.yaml</code> and make the changes as highlighted\n below:\n </Typography>\n <CodeSnippet\n text={EXAMPLE}\n language=\"yaml\"\n showLineNumbers\n highlightedNumbers={[3, 4, 5, 6, 7, 8]}\n customStyle={{ background: 'inherit', fontSize: '115%' }}\n />\n <Button\n variant=\"contained\"\n color=\"primary\"\n href=\"https://backstage.io/docs/auth/add-auth-provider\"\n >\n Read More\n </Button>\n </>\n }\n />\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React, { useEffect, useState } from 'react';\nimport {\n Button,\n ListItem,\n ListItemIcon,\n ListItemSecondaryAction,\n ListItemText,\n Tooltip,\n} from '@material-ui/core';\nimport {\n ApiRef,\n SessionApi,\n useApi,\n IconComponent,\n SessionState,\n} from '@backstage/core-plugin-api';\n\ntype Props = {\n title: string;\n description: string;\n icon: IconComponent;\n apiRef: ApiRef<SessionApi>;\n};\n\nexport const ProviderSettingsItem = ({\n title,\n description,\n icon: Icon,\n apiRef,\n}: Props) => {\n const api = useApi(apiRef);\n const [signedIn, setSignedIn] = useState(false);\n\n useEffect(() => {\n let didCancel = false;\n\n const subscription = api\n .sessionState$()\n .subscribe((sessionState: SessionState) => {\n if (!didCancel) {\n setSignedIn(sessionState === SessionState.SignedIn);\n }\n });\n\n return () => {\n didCancel = true;\n subscription.unsubscribe();\n };\n }, [api]);\n\n return (\n <ListItem>\n <ListItemIcon>\n <Icon />\n </ListItemIcon>\n <ListItemText\n primary={title}\n secondary={\n <Tooltip placement=\"top\" arrow title={description}>\n <span>{description}</span>\n </Tooltip>\n }\n secondaryTypographyProps={{ noWrap: true, style: { width: '80%' } }}\n />\n <ListItemSecondaryAction>\n <Tooltip\n placement=\"top\"\n arrow\n title={signedIn ? `Sign out from ${title}` : `Sign in to ${title}`}\n >\n <Button\n variant=\"outlined\"\n color=\"primary\"\n onClick={() => (signedIn ? api.signOut() : api.signIn())}\n >\n {signedIn ? `Sign out` : `Sign in`}\n </Button>\n </Tooltip>\n </ListItemSecondaryAction>\n </ListItem>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport Star from '@material-ui/icons/Star';\nimport React from 'react';\nimport { ProviderSettingsItem } from './ProviderSettingsItem';\nimport {\n auth0AuthApiRef,\n githubAuthApiRef,\n gitlabAuthApiRef,\n googleAuthApiRef,\n oauth2ApiRef,\n oktaAuthApiRef,\n microsoftAuthApiRef,\n bitbucketAuthApiRef,\n atlassianAuthApiRef,\n} from '@backstage/core-plugin-api';\n\ntype Props = {\n configuredProviders: string[];\n};\n\nexport const DefaultProviderSettings = ({ configuredProviders }: Props) => (\n <>\n {configuredProviders.includes('google') && (\n <ProviderSettingsItem\n title=\"Google\"\n description=\"Provides authentication towards Google APIs and identities\"\n apiRef={googleAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('microsoft') && (\n <ProviderSettingsItem\n title=\"Microsoft\"\n description=\"Provides authentication towards Microsoft APIs and identities\"\n apiRef={microsoftAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('github') && (\n <ProviderSettingsItem\n title=\"GitHub\"\n description=\"Provides authentication towards GitHub APIs\"\n apiRef={githubAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('gitlab') && (\n <ProviderSettingsItem\n title=\"GitLab\"\n description=\"Provides authentication towards GitLab APIs\"\n apiRef={gitlabAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('auth0') && (\n <ProviderSettingsItem\n title=\"Auth0\"\n description=\"Provides authentication towards Auth0 APIs\"\n apiRef={auth0AuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('okta') && (\n <ProviderSettingsItem\n title=\"Okta\"\n description=\"Provides authentication towards Okta APIs\"\n apiRef={oktaAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('bitbucket') && (\n <ProviderSettingsItem\n title=\"Bitbucket\"\n description=\"Provides authentication towards Bitbucket APIs\"\n apiRef={bitbucketAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('atlassian') && (\n <ProviderSettingsItem\n title=\"Atlassian\"\n description=\"Provides authentication towards Atlassian APIs\"\n apiRef={atlassianAuthApiRef}\n icon={Star}\n />\n )}\n {configuredProviders.includes('oauth2') && (\n <ProviderSettingsItem\n title=\"YourOrg\"\n description=\"Example of how to use oauth2 custom provider\"\n apiRef={oauth2ApiRef}\n icon={Star}\n />\n )}\n </>\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { List } from '@material-ui/core';\nimport { EmptyProviders } from './EmptyProviders';\nimport { DefaultProviderSettings } from './DefaultProviderSettings';\n\nimport { configApiRef, useApi } from '@backstage/core-plugin-api';\nimport { InfoCard } from '@backstage/core-components';\n\ntype Props = {\n providerSettings?: JSX.Element;\n};\n\nexport const UserSettingsAuthProviders = ({ providerSettings }: Props) => {\n const configApi = useApi(configApiRef);\n const providersConfig = configApi.getOptionalConfig('auth.providers');\n const configuredProviders = providersConfig?.keys() || [];\n const providers = providerSettings ?? (\n <DefaultProviderSettings configuredProviders={configuredProviders} />\n );\n\n if (!providerSettings && !configuredProviders?.length) {\n return <EmptyProviders />;\n }\n\n return (\n <InfoCard title=\"Available Providers\">\n <List dense>{providers}</List>\n </InfoCard>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { Button, Typography } from '@material-ui/core';\nimport { CodeSnippet, EmptyState } from '@backstage/core-components';\n\nconst EXAMPLE = `import { createPlugin } from '@backstage/core-plugin-api';\n\nexport default createPlugin({\n id: 'plugin-name',\n register({ router, featureFlags }) {\n featureFlags.register('enable-example-feature');\n },\n});\n`;\n\nexport const EmptyFlags = () => (\n <EmptyState\n missing=\"content\"\n title=\"No Feature Flags\"\n description=\"Feature Flags make it possible for plugins to register features in Backstage for users to opt into. You can use this to split out logic in your code for manual A/B testing, etc.\"\n action={\n <>\n <Typography variant=\"body1\">\n An example for how to add a feature flag is highlighted below:\n </Typography>\n <CodeSnippet\n text={EXAMPLE}\n language=\"typescript\"\n showLineNumbers\n highlightedNumbers={[6]}\n customStyle={{ background: 'inherit', fontSize: '115%' }}\n />\n <Button\n variant=\"contained\"\n color=\"primary\"\n href=\"https://backstage.io/docs/api/utility-apis\"\n >\n Read More\n </Button>\n </>\n }\n />\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport {\n ListItem,\n ListItemText,\n ListItemIcon,\n Switch,\n Tooltip,\n} from '@material-ui/core';\nimport { FeatureFlag } from '@backstage/core-plugin-api';\n\ntype Props = {\n flag: FeatureFlag;\n enabled: boolean;\n toggleHandler: Function;\n};\n\nexport const FlagItem = ({ flag, enabled, toggleHandler }: Props) => (\n <ListItem divider button onClick={() => toggleHandler(flag.name)}>\n <ListItemIcon>\n <Tooltip placement=\"top\" arrow title={enabled ? 'Disable' : 'Enable'}>\n <Switch color=\"primary\" checked={enabled} name={flag.name} />\n </Tooltip>\n </ListItemIcon>\n <ListItemText\n primary={flag.name}\n secondary={`Registered in ${flag.pluginId} plugin`}\n />\n </ListItem>\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useCallback, useState } from 'react';\nimport {\n List,\n TextField,\n IconButton,\n Grid,\n Typography,\n} from '@material-ui/core';\nimport { EmptyFlags } from './EmptyFlags';\nimport { FlagItem } from './FeatureFlagsItem';\n\nimport {\n featureFlagsApiRef,\n FeatureFlagState,\n useApi,\n} from '@backstage/core-plugin-api';\nimport { InfoCard } from '@backstage/core-components';\nimport ClearIcon from '@material-ui/icons/Clear';\n\nexport const UserSettingsFeatureFlags = () => {\n const featureFlagsApi = useApi(featureFlagsApiRef);\n const featureFlags = featureFlagsApi.getRegisteredFlags();\n\n const initialFlagState = Object.fromEntries(\n featureFlags.map(({ name }) => [name, featureFlagsApi.isActive(name)]),\n );\n\n const [state, setState] = useState<Record<string, boolean>>(initialFlagState);\n const [filterInput, setFilterInput] = useState<string>('');\n const inputRef = React.useRef<HTMLElement>();\n\n const toggleFlag = useCallback(\n (flagName: string) => {\n const newState = featureFlagsApi.isActive(flagName)\n ? FeatureFlagState.None\n : FeatureFlagState.Active;\n\n featureFlagsApi.save({\n states: { [flagName]: newState },\n merge: true,\n });\n\n setState(prevState => ({\n ...prevState,\n [flagName]: newState === FeatureFlagState.Active,\n }));\n },\n [featureFlagsApi],\n );\n\n if (!featureFlags.length) {\n return <EmptyFlags />;\n }\n\n const clearFilterInput = () => {\n setFilterInput('');\n inputRef?.current?.focus();\n };\n\n let filteredFeatureFlags = Array.from(featureFlags);\n\n const filterInputParts = filterInput\n .split(/\\s/)\n .map(part => part.trim().toLocaleLowerCase('en-US'));\n\n filterInputParts.forEach(\n part =>\n (filteredFeatureFlags = filteredFeatureFlags.filter(featureFlag =>\n featureFlag.name.toLocaleLowerCase('en-US').includes(part),\n )),\n );\n\n const Header = () => (\n <Grid container style={{ justifyContent: 'space-between' }}>\n <Grid item xs={6} md={8}>\n <Typography variant=\"h5\">Feature Flags</Typography>\n </Grid>\n {featureFlags.length >= 10 && (\n <Grid item xs={6} md={4}>\n <TextField\n label=\"Filter\"\n style={{ display: 'flex', justifyContent: 'flex-end' }}\n inputRef={ref => ref && ref.focus()}\n InputProps={{\n ...(filterInput.length && {\n endAdornment: (\n <IconButton\n aria-label=\"Clear filter\"\n onClick={clearFilterInput}\n edge=\"end\"\n >\n <ClearIcon />\n </IconButton>\n ),\n }),\n }}\n onChange={e => setFilterInput(e.target.value)}\n value={filterInput}\n />\n </Grid>\n )}\n </Grid>\n );\n\n return (\n <InfoCard title={<Header />}>\n <List dense>\n {filteredFeatureFlags.map(featureFlag => {\n const enabled = Boolean(state[featureFlag.name]);\n\n return (\n <FlagItem\n key={featureFlag.name}\n flag={featureFlag}\n enabled={enabled}\n toggleHandler={toggleFlag}\n />\n );\n })}\n </List>\n </InfoCard>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n alertApiRef,\n identityApiRef,\n ProfileInfo,\n useApi,\n} from '@backstage/core-plugin-api';\nimport { useEffect } from 'react';\nimport { useAsync } from 'react-use';\n\nexport const useUserProfile = () => {\n const identityApi = useApi(identityApiRef);\n const alertApi = useApi(alertApiRef);\n\n const { value, loading, error } = useAsync(async () => {\n return {\n profile: await identityApi.getProfileInfo(),\n identity: await identityApi.getBackstageIdentity(),\n };\n }, []);\n\n useEffect(() => {\n if (error) {\n alertApi.post({\n message: `Failed to load user identity: ${error}`,\n severity: 'error',\n });\n }\n }, [error, alertApi]);\n\n if (loading || error) {\n return {\n profile: {} as ProfileInfo,\n displayName: '',\n loading,\n };\n }\n\n return {\n profile: value!.profile,\n displayName: value!.profile.displayName ?? value!.identity.userEntityRef,\n loading,\n };\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { BackstageTheme } from '@backstage/theme';\nimport { makeStyles, Avatar } from '@material-ui/core';\nimport { useUserProfile } from '../useUserProfileInfo';\nimport { sidebarConfig } from '@backstage/core-components';\n\nconst useStyles = makeStyles<BackstageTheme, { size: number }>(theme => ({\n avatar: {\n width: ({ size }) => size,\n height: ({ size }) => size,\n fontSize: ({ size }) => size * 0.7,\n border: `1px solid ${theme.palette.textSubtle}`,\n },\n}));\n\ntype Props = { size?: number };\n\nexport const UserSettingsSignInAvatar = ({ size }: Props) => {\n const { iconSize } = sidebarConfig;\n const classes = useStyles(size ? { size } : { size: iconSize });\n const { profile } = useUserProfile();\n\n return <Avatar src={profile.picture} className={classes.avatar} />;\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { IconButton, ListItemIcon, Menu, MenuItem } from '@material-ui/core';\nimport SignOutIcon from '@material-ui/icons/MeetingRoom';\nimport MoreVertIcon from '@material-ui/icons/MoreVert';\nimport { identityApiRef, useApi } from '@backstage/core-plugin-api';\n\nexport const UserSettingsMenu = () => {\n const identityApi = useApi(identityApiRef);\n const [open, setOpen] = React.useState(false);\n const [anchorEl, setAnchorEl] = React.useState<undefined | HTMLElement>(\n undefined,\n );\n\n const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\n setAnchorEl(event.currentTarget);\n setOpen(true);\n };\n\n const handleClose = () => {\n setAnchorEl(undefined);\n setOpen(false);\n };\n\n return (\n <>\n <IconButton\n data-testid=\"user-settings-menu\"\n aria-label=\"more\"\n onClick={handleOpen}\n >\n <MoreVertIcon />\n </IconButton>\n <Menu anchorEl={anchorEl} open={open} onClose={handleClose}>\n <MenuItem data-testid=\"sign-out\" onClick={() => identityApi.signOut()}>\n <ListItemIcon>\n <SignOutIcon />\n </ListItemIcon>\n Sign Out\n </MenuItem>\n </Menu>\n </>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { Grid, Typography } from '@material-ui/core';\nimport React from 'react';\nimport { UserSettingsSignInAvatar } from './UserSettingsSignInAvatar';\nimport { UserSettingsMenu } from './UserSettingsMenu';\nimport { useUserProfile } from '../useUserProfileInfo';\nimport { InfoCard } from '@backstage/core-components';\n\nexport const UserSettingsProfileCard = () => {\n const { profile, displayName } = useUserProfile();\n\n return (\n <InfoCard title=\"Profile\" variant=\"gridItem\">\n <Grid container spacing={6}>\n <Grid item>\n <UserSettingsSignInAvatar size={96} />\n </Grid>\n <Grid item xs={12} sm container>\n <Grid item xs container direction=\"column\" spacing={2}>\n <Grid item xs>\n <Typography variant=\"subtitle1\" gutterBottom>\n {displayName}\n </Typography>\n <Typography variant=\"body2\" color=\"textSecondary\">\n {profile.email}\n </Typography>\n </Grid>\n </Grid>\n <Grid item>\n <UserSettingsMenu />\n </Grid>\n </Grid>\n </Grid>\n </InfoCard>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useContext } from 'react';\nimport {\n ListItem,\n ListItemSecondaryAction,\n ListItemText,\n Switch,\n Tooltip,\n} from '@material-ui/core';\nimport { SidebarPinStateContext } from '@backstage/core-components';\n\nexport const UserSettingsPinToggle = () => {\n const { isPinned, toggleSidebarPinState } = useContext(\n SidebarPinStateContext,\n );\n\n return (\n <ListItem>\n <ListItemText\n primary=\"Pin Sidebar\"\n secondary=\"Prevent the sidebar from collapsing\"\n />\n <ListItemSecondaryAction>\n <Tooltip\n placement=\"top\"\n arrow\n title={`${isPinned ? 'Unpin' : 'Pin'} Sidebar`}\n >\n <Switch\n color=\"primary\"\n checked={isPinned}\n onChange={() => toggleSidebarPinState()}\n name=\"pin\"\n inputProps={{ 'aria-label': 'Pin Sidebar Switch' }}\n />\n </Tooltip>\n </ListItemSecondaryAction>\n </ListItem>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { cloneElement } from 'react';\nimport { useObservable } from 'react-use';\nimport AutoIcon from '@material-ui/icons/BrightnessAuto';\nimport ToggleButton from '@material-ui/lab/ToggleButton';\nimport ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';\nimport {\n ListItem,\n ListItemText,\n ListItemSecondaryAction,\n Tooltip,\n makeStyles,\n} from '@material-ui/core';\nimport { appThemeApiRef, useApi } from '@backstage/core-plugin-api';\n\ntype ThemeIconProps = {\n id: string;\n activeId: string | undefined;\n icon: JSX.Element | undefined;\n};\n\nconst ThemeIcon = ({ id, activeId, icon }: ThemeIconProps) =>\n icon ? (\n cloneElement(icon, {\n color: activeId === id ? 'primary' : undefined,\n })\n ) : (\n <AutoIcon color={activeId === id ? 'primary' : undefined} />\n );\n\ntype TooltipToggleButtonProps = {\n children: JSX.Element;\n title: string;\n value: string;\n};\n\nconst useStyles = makeStyles(theme => ({\n list: {\n [theme.breakpoints.down('xs')]: {\n padding: `0 0 12px`,\n },\n },\n listItemText: {\n [theme.breakpoints.down('xs')]: {\n paddingRight: 0,\n paddingLeft: 0,\n },\n },\n listItemSecondaryAction: {\n [theme.breakpoints.down('xs')]: {\n width: '100%',\n top: 'auto',\n right: 'auto',\n position: 'relative',\n transform: 'unset',\n },\n },\n}));\n\n// ToggleButtonGroup uses React.children.map instead of context\n// so wrapping with Tooltip breaks ToggleButton functionality.\nconst TooltipToggleButton = ({\n children,\n title,\n value,\n ...props\n}: TooltipToggleButtonProps) => (\n <Tooltip placement=\"top\" arrow title={title}>\n <ToggleButton value={value} {...props}>\n {children}\n </ToggleButton>\n </Tooltip>\n);\n\nexport const UserSettingsThemeToggle = () => {\n const classes = useStyles();\n const appThemeApi = useApi(appThemeApiRef);\n const themeId = useObservable(\n appThemeApi.activeThemeId$(),\n appThemeApi.getActiveThemeId(),\n );\n\n const themeIds = appThemeApi.getInstalledThemes();\n\n const handleSetTheme = (\n _event: React.MouseEvent<HTMLElement>,\n newThemeId: string | undefined,\n ) => {\n if (themeIds.some(t => t.id === newThemeId)) {\n appThemeApi.setActiveThemeId(newThemeId);\n } else {\n appThemeApi.setActiveThemeId(undefined);\n }\n };\n\n return (\n <ListItem className={classes.list}>\n <ListItemText\n className={classes.listItemText}\n primary=\"Theme\"\n secondary=\"Change the theme mode\"\n />\n <ListItemSecondaryAction className={classes.listItemSecondaryAction}>\n <ToggleButtonGroup\n exclusive\n size=\"small\"\n value={themeId ?? 'auto'}\n onChange={handleSetTheme}\n >\n {themeIds.map(theme => {\n const themeIcon = themeIds.find(t => t.id === theme.id)?.icon;\n return (\n <TooltipToggleButton\n key={theme.id}\n title={`Select ${theme.title}`}\n value={theme.id}\n >\n <>\n {theme.title} \n <ThemeIcon\n id={theme.id}\n icon={themeIcon}\n activeId={themeId}\n />\n </>\n </TooltipToggleButton>\n );\n })}\n <Tooltip placement=\"top\" arrow title=\"Select auto theme\">\n <ToggleButton value=\"auto\" selected={themeId === undefined}>\n Auto \n <AutoIcon color={themeId === undefined ? 'primary' : undefined} />\n </ToggleButton>\n </Tooltip>\n </ToggleButtonGroup>\n </ListItemSecondaryAction>\n </ListItem>\n );\n};\n","/*\n * Copyright 2021 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\nimport { List } from '@material-ui/core';\nimport { InfoCard } from '@backstage/core-components';\nimport { UserSettingsPinToggle } from './UserSettingsPinToggle';\nimport { UserSettingsThemeToggle } from './UserSettingsThemeToggle';\n\nexport const UserSettingsAppearanceCard = () => (\n <InfoCard title=\"Appearance\" variant=\"gridItem\">\n <List dense>\n <UserSettingsThemeToggle />\n <UserSettingsPinToggle />\n </List>\n </InfoCard>\n);\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { Grid } from '@material-ui/core';\nimport React from 'react';\nimport { UserSettingsProfileCard } from './UserSettingsProfileCard';\nimport { UserSettingsAppearanceCard } from './UserSettingsAppearanceCard';\n\nexport const UserSettingsGeneral = () => {\n return (\n <Grid container direction=\"row\" spacing={3}>\n <Grid item sm={12} md={6}>\n <UserSettingsProfileCard />\n </Grid>\n <Grid item sm={12} md={6}>\n <UserSettingsAppearanceCard />\n </Grid>\n </Grid>\n );\n};\n","/*\n * Copyright 2020 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { UserSettingsAuthProviders } from './AuthProviders';\nimport { UserSettingsFeatureFlags } from './FeatureFlags';\nimport { UserSettingsGeneral } from './General';\nimport { Header, Page, TabbedLayout } from '@backstage/core-components';\n\ntype Props = {\n providerSettings?: JSX.Element;\n};\n\nexport const SettingsPage = ({ providerSettings }: Props) => {\n return (\n <Page themeId=\"home\">\n <Header title=\"Settings\" />\n\n <TabbedLayout>\n <TabbedLayout.Route path=\"general\" title=\"General\">\n <UserSettingsGeneral />\n </TabbedLayout.Route>\n <TabbedLayout.Route\n path=\"auth-providers\"\n title=\"Authentication Providers\"\n >\n <UserSettingsAuthProviders providerSettings={providerSettings} />\n </TabbedLayout.Route>\n <TabbedLayout.Route path=\"feature-flags\" title=\"Feature Flags\">\n <UserSettingsFeatureFlags />\n </TabbedLayout.Route>\n </TabbedLayout>\n </Page>\n );\n};\n"],"names":["EXAMPLE","useStyles"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@backstage/plugin-user-settings",
|
|
3
3
|
"description": "A Backstage plugin that provides a settings page",
|
|
4
|
-
"version": "0.3.
|
|
4
|
+
"version": "0.3.14",
|
|
5
5
|
"main": "dist/index.esm.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
7
|
"license": "Apache-2.0",
|
|
@@ -31,30 +31,30 @@
|
|
|
31
31
|
"clean": "backstage-cli clean"
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@backstage/core-components": "^0.
|
|
35
|
-
"@backstage/core-plugin-api": "^0.
|
|
36
|
-
"@backstage/theme": "^0.2.
|
|
34
|
+
"@backstage/core-components": "^0.8.2",
|
|
35
|
+
"@backstage/core-plugin-api": "^0.4.0",
|
|
36
|
+
"@backstage/theme": "^0.2.14",
|
|
37
37
|
"@material-ui/core": "^4.12.2",
|
|
38
38
|
"@material-ui/icons": "^4.9.1",
|
|
39
39
|
"@material-ui/lab": "4.0.0-alpha.57",
|
|
40
|
-
"react": "^16.13.1",
|
|
41
|
-
"react-dom": "^16.13.1",
|
|
42
40
|
"react-router": "6.0.0-beta.0",
|
|
43
41
|
"react-use": "^17.2.4"
|
|
44
42
|
},
|
|
43
|
+
"peerDependencies": {
|
|
44
|
+
"react": "^16.13.1 || ^17.0.0"
|
|
45
|
+
},
|
|
45
46
|
"devDependencies": {
|
|
46
|
-
"@backstage/cli": "^0.
|
|
47
|
-
"@backstage/core-app-api": "^0.
|
|
48
|
-
"@backstage/
|
|
49
|
-
"@backstage/
|
|
50
|
-
"@backstage/test-utils": "^0.1.19",
|
|
47
|
+
"@backstage/cli": "^0.10.3",
|
|
48
|
+
"@backstage/core-app-api": "^0.3.0",
|
|
49
|
+
"@backstage/dev-utils": "^0.2.15",
|
|
50
|
+
"@backstage/test-utils": "^0.2.0",
|
|
51
51
|
"@testing-library/jest-dom": "^5.10.1",
|
|
52
52
|
"@testing-library/react": "^11.2.5",
|
|
53
53
|
"@testing-library/user-event": "^13.1.8",
|
|
54
54
|
"@types/jest": "^26.0.7",
|
|
55
55
|
"@types/node": "^14.14.32",
|
|
56
56
|
"cross-fetch": "^3.0.6",
|
|
57
|
-
"msw": "^0.
|
|
57
|
+
"msw": "^0.35.0"
|
|
58
58
|
},
|
|
59
59
|
"files": [
|
|
60
60
|
"dist"
|
|
@@ -78,5 +78,5 @@
|
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
80
|
},
|
|
81
|
-
"gitHead": "
|
|
81
|
+
"gitHead": "b315430f9dfcfa19ab0dd90f5b4ac6904938fba7"
|
|
82
82
|
}
|