From 5e476b8428a7635eb4ada7ecaccbf41c698977b1 Mon Sep 17 00:00:00 2001
From: Mary Kate Fain <mk@marykatefain.com>
Date: Wed, 25 Feb 2026 12:04:31 -0600
Subject: [PATCH] Show all theme presets in onboarding flow, not just 5
 hardcoded ones

Dynamically generate the onboarding theme options from themePresets so
new themes (midnight, toxic, lavender, ocean, sunset) appear
automatically without manual updates.
---
 src/components/InitialSyncGate.tsx | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/components/InitialSyncGate.tsx b/src/components/InitialSyncGate.tsx
index f06fb0d7..b4ade877 100644
--- a/src/components/InitialSyncGate.tsx
+++ b/src/components/InitialSyncGate.tsx
@@ -227,8 +227,14 @@ const THEMES: ThemeOption[] = [
   { id: 'system', label: 'System', description: 'Matches your device', preview: '', splitPreview: true, builtinTheme: 'system' },
   { id: 'dark', label: 'Dark', description: 'Deep purple dark theme', preview: 'bg-[hsl(228,20%,10%)]', builtinTheme: 'dark' },
   { id: 'light', label: 'Light', description: 'Clean and bright', preview: 'bg-white border border-border', builtinTheme: 'light' },
-  { id: 'black', label: 'Black', description: 'True OLED black', preview: 'bg-black', presetId: 'black' },
-  { id: 'pink', label: 'Pink', description: 'Warm and playful', preview: 'bg-[hsl(330,100%,96%)]', presetId: 'pink' },
+  // Generate entries from all theme presets
+  ...Object.entries(themePresets).map(([id, preset]) => ({
+    id,
+    label: preset.label,
+    description: `${preset.emoji} ${preset.label} theme`,
+    preview: `bg-[hsl(${preset.tokens.background})]`,
+    presetId: id,
+  })),
 ];
 
 interface ContentKind {