✨ Re-add burger menu on mobile

src/components/layout/admin/main-admin.layout.tsx

@@ -103,6 +103,8 @@ export const MainLayout = ({ children }: MainLayoutProps) => {
             <IconSettings2 size="1rem" />
           </ThemeIcon>
         }
+        component={Link}
+        href="/manage/preferences"
       />
       <NavLink
         label="Help"
@@ -139,6 +141,9 @@ export const MainLayout = ({ children }: MainLayoutProps) => {
       </NavLink>
     </>
   );
+
+  const burgerMenu = screenLargerThanMd ? undefined : <Burger opened={burgerMenuOpen} onClick={toggleBurgerMenu} />;
+
   return (
     <>
       <CommonHeader />
@@ -155,7 +160,13 @@ export const MainLayout = ({ children }: MainLayoutProps) => {
             </Navbar.Section>
           </Navbar>
         }
-        header={<MainHeader showExperimental logoHref="/manage" />}
+        header={
+          <MainHeader
+            showExperimental
+            logoHref="/manage"
+            leftIcon={burgerMenu}
+          />
+        }
         footer={
           <Footer height={25}>
             <Group position="apart" px="md">

src/components/layout/new-header/Header.tsx

@@ -12,12 +12,14 @@ type MainHeaderProps = {
   logoHref?: string;
   showExperimental?: boolean;
   headerActions?: React.ReactNode;
+  leftIcon?: React.ReactNode;
 };
 
 export const MainHeader = ({
   showExperimental = false,
   logoHref = '/',
   headerActions,
+  leftIcon
 }: MainHeaderProps) => {
   const { breakpoints } = useMantineTheme();
   const isSmallerThanMd = useMediaQuery(`(max-width: ${breakpoints.sm})`);
@@ -28,9 +30,12 @@ export const MainHeader = ({
     <Header height={headerHeight} pb="sm" pt={0}>
       <ExperimentalHeaderNote visible={showExperimental} height={experimentalHeaderNoteHeight} />
       <Group spacing="xl" mt="xs" px="md" position="apart" noWrap>
-        <UnstyledButton component={Link} href={logoHref} style={{ flex: 1 }}>
+        <Group noWrap>
-          <Logo />
+          {leftIcon}
-        </UnstyledButton>
+          <UnstyledButton component={Link} href={logoHref} style={{ flex: 1 }}>
+            <Logo />
+          </UnstyledButton>
+        </Group>
 
         <Search />