Update app.py

app.py

@@ -174,6 +174,11 @@ def save_image(img: Image.Image) -> str:
     img.save(unique_name)
     return unique_name
 
+# Helper to generate a loading animation component.
+def loading_animation(message="Processing..."):
+    # Using Markdown to display an animated GIF for the loading animation.
+    return gr.Markdown(f"![Loading](https://media.giphy.com/media/sSgvbe1m3n93G/giphy.gif) {message}")
+
 @spaces.GPU
 def generate(
     input_dict: dict,
@@ -234,9 +239,12 @@ def generate(
             torch.cuda.empty_cache()
         
         selected_pipe = models.get(model_choice, pipe)
+        
+        # Yield a beautiful loading animation for image generation.
+        yield loading_animation("Generating image...")
+        
         images = selected_pipe(**options).images
         image_path = save_image(images[0])
-        yield "Generating image..."
         yield gr.Image(image_path)
         return
 
@@ -268,11 +276,14 @@ def generate(
         inputs = processor(text=[prompt], images=images, return_tensors="pt", padding=True).to("cuda")
         streamer = TextIteratorStreamer(processor, skip_prompt=True, skip_special_tokens=True)
         generation_kwargs = {**inputs, "streamer": streamer, "max_new_tokens": max_new_tokens}
+        
+        # Yield a beautiful loading animation for multimodal generation.
+        yield loading_animation("Thinking...")
+        
         thread = Thread(target=model_m.generate, kwargs=generation_kwargs)
         thread.start()
 
         buffer = ""
-        yield "Thinking..."
         for new_text in streamer:
             buffer += new_text
             buffer = buffer.replace("<|im_end|>", "")
@@ -296,6 +307,10 @@ def generate(
             "num_beams": 1,
             "repetition_penalty": repetition_penalty,
         }
+        
+        # Yield a beautiful loading animation for text generation.
+        yield loading_animation("Thinking...")
+        
         t = Thread(target=model.generate, kwargs=generation_kwargs)
         t.start()
 
@@ -327,6 +342,21 @@ h1 {
   background: #1565c0;
   border-radius: 100vh;
 }
+
+/* Loading spinner style (if you prefer a CSS spinner instead) */
+.spinner {
+  margin: 50px auto;
+  width: 50px;
+  height: 50px;
+  border: 6px solid #ddd;
+  border-top: 6px solid #1565c0;
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+}
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
 '''
 
 demo = gr.ChatInterface(