diff --git a/packages/core/src/layout/Sidebar/Sidebar.stories.tsx b/packages/core/src/layout/Sidebar/Sidebar.stories.tsx index 0710be4566..908fbba75c 100644 --- a/packages/core/src/layout/Sidebar/Sidebar.stories.tsx +++ b/packages/core/src/layout/Sidebar/Sidebar.stories.tsx @@ -26,8 +26,6 @@ import { import HomeOutlinedIcon from '@material-ui/icons/HomeOutlined'; import AddCircleOutlineIcon from '@material-ui/icons/AddCircleOutline'; import { MemoryRouter } from 'react-router-dom'; -// eslint-disable-next-line import/no-extraneous-dependencies -import { Settings as SidebarSettings } from '@backstage/plugin-user-settings'; export default { title: 'Sidebar', @@ -56,18 +54,3 @@ export const SampleSidebar = () => ( ); - -export const WithUserSettingsPlugin = () => ( - - - - - - - - - - - - -); diff --git a/packages/storybook/.storybook/main.js b/packages/storybook/.storybook/main.js index c83bb221be..2c58144acc 100644 --- a/packages/storybook/.storybook/main.js +++ b/packages/storybook/.storybook/main.js @@ -5,6 +5,7 @@ module.exports = { stories: [ '../../core/src/layout/**/*.stories.tsx', '../../core/src/components/**/*.stories.tsx', + '../../../plugins/**/src/**/*.stories.tsx', ], addons: [ '@storybook/addon-actions', diff --git a/plugins/user-settings/src/components/SidebarWithSettings.stories.tsx b/plugins/user-settings/src/components/SidebarWithSettings.stories.tsx new file mode 100644 index 0000000000..c3053e6851 --- /dev/null +++ b/plugins/user-settings/src/components/SidebarWithSettings.stories.tsx @@ -0,0 +1,81 @@ +/* + * Copyright 2020 Spotify AB + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import React from 'react'; +import { + ApiProvider, + ApiRegistry, + appThemeApiRef, + AppThemeSelector, + configApiRef, + ConfigReader, + FeatureFlags, + featureFlagsApiRef, + Sidebar, + SidebarDivider, + SidebarSpace, +} from '@backstage/core'; +import { MemoryRouter } from 'react-router'; +import { Settings } from './Settings'; +import { SettingsPage } from './SettingsPage'; + +export default { + title: 'Settings', + component: Settings, + decorators: [ + (storyFn: () => JSX.Element) => ( + {storyFn()} + ), + ], +}; + +export const SidebarItem = () => ( + + + + + +); + +const createConfig = () => + ConfigReader.fromConfigs([ + { + context: '', + data: { + auth: { + providers: { + // google: { development: {} }, + }, + }, + }, + }, + ]); + +const config = createConfig(); + +const apis = ApiRegistry.from([ + [configApiRef, config], + [featureFlagsApiRef, new FeatureFlags()], + [appThemeApiRef, AppThemeSelector.createWithStorage([])], +]); + +export const TheSettingsPage = () => ( +
+ + + +
+);