feat: add Radix UI components and implement sidebar functionality

- Added new Radix UI components: Dialog, Tooltip, Separator, and updated existing components.
- Introduced a Sidebar component with collapsible functionality and mobile responsiveness.
- Implemented a custom hook `useIsMobile` to manage mobile state.
- Updated package dependencies in package.json and yarn.lock for new components.
- Created utility components such as Button, Skeleton, and Input for consistent styling.

feat: add AppSidebar component with collapsible functionality and sidebar menu

- Introduced AppSidebar component for a customizable sidebar layout.
- Implemented collapsible sections using Radix UI's Collapsible component.
- Added sidebar menu items with icons and links for navigation.
- Created Sidebar UI components including SidebarHeader, SidebarFooter, and SidebarMenu.
- Integrated ThemePicker for theme selection within the sidebar.
- Updated sidebar styles and layout for better responsiveness.

chore: add @radix-ui/react-collapsible dependency

- Added @radix-ui/react-collapsible package to manage collapsible UI elements.

src/components/misc/header.tsx

@@ -0,0 +1,23 @@
+import { SidebarTrigger } from '@/components/ui/sidebar';
+import { ThemePicker } from '@/components/misc/theme-picker';
+
+export default function Header({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <div className='w-full grid grid-rows-[50px_1fr] h-screen'>
+      <header className='border-b-1 grid-cols-[1fr_3fr_1fr] grid items-center px-2'>
+        <span className='flex justify-start'>
+          <SidebarTrigger variant='outline_primary' size='icon' />
+        </span>
+        <span className='flex justify-center'>Search</span>
+        <span className='flex justify-end'>
+          <ThemePicker />
+        </span>
+      </header>
+      <main>{children}</main>
+    </div>
+  );
+}