feat: 🎨 Update AppLayout to use Link component and enhance user settings with dark mode and new themes

Author: sizzlebop

data/bytebox.db

@@ -207,7 +207,7 @@ export function AppLayout({
             const Icon = item.icon;
             const iconColor = getIconColor(item.name);
             return (
-              <a
+              <Link
                 key={item.name}
                 href={item.href}
                 className={cn(
@@ -236,7 +236,7 @@ export function AppLayout({
                     {item.name}
                   </span>
                 )}
-              </a>
+              </Link>
             );
           })}
         </nav>

src/components/layout/AppLayout.tsx

@@ -368,15 +368,15 @@ export async function getUserSettings(): Promise<UserSettingsData> {
     await prisma.userSettings.create({
       data: {
         id: SETTINGS_ID,
-        mode: 'light',
-        accentThemeId: 'default',
-        iconThemeId: 'default',
+        mode: 'dark',
+        accentThemeId: 'byte-classic',
+        iconThemeId: 'neon-grid',
         customAccentThemes: '[]',
         settingsPresets: '[]',
-        backgroundConfig: '{}',
-        fontConfig: '{}',
-        customIconColor: '',
-        glassIntensity: 0,
+        backgroundConfig: '{"type":"default"}',
+        fontConfig: '{"uiFont":"system","monoFont":"geist-mono"}',
+        customIconColor: '#f472b6',
+        glassIntensity: 60,
       },
     });