packages/core: add logout item to user settings in sidebar

packages/core/src/layout/Sidebar/UserSettings.tsx

@@ -17,17 +17,25 @@
 import React, { useContext, useEffect } from 'react';
 import Collapse from '@material-ui/core/Collapse';
 import Star from '@material-ui/icons/Star';
+import SignOutIcon from '@material-ui/icons/MeetingRoom';
 import { SidebarContext } from './config';
-import { googleAuthApiRef, githubAuthApiRef } from '@backstage/core-api';
+import {
+  googleAuthApiRef,
+  githubAuthApiRef,
+  identityApiRef,
+  useApi,
+} from '@backstage/core-api';
 import {
   OAuthProviderSettings,
   OIDCProviderSettings,
   UserProfile as SidebarUserProfile,
 } from './Settings';
+import { SidebarItem } from './Items';
 
 export function SidebarUserSettings() {
   const { isOpen: sidebarOpen } = useContext(SidebarContext);
   const [open, setOpen] = React.useState(false);
+  const identityApi = useApi(identityApiRef);
 
   // Close the provider list when sidebar collapse
   useEffect(() => {
@@ -48,6 +56,11 @@ export function SidebarUserSettings() {
           apiRef={githubAuthApiRef}
           icon={Star}
         />
+        <SidebarItem
+          icon={SignOutIcon}
+          text="Sign Out"
+          onClick={() => identityApi.logout()}
+        />
       </Collapse>
     </>
   );