Spaces:
Sleeping
fix: Replace examples with interactive buttons for model switching
Browse files**Problem:**
- ChatInterface examples with additional_inputs don't work properly
- Model dropdown not updating when example is clicked
- Examples were non-functional with current setup
**Solution:**
- Replace built-in examples with custom button-based UI
- Create 4 separate example buttons with emojis
- Each button updates both model dropdown and textbox
- Organized in 2 columns (English vs Korean examples)
**Example Buttons:**
English:
- π Hello! How are you? β DialoGPT-small
- π Tell me a joke β DialoGPT-medium
Korean:
- π€οΈ μλ
νμΈμ! μ€λ λ μ¨κ° μ΄λμ? β Llama-2-Ko 7B
- π€ μΈκ³΅μ§λ₯μ λν΄ κ°λ¨ν μ€λͺ
ν΄μ£ΌμΈμ. β KoT-Llama2-7B-Chat
**Benefits:**
- Actually works (updates both model and input)
- Better UX with clear visual separation
- Emoji indicators for context
- Clear description of functionality
π€ Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
@@ -275,14 +275,40 @@ with gr.Blocks(
|
|
| 275 |
elem_classes="chatbot-input",
|
| 276 |
show_label=False,
|
| 277 |
),
|
| 278 |
-
examples=[
|
| 279 |
-
["Hello! How are you?", "microsoft/DialoGPT-small"],
|
| 280 |
-
["Tell me a joke", "microsoft/DialoGPT-medium"],
|
| 281 |
-
["μλ
νμΈμ! μ€λ λ μ¨κ° μ΄λμ?", "beomi/llama-2-ko-7b"],
|
| 282 |
-
["μΈκ³΅μ§λ₯μ λν΄ κ°λ¨ν μ€λͺ
ν΄μ£ΌμΈμ.", "kyujinpy/KoT-Llama2-7B-Chat"],
|
| 283 |
-
],
|
| 284 |
)
|
| 285 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 286 |
# Show warning and clear chat when model changes
|
| 287 |
def on_model_change(new_model):
|
| 288 |
global current_model
|
|
|
|
| 275 |
elem_classes="chatbot-input",
|
| 276 |
show_label=False,
|
| 277 |
),
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 278 |
)
|
| 279 |
|
| 280 |
+
# Examples section with model switching
|
| 281 |
+
gr.Markdown("### π‘ μμ (ν΄λ¦νλ©΄ λͺ¨λΈκ³Ό λ©μμ§κ° μλμΌλ‘ μ€μ λ©λλ€)")
|
| 282 |
+
|
| 283 |
+
with gr.Row():
|
| 284 |
+
with gr.Column(scale=1):
|
| 285 |
+
gr.Markdown("**μμ΄ μμ :**")
|
| 286 |
+
example_btn_1 = gr.Button("π Hello! How are you?", size="sm")
|
| 287 |
+
example_btn_2 = gr.Button("π Tell me a joke", size="sm")
|
| 288 |
+
|
| 289 |
+
with gr.Column(scale=1):
|
| 290 |
+
gr.Markdown("**νκΈ μμ :**")
|
| 291 |
+
example_btn_3 = gr.Button("π€οΈ μλ
νμΈμ! μ€λ λ μ¨κ° μ΄λμ?", size="sm")
|
| 292 |
+
example_btn_4 = gr.Button("π€ μΈκ³΅μ§λ₯μ λν΄ κ°λ¨ν μ€λͺ
ν΄μ£ΌμΈμ.", size="sm")
|
| 293 |
+
|
| 294 |
+
# Example button click handlers
|
| 295 |
+
def set_example_1():
|
| 296 |
+
return "microsoft/DialoGPT-small", "Hello! How are you?"
|
| 297 |
+
|
| 298 |
+
def set_example_2():
|
| 299 |
+
return "microsoft/DialoGPT-medium", "Tell me a joke"
|
| 300 |
+
|
| 301 |
+
def set_example_3():
|
| 302 |
+
return "beomi/llama-2-ko-7b", "μλ
νμΈμ! μ€λ λ μ¨κ° μ΄λμ?"
|
| 303 |
+
|
| 304 |
+
def set_example_4():
|
| 305 |
+
return "kyujinpy/KoT-Llama2-7B-Chat", "μΈκ³΅μ§λ₯μ λν΄ κ°λ¨ν μ€λͺ
ν΄μ£ΌμΈμ."
|
| 306 |
+
|
| 307 |
+
example_btn_1.click(set_example_1, outputs=[model_dropdown, chatbot.textbox])
|
| 308 |
+
example_btn_2.click(set_example_2, outputs=[model_dropdown, chatbot.textbox])
|
| 309 |
+
example_btn_3.click(set_example_3, outputs=[model_dropdown, chatbot.textbox])
|
| 310 |
+
example_btn_4.click(set_example_4, outputs=[model_dropdown, chatbot.textbox])
|
| 311 |
+
|
| 312 |
# Show warning and clear chat when model changes
|
| 313 |
def on_model_change(new_model):
|
| 314 |
global current_model
|