Update Gradio app with multiple files

app.py

@@ -3,37 +3,69 @@ import os
 from huggingface_hub import InferenceClient
 from pathlib import Path
 import tempfile
+import time
+from typing import Optional
+import shutil
 
-# Initialize the inference client
-client = InferenceClient(
-    provider="fal-ai",
-    api_key=os.environ.get("HF_TOKEN"),
-    bill_to="huggingface",
-)
+# -------------------------
+# Utilities
+# -------------------------
 
-def generate_video_with_auth(image, prompt, profile: gr.OAuthProfile | None, progress=gr.Progress()):
+def cleanup_temp_files():
+    try:
+        temp_dir = tempfile.gettempdir()
+        for file_path in Path(temp_dir).glob("*.mp4"):
+            try:
+                if file_path.stat().st_mtime < (time.time() - 300):
+                    file_path.unlink(missing_ok=True)
+            except Exception:
+                pass
+    except Exception as e:
+        print(f"Cleanup error: {e}")
+
+def _client_from_token(token: Optional[str]) -> InferenceClient:
+    if not token:
+        raise gr.Error("Please sign in first. This app requires your Hugging Face login.")
+    # IMPORTANT: do not set bill_to when using user OAuth tokens
+    return InferenceClient(
+        provider="fal-ai",
+        api_key=token,
+    )
+
+def _save_bytes_as_temp_mp4(data: bytes) -> str:
+    temp_file = tempfile.NamedTemporaryFile(suffix=".mp4", delete=False)
+    try:
+        temp_file.write(data)
+        temp_file.flush()
+        return temp_file.name
+    finally:
+        temp_file.close()
+
+def generate_video_with_auth(image, prompt, token: gr.OAuthToken | None, progress=gr.Progress()):
     """
     Generate a video from an image using the Ovi model with authentication check.
     
     Args:
         image: Input image (PIL Image or file path)
         prompt: Text prompt describing the desired motion/animation
-        profile: OAuth profile for authentication
+        token: OAuth token for authentication
         progress: Gradio progress tracker
     
     Returns:
-        Path to the generated video file
+        Tuple of (video_path, status_message)
     """
-    if profile is None:
-        raise gr.Error("Click Sign in with Hugging Face button to use this app for free")
-    
-    if image is None:
-        raise gr.Error("Please upload an image first!")
-    
-    if not prompt or prompt.strip() == "":
-        raise gr.Error("Please enter a prompt describing the desired motion!")
-    
     try:
+        if token is None or not getattr(token, "token", None):
+            return None, "❌ Sign in with Hugging Face to continue. This app uses your inference provider credits."
+        
+        if image is None:
+            return None, "Please upload an image first!"
+        
+        if not prompt or prompt.strip() == "":
+            return None, "Please enter a prompt describing the desired motion!"
+        
+        cleanup_temp_files()
+        
         progress(0.2, desc="Processing image...")
         
         # Read the image file
@@ -42,114 +74,125 @@ def generate_video_with_auth(image, prompt, profile: gr.OAuthProfile | None, pro
                 input_image = image_file.read()
         else:
             # If image is a PIL Image, save it temporarily
-            temp_image = tempfile.NamedTemporaryFile(delete=False, suffix=".png")
-            image.save(temp_image.name)
-            with open(temp_image.name, "rb") as image_file:
-                input_image = image_file.read()
+            import io
+            from PIL import Image as PILImage
+            
+            # Convert to bytes if necessary
+            if isinstance(image, PILImage.Image):
+                buffer = io.BytesIO()
+                image.save(buffer, format='PNG')
+                input_image = buffer.getvalue()
+            else:
+                # Assume it's a numpy array or similar
+                pil_image = PILImage.fromarray(image)
+                buffer = io.BytesIO()
+                pil_image.save(buffer, format='PNG')
+                input_image = buffer.getvalue()
         
         progress(0.4, desc="Generating video with AI...")
         
+        # Create client with user's token
+        client = _client_from_token(token.token)
+        
         # Generate video using the inference client
-        video = client.image_to_video(
-            input_image,
-            prompt=prompt,
-            model="chetwinlow1/Ovi",
-        )
+        try:
+            video = client.image_to_video(
+                input_image,
+                prompt=prompt,
+                model="chetwinlow1/Ovi",
+            )
+        except Exception as e:
+            import requests
+            if isinstance(e, requests.HTTPError) and getattr(e.response, "status_code", None) == 403:
+                return None, "❌ Access denied by provider (403). Make sure your HF account has credits/permission for provider 'fal-ai' and model 'chetwinlow1/Ovi'."
+            raise
         
         progress(0.9, desc="Finalizing video...")
         
         # Save the video to a temporary file
-        output_path = tempfile.NamedTemporaryFile(delete=False, suffix=".mp4")
-        
-        # Check if video is bytes or a file path
-        if isinstance(video, bytes):
-            with open(output_path.name, "wb") as f:
-                f.write(video)
-        elif isinstance(video, str) and os.path.exists(video):
-            # If it's a path, copy it
-            import shutil
-            shutil.copy(video, output_path.name)
-        else:
-            # Try to write it directly
-            with open(output_path.name, "wb") as f:
-                f.write(video)
+        video_path = _save_bytes_as_temp_mp4(video)
         
         progress(1.0, desc="Complete!")
         
-        return output_path.name
+        return video_path, f"✅ Video generated successfully with motion: '{prompt[:50]}...'"
     
+    except gr.Error as e:
+        return None, f"❌ {str(e)}"
     except Exception as e:
-        raise gr.Error(f"Error generating video: {str(e)}")
+        return None, f"❌ Generation failed. If this keeps happening, check your provider quota or try again later."
+
+def clear_inputs():
+    """Clear all inputs and outputs"""
+    return None, "", None, ""
+
+# Custom CSS for better styling
+custom_css = """
+.container {
+    max-width: 1200px;
+    margin: auto;
+}
+.header-link {
+    text-decoration: none;
+    color: #2196F3;
+    font-weight: bold;
+}
+.header-link:hover {
+    text-decoration: underline;
+}
+.status-box {
+    padding: 10px;
+    border-radius: 5px;
+    margin-top: 10px;
+}
+.notice {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: white;
+    padding: 14px 16px;
+    border-radius: 12px;
+    margin: 18px auto 6px;
+    max-width: 860px;
+    text-align: center;
+    font-size: 0.98rem;
+}
+.info-box {
+    background-color: #f0f7ff;
+    border-left: 4px solid #4285f4;
+    padding: 1em;
+    margin: 1em 0;
+    border-radius: 4px;
+}
+"""
 
 # Create the Gradio interface
-with gr.Blocks(
-    theme=gr.themes.Soft(
-        primary_hue="blue",
-        secondary_hue="indigo",
-    ),
-    css="""
-        .header-link {
-            font-size: 0.9em;
-            color: #666;
-            text-decoration: none;
-            margin-bottom: 1em;
-            display: inline-block;
-        }
-        .header-link:hover {
-            color: #333;
-            text-decoration: underline;
-        }
-        .main-header {
-            text-align: center;
-            margin-bottom: 2em;
-        }
-        .info-box {
-            background-color: #f0f7ff;
-            border-left: 4px solid #4285f4;
-            padding: 1em;
-            margin: 1em 0;
-            border-radius: 4px;
-        }
-        .auth-warning {
-            color: #ff6b00;
-            font-weight: bold;
-            text-align: center;
-            margin: 1em 0;
-        }
-    """,
-    title="Image to Video Generator with Ovi",
-) as demo:
+with gr.Blocks(css=custom_css, theme=gr.themes.Soft(), title="Image to Video Generator with Ovi (Paid)") as demo:
     
     gr.HTML(
         """
-        <div class="main-header">
-            <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank" class="header-link">
-                Built with anycoder ✨
-            </a>
+        <div style="text-align:center; max-width:900px; margin:0 auto;">
+            <h1 style="font-size:2.2em; margin-bottom:6px;">🎬 Image to Video Generator with Ovi</h1>
+            <p style="color:#777; margin:0 0 8px;">Transform your static images into dynamic videos with synchronized audio using AI!</p>
+            <div class="notice">
+                <b>Heads up:</b> This is a paid app that uses <b>your</b> inference provider credits when you run generations.
+                Free users get <b>$0.10 in included credits</b>. <b>PRO users</b> get <b>$2 in included credits</b> 
+                and can continue using beyond that (with billing). 
+                <a href='http://huggingface.co/subscribe/pro?source=ovi' target='_blank' style='color:#fff; text-decoration:underline; font-weight:bold;'>Subscribe to PRO</a> 
+                for more credits. Please sign in with your Hugging Face account to continue.
+            </div>
+            <p style="font-size: 0.9em; color: #999; margin-top: 10px;">
+                Built with <a href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank" style="color:#667eea; text-decoration:underline;">anycoder</a>
+            </p>
         </div>
         """
     )
     
     gr.Markdown(
         """
-        # 🎬 Image to Video Generator with Ovi
-        
-        Transform your static images into dynamic videos with synchronized audio using AI! Upload an image and describe the motion you want to see.
-        
         Powered by Ovi: Twin Backbone Cross-Modal Fusion for Audio-Video Generation via [HuggingFace Inference Providers](https://huggingface.co/docs/huggingface_hub/guides/inference).
         """
     )
     
-    gr.HTML(
-        """
-        <div class="auth-warning">
-            ⚠️ You must Sign in with Hugging Face using the button below to use this app.
-        </div>
-        """
-    )
-    
     # Add login button - required for OAuth
-    gr.LoginButton()
+    login_btn = gr.LoginButton("Sign in with Hugging Face")
     
     gr.HTML(
         """
@@ -185,25 +228,33 @@ with gr.Blocks(
         with gr.Column(scale=1):
             image_input = gr.Image(
                 label="📸 Upload Image",
-                type="filepath",
-                sources=["upload", "clipboard"],
+                type="pil",
                 height=400,
             )
             
             prompt_input = gr.Textbox(
                 label="✍️ Text Prompt",
                 lines=3,
+                placeholder="Describe the motion you want to see in the video..."
             )
             
-            generate_btn = gr.Button(
-                "🎬 Generate Video",
-                variant="primary",
-                size="lg",
-            )
+            with gr.Row():
+                generate_btn = gr.Button(
+                    "🎬 Generate Video",
+                    variant="primary",
+                    scale=2,
+                )
+                
+                clear_btn = gr.ClearButton(
+                    value="🗑️ Clear",
+                    scale=1,
+                )
             
-            clear_btn = gr.Button(
-                "🗑️ Clear",
-                variant="secondary",
+            status = gr.Textbox(
+                label="Status",
+                interactive=False,
+                visible=True,
+                elem_classes=["status-box"]
             )
             
             gr.Examples(
@@ -222,6 +273,7 @@ with gr.Blocks(
                 label="🎥 Generated Video",
                 height=400,
                 autoplay=True,
+                show_download_button=True,
             )
             
             gr.Markdown(
@@ -245,17 +297,18 @@ with gr.Blocks(
     # Event handlers with authentication
     generate_btn.click(
         fn=generate_video_with_auth,
-        inputs=[image_input, prompt_input],
-        outputs=[video_output],
+        inputs=[image_input, prompt_input, login_btn],
+        outputs=[video_output, status],
+        show_progress="full",
         queue=False,
         api_name=False,
         show_api=False,
     )
     
     clear_btn.click(
-        fn=lambda: (None, "", None),
-        inputs=None,
-        outputs=[image_input, prompt_input, video_output],
+        fn=clear_inputs,
+        inputs=[],
+        outputs=[image_input, prompt_input, video_output, status],
         queue=False,
     )
     
@@ -288,8 +341,19 @@ with gr.Blocks(
 
 # Launch the app
 if __name__ == "__main__":
+    try:
+        cleanup_temp_files()
+        if os.path.exists("gradio_cached_examples"):
+            shutil.rmtree("gradio_cached_examples", ignore_errors=True)
+    except Exception as e:
+        print(f"Initial cleanup error: {e}")
+    
+    demo.queue(status_update_rate="auto", api_open=False, default_concurrency_limit=None)
     demo.launch(
         show_api=False,
+        share=False,
+        show_error=True,
         enable_monitoring=False,
         quiet=True,
+        ssr_mode=True
     )