fixes for pull from master

Signed-off-by: Jonathan Ash <jonathan-ash@users.noreply.github.com>

packages/core-components/src/layout/Sidebar/Intro.tsx

@@ -40,50 +40,48 @@ export type SidebarIntroClassKey =
 
 const useStyles = ({ sidebarConfig }: { sidebarConfig: SidebarConfig }) =>
   makeStyles<BackstageTheme>(
-    theme => {
-      return {
-        introCard: {
-          color: '#b5b5b5',
-          // XXX (@koroeskohr): should I be using a Mui theme variable?
-          fontSize: 12,
-          width: sidebarConfig.drawerWidthOpen,
-          marginTop: 18,
-          marginBottom: 12,
-          paddingLeft: sidebarConfig.iconPadding,
-          paddingRight: sidebarConfig.iconPadding,
+    theme => ({
+      introCard: {
+        color: '#b5b5b5',
+        // XXX (@koroeskohr): should I be using a Mui theme variable?
+        fontSize: 12,
+        width: sidebarConfig.drawerWidthOpen,
+        marginTop: 18,
+        marginBottom: 12,
+        paddingLeft: sidebarConfig.iconPadding,
+        paddingRight: sidebarConfig.iconPadding,
+      },
+      introDismiss: {
+        display: 'flex',
+        justifyContent: 'flex-end',
+        alignItems: 'center',
+        marginTop: 12,
+      },
+      introDismissLink: {
+        color: '#dddddd',
+        display: 'flex',
+        alignItems: 'center',
+        marginBottom: 4,
+        '&:hover': {
+          color: theme.palette.linkHover,
+          transition: theme.transitions.create('color', {
+            easing: theme.transitions.easing.sharp,
+            duration: theme.transitions.duration.shortest,
+          }),
         },
-        introDismiss: {
-          display: 'flex',
-          justifyContent: 'flex-end',
-          alignItems: 'center',
-          marginTop: 12,
-        },
-        introDismissLink: {
-          color: '#dddddd',
-          display: 'flex',
-          alignItems: 'center',
-          marginBottom: 4,
-          '&:hover': {
-            color: theme.palette.linkHover,
-            transition: theme.transitions.create('color', {
-              easing: theme.transitions.easing.sharp,
-              duration: theme.transitions.duration.shortest,
-            }),
-          },
-        },
-        introDismissText: {
-          fontSize: '0.7rem',
-          fontWeight: 'bold',
-          textTransform: 'uppercase',
-          letterSpacing: 1,
-        },
-        introDismissIcon: {
-          width: 18,
-          height: 18,
-          marginRight: 12,
-        },
-      };
-    },
+      },
+      introDismissText: {
+        fontSize: '0.7rem',
+        fontWeight: 'bold',
+        textTransform: 'uppercase',
+        letterSpacing: 1,
+      },
+      introDismissIcon: {
+        width: 18,
+        height: 18,
+        marginRight: 12,
+      },
+    }),
     { name: 'BackstageSidebarIntro' },
   );
 

packages/core-components/src/layout/Sidebar/Items.tsx

@@ -83,20 +83,7 @@ export type SidebarItemClassKey =
   | 'arrows'
   | 'selected';
 
-<<<<<<< HEAD
 const useStyles = ({ sidebarConfig }: { sidebarConfig: SidebarConfig }) =>
-=======
-const useStyles = ({
-  sidebarConfig: {
-    drawerWidthClosed,
-    drawerWidthOpen,
-    iconContainerWidth,
-    selectedIndicatorWidth,
-  },
-}: {
-  sidebarConfig: SidebarConfig;
-}) =>
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
   makeStyles<BackstageTheme>(
     theme => {
       return {
@@ -213,11 +200,7 @@ const useStyles = ({
       };
     },
     { name: 'BackstageSidebarItem' },
-<<<<<<< HEAD
   );
-=======
-  )();
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
 
 /**
  * Evaluates the routes of the SubmenuItems & nested DropdownItems.
@@ -371,11 +354,7 @@ const SidebarItemBase = forwardRef<any, SidebarItemProps>((props, ref) => {
     ...navLinkProps
   } = props;
   const { sidebarConfig } = useContext(SidebarConfigContext);
-<<<<<<< HEAD
   const classes = useStyles({ sidebarConfig })();
-=======
-  const classes = useStyles({ sidebarConfig });
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
   // XXX (@koroeskohr): unsure this is optimal. But I just really didn't want to have the item component
   // depend on the current location, and at least have it being optionally forced to selected.
   // Still waiting on a Q answered to fine tune the implementation
@@ -449,11 +428,7 @@ const SidebarItemWithSubmenu = ({
   children: React.ReactElement<SidebarSubmenuProps>;
 }) => {
   const { sidebarConfig } = useContext(SidebarConfigContext);
-<<<<<<< HEAD
   const classes = useStyles({ sidebarConfig })();
-=======
-  const classes = useStyles({ sidebarConfig });
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
   const [isHoveredOn, setIsHoveredOn] = useState(false);
   const location = useLocation();
   const isActive = useLocationMatch(children, location);
@@ -543,13 +518,8 @@ type SidebarSearchFieldProps = {
 
 export function SidebarSearchField(props: SidebarSearchFieldProps) {
   const { sidebarConfig } = useContext(SidebarConfigContext);
-<<<<<<< HEAD
   const [input, setInput] = useState('');
   const classes = useStyles({ sidebarConfig })();
-=======
-  const classes = useStyles({ sidebarConfig });
-  const [input, setInput] = useState('');
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
   const Icon = props.icon ? props.icon : SearchIcon;
 
   const search = () => {
@@ -678,11 +648,7 @@ export const SidebarScrollWrapper = styled('div')(({ theme }) => {
  */
 export const SidebarExpandButton = () => {
   const { sidebarConfig } = useContext(SidebarConfigContext);
-<<<<<<< HEAD
   const classes = useStyles({ sidebarConfig })();
-=======
-  const classes = useStyles({ sidebarConfig });
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
   const { isOpen, setOpen } = useContext(SidebarContext);
   const isSmallScreen = useMediaQuery<BackstageTheme>(
     theme => theme.breakpoints.down('md'),

packages/core-components/src/layout/Sidebar/MobileSidebar.tsx

@@ -28,11 +28,7 @@ import { orderBy } from 'lodash';
 import React, { createContext, useEffect, useState, useContext } from 'react';
 import { useLocation } from 'react-router';
 import { SidebarGroup } from './SidebarGroup';
-<<<<<<< HEAD
 import { SidebarConfigContext, SidebarContext, SidebarConfig } from './config';
-=======
-import { SidebarConfigContext, SidebarConfig } from './config';
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
 
 /**
  * Type of `MobileSidebarContext`
@@ -63,11 +59,7 @@ type OverlayMenuProps = {
   children?: React.ReactNode;
 };
 
-<<<<<<< HEAD
 const useStyles = ({ sidebarConfig }: { sidebarConfig: SidebarConfig }) => 
-=======
-const useStyles = ({ sidebarConfig }: { sidebarConfig: SidebarConfig }) =>
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
   makeStyles<BackstageTheme>(theme => {
     return {
       root: {
@@ -107,11 +99,7 @@ const useStyles = ({ sidebarConfig }: { sidebarConfig: SidebarConfig }) =>
         marginBottom: `${sidebarConfig.mobileSidebarHeight}px`,
       },
     };
-<<<<<<< HEAD
   })
-=======
-  })();
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
 
 const sortSidebarGroupsForPriority = (children: React.ReactElement[]) =>
   orderBy(
@@ -129,11 +117,7 @@ const OverlayMenu = ({
   onClose,
 }: OverlayMenuProps) => {
   const { sidebarConfig } = useContext(SidebarConfigContext);
-<<<<<<< HEAD
   const classes = useStyles({ sidebarConfig })();
-=======
-  const classes = useStyles({ sidebarConfig });
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
 
   return (
     <Drawer
@@ -184,12 +168,7 @@ export const MobileSidebarContext = createContext<MobileSidebarContextType>({
 export const MobileSidebar = (props: MobileSidebarProps) => {
   const { sidebarConfig } = useContext(SidebarConfigContext);
   const { children } = props;
-<<<<<<< HEAD
   const classes = useStyles({ sidebarConfig })();
-=======
-  const { sidebarConfig } = useContext(SidebarConfigContext);
-  const classes = useStyles({ sidebarConfig });
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
   const location = useLocation();
   const [selectedMenuItemIndex, setSelectedMenuItemIndex] =
     useState<number>(-1);

packages/core-components/src/layout/Sidebar/SidebarGroup.tsx

@@ -67,11 +67,7 @@ const useStyles = ({ sidebarConfig }: { sidebarConfig: SidebarConfig }) =>
         display: 'none',
       },
     };
-<<<<<<< HEAD
   });
-=======
-  })();
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
 
 /**
  * Returns a MUI `BottomNavigationAction`, which is aware of the current location & the selected item in the `BottomNavigation`,
@@ -83,11 +79,7 @@ const useStyles = ({ sidebarConfig }: { sidebarConfig: SidebarConfig }) =>
 const MobileSidebarGroup = (props: SidebarGroupProps) => {
   const { to, label, icon, value } = props;
   const { sidebarConfig } = useContext(SidebarConfigContext);
-<<<<<<< HEAD
   const classes = useStyles({ sidebarConfig })();
-=======
-  const classes = useStyles({ sidebarConfig });
->>>>>>> Changed sidebar to accept new props sidebarOptions and submenuOptions
   const location = useLocation();
   const { selectedMenuItemIndex, setSelectedMenuItemIndex } =
     useContext(MobileSidebarContext);

packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx

@@ -25,7 +25,7 @@ import {
 } from './config';
 import { BackstageTheme } from '@backstage/theme';
 
-const useStyles = (props: { left: number, submenuConfig: SubmenuConfig }) =>
+const useStyles = (props: { left: number; submenuConfig: SubmenuConfig }) =>
   makeStyles<BackstageTheme>(
     theme => ({
       root: {