From 790cd5ac4943b13a3cc7b84bfc69abf26c8dd207 Mon Sep 17 00:00:00 2001
From: Marcus Eide <eide@spotify.com>
Date: Mon, 28 Sep 2020 10:26:42 +0200
Subject: [PATCH] Update storybook for Sidebar

---
 .../src/layout/Sidebar/Sidebar.stories.tsx    | 67 +++++++++++++++----
 1 file changed, 55 insertions(+), 12 deletions(-)

diff --git a/packages/core/src/layout/Sidebar/Sidebar.stories.tsx b/packages/core/src/layout/Sidebar/Sidebar.stories.tsx
index 61975a728a..1b646fab8a 100644
--- a/packages/core/src/layout/Sidebar/Sidebar.stories.tsx
+++ b/packages/core/src/layout/Sidebar/Sidebar.stories.tsx
@@ -22,14 +22,27 @@ import {
   SidebarDivider,
   SidebarSearchField,
   SidebarSpace,
+<<<<<<< HEAD
   SidebarUserSettings,
   ProviderSettingsItem,
+=======
+>>>>>>> a4e66bae0... Update storybook for Sidebar
 } from '.';
 import HomeOutlinedIcon from '@material-ui/icons/HomeOutlined';
 import AddCircleOutlineIcon from '@material-ui/icons/AddCircleOutline';
-import Star from '@material-ui/icons/Star';
 import { MemoryRouter } from 'react-router-dom';
-import { githubAuthApiRef } from '@backstage/core-api';
+import {
+  ApiProvider,
+  ApiRegistry,
+  appThemeApiRef,
+  AppThemeSelector,
+  configApiRef,
+  ConfigReader,
+  FeatureFlags,
+  featureFlagsApiRef,
+} from '@backstage/core-api';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { UserSettings } from '@backstage/plugin-user-settings';
 
 export default {
   title: 'Sidebar',
@@ -57,15 +70,45 @@ export const SampleSidebar = () => (
     <SidebarDivider />
     <SidebarIntro />
     <SidebarSpace />
-    <SidebarDivider />
-    <SidebarUserSettings
-      providerSettings={
-        <ProviderSettingsItem
-          title="Github"
-          apiRef={githubAuthApiRef}
-          icon={Star}
-        />
-      }
-    />
+  </Sidebar>
+);
+
+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 WithUserSettingsPlugin = () => (
+  <Sidebar>
+    {/* <SidebarLogo /> */}
+    <SidebarSearchField onSearch={handleSearch} />
+    <SidebarDivider />
+    <SidebarItem icon={HomeOutlinedIcon} to="#" text="Home" />
+    <SidebarItem icon={HomeOutlinedIcon} to="#" text="Plugins" />
+    <SidebarItem icon={AddCircleOutlineIcon} to="#" text="Create..." />
+    <SidebarDivider />
+    <SidebarIntro />
+    <SidebarSpace />
+    <SidebarDivider />
+    <ApiProvider apis={apis}>
+      <UserSettings />
+    </ApiProvider>
   </Sidebar>
 );