import re
import gradio as gr
from PIL import Image

def create_detection_tab(predict_fn, example_images):
    with gr.TabItem("Breed Detection"):
        gr.HTML("<p style='text-align: center;'>Upload a picture of a dog, and the model will predict its breed and provide detailed information!</p>")
        gr.HTML("<p style='text-align: center; color: #666; font-size: 0.9em;'>Note: The model's predictions may not always be 100% accurate, and it is recommended to use the results as a reference.</p>")

        with gr.Row():
            input_image = gr.Image(label="Upload a dog image", type="pil")
            output_image = gr.Image(label="Annotated Image")

        output = gr.HTML(label="Prediction Results")
        initial_state = gr.State()

        input_image.change(
            predict_fn,
            inputs=input_image,
            outputs=[output, output_image, initial_state]
        )

        gr.Examples(
            examples=example_images,
            inputs=input_image
        )

    return {
        'input_image': input_image,
        'output_image': output_image,
        'output': output,
        'initial_state': initial_state
    }