Reset preset to saved theme

components/editor/action-bar/action-bar.tsx

@@ -15,7 +15,7 @@ import { ActionBarButtons } from "@/components/editor/action-bar/components/acti
 import { usePostHog } from "posthog-js/react";
 
 export function ActionBar() {
-  const { themeState, setThemeState } = useEditorStore();
+  const { themeState, setThemeState, applyThemePreset } = useEditorStore();
   const [cssImportOpen, setCssImportOpen] = useState(false);
   const [codePanelOpen, setCodePanelOpen] = useState(false);
   const [saveDialogOpen, setSaveDialogOpen] = useState(false);
@@ -68,6 +68,7 @@ export function ActionBar() {
         theme_id: theme?.id,
         theme_name: theme?.name,
       });
+      applyThemePreset(theme?.id);
       setTimeout(() => {
         if (!theme) return;
         setSaveDialogOpen(false);

components/editor/action-bar/components/save-button.tsx

@@ -1,4 +1,4 @@
-import { Bookmark, Heart, Loader2 } from "lucide-react";
+import { Heart, Loader2 } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import {
   Tooltip,

components/editor/theme-edit-actions.tsx

@@ -62,7 +62,7 @@ const ThemeEditActions: React.FC<ThemeEditActionsProps> = ({ theme }) => {
     if (result) {
       setIsNameDialogOpen(false);
       router.push("/editor/theme");
-      applyThemePreset(themeState?.preset || "default");
+      applyThemePreset(result?.id || themeState?.preset || "default");
     } else {
       console.error("Failed to update theme");
     }

components/editor/theme-preset-select.tsx

@@ -173,10 +173,12 @@ const ThemePresetSelect: React.FC<ThemePresetSelectProps> = ({
   const mode = themeState.currentMode;
   const [search, setSearch] = useState("");
 
-  // Placeholder condition for saved themes
-  const isSavedTheme = (presetId: string) => {
-    return presets[presetId]?.source === "SAVED";
-  };
+  const isSavedTheme = useCallback(
+    (presetId: string) => {
+      return presets[presetId]?.source === "SAVED";
+    },
+    [presets]
+  );
 
   const presetNames = useMemo(
     () => ["default", ...Object.keys(presets)],
@@ -212,7 +214,7 @@ const ThemePresetSelect: React.FC<ThemePresetSelectProps> = ({
 
     // Combine saved themes first, then default themes
     return [...sortThemes(savedThemesList), ...sortThemes(defaultThemesList)];
-  }, [presetNames, search, presets]);
+  }, [presetNames, search, presets, isSavedTheme]);
 
   const currentIndex =
     useMemo(