vite

* replace next with vite
* disable strictmode (it interferes with collaboration in dev mode)

client/src/components/layouts/shell.tsx

@@ -0,0 +1,51 @@
+import { desktopSidebarAtom } from '@/components/navbar/atoms/sidebar-atom';
+import { useToggleSidebar } from '@/components/navbar/hooks/use-toggle-sidebar';
+import { Navbar } from '@/components/navbar/navbar';
+import { AppShell, Burger, Group } from '@mantine/core';
+import { useDisclosure } from '@mantine/hooks';
+import { useAtom } from 'jotai';
+
+export default function Shell({ children }: { children: React.ReactNode }) {
+  const [mobileOpened, { toggle: toggleMobile }] = useDisclosure();
+  const [desktopOpened] = useAtom(desktopSidebarAtom);
+  const toggleDesktop = useToggleSidebar(desktopSidebarAtom);
+
+  return (
+    <AppShell
+      layout="alt"
+      header={{ height: 45 }}
+      navbar={{
+        width: 300,
+        breakpoint: 'sm',
+        collapsed: { mobile: !mobileOpened, desktop: !desktopOpened },
+      }}
+      padding="md"
+    >
+      <AppShell.Header>
+        <Group h="100%" px="md">
+          <Burger
+            opened={mobileOpened}
+            onClick={toggleMobile}
+            hiddenFrom="sm"
+            size="sm"
+          />
+          <Burger
+            opened={desktopOpened}
+            onClick={toggleDesktop}
+            visibleFrom="sm"
+            size="sm"
+          />
+
+          Header
+
+        </Group>
+      </AppShell.Header>
+
+      <AppShell.Navbar>
+        <Navbar />
+      </AppShell.Navbar>
+
+      <AppShell.Main>{children}</AppShell.Main>
+    </AppShell>
+  );
+}