gr.Blocks

app.py

@@ -222,10 +222,26 @@ examples = [
     ["flower-night.jpg"]
 ]
 
-gr.Interface(
-    fn=process_image,
-    inputs=[gr.Image(type="pil"), gr.Checkbox(label="Include JSON", value=False), gr.Checkbox(label="Include Bounding Boxes", value=False)],
-    outputs=[gr.Image(type="numpy")] + [gr.Image(type="numpy")] * 10 + [gr.Textbox()],
-    title="InsectSAM 🐞",
-    examples=examples
-).launch()
+with gr.Blocks() as demo:
+    with gr.Row():
+        image_input = gr.Image(type="pil")
+        include_json = gr.Checkbox(label="Include JSON", value=False)
+        include_bboxes = gr.Checkbox(label="Include Bounding Boxes", value=False)
+        submit_button = gr.Button("Submit")
+
+    annotated_output = gr.Image(type="numpy")
+    json_output = gr.Textbox()
+    crops_output = gr.Gallery(label="Cropped Bounding Boxes").style(grid=[2], height="auto")
+
+    def update_outputs(image, include_json, include_bboxes):
+        results = process_image(image, include_json, include_bboxes)
+        if include_bboxes:
+            annotated_img, *crops, json_txt = results
+            return (annotated_img, json_txt, crops)
+        else:
+            annotated_img, json_txt = results
+            return (annotated_img, json_txt, [])
+
+    submit_button.click(update_outputs, [image_input, include_json, include_bboxes], [annotated_output, json_output, crops_output])
+
+demo.launch()