Add labels to the image components

app.py

@@ -110,11 +110,11 @@ with demo:
       """)  
     with gr.Tabs():
       with gr.TabItem(label="Upload an image"):
-        uploaded_image = gr.Image(type="numpy")
+        uploaded_image = gr.Image(type="numpy", label="Input image")
         example_image = gr.Examples(examples=[['examples/example-01.jpg', 1, 0.4], ['examples/example-02.jpg', 2, 0.5], ['examples/example-03.jpg', 1, 0.5]], inputs=[uploaded_image, max_num_hands, min_detection_conf])
         submit_uploaded_image = gr.Button(value="Process Image")
       with gr.TabItem(label="Take a picture"):
-        camera_picture = gr.Image(source="webcam", type="numpy")
+        camera_picture = gr.Image(source="webcam", type="numpy", label="Input image")
         submit_camera_picture = gr.Button(value="Process Image")  
 
   gr.Markdown(""" 
@@ -126,8 +126,8 @@ with demo:
         left_hands = gr.Number(label="Left hands detected")
       with gr.Column():
         right_hands = gr.Number(label="Right hands detected")  
-    multi_handedness = gr.JSON(label="Raw results")
-    processed_image = gr.Image()
+    multi_handedness = gr.JSON(label="Raw handedness results")
+    processed_image = gr.Image(label="Processed image")
 
   gr.Markdown('<img id="visitor-badge" alt="visitor badge" src="https://visitor-badge.glitch.me/badge?page_id=kristyc.mediapipe-hands" />')
   setting_inputs = [