Update app.py

app.py

@@ -159,29 +159,41 @@ def extract_fields(image):
 
 
 # -------------------- Gradio Interface --------------------
-demo = gr.Interface(
-    fn=extract_fields,
-    inputs=gr.Image(type="pil", label="Upload Your Document"),
-    outputs=[
-        gr.Text(label="Name"),
-        gr.Text(label="Email"),
-        gr.Text(label="Phone"),
-        gr.Text(label="DOB"),
-        gr.Text(label="Postcode"),
-        gr.Text(label="Prem (CurBase)"),
-        gr.Text(label="Temp (Hourly Rate)"),
-        gr.Textbox(label="Functions", lines=4)
-    ],
-    title="Image OCR Field Extractor",
-    description="Upload a document image to extract structured data fields."
-)
-
-# Create a demo block with example image shown after the interface
-with gr.Blocks() as final_ui:
-    demo.render()
-    gr.Markdown("### 📌 Example Document Format (for reference):")
-    gr.Image(value="example_doc.jpeg", interactive=False, label="Sample Document")
+def extract_fields(image):
+    # Your full function definition goes here
+    return ["Name", "Email", "Phone", "DOB", "Postcode", "Prem", "Rate", "Functions"]
+
+with gr.Blocks() as demo:
+    gr.Markdown("## 📄 Image OCR Field Extractor")
+    gr.Markdown("Upload a document image to extract structured data fields.")
+
+    with gr.Row():
+        with gr.Column():
+            image_input = gr.Image(type="pil", label="📤 Upload Your Document")
+            submit_btn = gr.Button("🔍 Run Detection")
+
+            # ✅ One Example Image that auto-fills input when clicked
+            gr.Examples(
+                examples=["example_doc.jpeg"],  # Just one image
+                inputs=[image_input],
+                label="📌 Example Image (Click to load)"
+            )
+
+        with gr.Column():
+            name = gr.Text(label="Name")
+            email = gr.Text(label="Email")
+            phone = gr.Text(label="Phone")
+            dob = gr.Text(label="DOB")
+            postcode = gr.Text(label="Postcode")
+            prem = gr.Text(label="Prem (CurBase)")
+            rate = gr.Text(label="Temp (Hourly Rate)")
+            functions = gr.Textbox(label="Functions", lines=4)
+
+    # 🔁 Link button to function
+    submit_btn.click(fn=extract_fields, inputs=image_input,
+                     outputs=[name, email, phone, dob, postcode, prem, rate, functions])
 
 if __name__ == "__main__":
-    final_ui.launch()
+    demo.launch()
+