ui: make preset prompting more user friendly on fe (#4)

- ui: make preset prompting more user friendly on fe (0df64d5394854038780b8ea01ec7dcb371c724ec)

app_local.py

@@ -236,7 +236,24 @@ if is_xformers_available():
 else:
     print("xformers not available")
 
+# Function to update prompt preview when preset is selected
+def update_prompt_preview(preset_type, base_prompt):
+    """Update the prompt preview display based on selected preset and base prompt"""
+    if preset_type and preset_type in PRESETS:
+        preset = PRESETS[preset_type]
+        preview_text = f"**Preset: {preset_type}**\n\n"
+        preview_text += f"*{preset['description']}*\n\n"
+        preview_text += "**Generated Prompts:**\n"
+        
+        for i, preset_prompt in enumerate(preset["prompts"], 1):
+            full_prompt = f"{base_prompt}, {preset_prompt}"
+            preview_text += f"{i}. {full_prompt}\n"
+        
+        return preview_text
+    else:
+        return "Select a preset above to see how your base prompt will be modified for batch generation."
 
+        
 @spaces.GPU()
 def infer(
     image,
@@ -442,6 +459,15 @@ with gr.Blocks(title="Qwen Image Edit - Fast Lightning Mode w/ Batch") as demo:
                 interactive=True
             )
             
+            # Add prompt preview component
+            prompt_preview = gr.Textbox(
+                label="📋 Prompt Preview",
+                interactive=False,
+                lines=6,
+                max_lines=10,
+                value="Enter a base prompt and select a preset above to see how your prompt will be modified for batch generation.",
+                placeholder="Prompt preview will appear here..."
+            )
             run_button = gr.Button(
                 "Generate Edit(s)",
                 variant="primary"
@@ -495,6 +521,19 @@ with gr.Blocks(title="Qwen Image Edit - Fast Lightning Mode w/ Batch") as demo:
                 value="<div style='padding:15px; margin-top:15px'>"
                 "Prompt details will appear after generation</div>"
             )
+            
+    # Set up prompt preview update
+    preset_dropdown.change(
+        fn=update_prompt_preview,
+        inputs=[preset_dropdown, prompt],
+        outputs=prompt_preview
+    )
+    
+    prompt.change(
+        fn=update_prompt_preview,
+        inputs=[preset_dropdown, prompt],
+        outputs=prompt_preview
+    )
     
     # Set up processing
     inputs = [
@@ -506,7 +545,7 @@ with gr.Blocks(title="Qwen Image Edit - Fast Lightning Mode w/ Batch") as demo:
         num_inference_steps,
         rewrite_toggle,
         num_images_per_prompt,
-        preset_dropdown  # Add preset dropdown to inputs
+        preset_dropdown
     ]
     outputs = [result, seed, prompt_info]