[FIX] トップ5まで出せるように修正

app.py

@@ -1,4 +1,5 @@
 import gradio as gr
+from gradio.components import label
 
 from model import MLModel
 from dotenv import load_dotenv
@@ -22,16 +23,29 @@ def save(image_path: str):
 
 def search(prompt: str):
     urls = model.search(prompt)
-    return urls[0]
+    result = [None] * 5
+    for i, url in enumerate(urls):
+        result[i] = url
+
+    return result
 
 
 with gr.Blocks() as app:
     # Rowでレイアウトを定義
+    gr.Label("自然言語画像検索(左から検索ランキングが高い)")
     input = gr.Textbox(placeholder="可愛いワンコ", label="検索")
-    output = gr.Image(type="filepath")
+    with gr.Row():
+        output1 = gr.Image(type="filepath", label="ランキング1")
+        output2 = gr.Image(type="filepath", label="ランキング2")
+        output3 = gr.Image(type="filepath", label="ランキング3")
+        output4 = gr.Image(type="filepath", label="ランキング4")
+        output5 = gr.Image(type="filepath", label="ランキング5")
     btn = gr.Button("検索")
-    btn.click(fn=search, inputs=input, outputs=output)
+    btn.click(
+        fn=search, inputs=input, outputs=[output1, output2, output3, output4, output5]
+    )
 
+    gr.Label("画像保存")
     save_image = gr.Image(type="filepath")
     result = gr.Text(label="upload結果")
     save_btn = gr.Button("保存")