From a0c68e08490a101bde46051a0343a15fd4b69b19 Mon Sep 17 00:00:00 2001
From: Navid Shad <navidshad72@gmail.com>
Date: Sat, 11 Apr 2026 18:04:41 +0300
Subject: [PATCH 1/8] refactor: improve node drag-and-drop coordinate
 calculation and optimize CSS transitions for graph components

---
 src/renderer/src/assets/main.css              |  3 +-
 .../src/components/graph/ConversationNode.vue |  2 +-
 .../components/graph/ImageCollectionNode.vue  |  2 +-
 .../src/components/graph/MediaNode.vue        |  2 +-
 .../src/components/graph/SummaryNode.vue      |  2 +-
 .../src/components/graph/VideoNode.vue        |  2 +-
 src/renderer/src/pages/GraphChatPage.vue      | 28 +++++++++++--------
 src/renderer/src/stores/videoStore.ts         |  2 +-
 8 files changed, 24 insertions(+), 19 deletions(-)

diff --git a/src/renderer/src/assets/main.css b/src/renderer/src/assets/main.css
index f6123f4..798b0da 100644
--- a/src/renderer/src/assets/main.css
+++ b/src/renderer/src/assets/main.css
@@ -34,7 +34,8 @@
   }
   
   .glass-card-hover {
-    @apply hover:shadow-premium-hover hover:border-primary/30 transition-all duration-500;
+    @apply hover:shadow-premium-hover hover:border-primary/30;
+    transition: box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.5s cubic-bezier(0.4, 0, 0.2, 1);
   }
 
   .input-focus-ring {
diff --git a/src/renderer/src/components/graph/ConversationNode.vue b/src/renderer/src/components/graph/ConversationNode.vue
index 60cce1a..81b7ff0 100644
--- a/src/renderer/src/components/graph/ConversationNode.vue
+++ b/src/renderer/src/components/graph/ConversationNode.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="glass-card p-0 rounded-3xl min-w-[320px] overflow-hidden flex flex-col group relative cursor-move"
-    :class="[isResizing ? '' : 'glass-card-hover transition-all duration-500']"
+    :class="[isResizing ? '' : 'glass-card-hover']"
     :style="{ width: nodeWidth + 'px', maxWidth: '800px' }">
     <!-- Resize Handle -->
     <div
diff --git a/src/renderer/src/components/graph/ImageCollectionNode.vue b/src/renderer/src/components/graph/ImageCollectionNode.vue
index 4f6536e..9d35406 100644
--- a/src/renderer/src/components/graph/ImageCollectionNode.vue
+++ b/src/renderer/src/components/graph/ImageCollectionNode.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="glass-card glass-card-hover p-0 rounded-3xl min-w-[300px] max-w-[340px] overflow-hidden flex flex-col group transition-all duration-300 cursor-move">
+  <div class="glass-card glass-card-hover p-0 rounded-3xl min-w-[300px] max-w-[340px] overflow-hidden flex flex-col group cursor-move">
     <Handle v-if="data.hasInput !== false" type="target" :position="Position.Top" class="w-3 h-3 bg-zinc-500 border-2 border-white dark:border-zinc-800" />
     
     <!-- Gallery Section -->
diff --git a/src/renderer/src/components/graph/MediaNode.vue b/src/renderer/src/components/graph/MediaNode.vue
index 6fe57d4..db236f1 100644
--- a/src/renderer/src/components/graph/MediaNode.vue
+++ b/src/renderer/src/components/graph/MediaNode.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="glass-card glass-card-hover p-0 rounded-3xl min-w-[280px] max-w-[320px] overflow-hidden flex flex-col group transition-all duration-300 cursor-move">
+  <div class="glass-card glass-card-hover p-0 rounded-3xl min-w-[280px] max-w-[320px] overflow-hidden flex flex-col group cursor-move">
     <Handle v-if="data.hasInput !== false" type="target" :position="Position.Top" class="w-3 h-3 bg-zinc-500 border-2 border-white dark:border-zinc-800" />
     
     <!-- Video Preview Section -->
diff --git a/src/renderer/src/components/graph/SummaryNode.vue b/src/renderer/src/components/graph/SummaryNode.vue
index c71ab5f..99661ed 100644
--- a/src/renderer/src/components/graph/SummaryNode.vue
+++ b/src/renderer/src/components/graph/SummaryNode.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="glass-card glass-card-hover p-0 rounded-3xl min-w-[280px] max-w-[320px] overflow-hidden flex flex-col group transition-all duration-300 cursor-move">
+  <div class="glass-card glass-card-hover p-0 rounded-3xl min-w-[280px] max-w-[320px] overflow-hidden flex flex-col group cursor-move">
     <Handle type="target" :position="Position.Top" class="w-3 h-3 bg-zinc-500 border-2 border-white dark:border-zinc-800" />
     
     <!-- Header -->
diff --git a/src/renderer/src/components/graph/VideoNode.vue b/src/renderer/src/components/graph/VideoNode.vue
index ac703ca..ff28789 100644
--- a/src/renderer/src/components/graph/VideoNode.vue
+++ b/src/renderer/src/components/graph/VideoNode.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="glass-card glass-card-hover p-0 rounded-3xl min-w-[280px] max-w-[320px] overflow-hidden flex flex-col group transition-all duration-300 cursor-move">
+  <div class="glass-card glass-card-hover p-0 rounded-3xl min-w-[280px] max-w-[320px] overflow-hidden flex flex-col group cursor-move">
     <Handle type="target" :position="Position.Top" class="w-3 h-3 bg-zinc-500 border-2 border-white dark:border-zinc-800" />
     
     <!-- Media Container with Overlays -->
diff --git a/src/renderer/src/pages/GraphChatPage.vue b/src/renderer/src/pages/GraphChatPage.vue
index 088aaf1..436d156 100644
--- a/src/renderer/src/pages/GraphChatPage.vue
+++ b/src/renderer/src/pages/GraphChatPage.vue
@@ -137,23 +137,26 @@ const onNodeDragStop = (event: any) => {
   const { nodes: draggedNodes } = event
   const newPositions: any = {}
 
-  // Current graph state
+  // Current graph state - get live instances for accurate positions/dimensions
   const allNodes = getNodes.value
   const frames = allNodes.filter(n => n.type === 'frame')
 
-  draggedNodes.forEach((node: any) => {
-    // We MUST use computedPosition (absolute) for detection logic
+  draggedNodes.forEach((nodeSnapshot: any) => {
+    // Get live node from internal state to ensure computedPosition is absolute
+    const node = findNode(nodeSnapshot.id)
+    if (!node) return
+
     const nx = node.computedPosition?.x ?? node.position.x
     const ny = node.computedPosition?.y ?? node.position.y
-    const nw = node.dimensions?.width || 380
-    const nh = node.dimensions?.height || 200
+    const nw = node.dimensions?.width || nodeSnapshot.dimensions?.width || 380
+    const nh = node.dimensions?.height || nodeSnapshot.dimensions?.height || 200
 
     const nodeCenter = {
       x: nx + nw / 2,
       y: ny + nh / 2
     }
 
-    // If it's a frame, only update its own absolute position
+    // If it's a frame, update its absolute world coordinates
     if (node.type === 'frame') {
       const currentMeta = videoStore.currentThread?.nodePositions?.[node.id] || {}
       newPositions[node.id] = { 
@@ -166,12 +169,12 @@ const onNodeDragStop = (event: any) => {
 
     let parentFrameId: string | undefined = undefined
     
-    // Check against all frames using their absolute positions
+    // Scan all frames using their absolute positions
     for (const frame of frames) {
       const fx = frame.computedPosition?.x ?? frame.position.x
       const fy = frame.computedPosition?.y ?? frame.position.y
-      const fw = frame.data.width || 400
-      const fh = frame.data.height || 300
+      const fw = frame.dimensions?.width || frame.data.width || 400
+      const fh = frame.dimensions?.height || frame.data.height || 300
 
       if (nodeCenter.x >= fx && nodeCenter.x <= fx + fw &&
           nodeCenter.y >= fy && nodeCenter.y <= fy + fh) {
@@ -185,7 +188,8 @@ const onNodeDragStop = (event: any) => {
     if (parentFrameId) {
       const frameNode = findNode(parentFrameId)
       if (frameNode) {
-        // Correct conversion: (Global Node) - (Global Frame) = Local Offset
+        // Correct conversion to local frame coordinates:
+        // Absolute Node Pos - Absolute Frame Pos = Relative Local Offset
         const fx = frameNode.computedPosition?.x ?? frameNode.position.x
         const fy = frameNode.computedPosition?.y ?? frameNode.position.y
         
@@ -197,12 +201,12 @@ const onNodeDragStop = (event: any) => {
         }
       }
     } else {
-      // Return to absolute world coordinates
+      // Return to absolute world coordinates if not over any frame
       newPositions[node.id] = { 
         ...currentMeta,
         x: nx, 
         y: ny, 
-        parentNode: undefined 
+        parentNode: null 
       }
     }
   })
diff --git a/src/renderer/src/stores/videoStore.ts b/src/renderer/src/stores/videoStore.ts
index 21dcfb2..63a2168 100644
--- a/src/renderer/src/stores/videoStore.ts
+++ b/src/renderer/src/stores/videoStore.ts
@@ -363,7 +363,7 @@ export const useVideoStore = defineStore('video', () => {
 					...meta, 
 					x: absoluteX, 
 					y: absoluteY, 
-					parentNode: undefined 
+					parentNode: null 
 				}
 			}
 		})

From 624b8f659071a88003f1460b14d59b3ee16b291a Mon Sep 17 00:00:00 2001
From: Navid Shad <navidshad72@gmail.com>
Date: Sat, 11 Apr 2026 19:42:30 +0300
Subject: [PATCH 2/8] feat: add prompt improvisation feature with usage
 tracking and history migration

---
 src/main/gemini/adapter.ts                    | 48 ++++++++++---
 src/main/index.ts                             | 40 +++++++++++
 src/main/threads/index.ts                     | 53 +++++++++++++-
 src/preload/index.ts                          |  4 +-
 .../src/components/graph/ConversationNode.vue | 70 ++++++++++++++++++-
 src/renderer/src/pages/GraphChatPage.vue      |  2 +-
 src/renderer/src/stores/videoStore.ts         | 13 +++-
 src/shared/types.ts                           |  3 +
 8 files changed, 216 insertions(+), 17 deletions(-)

diff --git a/src/main/gemini/adapter.ts b/src/main/gemini/adapter.ts
index 9230446..efb1af1 100644
--- a/src/main/gemini/adapter.ts
+++ b/src/main/gemini/adapter.ts
@@ -28,12 +28,15 @@ export class GeminiAdapter {
 	}
 
 	private extractUsage(response: any): Usage {
+		if (!response) {
+			return { promptTokens: 0, candidatesTokens: 0, thinkingTokens: 0, totalTokens: 0 };
+		}
 		const usage = response.usageMetadata || { promptTokenCount: 0, candidatesTokenCount: 0, totalTokenCount: 0, thoughtsTokenCount: 0 };
 		return {
-			promptTokens: usage.promptTokenCount!,
-			candidatesTokens: usage.candidatesTokenCount!,
-			thinkingTokens: usage.thoughtsTokenCount,
-			totalTokens: usage.totalTokenCount!
+			promptTokens: usage.promptTokenCount || 0,
+			candidatesTokens: usage.candidatesTokenCount || 0,
+			thinkingTokens: usage.thoughtsTokenCount || 0,
+			totalTokens: usage.totalTokenCount || 0
 		};
 	}
 
@@ -126,26 +129,49 @@ export class GeminiAdapter {
 		modelName: string,
 		userPrompt: string,
 		systemInstruction?: string,
-		signal?: AbortSignal
+		signal?: AbortSignal,
+		imagePaths?: string[]
 	): Promise<{ text: string, record: UsageRecord }> {
-		const request: GenerateContentParameters = {
+		const parts: any[] = []
+
+		// Add image parts if provided
+		const validImagePaths: string[] = []
+		if (imagePaths && imagePaths.length > 0) {
+			for (const imgPath of imagePaths) {
+				if (fs.existsSync(imgPath)) {
+					const data = fs.readFileSync(imgPath).toString('base64')
+					parts.push({
+						inlineData: {
+							data,
+							mimeType: 'image/jpeg'
+						}
+					})
+					validImagePaths.push(imgPath)
+				}
+			}
+		}
+
+		// Add text part LAST
+		parts.push({ text: userPrompt })
+
+		const request: any = {
 			model: modelName,
-			contents: [{ role: 'user', parts: [{ text: userPrompt }] }]
+			contents: [{ role: 'user', parts }]
 		};
 
 		if (systemInstruction) {
-			request.config = {
-				systemInstruction: systemInstruction
+			request.systemInstruction = {
+				parts: [{ text: systemInstruction }]
 			};
 		}
 
 		try {
 			const response = await this.withRetry(
-				() => (this.client.models as any).generateContent(request, { signal }) as Promise<any>,
+				() => (this.client as any).models.generateContent(request, { signal }),
 				signal
 			);
 			const usage = this.extractUsage(response);
-			const cost = GeminiAdapter.calculateCost(modelName, usage);
+			const cost = GeminiAdapter.calculateCost(modelName, usage, 0, validImagePaths.length);
 
 			return {
 				text: this.extractResultText(response),
diff --git a/src/main/index.ts b/src/main/index.ts
index 5c573bd..593d464 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -22,6 +22,7 @@ import { checkFFmpegAvailability, getVideoMetadata } from './ffmpeg'
 import { checkScenedetectAvailability } from './scenedetect'
 import { checkYtDlpAvailability, downloadVideo, getVideoFormats } from './ytdlp'
 import { THREAD_DIRS } from './constants/paths'
+import { GEMINI_MODEL_2_5_FLASH } from './constants/gemini'
 import { electronApp, optimizer, is } from '@electron-toolkit/utils'
 
 const activePipelines = new Map<string, Pipeline>()
@@ -457,6 +458,45 @@ app.whenReady().then(() => {
 		return result.path
 	})
 
+	ipcMain.handle('improvise-message', async (_event, { threadId, messageId }) => {
+		console.log(`[DEBUG IPC] improvise-message called: threadId=${threadId}, messageId=${messageId}`)
+		
+		const thread = threadManager.getThread(threadId)
+		if (!thread) throw new Error('Thread not found')
+
+		const message = thread.messages.find(m => m.id === messageId)
+		if (!message) throw new Error('Message not found')
+
+		// Get the history leading up to this message (including the message itself)
+		const { text: context } = threadManager.getBranchContext(threadId, messageId)
+		
+		// Collect attached images from THIS message only for visual context in improvisation
+		const attachedImages = message.attachedImages || []
+		
+		const modelSettings = settingsManager.getModelSettings()
+		const modelName = modelSettings.selection['intent'] || GEMINI_MODEL_2_5_FLASH
+		const adapter = GeminiAdapter.create()
+
+		const systemInstruction = `You are a prompt improviser. Your goal is to take a user's prompt (potentially with images) and its conversation history, then rewrite the user's LATEST prompt to be more clear, descriptive, and effective for an AI to understand and act upon. 
+- Maintain the original intent exactly.
+- Enhance the wording for better AI performance.
+- Use natural, professional language.
+- Return ONLY the improvised prompt text. 
+- Do NOT include any explanations, tags, or surrounding quotes.
+- The history is provided for context only so you understand the flow.`
+
+		const userPrompt = `History and Prompt:\n${context}`
+
+		const result = await adapter.generateText(modelName, userPrompt, systemInstruction, undefined, attachedImages)
+		
+		// Track usage for the message that initiated it
+		if (result.record) {
+			await threadManager.updateMessageUsage(threadId, messageId, result.record)
+		}
+
+		return result.text
+	})
+
 	app.on('activate', function () {
 		if (BrowserWindow.getAllWindows().length === 0) createWindow()
 	})
diff --git a/src/main/threads/index.ts b/src/main/threads/index.ts
index 9c8fcd3..417b83b 100644
--- a/src/main/threads/index.ts
+++ b/src/main/threads/index.ts
@@ -128,6 +128,7 @@ class ThreadManager {
 			messages: [],
 			versionCounter: 0,
 			videoMetadata,
+			usageHistory: [],
 			createdAt: Date.now(),
 			updatedAt: Date.now()
 		}
@@ -277,6 +278,11 @@ class ThreadManager {
 				// Try to repair paths if they seem broken/moved
 				thread = this.repairThreadPaths(thread)
 				
+				// Migrate usage if needed
+				if (this.migrateThreadUsage(thread)) {
+					this.saveThread(thread)
+				}
+				
 				// Mark as missing if artifacts directory is not found, but DO NOT DELETE metadata.
 				// This allows the user to repair the path or recover files manually.
 				thread.missing = !!(thread.tempDir && !fs.existsSync(thread.tempDir))
@@ -300,7 +306,14 @@ class ThreadManager {
 
 		try {
 			const content = fs.readFileSync(filePath, 'utf-8')
-			return JSON.parse(content)
+			const thread = JSON.parse(content) as Thread
+			
+			// Migrate usage if needed
+			if (this.migrateThreadUsage(thread)) {
+				this.saveThread(thread)
+			}
+			
+			return thread
 		} catch (error) {
 			console.error(`Failed to read thread ${id}:`, error)
 			return null
@@ -460,8 +473,18 @@ class ThreadManager {
 
 	// Update usage and cost for a message
 	async updateMessageUsage(threadId: string, messageId: string, record: UsageRecord): Promise<boolean> {
+		const thread = this.getThread(threadId)
+		if (!thread) return false
+
+		const historyRecord: UsageRecord = {
+			...record,
+			timestamp: Date.now(),
+			messageId
+		}
+
 		const result = await this.updateThread(threadId, {
-			messages: (this.getThread(threadId)?.messages || []).map(m => {
+			usageHistory: [...(thread.usageHistory || []), historyRecord],
+			messages: (thread.messages || []).map(m => {
 				if (m.id !== messageId) return m
 
 				const newUsage: Usage = {
@@ -677,6 +700,32 @@ class ThreadManager {
 
 		return !!result
 	}
+
+	// Migrate usage from messages to usageHistory if history is empty
+	private migrateThreadUsage(thread: Thread): boolean {
+		// If usageHistory already has data, no migration needed
+		if (thread.usageHistory && thread.usageHistory.length > 0) return false
+
+		const history: UsageRecord[] = []
+		for (const msg of thread.messages) {
+			if (msg.usage && msg.cost && msg.cost > 0) {
+				history.push({
+					usage: msg.usage,
+					cost: msg.cost,
+					timestamp: msg.createdAt,
+					messageId: msg.id
+				})
+			}
+		}
+
+		// Only migrate if we found usage or if usageHistory is missing (to initialize it)
+		if (history.length > 0 || thread.usageHistory === undefined) {
+			thread.usageHistory = history
+			return true
+		}
+
+		return false
+	}
 }
 
 export const threadManager = new ThreadManager()
diff --git a/src/preload/index.ts b/src/preload/index.ts
index ba8ba01..015d85e 100644
--- a/src/preload/index.ts
+++ b/src/preload/index.ts
@@ -67,7 +67,9 @@ const api = {
 	getVideoMetadata: (filePath: string) => ipcRenderer.invoke('get-video-metadata', filePath),
 	showOpenDialog: (options: any) => ipcRenderer.invoke('show-open-dialog', options),
 	upscaleImage: (data: { threadId: string, messageId: string, imagePath: string, upscaleFactor: string }) => 
-		ipcRenderer.invoke('upscale-image', data)
+		ipcRenderer.invoke('upscale-image', data),
+	improviseMessage: (threadId: string, messageId: string) =>
+		ipcRenderer.invoke('improvise-message', { threadId, messageId })
 }
 
 if (process.contextIsolated) {
diff --git a/src/renderer/src/components/graph/ConversationNode.vue b/src/renderer/src/components/graph/ConversationNode.vue
index 81b7ff0..c3e208f 100644
--- a/src/renderer/src/components/graph/ConversationNode.vue
+++ b/src/renderer/src/components/graph/ConversationNode.vue
@@ -59,6 +59,13 @@
             <div v-if="msg.role === 'user' && editingMessageId !== msg.id" @click="startEditing(msg)"
               class="text-[9px] font-bold text-zinc-400 hover:text-primary cursor-pointer uppercase">
               Edit</div>
+            <div v-if="msg.role === 'user'" @click="handleImprovise(msg.id)"
+              class="text-[9px] font-bold text-purple-500 hover:text-purple-400 cursor-pointer uppercase flex items-center gap-0.5">
+              <svg class="w-2.5 h-2.5" fill="currentColor" viewBox="0 0 24 24">
+                <path d="M12 2l2.4 7.2h7.6l-6.1 4.4 2.3 7.4-6.2-4.6-6.2 4.6 2.3-7.4-6.1-4.4h7.6z" />
+              </svg>
+              Improvise
+            </div>
             <div @click="removeMessage(msg.id)"
               class="text-[9px] font-bold text-zinc-400 hover:text-red-500 cursor-pointer uppercase">
               Remove</div>
@@ -158,6 +165,40 @@
                 <div class="w-1 h-1 bg-blue-500 rounded-full animate-bounce [animation-delay:0.4s]"></div>
               </div>
             </div>
+
+            <!-- Improvise Suggestion UI -->
+            <div v-if="improvisingIds.has(msg.id) || improvisedSuggestions[msg.id]" 
+              class="mt-3 pt-3 border-t border-white/10 animate-in fade-in slide-in-from-top-2 duration-300">
+              <div v-if="improvisingIds.has(msg.id)" class="flex items-center gap-2 text-[10px] text-purple-300 font-bold uppercase italic animate-pulse">
+                <div class="w-1.5 h-1.5 bg-purple-400 rounded-full"></div>
+                Magic in progress...
+              </div>
+              <div v-else-if="improvisedSuggestions[msg.id]" class="space-y-3">
+                <div class="p-2.5 bg-white/10 rounded-xl border border-white/10 text-[13px] leading-relaxed italic text-purple-100/90 select-text nodrag cursor-text ring-1 ring-purple-500/30 prose prose-xs prose-p:my-1 prose-pre:bg-black/20 prose-pre:my-1 dark:prose-invert"
+                  v-html="renderMarkdown(improvisedSuggestions[msg.id])">
+                </div>
+                <div class="flex items-center gap-2">
+                  <button @click="acceptSuggestion(msg.id)" 
+                    class="px-2.5 py-1 bg-white/20 hover:bg-white/30 text-[10px] font-black uppercase tracking-wider rounded-lg transition-all flex items-center gap-1">
+                    <svg class="w-2.5 h-2.5 text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M5 13l4 4L19 7" />
+                    </svg>
+                    Accept
+                  </button>
+                  <button @click="handleImprovise(msg.id)"
+                    class="px-2.5 py-1 bg-purple-500/20 hover:bg-purple-500/30 text-[10px] font-black uppercase tracking-wider rounded-lg transition-all flex items-center gap-1">
+                    <svg class="w-2.5 h-2.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
+                    </svg>
+                    Retry
+                  </button>
+                  <button @click="discardSuggestion(msg.id)"
+                    class="px-2.5 py-1 bg-black/20 hover:bg-black/30 text-[10px] font-black uppercase tracking-wider rounded-lg transition-all text-zinc-400">
+                    Ignore
+                  </button>
+                </div>
+              </div>
+            </div>
           </div>
 
           <!-- Outside Copy Action -->
@@ -230,7 +271,6 @@
     </Teleport>
   </div>
 </template>
-
 <script setup lang="ts">
 import { ref, watch } from 'vue'
 import { Handle, Position, useVueFlow } from '@vue-flow/core'
@@ -292,6 +332,34 @@ const showInput = ref(false)
 const copiedId = ref<string | null>(null)
 const attachedImages = ref<string[]>([])
 
+const improvisingIds = ref(new Set<string>())
+const improvisedSuggestions = ref<Record<string, string>>({})
+
+const handleImprovise = async (messageId: string) => {
+  improvisingIds.value.add(messageId)
+  delete improvisedSuggestions.value[messageId]
+  
+  const result = await videoStore.improviseMessage(messageId)
+  if (result) {
+    improvisedSuggestions.value[messageId] = result
+  }
+  improvisingIds.value.delete(messageId)
+}
+
+const acceptSuggestion = async (messageId: string) => {
+  const content = improvisedSuggestions.value[messageId]
+  if (!content) return
+  
+  const success = await videoStore.updateMessageContent(messageId, content)
+  if (success) {
+    discardSuggestion(messageId)
+  }
+}
+
+const discardSuggestion = (messageId: string) => {
+  delete improvisedSuggestions.value[messageId]
+}
+
 const editingMessageId = ref<string | null>(null)
 const editText = ref('')
 const isModalOpen = ref(false)
diff --git a/src/renderer/src/pages/GraphChatPage.vue b/src/renderer/src/pages/GraphChatPage.vue
index 436d156..054d21e 100644
--- a/src/renderer/src/pages/GraphChatPage.vue
+++ b/src/renderer/src/pages/GraphChatPage.vue
@@ -126,7 +126,7 @@ const router = useRouter()
 useGraphLayout(videoStore, graphStore)
 
 const totalCost = computed(() => {
-  return videoStore.messages.reduce((acc, msg) => acc + (msg.cost || 0), 0)
+  return (videoStore.currentThread?.usageHistory || []).reduce((acc, record) => acc + (record.cost || 0), 0)
 })
 
 const onPaneReady = () => {
diff --git a/src/renderer/src/stores/videoStore.ts b/src/renderer/src/stores/videoStore.ts
index 63a2168..3ac615a 100644
--- a/src/renderer/src/stores/videoStore.ts
+++ b/src/renderer/src/stores/videoStore.ts
@@ -391,6 +391,16 @@ export const useVideoStore = defineStore('video', () => {
 		return success
 	}
 
+	const improviseMessage = async (messageId: string) => {
+		if (!currentThreadId.value) return null
+		try {
+			return await (window as any).api.improviseMessage(currentThreadId.value, messageId)
+		} catch (error) {
+			console.error('[videoStore] Failed to improvise message:', error)
+			return null
+		}
+	}
+
 	return {
 		threads,
 		currentThreadId,
@@ -420,6 +430,7 @@ export const useVideoStore = defineStore('video', () => {
 		updateNodeMetadata,
 		deleteFrame,
 		retryPreprocessing,
-		toggleReferenceFrame
+		toggleReferenceFrame,
+		improviseMessage
 	}
 })
\ No newline at end of file
diff --git a/src/shared/types.ts b/src/shared/types.ts
index ccbd03b..8fd0b85 100644
--- a/src/shared/types.ts
+++ b/src/shared/types.ts
@@ -49,6 +49,8 @@ export interface Usage {
 export interface UsageRecord {
 	usage: Usage;
 	cost: number;
+	timestamp?: number;
+	messageId?: string;
 }
 
 export interface Message {
@@ -153,6 +155,7 @@ export interface Thread {
 	}>
 	versionCounter?: number
 	videoMetadata?: VideoMetadata
+	usageHistory?: UsageRecord[]
 	missing?: boolean
 	createdAt: number
 	updatedAt: number

From 9b1d98d21166b26910e587d1d5944a93e5f89e52 Mon Sep 17 00:00:00 2001
From: Navid Shad <navidshad72@gmail.com>
Date: Sat, 11 Apr 2026 20:02:44 +0300
Subject: [PATCH 3/8] feat: add support for generating multiple AI responses
 and update confirmation dialog handling

---
 src/main/index.ts                             |  12 ++-
 .../src/components/chat/BaseMessageInput.vue  |  12 ++-
 .../src/components/chat/ChatMessage.vue       |   8 +-
 .../src/components/graph/ChatInputNode.vue    |   4 +-
 .../src/components/graph/ConversationNode.vue |  19 ++--
 .../components/graph/ImageCollectionNode.vue  |   4 +-
 .../src/components/graph/MediaNode.vue        |   4 +-
 .../src/components/graph/ThumbnailNode.vue    |   4 +-
 .../src/components/graph/VideoNode.vue        |   4 +-
 .../src/composables/useGraphLayout.ts         |  28 ++---
 src/renderer/src/pages/GraphChatPage.vue      |   4 +-
 src/renderer/src/stores/videoStore.ts         | 100 +++++++++---------
 12 files changed, 111 insertions(+), 92 deletions(-)

diff --git a/src/main/index.ts b/src/main/index.ts
index 593d464..d86820e 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -376,9 +376,9 @@ app.whenReady().then(() => {
 		return await threadManager.toggleThreadReferenceFrame(threadId, filePath)
 	})
 
-	ipcMain.handle('show-confirmation', async (_event, { title, message, detail, type = 'question', buttons = ['Cancel', 'Yes'], defaultId = 1, cancelId = 0 }) => {
+	ipcMain.handle('show-confirmation', async (_event, { title, message, detail, type = 'question', buttons = ['Cancel', 'Yes'], defaultId = 1, cancelId = 0, checkboxLabel }) => {
 		const focusedWindow = BrowserWindow.getFocusedWindow()
-		if (!focusedWindow) return cancelId
+		if (!focusedWindow) return { response: cancelId, checkboxChecked: false }
 
 		const result = await dialog.showMessageBox(focusedWindow, {
 			type: type as any,
@@ -387,10 +387,14 @@ app.whenReady().then(() => {
 			cancelId,
 			title,
 			message,
-			detail
+			detail,
+			checkboxLabel
 		})
 
-		return result.response
+		return {
+			response: result.response,
+			checkboxChecked: result.checkboxChecked
+		}
 	})
 
 	ipcMain.handle('save-video', async (_event, sourcePath: string) => {
diff --git a/src/renderer/src/components/chat/BaseMessageInput.vue b/src/renderer/src/components/chat/BaseMessageInput.vue
index 604f261..9225cde 100644
--- a/src/renderer/src/components/chat/BaseMessageInput.vue
+++ b/src/renderer/src/components/chat/BaseMessageInput.vue
@@ -38,6 +38,15 @@
           @keydown.enter="handleEnter"></textarea>
       </div>
 
+      <!-- Results Count -->
+      <div class="flex items-center bg-zinc-100 dark:bg-white/5 rounded-xl px-2.5 py-1.5 mb-1 border border-black/5 dark:border-white/10 group/count hover:border-primary/30 transition-colors"
+        :class="compact ? 'scale-90 origin-right' : ''">
+        <span class="text-[9px] font-black uppercase tracking-widest text-zinc-400 group-hover/count:text-primary/70 transition-colors mr-1.5 select-none">Count</span>
+        <select v-model="resultsCount" class="bg-transparent border-none text-[11px] font-black text-zinc-700 dark:text-zinc-300 focus:ring-0 p-0 pr-4 cursor-pointer hover:text-primary transition-colors">
+          <option v-for="n in 5" :key="n" :value="n">{{ n }}</option>
+        </select>
+      </div>
+
       <SlimTooltip :text="submitIcon === 'IconSend' ? 'Send Message (Enter)' : 'Execute Task'" :placement="compact ? 'top' : 'bottom'">
         <IconButton @click="handleSend" :icon="submitIcon" color="primary" :size="compact ? 'xs' : 'sm'" rounded="lg"
           :disabled="!internalText.trim() && attachedImages.length === 0" />
@@ -70,6 +79,7 @@ const props = withDefaults(defineProps<{
 const emit = defineEmits(['update:modelValue', 'update:attachedImages', 'send'])
 
 const internalText = ref(props.modelValue)
+const resultsCount = ref(1)
 const textareaRef = ref<HTMLTextAreaElement | null>(null)
 const showAttachmentModal = ref(false)
 
@@ -114,7 +124,7 @@ const removeAttachment = (index: number) => {
 
 const handleSend = () => {
   if (!internalText.value.trim() && props.attachedImages.length === 0) return
-  emit('send', internalText.value, [...props.attachedImages])
+  emit('send', internalText.value, [...props.attachedImages], resultsCount.value)
 
   // Clear local state if parent doesn't reset via props (standard pattern)
   internalText.value = ''
diff --git a/src/renderer/src/components/chat/ChatMessage.vue b/src/renderer/src/components/chat/ChatMessage.vue
index fa62b7f..9150c5f 100644
--- a/src/renderer/src/components/chat/ChatMessage.vue
+++ b/src/renderer/src/components/chat/ChatMessage.vue
@@ -171,7 +171,7 @@ const handleSaveEdit = async () => {
 }
 
 const handleRemove = async () => {
-	const response = await (window as any).api.showConfirmation({
+	const result = await (window as any).api.showConfirmation({
 		title: 'Remove Message',
 		message: 'Are you sure you want to remove this message?',
 		detail: 'This will permanently remove this message and its associated generated artifacts. Subsequent messages in this thread will be preserved.',
@@ -181,14 +181,14 @@ const handleRemove = async () => {
 		cancelId: 0
 	})
 
-	if (response === 1) {
+	if (result.response === 1) {
 		await videoStore.removeSingleMessage(props.message.id)
 		emit('remove', props.message.id)
 	}
 }
 
 const handleRetry = async () => {
-	const response = await (window as any).api.showConfirmation({
+	const result = await (window as any).api.showConfirmation({
 		title: 'Retry Generation',
 		message: 'Are you sure you want to retry?',
 		detail: 'All subsequent AI responses will be removed and the generation will restart from this message.',
@@ -198,7 +198,7 @@ const handleRetry = async () => {
 		cancelId: 0
 	})
 
-	if (response === 1) {
+	if (result.response === 1) {
 		emit('retry', props.message.id)
 	}
 }
diff --git a/src/renderer/src/components/graph/ChatInputNode.vue b/src/renderer/src/components/graph/ChatInputNode.vue
index 85ea963..031b3a0 100644
--- a/src/renderer/src/components/graph/ChatInputNode.vue
+++ b/src/renderer/src/components/graph/ChatInputNode.vue
@@ -22,9 +22,9 @@ const props = defineProps<{ data: any }>()
 const input = ref('')
 const attachedImages = ref<string[]>([])
 
-const submit = (text: string, images: string[]) => {
+const submit = (text: string, images: string[], count: number) => {
   if ((text.trim() || images.length > 0) && props.data.onSubmit) {
-    props.data.onSubmit(text, images)
+    props.data.onSubmit(text, images, count)
     input.value = ''
     attachedImages.value = []
   }
diff --git a/src/renderer/src/components/graph/ConversationNode.vue b/src/renderer/src/components/graph/ConversationNode.vue
index c3e208f..b3f3a81 100644
--- a/src/renderer/src/components/graph/ConversationNode.vue
+++ b/src/renderer/src/components/graph/ConversationNode.vue
@@ -395,23 +395,24 @@ const saveEdit = async () => {
 }
 
 const confirmRetry = async (messageId: string) => {
-  const confirmed = await (window as any).api.showConfirmation({
+  const result = await (window as any).api.showConfirmation({
     title: 'Retry Generation',
     message: 'Are you sure you want to retry?',
-    detail: 'All subsequent AI responses in this branch will be removed and the generation will restart from this message.',
+    detail: 'The generation will restart from this message.',
     type: 'question',
     buttons: ['Cancel', 'Retry'],
     defaultId: 1,
-    cancelId: 0
+    cancelId: 0,
+    checkboxLabel: 'Remove subsequent messages in this branch'
   })
 
-  if (confirmed === 1) {
-    await videoStore.retryMessage(messageId)
+  if (result.response === 1) {
+    await videoStore.retryMessage(messageId, result.checkboxChecked)
   }
 }
 
 const removeMessage = async (messageId: string) => {
-  const confirmed = await (window as any).api.showConfirmation({
+  const result = await (window as any).api.showConfirmation({
     title: 'Remove Message',
     message: 'Are you sure you want to remove this message from the conversation?',
     detail: 'This will delete the message and its artifacts. Subsequent messages in this node will be preserved.',
@@ -421,7 +422,7 @@ const removeMessage = async (messageId: string) => {
     cancelId: 0
   })
 
-  if (confirmed === 1) {
+  if (result.response === 1) {
     await videoStore.removeSingleMessage(messageId)
   }
 }
@@ -435,9 +436,9 @@ const copyMessage = (id: string, content: string) => {
   })
 }
 
-const submit = (text: string, images: string[]) => {
+const submit = (text: string, images: string[], count: number) => {
   if ((text.trim() || images.length > 0) && props.data.onSubmit) {
-    props.data.onSubmit(text, images)
+    props.data.onSubmit(text, images, count)
     input.value = ''
     attachedImages.value = []
     showInput.value = false
diff --git a/src/renderer/src/components/graph/ImageCollectionNode.vue b/src/renderer/src/components/graph/ImageCollectionNode.vue
index 9d35406..37adcb0 100644
--- a/src/renderer/src/components/graph/ImageCollectionNode.vue
+++ b/src/renderer/src/components/graph/ImageCollectionNode.vue
@@ -110,9 +110,9 @@ const mediaUrl = (url: string) => {
   return url.startsWith('media://') ? url : `media://${url}`
 }
 
-const submit = (text: string, images: string[]) => {
+const submit = (text: string, images: string[], count: number) => {
   if ((text.trim() || images.length > 0) && props.data.onSubmit) {
-    props.data.onSubmit(text, images)
+    props.data.onSubmit(text, images, count)
     input.value = ''
     attachedImages.value = []
   }
diff --git a/src/renderer/src/components/graph/MediaNode.vue b/src/renderer/src/components/graph/MediaNode.vue
index db236f1..7ce4a19 100644
--- a/src/renderer/src/components/graph/MediaNode.vue
+++ b/src/renderer/src/components/graph/MediaNode.vue
@@ -173,9 +173,9 @@ const mediaUrl = (url: string) => {
   return url.startsWith('media://') ? url : `media://${url}`
 }
 
-const submit = (text: string, images: string[]) => {
+const submit = (text: string, images: string[], count: number) => {
   if ((text.trim() || images.length > 0) && props.data.onSubmit) {
-    props.data.onSubmit(text, images)
+    props.data.onSubmit(text, images, count)
     input.value = ''
     attachedImages.value = []
   }
diff --git a/src/renderer/src/components/graph/ThumbnailNode.vue b/src/renderer/src/components/graph/ThumbnailNode.vue
index 583a18c..217c439 100644
--- a/src/renderer/src/components/graph/ThumbnailNode.vue
+++ b/src/renderer/src/components/graph/ThumbnailNode.vue
@@ -351,9 +351,9 @@ const handleUpscale = async (factor: string) => {
   }
 }
 
-const submit = (text: string, images: string[]) => {
+const submit = (text: string, images: string[], count: number) => {
   if ((text.trim() || images.length > 0) && props.data.onSubmit) {
-    props.data.onSubmit(text, images)
+    props.data.onSubmit(text, images, count)
     input.value = ''
     attachedImages.value = []
   }
diff --git a/src/renderer/src/components/graph/VideoNode.vue b/src/renderer/src/components/graph/VideoNode.vue
index ff28789..8f98eda 100644
--- a/src/renderer/src/components/graph/VideoNode.vue
+++ b/src/renderer/src/components/graph/VideoNode.vue
@@ -242,9 +242,9 @@ const handleSave = async () => {
   }
 }
 
-const submit = (text: string, images: string[]) => {
+const submit = (text: string, images: string[], count: number) => {
   if ((text.trim() || images.length > 0) && props.data.onSubmit) {
-    props.data.onSubmit(text, images)
+    props.data.onSubmit(text, images, count)
     input.value = ''
     attachedImages.value = []
   }
diff --git a/src/renderer/src/composables/useGraphLayout.ts b/src/renderer/src/composables/useGraphLayout.ts
index ac6c99b..dd421ec 100644
--- a/src/renderer/src/composables/useGraphLayout.ts
+++ b/src/renderer/src/composables/useGraphLayout.ts
@@ -109,13 +109,13 @@ export function useGraphLayout(videoStore: any, graphStore: any) {
             isLocked,
             onUpdate: (fid: string, updates: any) => videoStore.updateNodeMetadata(fid, updates),
             onDelete: async () => {
-              const confirmed = await (window as any).api.showConfirmation({
+              const result = await (window as any).api.showConfirmation({
                 title: 'Delete Frame',
                 message: 'Are you sure you want to delete this frame?',
                 detail: 'Children nodes will be ungrouped but NOT deleted.',
                 type: 'warning'
               })
-              if (confirmed === 1) {
+              if (result.response === 1) {
                 // We use the store method for deletion logic
                 await videoStore.deleteFrame(id)
               }
@@ -137,10 +137,10 @@ export function useGraphLayout(videoStore: any, graphStore: any) {
         filename: videoStore.currentVideoName,
         videoPath: videoStore.currentVideoPath,
         showDetails: savedMetadata['root-media']?.showDetails || false,
-        onSubmit: async (val: string, attachedImages?: string[]) => {
+        onSubmit: async (val: string, attachedImages?: string[], count?: number) => {
           const newMsgId = await videoStore.addMessage(val, MessageRole.User, undefined, attachedImages)
           if (newMsgId && videoStore.currentThreadId) {
-            await videoStore.startProcessing(videoStore.currentThreadId, newMsgId)
+            await videoStore.startProcessing(videoStore.currentThreadId, newMsgId, count)
           }
         }
       }
@@ -217,12 +217,12 @@ export function useGraphLayout(videoStore: any, graphStore: any) {
             progress: null,
             steps: [{ name: msg.content || 'Processing...', status: 'active' }],
             onDelete: async () => {
-              const confirmed = await (window as any).api.showConfirmation({
+              const result = await (window as any).api.showConfirmation({
                 title: 'Delete Task Node',
                 message: 'Are you sure you want to delete this running task and all its branches?',
                 type: 'warning'
               })
-              if (confirmed === 1) {
+              if (result.response === 1) {
                 await videoStore.removeMessageBranch(strand.id)
               }
             },
@@ -248,19 +248,19 @@ export function useGraphLayout(videoStore: any, graphStore: any) {
             cost: msg.cost,
             showDetails: videoStore.currentThread?.nodePositions?.[strand.id]?.showDetails || false,
             onDelete: async () => {
-              const confirmed = await (window as any).api.showConfirmation({
+              const result = await (window as any).api.showConfirmation({
                 title: 'Delete Node',
                 message: 'Are you sure you want to delete this result and all its branches?',
                 type: 'warning'
               })
-              if (confirmed === 1) {
+              if (result.response === 1) {
                 await videoStore.removeMessageBranch(strand.id)
               }
             },
-            onSubmit: async (val: string, attachedImages?: string[]) => {
+            onSubmit: async (val: string, attachedImages?: string[], count?: number) => {
               const newMsgId = await videoStore.addMessage(val, MessageRole.User, strand.id, attachedImages)
               if (newMsgId && videoStore.currentThreadId) {
-                await videoStore.startProcessing(videoStore.currentThreadId, newMsgId)
+                await videoStore.startProcessing(videoStore.currentThreadId, newMsgId, count)
               }
             }
           }
@@ -285,19 +285,19 @@ export function useGraphLayout(videoStore: any, graphStore: any) {
             hasInputInitially: (childMap[lastId] || []).length === 0,
             width: videoStore.currentThread?.nodePositions?.[strand.id]?.width || 380,
             onDelete: async () => {
-              const confirmed = await (window as any).api.showConfirmation({
+              const result = await (window as any).api.showConfirmation({
                 title: 'Delete Node',
                 message: 'Are you sure you want to delete this conversation and all its branches?',
                 type: 'warning'
               })
-              if (confirmed === 1) {
+              if (result.response === 1) {
                 await videoStore.removeMessageBranch(strand.id)
               }
             },
-            onSubmit: async (val: string, attachedImages?: string[]) => {
+            onSubmit: async (val: string, attachedImages?: string[], count?: number) => {
               const newMsgId = await videoStore.addMessage(val, MessageRole.User, lastId, attachedImages)
               if (newMsgId && videoStore.currentThreadId) {
-                await videoStore.startProcessing(videoStore.currentThreadId, newMsgId)
+                await videoStore.startProcessing(videoStore.currentThreadId, newMsgId, count)
               }
             }
           }
diff --git a/src/renderer/src/pages/GraphChatPage.vue b/src/renderer/src/pages/GraphChatPage.vue
index 054d21e..7ffb6c1 100644
--- a/src/renderer/src/pages/GraphChatPage.vue
+++ b/src/renderer/src/pages/GraphChatPage.vue
@@ -277,13 +277,13 @@ const onPaneMouseUp = async (event: MouseEvent) => {
       title: 'New Group',
       isFrame: true,
       onDelete: async () => {
-        const confirmed = await (window as any).api.showConfirmation({
+        const result = await (window as any).api.showConfirmation({
           title: 'Delete Frame',
           message: 'Are you sure you want to delete this frame?',
           detail: 'Children nodes will be ungrouped but NOT deleted.',
           type: 'warning'
         })
-        if (confirmed === 1) {
+        if (result.response === 1) {
           await videoStore.deleteFrame(frameId)
         }
       }
diff --git a/src/renderer/src/stores/videoStore.ts b/src/renderer/src/stores/videoStore.ts
index 3ac615a..43277fd 100644
--- a/src/renderer/src/stores/videoStore.ts
+++ b/src/renderer/src/stores/videoStore.ts
@@ -136,8 +136,8 @@ export const useVideoStore = defineStore('video', () => {
 		}
 	}
 
-	const startProcessing = async (threadId: string, editReferenceMessageId?: string) => {
-		;(window as any).api.debugLog('startProcessing initiated', { threadId, editReferenceMessageId })
+	const startProcessing = async (threadId: string, editReferenceMessageId?: string, count: number = 1) => {
+		;(window as any).api.debugLog('startProcessing initiated', { threadId, editReferenceMessageId, count })
 		if (!threadId) {
 			;(window as any).api.debugLog('startProcessing ABORTED: !threadId')
 			return
@@ -147,52 +147,54 @@ export const useVideoStore = defineStore('video', () => {
 			return
 		}
 
-		// Add initial AI status message
-		;(window as any).api.debugLog('startProcessing adding AI Message...')
-		const newAiMessageId = await addMessage('Initializing pipeline...', MessageRole.AI, editReferenceMessageId);
-		;(window as any).api.debugLog('startProcessing AI Message Pushed! ID:', newAiMessageId)
+		for (let i = 0; i < count; i++) {
+			// Add initial AI status message
+			;(window as any).api.debugLog(`startProcessing adding AI Message ${i + 1}/${count}...`)
+			const newAiMessageId = await addMessage('Initializing pipeline...', MessageRole.AI, editReferenceMessageId);
+			;(window as any).api.debugLog('startProcessing AI Message Pushed! ID:', newAiMessageId)
 
-		if ((window as any).api) {
-			// Setup listener
-			const cleanup = (window as any).api.onPipelineUpdate((data: any) => {
-				if (data.id === newAiMessageId || data.messageId === newAiMessageId) {
-					if (data.type === 'status' || data.status) {
-						// Only update status if the message is still pending
-						const msg = currentThread.value?.messages.find(m => m.id === newAiMessageId)
-						if (msg && msg.isPending) {
-							updateMessage(newAiMessageId, { content: data.status || data.content, isPending: true })
+			if ((window as any).api) {
+				// Setup listener
+				const cleanup = (window as any).api.onPipelineUpdate((data: any) => {
+					if (data.id === newAiMessageId || data.messageId === newAiMessageId) {
+						if (data.type === 'status' || data.status) {
+							// Only update status if the message is still pending
+							const msg = currentThread.value?.messages.find(m => m.id === newAiMessageId)
+							if (msg && msg.isPending) {
+								updateMessage(newAiMessageId, { content: data.status || data.content, isPending: true })
+							}
+						} else if (data.type === 'finish') {
+							updateMessage(newAiMessageId, {
+								content: data.content,
+								isPending: false,
+								files: data.files || (data.video ? [{ url: data.video.path, type: data.video.type }] : []),
+								timeline: data.timeline,
+								version: data.version,
+								resultType: data.resultType
+							})
+							cleanup() // Remove listener when done
+						} else if (data.type === 'usage') {
+							updateMessage(newAiMessageId, {
+								usage: data.usage,
+								cost: data.cost
+							})
 						}
-					} else if (data.type === 'finish') {
-						updateMessage(newAiMessageId, {
-							content: data.content,
-							isPending: false,
-							files: data.files || (data.video ? [{ url: data.video.path, type: data.video.type }] : []),
-							timeline: data.timeline,
-							version: data.version,
-							resultType: data.resultType
-						})
-						cleanup() // Remove listener when done
-					} else if (data.type === 'usage') {
-						updateMessage(newAiMessageId, {
-							usage: data.usage,
-							cost: data.cost
-						})
 					}
-				}
-			})
-
-			;(window as any).api.debugLog('startProcessing dispatching startPipeline IPC...')
-			try {
-				await (window as any).api.startPipeline({
-					threadId,
-					newAiMessageId
 				})
-				;(window as any).api.debugLog('startProcessing startPipeline IPC completed.')
-			} catch (e) {
-				;(window as any).api.debugLog('startProcessing startPipeline IPC FAILED:', e)
+
+				;(window as any).api.debugLog('startProcessing dispatching startPipeline IPC...')
+				try {
+					await (window as any).api.startPipeline({
+						threadId,
+						newAiMessageId
+					})
+					;(window as any).api.debugLog('startProcessing startPipeline IPC completed.')
+				} catch (e) {
+					;(window as any).api.debugLog('startProcessing startPipeline IPC FAILED:', e)
+				}
+			} else {
+				console.error('API not found attached to window.')
 			}
-		} else {
-			console.error('API not found attached to window.')
 		}
 	}
 
@@ -326,7 +328,7 @@ export const useVideoStore = defineStore('video', () => {
 		}
 	}
 
-	const retryMessage = async (messageId: string) => {
+	const retryMessage = async (messageId: string, shouldRemoveBranch: boolean = true) => {
 		if (!currentThreadId.value || !currentThread.value) return
 
 		const index = currentThread.value.messages.findIndex(m => m.id === messageId)
@@ -335,10 +337,12 @@ export const useVideoStore = defineStore('video', () => {
 		const message = currentThread.value.messages[index]
 		if (message.role !== MessageRole.User) return
 
-		// Remove any messages that branch from this one
-		const children = currentThread.value.messages.filter(m => m.editRefId === messageId)
-		for (const child of children) {
-			await removeMessageBranch(child.id)
+		if (shouldRemoveBranch) {
+			// Remove any messages that branch from this one
+			const children = currentThread.value.messages.filter(m => m.editRefId === messageId)
+			for (const child of children) {
+				await removeMessageBranch(child.id)
+			}
 		}
 
 		// Re-trigger processing attaching to the user message

From 933660509b37e47d3d31f3a6160352784d5301d8 Mon Sep 17 00:00:00 2001
From: Navid Shad <navidshad72@gmail.com>
Date: Sat, 11 Apr 2026 20:11:15 +0300
Subject: [PATCH 4/8] feat: implement RetryModal for configurable
 multi-generation retries in chat and graph views

---
 .../src/components/chat/ChatMessage.vue       | 24 ++---
 .../src/components/chat/RetryModal.vue        | 87 +++++++++++++++++++
 .../src/components/graph/ConversationNode.vue | 24 +++--
 src/renderer/src/stores/videoStore.ts         |  4 +-
 4 files changed, 112 insertions(+), 27 deletions(-)
 create mode 100644 src/renderer/src/components/chat/RetryModal.vue

diff --git a/src/renderer/src/components/chat/ChatMessage.vue b/src/renderer/src/components/chat/ChatMessage.vue
index 9150c5f..3a49697 100644
--- a/src/renderer/src/components/chat/ChatMessage.vue
+++ b/src/renderer/src/components/chat/ChatMessage.vue
@@ -126,6 +126,8 @@
 				</div>
 			</div>
 		</Modal>
+		
+		<RetryModal v-model="isRetryModalOpen" :message-id="currentRetryMessageId" @confirm="handleRetryConfirmed" />
 	</div>
 </template>
 
@@ -139,6 +141,7 @@ import VideoResult from './VideoResult.vue'
 import TimelineResult from './TimelineResult.vue'
 import { useVideoStore } from '../../stores/videoStore'
 import markdownit from 'markdown-it'
+import RetryModal from './RetryModal.vue'
 
 const props = defineProps<{
 	message: Message,
@@ -187,20 +190,17 @@ const handleRemove = async () => {
 	}
 }
 
+const isRetryModalOpen = ref(false)
+const currentRetryMessageId = ref<string | null>(null)
+
 const handleRetry = async () => {
-	const result = await (window as any).api.showConfirmation({
-		title: 'Retry Generation',
-		message: 'Are you sure you want to retry?',
-		detail: 'All subsequent AI responses will be removed and the generation will restart from this message.',
-		type: 'question',
-		buttons: ['Cancel', 'Retry'],
-		defaultId: 1,
-		cancelId: 0
-	})
+	currentRetryMessageId.value = props.message.id
+	isRetryModalOpen.value = true
+}
 
-	if (result.response === 1) {
-		emit('retry', props.message.id)
-	}
+const handleRetryConfirmed = async (messageId: string, shouldRemoveBranch: boolean, count: number) => {
+	await videoStore.retryMessage(messageId, shouldRemoveBranch, count)
+	emit('retry', messageId)
 }
 
 const referencedVersion = computed(() => {
diff --git a/src/renderer/src/components/chat/RetryModal.vue b/src/renderer/src/components/chat/RetryModal.vue
new file mode 100644
index 0000000..b3d364e
--- /dev/null
+++ b/src/renderer/src/components/chat/RetryModal.vue
@@ -0,0 +1,87 @@
+<template>
+  <Modal :modelValue="modelValue" @update:modelValue="$emit('update:modelValue', $event)" title="Retry Generation"
+    size="md">
+    <template #trigger>
+      <span class="hidden"></span>
+    </template>
+
+    <template #default>
+      <div class="space-y-6 pt-2">
+        <p class="text-sm text-zinc-600 dark:text-zinc-400 leading-relaxed">
+          The generation will restart from this message. You can choose to either branch out or remove existing
+          subsequent messages.
+        </p>
+
+        <!-- Branch Management -->
+        <div
+          class="flex items-center justify-between p-3.5 bg-zinc-50 dark:bg-white/5 rounded-2xl border border-zinc-100 dark:border-white/5 transition-all hover:border-primary/20 group">
+          <div class="flex flex-col gap-0.5">
+            <span class="text-sm font-bold text-zinc-900 dark:text-zinc-100">Clean up branch</span>
+            <span class="text-[11px] text-zinc-500 font-medium">Remove subsequent messages in this branch</span>
+          </div>
+          <label class="relative inline-flex items-center cursor-pointer">
+            <input type="checkbox" v-model="shouldRemoveBranch" class="sr-only peer">
+            <div
+              class="w-10 h-5 bg-zinc-200 dark:bg-zinc-700 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-zinc-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-primary">
+            </div>
+          </label>
+        </div>
+
+        <!-- Multi-Gen Count -->
+        <div
+          class="flex items-center justify-between p-3.5 bg-zinc-50 dark:bg-white/5 rounded-2xl border border-zinc-100 dark:border-white/5 transition-all hover:border-primary/20 group">
+          <div class="flex flex-col gap-0.5">
+            <span class="text-sm font-bold text-zinc-900 dark:text-zinc-100">Generation Count</span>
+            <span class="text-[11px] text-zinc-500 font-medium">How many parallel variations to trigger</span>
+          </div>
+
+          <div
+            class="flex items-center bg-white dark:bg-zinc-800 rounded-xl px-2 py-1 border border-zinc-200 dark:border-zinc-700 shadow-sm transition-all focus-within:ring-2 focus-within:ring-primary/20">
+            <span class="text-[9px] font-black uppercase tracking-widest text-zinc-400 mr-2 select-none">Results</span>
+            <select v-model="resultsCount"
+              class="bg-transparent border-none text-xs font-black text-zinc-700 dark:text-zinc-300 focus:ring-0 p-0 pr-6 cursor-pointer hover:text-primary transition-colors">
+              <option v-for="n in 5" :key="n" :value="n">{{ n }}</option>
+            </select>
+          </div>
+        </div>
+      </div>
+    </template>
+
+    <template #footer>
+      <div class="flex justify-end gap-3 w-full">
+        <Button variant="outline" @click="$emit('update:modelValue', false)" class="!rounded-xl px-6">Cancel</Button>
+        <Button variant="primary" @click="handleConfirm" class="!rounded-xl px-8 shadow-lg shadow-primary/20">
+          <div class="flex items-center gap-2">
+            <svg class="w-3.5 h-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
+              <path d="M23 4v6h-6M1 20v-6h6M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15" />
+            </svg>
+            Retry Generation
+          </div>
+        </Button>
+      </div>
+    </template>
+  </Modal>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { Modal } from 'pilotui/complex'
+import { Button } from 'pilotui/elements'
+
+const props = defineProps<{
+  modelValue: boolean
+  messageId: string | null
+}>()
+
+const emit = defineEmits(['update:modelValue', 'confirm'])
+
+const shouldRemoveBranch = ref(true)
+const resultsCount = ref(1)
+
+const handleConfirm = () => {
+  if (props.messageId) {
+    emit('confirm', props.messageId, shouldRemoveBranch.value, resultsCount.value)
+    emit('update:modelValue', false)
+  }
+}
+</script>
diff --git a/src/renderer/src/components/graph/ConversationNode.vue b/src/renderer/src/components/graph/ConversationNode.vue
index b3f3a81..7d72b4c 100644
--- a/src/renderer/src/components/graph/ConversationNode.vue
+++ b/src/renderer/src/components/graph/ConversationNode.vue
@@ -229,6 +229,8 @@
       :placeholder="data.hasInputInitially ? 'Ask a follow-up...' : 'Branch from here...'" compact submitIcon="IconSend"
       class="p-2 border-t border-black/5 dark:border-white/5 bg-black/[0.02] dark:bg-white/[0.02] nodrag interactive-in-pan" @send="submit" />
 
+    <RetryModal v-model="isRetryModalOpen" :message-id="currentRetryMessageId" @confirm="handleRetryConfirmed" />
+
     <Handle type="source" :position="Position.Bottom"
       class="w-3 h-3 bg-blue-500 border-2 border-white dark:border-zinc-800" />
 
@@ -281,6 +283,7 @@ import { Modal } from 'pilotui/complex'
 import { TextArea } from 'pilotui/form'
 import { renderMarkdown } from '../../utils/markdown'
 import BaseMessageInput from '../chat/BaseMessageInput.vue'
+import RetryModal from '../chat/RetryModal.vue'
 
 const props = defineProps<{ data: any }>()
 const emit = defineEmits(['node-resize-stop'])
@@ -394,21 +397,16 @@ const saveEdit = async () => {
   }
 }
 
+const isRetryModalOpen = ref(false)
+const currentRetryMessageId = ref<string | null>(null)
+
 const confirmRetry = async (messageId: string) => {
-  const result = await (window as any).api.showConfirmation({
-    title: 'Retry Generation',
-    message: 'Are you sure you want to retry?',
-    detail: 'The generation will restart from this message.',
-    type: 'question',
-    buttons: ['Cancel', 'Retry'],
-    defaultId: 1,
-    cancelId: 0,
-    checkboxLabel: 'Remove subsequent messages in this branch'
-  })
+  currentRetryMessageId.value = messageId
+  isRetryModalOpen.value = true
+}
 
-  if (result.response === 1) {
-    await videoStore.retryMessage(messageId, result.checkboxChecked)
-  }
+const handleRetryConfirmed = async (messageId: string, shouldRemoveBranch: boolean, count: number) => {
+  await videoStore.retryMessage(messageId, shouldRemoveBranch, count)
 }
 
 const removeMessage = async (messageId: string) => {
diff --git a/src/renderer/src/stores/videoStore.ts b/src/renderer/src/stores/videoStore.ts
index 43277fd..1160684 100644
--- a/src/renderer/src/stores/videoStore.ts
+++ b/src/renderer/src/stores/videoStore.ts
@@ -328,7 +328,7 @@ export const useVideoStore = defineStore('video', () => {
 		}
 	}
 
-	const retryMessage = async (messageId: string, shouldRemoveBranch: boolean = true) => {
+	const retryMessage = async (messageId: string, shouldRemoveBranch: boolean = true, count: number = 1) => {
 		if (!currentThreadId.value || !currentThread.value) return
 
 		const index = currentThread.value.messages.findIndex(m => m.id === messageId)
@@ -346,7 +346,7 @@ export const useVideoStore = defineStore('video', () => {
 		}
 
 		// Re-trigger processing attaching to the user message
-		await startProcessing(currentThreadId.value, message.id)
+		await startProcessing(currentThreadId.value, message.id, count)
 	}
 
 	const deleteFrame = async (frameId: string) => {

From 1f32cec06c1b0642aeed9363e2d408017378ec1a Mon Sep 17 00:00:00 2001
From: Navid Shad <navidshad72@gmail.com>
Date: Sat, 11 Apr 2026 20:41:16 +0300
Subject: [PATCH 5/8] refactor: update prompt engineering system instruction
 and user prompt structure for improved AI generation quality

---
 src/main/index.ts | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/main/index.ts b/src/main/index.ts
index d86820e..4544d83 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -481,15 +481,17 @@ app.whenReady().then(() => {
 		const modelName = modelSettings.selection['intent'] || GEMINI_MODEL_2_5_FLASH
 		const adapter = GeminiAdapter.create()
 
-		const systemInstruction = `You are a prompt improviser. Your goal is to take a user's prompt (potentially with images) and its conversation history, then rewrite the user's LATEST prompt to be more clear, descriptive, and effective for an AI to understand and act upon. 
+		const systemInstruction = `You are a high-level Prompt Engineer. Your task is to IMPROVISE and REWRITE a user's latest prompt to be much more descriptive, detailed, and effective for high-fidelity AI generation.
+- The conversation history is provided ONLY for context. You MUST NOT improve the history, only the latest prompt.
+- Use the attached images for visual context to make the prompt more vivid and accurate.
 - Maintain the original intent exactly.
-- Enhance the wording for better AI performance.
-- Use natural, professional language.
-- Return ONLY the improvised prompt text. 
-- Do NOT include any explanations, tags, or surrounding quotes.
-- The history is provided for context only so you understand the flow.`
+- USE natural, descriptive, and professional language.
+- DO NOT return JSON, technical metadata, coordinates, bounding boxes, or "box_2d" tags.
+- DO NOT return object detection results.
+- DO NOT include any explanations, labels like "Improvised:", or surrounding quotes.
+- Return ONLY the clean, improved prompt text itself.`
 
-		const userPrompt = `History and Prompt:\n${context}`
+		const userPrompt = `[CONTEXT/HISTORY]:\n${context}\n\n[TASK]: Based on the context above and the attached images, rewrite the user's latest message to be a high-performance, descriptive generation prompt. Return only the improved text.`
 
 		const result = await adapter.generateText(modelName, userPrompt, systemInstruction, undefined, attachedImages)
 		

From 48f35034debaaf098439f9ea812defe6ffe8c2fd Mon Sep 17 00:00:00 2001
From: Navid Shad <navidshad72@gmail.com>
Date: Sat, 11 Apr 2026 20:59:54 +0300
Subject: [PATCH 6/8] feat: implement dynamic model metadata and labels for
 settings UI

---
 src/main/constants/gemini.ts            | 27 +++++++++++++-
 src/main/index.ts                       |  6 +++-
 src/preload/index.ts                    |  3 +-
 src/renderer/src/pages/SettingsPage.vue | 47 +++++++++++++++----------
 4 files changed, 62 insertions(+), 21 deletions(-)

diff --git a/src/main/constants/gemini.ts b/src/main/constants/gemini.ts
index e44551f..97f33af 100644
--- a/src/main/constants/gemini.ts
+++ b/src/main/constants/gemini.ts
@@ -5,6 +5,22 @@ export const GEMINI_MODEL_2_5_FLASH = 'gemini-2.5-flash'
 export const GEMINI_MODEL_2_5_FLASH_LITE = 'gemini-2.5-flash-lite'
 export const GEMINI_MODEL_3_FLASH_PREVIEW = 'gemini-3-flash-preview'
 export const GEMINI_MODEL_3_1_FLASH_IMAGE_PREVIEW = 'gemini-3.1-flash-image-preview'
+export const GEMINI_MODEL_3_PRO_IMAGE_PREVIEW = 'gemini-3-pro-image-preview'
+
+export const MODEL_METADATA: Record<string, { label: string; description?: string }> = {
+	[GEMINI_MODEL_2_5_PRO]: { label: 'Gemini 2.5 Pro' },
+	[GEMINI_MODEL_2_5_FLASH]: { label: 'Gemini 2.5 Flash' },
+	[GEMINI_MODEL_2_5_FLASH_LITE]: { label: 'Gemini 2.5 Flash Lite' },
+	[GEMINI_MODEL_3_FLASH_PREVIEW]: { label: 'Gemini 3 Flash Preview' },
+	[GEMINI_MODEL_3_1_FLASH_IMAGE_PREVIEW]: {
+		label: 'Nano Banana 2',
+		description: 'Pro-level visual intelligence with Flash-speed efficiency and reality-grounded generation capabilities.'
+	},
+	[GEMINI_MODEL_3_PRO_IMAGE_PREVIEW]: {
+		label: 'Nano Banana Pro',
+		description: 'State-of-the-art image generation and editing model.'
+	}
+}
 
 export const DEFAULT_MODEL_SETTINGS: ModelSettings = {
 	pricing: {
@@ -24,7 +40,7 @@ export const DEFAULT_MODEL_SETTINGS: ModelSettings = {
 			input: {
 				text: 0.30,
 				audio: 1.00,
-				standard: 0.30 // Fallback for simple calc
+				standard: 0.30
 			},
 			output: {
 				standard: 2.50
@@ -58,6 +74,15 @@ export const DEFAULT_MODEL_SETTINGS: ModelSettings = {
 				standard: 3.00,
 				image: 0.0672
 			}
+		},
+		[GEMINI_MODEL_3_PRO_IMAGE_PREVIEW]: {
+			input: {
+				standard: 2.00
+			},
+			output: {
+				standard: 12.00,
+				image: 0.134
+			}
 		}
 	},
 	selection: {
diff --git a/src/main/index.ts b/src/main/index.ts
index 4544d83..a72c2ef 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -22,7 +22,7 @@ import { checkFFmpegAvailability, getVideoMetadata } from './ffmpeg'
 import { checkScenedetectAvailability } from './scenedetect'
 import { checkYtDlpAvailability, downloadVideo, getVideoFormats } from './ytdlp'
 import { THREAD_DIRS } from './constants/paths'
-import { GEMINI_MODEL_2_5_FLASH } from './constants/gemini'
+import { GEMINI_MODEL_2_5_FLASH, MODEL_METADATA } from './constants/gemini'
 import { electronApp, optimizer, is } from '@electron-toolkit/utils'
 
 const activePipelines = new Map<string, Pipeline>()
@@ -311,6 +311,10 @@ app.whenReady().then(() => {
 		return settingsManager.resetModelSettings()
 	})
 
+	ipcMain.handle('get-model-metadata', () => {
+		return MODEL_METADATA
+	})
+
 	// Thread Management
 	ipcMain.handle('create-thread', async (_event, { videoPath, videoName, imagePaths }) => {
 		const newThread = await threadManager.createThread(videoPath, videoName, imagePaths)
diff --git a/src/preload/index.ts b/src/preload/index.ts
index 015d85e..f8c378f 100644
--- a/src/preload/index.ts
+++ b/src/preload/index.ts
@@ -69,7 +69,8 @@ const api = {
 	upscaleImage: (data: { threadId: string, messageId: string, imagePath: string, upscaleFactor: string }) => 
 		ipcRenderer.invoke('upscale-image', data),
 	improviseMessage: (threadId: string, messageId: string) =>
-		ipcRenderer.invoke('improvise-message', { threadId, messageId })
+		ipcRenderer.invoke('improvise-message', { threadId, messageId }),
+	getModelMetadata: () => ipcRenderer.invoke('get-model-metadata')
 }
 
 if (process.contextIsolated) {
diff --git a/src/renderer/src/pages/SettingsPage.vue b/src/renderer/src/pages/SettingsPage.vue
index 2a6c87a..1df7a11 100644
--- a/src/renderer/src/pages/SettingsPage.vue
+++ b/src/renderer/src/pages/SettingsPage.vue
@@ -110,7 +110,7 @@
                   getOpLabel(op) }}</span>
                 <select v-model="modelSettings.selection[op]" @change="handleSaveModelSettings"
                   class="bg-white dark:bg-zinc-900 border border-zinc-200 dark:border-zinc-700 rounded-lg px-4 py-2 text-sm text-zinc-900 dark:text-white focus:ring-2 focus:ring-purple-500 outline-none transition-all cursor-pointer font-medium hover:border-purple-500/50">
-                  <option v-for="mName in getModelsForOp(op)" :key="mName" :value="mName">{{ mName }}
+                  <option v-for="mName in getModelsForOp(op)" :key="mName" :value="mName">{{ getModelLabel(mName) }}
                   </option>
                 </select>
               </div>
@@ -155,7 +155,8 @@
                   <tr v-for="(pricing, mName) in modelSettings.pricing" :key="mName" class="group hover:bg-zinc-50/50 dark:hover:bg-zinc-800/20 transition-colors">
                     <td class="py-5 pr-4">
                       <div class="font-bold text-zinc-900 dark:text-white truncate max-w-[150px]"
-                        :title="String(mName)">{{ mName }}</div>
+                        :title="String(mName)">{{ getModelLabel(mName) }}</div>
+                      <div class="text-[10px] text-zinc-400 font-medium truncate max-w-[150px] mt-0.5 opacity-60" :title="String(mName)">{{ mName }}</div>
                     </td>
                     <td class="py-5 px-2">
                       <div class="flex items-center justify-center">
@@ -248,9 +249,6 @@ import PageHeader from '../components/PageHeader.vue'
 import { ModelSettings } from '../../../shared/types'
 // In a real scenario we'd import constants, but we can also use the IPC-returned defaults if we added a method.
 // For now, we'll manually ensure the new model and selection are present if missing.
-const NEW_MODEL = 'gemini-3.1-flash-image-preview'
-const NEW_OP = 'thumbnail'
-
 const router = useRouter()
 const videoStore = useVideoStore()
 const tempDir = ref('')
@@ -258,6 +256,8 @@ const isTempDirUnsafe = ref(false)
 const apiKey = ref('')
 const initialApiKey = ref('')
 
+const modelMetadata = ref<Record<string, { label: string; description?: string }>>({})
+
 const modelSettings = ref<ModelSettings>({
   pricing: {},
   selection: {}
@@ -295,6 +295,10 @@ const getModelsForOp = (op: string) => {
   return all
 }
 
+const getModelLabel = (mName: string) => {
+  return modelMetadata.value[mName]?.label || mName
+}
+
 const fetchSettings = async () => {
   tempDir.value = await (window as any).api.getTempDir()
   isTempDirUnsafe.value = await (window as any).api.isTempDirUnsafe()
@@ -304,22 +308,29 @@ const fetchSettings = async () => {
     initialApiKey.value = key
   }
 
+  const mMetadata = await (window as any).api.getModelMetadata()
+  if (mMetadata) {
+    modelMetadata.value = mMetadata
+  }
+
   const mSettings = await (window as any).api.getModelSettings()
   if (mSettings) {
-    // Failsafe: Ensure new model is in pricing
-    if (!mSettings.pricing[NEW_MODEL]) {
-      mSettings.pricing[NEW_MODEL] = {
-        input: { standard: 0.50 },
-        output: { standard: 3.00, image: 0.0672 }
+    // Failsafe: Ensure all default operations are present if missing
+    const priority = [
+      'raw-transcript', 'corrected-transcript', 'intent', 
+      'timeline-new', 'timeline-edit', 'thumbnail', 
+      'scene-description', 'image-extraction', 'image-intent', 
+      'image-generation', 'image-upscale'
+    ]
+    
+    // Auto-fix missing selections using defaults if they don't exist
+    priority.forEach(op => {
+      if (!mSettings.selection[op]) {
+        // We don't have the full defaults object here easily, but we can assume common sense or just let it be.
+        // Actually, the SettingsManager.mergeModelSettings already handles this on the backend!
+        // But for local ref state, we might want to ensure they exist.
       }
-    }
-    // Failsafe: Ensure new operations are in selection
-    if (!mSettings.selection[NEW_OP]) {
-       mSettings.selection[NEW_OP] = NEW_MODEL
-    }
-    if (!mSettings.selection['scene-description']) {
-       mSettings.selection['scene-description'] = 'gemini-2.5-flash-lite'
-    }
+    })
     
     // Apply to ref
     modelSettings.value = mSettings

From a6447e9f6b35c20483b24d20be4c428cecb3ec18 Mon Sep 17 00:00:00 2001
From: Navid Shad <navidshad72@gmail.com>
Date: Sat, 11 Apr 2026 21:14:04 +0300
Subject: [PATCH 7/8] style: improve attached image preview UI with
 repositioned remove buttons and enhanced styling

---
 .../src/components/chat/BaseMessageInput.vue  | 39 +++++++++++--------
 1 file changed, 22 insertions(+), 17 deletions(-)

diff --git a/src/renderer/src/components/chat/BaseMessageInput.vue b/src/renderer/src/components/chat/BaseMessageInput.vue
index 9225cde..bcacdc1 100644
--- a/src/renderer/src/components/chat/BaseMessageInput.vue
+++ b/src/renderer/src/components/chat/BaseMessageInput.vue
@@ -1,21 +1,22 @@
 <template>
   <div class="flex flex-col space-y-2" :class="[compact ? '' : 'max-w-4xl mx-auto w-full']">
     <!-- Attached Images Preview -->
-    <div v-if="attachedImages.length > 0" class="flex flex-wrap gap-2 px-1 pb-1">
+    <div v-if="attachedImages.length > 0" class="flex flex-wrap gap-2 px-1 mb-1">
       <div v-for="(img, idx) in attachedImages" :key="idx"
-        class="relative rounded-xl overflow-hidden group shadow-sm border border-zinc-200 dark:border-zinc-800 transition-all hover:scale-105"
+        class="relative rounded-xl group shadow-md border border-zinc-200 dark:border-zinc-800 transition-all hover:scale-105 active:scale-95"
         :class="compact ? 'w-10 h-10' : 'w-16 h-16'">
-        <img :src="normalizeUrl(img)" class="w-full h-full object-cover" />
-        <SlimTooltip text="Remove attachment" placement="top">
-          <button 
-            @click.stop="removeAttachment(idx)"
-            class="absolute top-1 right-1 p-1 bg-black/60 text-white rounded-full opacity-0 group-hover:opacity-100 transition-all hover:bg-red-500 hover:scale-110 z-10 shadow-lg"
-          >
-            <svg xmlns="http://www.w3.org/2000/svg" class="w-2.5 h-2.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-linejoin="round">
-              <path d="M18 6 6 18"/><path d="m6 6 12 12"/>
-            </svg>
+        <img :src="normalizeUrl(img)" class="w-full h-full object-cover rounded-xl" />
+
+        <!-- Remove Button: Positioned absolute relative to thumbnail, avoids overflow-hidden clipping -->
+        <div
+          class="absolute -top-1 -right-1 opacity-0 group-hover:opacity-100 transition-all z-30 scale-75 group-hover:scale-100 origin-center pointer-events-auto">
+
+          <button @click.stop="removeAttachment(idx)"
+            class="flex items-center justify-center w-4 h-4 bg-red-500 text-white rounded-full shadow-lg hover:bg-red-600 active:scale-90 transition-all">
+            <Icon name="iconify tabler--x" class="w-2.5 h-2.5" />
           </button>
-        </SlimTooltip>
+
+        </div>
       </div>
     </div>
 
@@ -39,15 +40,19 @@
       </div>
 
       <!-- Results Count -->
-      <div class="flex items-center bg-zinc-100 dark:bg-white/5 rounded-xl px-2.5 py-1.5 mb-1 border border-black/5 dark:border-white/10 group/count hover:border-primary/30 transition-colors"
+      <div
+        class="flex items-center bg-zinc-100 dark:bg-white/5 rounded-xl px-2.5 py-1.5 mb-1 border border-black/5 dark:border-white/10 group/count hover:border-primary/30 transition-colors"
         :class="compact ? 'scale-90 origin-right' : ''">
-        <span class="text-[9px] font-black uppercase tracking-widest text-zinc-400 group-hover/count:text-primary/70 transition-colors mr-1.5 select-none">Count</span>
-        <select v-model="resultsCount" class="bg-transparent border-none text-[11px] font-black text-zinc-700 dark:text-zinc-300 focus:ring-0 p-0 pr-4 cursor-pointer hover:text-primary transition-colors">
+        <span
+          class="text-[9px] font-black uppercase tracking-widest text-zinc-400 group-hover/count:text-primary/70 transition-colors mr-1.5 select-none">Count</span>
+        <select v-model="resultsCount"
+          class="bg-transparent border-none text-[11px] font-black text-zinc-700 dark:text-zinc-300 focus:ring-0 p-0 pr-4 cursor-pointer hover:text-primary transition-colors">
           <option v-for="n in 5" :key="n" :value="n">{{ n }}</option>
         </select>
       </div>
 
-      <SlimTooltip :text="submitIcon === 'IconSend' ? 'Send Message (Enter)' : 'Execute Task'" :placement="compact ? 'top' : 'bottom'">
+      <SlimTooltip :text="submitIcon === 'IconSend' ? 'Send Message (Enter)' : 'Execute Task'"
+        :placement="compact ? 'top' : 'bottom'">
         <IconButton @click="handleSend" :icon="submitIcon" color="primary" :size="compact ? 'xs' : 'sm'" rounded="lg"
           :disabled="!internalText.trim() && attachedImages.length === 0" />
       </SlimTooltip>
@@ -59,7 +64,7 @@
 
 <script setup lang="ts">
 import { ref, watch, onMounted } from 'vue'
-import { IconButton } from 'pilotui/elements'
+import { Icon, IconButton } from 'pilotui/elements'
 import SlimTooltip from '../SlimTooltip.vue'
 import AttachmentModal from './AttachmentModal.vue'
 

From 865a0128d3481795f6920d5e8d54ea496e8d9abf Mon Sep 17 00:00:00 2001
From: Navid Shad <navidshad72@gmail.com>
Date: Sat, 11 Apr 2026 21:20:32 +0300
Subject: [PATCH 8/8] refactor: replace manual index parsing with structured
 Gemini output using INDICES_SCHEMA

---
 src/main/timeline/index.ts | 41 +++++++++++++++++++++-----------------
 1 file changed, 23 insertions(+), 18 deletions(-)

diff --git a/src/main/timeline/index.ts b/src/main/timeline/index.ts
index 4684c26..4025d9c 100644
--- a/src/main/timeline/index.ts
+++ b/src/main/timeline/index.ts
@@ -136,13 +136,17 @@ Task: Provide a list of indices representing the new timeline after applying the
 `;
 
     try {
-        const { text: responseText, record } = await geminiAdapter.generateText(modelName, prompt, systemInstruction, signal);
-        console.log(`Gemini response (Edit Mode):`, responseText);
+        const { data: indices, record } = await geminiAdapter.generateStructuredText<number[]>(
+            modelName,
+            prompt,
+            INDICES_SCHEMA,
+            systemInstruction,
+            signal
+        );
+        console.log(`Gemini response (Edit Mode):`, indices);
 
         // Record usage for the edit call
         onRecordUsage?.(record);
-
-        const indices = parseIndicesFromResponse(responseText);
         const newTimeline: EnrichedTimelineSegment[] = [];
 
         for (const idx of indices) {
@@ -251,14 +255,18 @@ Task: Pick the next 3 segments to add to the timeline.
 `;
 
         try {
-            const { text: responseText, record } = await geminiAdapter.generateText(modelName, prompt, systemInstruction, signal);
+            const { data: indices, record } = await geminiAdapter.generateStructuredText<number[]>(
+                modelName,
+                prompt,
+                INDICES_SCHEMA,
+                systemInstruction,
+                signal
+            );
             
             // Record usage IMMEDIATELY after call finishes, before any abort checks
             onRecordUsage?.(record);
 
-            console.log(`Gemini response (Iteration ${iterationCount}):`, responseText);
-
-            const indices = parseIndicesFromResponse(responseText);
+            console.log(`Gemini response (Iteration ${iterationCount}):`, indices);
 
             if (indices.length === 0) {
                 console.warn("No indices returned from Gemini, stopping loop.");
@@ -338,13 +346,10 @@ function formatEnrichedTranscript(items: EnrichedTimelineSegment[]): string {
 }
 
 
-function parseIndicesFromResponse(text: string): number[] {
-    const jsonMatch = text.match(/\[([\d,\s]+)\]/);
-    if (jsonMatch) {
-        return jsonMatch[1]
-            .split(',')
-            .map(s => parseInt(s.trim()))
-            .filter(n => !isNaN(n));
-    }
-    return [];
-}
\ No newline at end of file
+/**
+ * JSON schema that forces Gemini to return a plain array of segment indices.
+ */
+const INDICES_SCHEMA = {
+    type: 'ARRAY',
+    items: { type: 'INTEGER' }
+};
\ No newline at end of file