feat: enhance header with notification buttons and user dropdown

- Updated header component to include notification buttons with icons.
- Introduced a new NavUser component for user-related actions in the sidebar.
- Added NotificationDot component for visual notification indicators.
- Created UserCard component to display user information.
- Implemented UserDropdown for user settings and logout functionality.
- Added Avatar component for user images with fallback support.
- Refactored Sheet and Tooltip components for consistency and improved styling.
- Introduced QueryProvider for managing React Query context.
- Updated SidebarProvider to use custom sidebar implementation.
- Enhanced mobile detection hook for better responsiveness.
- Updated dependencies in yarn.lock for new features and fixes.

feat: remove dot

src/components/misc/user-card.tsx

@@ -0,0 +1,29 @@
+import { useGetApiUserMe } from '@/generated/api/user/user';
+import { Avatar } from '@/components/ui/avatar';
+import Image from 'next/image';
+import { User } from 'lucide-react';
+
+export default function UserCard() {
+  const { data } = useGetApiUserMe();
+  return (
+    <div className='w-full'>
+      <Avatar className='flex justify-center items-center'>
+        {data?.data.user.image ? (
+          <Image
+            className='border-2 rounded-md'
+            src={data?.data.user.image}
+            alt='Avatar'
+            width='50'
+            height='50'
+          />
+        ) : (
+          <User />
+        )}
+      </Avatar>
+      <div className='flex justify-center'>{data?.data.user.name}</div>
+      <div className='flex justify-center text-text-muted'>
+        {data?.data.user.email}
+      </div>
+    </div>
+  );
+}