fix: tighten kokoro profile handling

app/src/components/Generation/EngineModelSelector.tsx

@@ -1,3 +1,4 @@
+import { useEffect } from 'react';
 import type { UseFormReturn } from 'react-hook-form';
 import { FormControl } from '@/components/ui/form';
 import {
@@ -41,12 +42,9 @@ const ENGLISH_ONLY_ENGINES = new Set(['luxtts', 'chatterbox_turbo']);
 /** Engines that support cloned (reference audio) profiles. */
 const CLONING_ENGINES = new Set(['qwen', 'luxtts', 'chatterbox', 'chatterbox_turbo', 'tada']);
 
-/**
- * All engine options are always available. The profile grid already
- * filters by engine, so the dropdown doesn't need to restrict options.
- */
-function getAvailableOptions(_selectedProfile?: VoiceProfileResponse | null) {
-  return ENGINE_OPTIONS;
+function getAvailableOptions(selectedProfile?: VoiceProfileResponse | null) {
+  if (!selectedProfile) return ENGINE_OPTIONS;
+  return ENGINE_OPTIONS.filter((opt) => isProfileCompatibleWithEngine(selectedProfile, opt.engine));
 }
 
 function getSelectValue(engine: string, modelSize?: string): string {
@@ -108,12 +106,13 @@ export function EngineModelSelector({ form, compact, selectedProfile }: EngineMo
   const selectValue = getSelectValue(engine, modelSize);
   const availableOptions = getAvailableOptions(selectedProfile);
 
-  // If current engine isn't in available options, auto-switch to first available
   const currentEngineAvailable = availableOptions.some((opt) => opt.value === selectValue);
-  if (!currentEngineAvailable && availableOptions.length > 0) {
-    // Defer to avoid setting state during render
-    setTimeout(() => handleEngineChange(form, availableOptions[0].value), 0);
-  }
+
+  useEffect(() => {
+    if (!currentEngineAvailable && availableOptions.length > 0) {
+      handleEngineChange(form, availableOptions[0].value);
+    }
+  }, [availableOptions, currentEngineAvailable, form]);
 
   const itemClass = compact ? 'text-xs text-muted-foreground' : undefined;
   const triggerClass = compact

app/src/components/VoiceProfiles/ProfileForm.tsx

@@ -43,6 +43,7 @@ import {
   useAddSample,
   useCreateProfile,
   useDeleteAvatar,
+  useDeleteProfile,
   useProfile,
   useUpdateProfile,
   useUploadAvatar,
@@ -59,6 +60,15 @@ import { AudioSampleUpload } from './AudioSampleUpload';
 import { SampleList } from './SampleList';
 
 const MAX_AUDIO_DURATION_SECONDS = 30;
+const PRESET_ONLY_ENGINES = new Set(['kokoro']);
+const DEFAULT_ENGINE_OPTIONS = [
+  { value: 'qwen', label: 'Qwen3-TTS' },
+  { value: 'luxtts', label: 'LuxTTS' },
+  { value: 'chatterbox', label: 'Chatterbox' },
+  { value: 'chatterbox_turbo', label: 'Chatterbox Turbo' },
+  { value: 'tada', label: 'TADA' },
+  { value: 'kokoro', label: 'Kokoro 82M' },
+] as const;
 
 const baseProfileSchema = z.object({
   name: z.string().min(1, 'Name is required').max(100),
@@ -119,6 +129,7 @@ export function ProfileForm() {
   const createProfile = useCreateProfile();
   const updateProfile = useUpdateProfile();
   const addSample = useAddSample();
+  const deleteProfile = useDeleteProfile();
   const uploadAvatar = useUploadAvatar();
   const deleteAvatar = useDeleteAvatar();
   const transcribe = useTranscription();
@@ -259,6 +270,12 @@ export function ProfileForm() {
         (!isCreating && editingProfile?.voice_type === 'preset')),
   });
   const presetVoices = presetVoicesData?.voices ?? [];
+  const isSampleBasedProfile = isCreating
+    ? voiceSource === 'clone'
+    : editingProfile?.voice_type !== 'preset';
+  const availableDefaultEngines = DEFAULT_ENGINE_OPTIONS.filter(
+    (option) => !isSampleBasedProfile || !PRESET_ONLY_ENGINES.has(option.value),
+  );
 
   // Show recording errors
   useEffect(() => {
@@ -348,6 +365,15 @@ export function ProfileForm() {
     }
   }, [editingProfile, profileFormDraft, open, form]);
 
+  useEffect(() => {
+    if (
+      defaultEngine &&
+      !availableDefaultEngines.some((option) => option.value === defaultEngine)
+    ) {
+      setDefaultEngine('');
+    }
+  }, [availableDefaultEngines, defaultEngine]);
+
   async function handleTranscribe() {
     const file = form.getValues('sampleFile');
     if (!file) {
@@ -638,12 +664,32 @@ export function ProfileForm() {
             description: `"${data.name}" has been created with a sample.`,
           });
         } catch (sampleError) {
-          // Profile was created but sample failed - still show error
+          let rollbackSucceeded = false;
+          try {
+            await deleteProfile.mutateAsync(profile.id);
+            rollbackSucceeded = true;
+          } catch (rollbackError) {
+            toast({
+              title: 'Rollback failed',
+              description:
+                rollbackError instanceof Error
+                  ? rollbackError.message
+                  : 'Created profile could not be removed after sample upload failure.',
+              variant: 'destructive',
+            });
+          }
+
           toast({
             title: 'Failed to add sample',
-            description: `Profile "${data.name}" was created, but failed to add sample: ${sampleError instanceof Error ? sampleError.message : 'Unknown error'}`,
+            description:
+              sampleError instanceof Error
+                ? `${sampleError.message}${rollbackSucceeded ? ' The profile was rolled back.' : ''}`
+                : rollbackSucceeded
+                  ? 'Failed to add sample. The profile was rolled back.'
+                  : 'Failed to add sample.',
             variant: 'destructive',
           });
+          return;
         }
       }
 
@@ -1140,12 +1186,11 @@ export function ProfileForm() {
                       </FormControl>
                       <SelectContent>
                         <SelectItem value="_none">No preference</SelectItem>
-                        <SelectItem value="qwen">Qwen3-TTS</SelectItem>
-                        <SelectItem value="luxtts">LuxTTS</SelectItem>
-                        <SelectItem value="chatterbox">Chatterbox</SelectItem>
-                        <SelectItem value="chatterbox_turbo">Chatterbox Turbo</SelectItem>
-                        <SelectItem value="tada">TADA</SelectItem>
-                        <SelectItem value="kokoro">Kokoro 82M</SelectItem>
+                        {availableDefaultEngines.map((option) => (
+                          <SelectItem key={option.value} value={option.value}>
+                            {option.label}
+                          </SelectItem>
+                        ))}
                       </SelectContent>
                     </Select>
                     <p className="text-xs text-muted-foreground">

app/src/components/VoiceProfiles/ProfileList.tsx

@@ -63,7 +63,7 @@ export function ProfileList() {
                 No {ENGINE_NAMES[selectedEngine] ?? selectedEngine} voices created yet.
               </p>
               <p className="text-sm text-muted-foreground mb-4">
-                The default voice will be used. Create a profile to choose a specific voice.
+                Create a profile to choose a specific voice before generating.
               </p>
               <Button onClick={() => setDialogOpen(true)}>
                 <Sparkles className="mr-2 h-4 w-4" />