Update description_search_ui.py

description_search_ui.py

@@ -275,17 +275,14 @@ def create_description_search_tab() -> gr.Column:
     """
 
     with gr.Column():
-        # 顯示指南和樣式
         gr.HTML(css + guide_html)
         
-        # 描述輸入區
         description_input = gr.Textbox(
             label="",
             placeholder="Example: I'm looking for a medium-sized, friendly dog that's good with kids...",
             lines=5
         )
         
-        # 搜索按鈕
         search_button = gr.Button(
             "Find My Perfect Match! 🔍",
             variant="primary",
@@ -293,9 +290,35 @@ def create_description_search_tab() -> gr.Column:
         )
 
         # 加載狀態提示
-        processing_message = gr.HTML(value="<div style='text-align: center; padding: 20px; color: #666;'><p><b>Finding your perfect match...</b></p><p>Please wait 15-20 seconds while we analyze your preferences.</p></div>", visible=False)
+        processing_message = gr.HTML(
+            value="<div style='text-align: center; padding: 20px; color: #666;'><p><b>Finding your perfect match...</b></p><p>Please wait 15-20 seconds while we analyze your preferences.</p></div>",
+            visible=False
+        )
+        
+        result_output = gr.HTML(label="Breed Recommendations", visible=True)
         
-        # 結果顯示區域
-        result_output = gr.HTML(label="Breed Recommendations")
+        def on_search_start(description):
+            return {
+                processing_message: gr.update(visible=True),
+                result_output: gr.update(visible=False),
+                description_input: gr.update(interactive=False)
+            }
+
+        def on_search_complete(output):
+            return {
+                processing_message: gr.update(visible=False),
+                result_output: gr.update(visible=True, value=output),
+                description_input: gr.update(interactive=True)
+            }
+
+        search_button.click(
+            fn=on_search_start,
+            inputs=[description_input],
+            outputs=[processing_message, result_output, description_input]
+        ).success(
+            fn=lambda x: x,
+            inputs=[description_input],
+            outputs=[description_input]
+        )
         
-        return description_input, search_button, result_output, processing_message
+        return description_input, search_button, result_output