⚡ Bolt: Optimize Logo component re-renders

.jules/bolt.md

@@ -0,0 +1,3 @@
+## 2026-01-19 - Iconify Bundle Bloat
+**Learning:** The `IconifyIcon` component imports full JSON datasets for multiple icon libraries (material-symbols, eva, etc.) into the client bundle. This likely causes massive bundle bloat.
+**Action:** In the future, refactor `IconifyIcon` to use dynamic imports or an API to fetch icon data on demand, rather than bundling all icon sets.

apps/client/src/components/common/Logo.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react';
+import { useId, useMemo } from 'react';
 import { Link, SvgIcon, SvgIconProps, Typography, typographyClasses } from '@mui/material';
 import { useSettingsContext } from 'providers/SettingsProvider';
 import { rootPaths } from 'routes/paths';
@@ -8,7 +8,7 @@ interface LogoProps extends SvgIconProps {
 }
 
 const Logo = ({ sx, viewBox = '0 0 26 40', showName = true, ...rest }: LogoProps) => {
-  const [id, setId] = useState('logo');
+  const id = useId();
 
   const {
     config: { navColor },
@@ -18,10 +18,6 @@ const Logo = ({ sx, viewBox = '0 0 26 40', showName = true, ...rest }: LogoProps
     return navColor === 'vibrant' ? '#A641FA' : '#20DE99';
   }, [navColor]);
 
-  useEffect(() => {
-    setId(`logo-${Math.floor(Math.random() * 1000) + 1}`);
-  }, []);
-
   return (
     <Link
       href={rootPaths.root}

client_output.log

@@ -0,0 +1,19 @@
+
+> client@1.0.0 dev /app/apps/client
+> next dev --turbopack -p 3001
+
+   ▲ Next.js 15.5.9 (Turbopack)
+   - Local:        http://localhost:3001
+   - Network:      http://192.168.0.2:3001
+
+ ✓ Starting...
+ ○ Compiling middleware ...
+ ✓ Compiled middleware in 979ms
+ ✓ Ready in 2.6s
+ ○ Compiling /auth/login ...
+ ✓ Compiled /auth/login in 19.4s
+ GET /auth/login 200 in 23339ms
+/app/apps/client:
+ ERR_PNPM_RECURSIVE_RUN_FIRST_FAIL  client@1.0.0 dev: `next dev --turbopack -p 3001`
+Command failed with signal "SIGTERM"
+[?25h