Update app.py

app.py

@@ -29,6 +29,9 @@ except Exception as e:
 with gr.Blocks(title="DeepV for RTL (Model-Agnostic)", theme=gr.themes.Soft()) as demo:
     gr.Markdown("## DeepV for RTL Code Generation — Model-Agnostic (Bring Your Own API Key)", elem_id="main-title")
 
+    # Serve the logo file correctly using gr.File
+    logo_file = gr.File("DeepV_logo.png", visible=False, file_id="deepv-logo-file")
+    
     with gr.Row():
         with gr.Column(scale=2):
             with gr.Row():
@@ -71,12 +74,12 @@ with gr.Blocks(title="DeepV for RTL (Model-Agnostic)", theme=gr.themes.Soft()) a
                 )
             
         with gr.Column(scale=3):
-            # --- DeepV Logo and "Output" text (Correctly configured gr.Image) ---
+            # --- DeepV Logo and "Output" text ---
             with gr.Row(elem_id="logo-and-output-row"):
                 # Container for the logo to allow layered animations
                 gr.HTML("""
                     <div id="logo-container">
-                        <img src="file=DeepV_logo.png" id="deepv-base-logo" alt="DeepV Logo">
+                        <img id="deepv-base-logo" alt="DeepV Logo">
                         <div id="deep-part" class="logo-overlay"></div>
                     </div>
                 """)
@@ -123,9 +126,12 @@ with gr.Blocks(title="DeepV for RTL (Model-Agnostic)", theme=gr.themes.Soft()) a
         show_progress=False,
         js="""
             (e) => {
-                document.getElementById('deep-part').classList.add('deep-hop-away');
+                var deepPart = document.getElementById('deep-part');
+                if (deepPart) {
+                    deepPart.classList.add('deep-hop-away');
+                }
             }
-        """ # Call JS to start animation when button is clicked
+        """
     ).then(
         fn=generate_only,
         inputs=[spec, use_rag, top_k, model_choice, api_key, temperature_tb, top_p_tb, max_new_tokens_tb],
@@ -136,11 +142,14 @@ with gr.Blocks(title="DeepV for RTL (Model-Agnostic)", theme=gr.themes.Soft()) a
         outputs=[run_btn, loading_state],
         js="""
             (e) => {
-                document.getElementById('deep-part').classList.remove('deep-hop-away');
-                // This line forces the browser to re-render, ensuring the animation resets
-                void document.getElementById('deep-part').offsetWidth; 
+                var deepPart = document.getElementById('deep-part');
+                if (deepPart) {
+                    deepPart.classList.remove('deep-hop-away');
+                    // This line forces the browser to re-render, ensuring the animation resets
+                    void deepPart.offsetWidth; 
+                }
             }
-        """ # Call JS to reset animation when generation finishes
+        """
     )
 
     clear_btn.click(fn=lambda: "Ready", outputs=[])
@@ -152,7 +161,6 @@ with gr.Blocks(title="DeepV for RTL (Model-Agnostic)", theme=gr.themes.Soft()) a
         outputs=[],
         js="""
             (text) => {
-                // Creates and copies a temporary element without using variable declarations
                 (function(el) {
                     el.value = text;
                     document.body.appendChild(el);
@@ -164,6 +172,16 @@ with gr.Blocks(title="DeepV for RTL (Model-Agnostic)", theme=gr.themes.Soft()) a
         """
     )
 
+    # --- New JS/CSS to handle the logo paths
+    demo.load(None, None, None, js="""
+        function setLogoSrc() {
+            var logo_url = window.__gradio_space__ + '/file=DeepV_logo.png';
+            document.getElementById('deepv-base-logo').src = logo_url;
+            document.getElementById('deep-part').style.backgroundImage = 'url(' + logo_url + ')';
+        }
+        window.addEventListener('load', setLogoSrc);
+    """)
+
     demo.css = """
         @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap');
 
@@ -207,8 +225,6 @@ with gr.Blocks(title="DeepV for RTL (Model-Agnostic)", theme=gr.themes.Soft()) a
             left: 0;
             width: 100%;
             height: 100%;
-            /* CORRECTED: Use a URL that Gradio can resolve */
-            background-image: url('file=DeepV_logo.png');
             background-size: contain;
             background-repeat: no-repeat;
             background-position: center;