Update app.py

app.py

@@ -1,31 +1,58 @@
 import gradio as gr
 from huggingface_hub import InferenceClient
 
-# Initialize the InferenceClient with your chat model.
-client = InferenceClient("amusktweewt/tiny-model-500M-chat-v2")
+# Define available models.
+# Each model has a name, description, model ID, and an "enabled" flag.
+models = [
+    {
+        "name": "Tiny Model",
+        "description": "A small chat model.",
+        "id": "amusktweewt/tiny-model-500M-chat-v2",
+        "enabled": True
+    },
+    {
+        "name": "Another Model",
+        "description": "A bigger chat model (disabled).",
+        "id": "another-model",
+        "enabled": False
+    }
+]
 
-def respond(message, history: list[tuple[str, str]], system_message, max_tokens, temperature, top_p):
-    """
-    Builds a chat prompt using a simple template:
-      - Optionally includes a system message.
-      - Iterates over conversation history (each exchange as a tuple of (user, assistant)).
-      - Adds the new user message and appends an empty assistant turn.
-    Then it streams the response from the model.
-    """
-    messages = []
+# Build the HTML for the custom dropdown.
+dropdown_options = ""
+for model in models:
+    # If a model is disabled, add the "disabled" attribute and modify its label.
+    disabled_attr = "disabled" if not model["enabled"] else ""
+    label = f"{model['name']}: {model['description']}"
+    if not model["enabled"]:
+        label = f"{model['name']} (Disabled): {model['description']}"
+    dropdown_options += f'<option value="{model["id"]}" {disabled_attr}>{label}</option>\n'
+
+# This HTML dropdown will be displayed. When the user selects an option,
+# an inline JavaScript updates the value of the hidden textbox with the chosen model ID.
+dropdown_html = f"""
+<div>
+  <label for="model_select"><strong>Select Model:</strong></label>
+  <select id="model_select" onchange="document.getElementById('hidden_model').value = this.value;">
+    {dropdown_options}
+  </select>
+</div>
+"""
+
+# The respond function now accepts the model_id as one of its inputs.
+def respond(message, history: list[tuple[str, str]], model_id, system_message, max_tokens, temperature, top_p):
+    # Instantiate the InferenceClient with the selected model.
+    client = InferenceClient(model_id)
     
-    # Include the system prompt if provided.
+    messages = []
     if system_message:
         messages.append({"role": "system", "content": system_message})
     
-    # Append conversation history.
     if history:
         for user_msg, bot_msg in history:
             messages.append({"role": "user", "content": user_msg})
             messages.append({"role": "assistant", "content": bot_msg})
     
-    # Add the new user message and an empty assistant response
-    # (this mimics your template where the assistant turn is empty to be filled).
     messages.append({"role": "user", "content": message})
     messages.append({"role": "assistant", "content": ""})
     
@@ -42,15 +69,27 @@ def respond(message, history: list[tuple[str, str]], system_message, max_tokens,
         response_text += token
         yield response_text
 
-# Create a Gradio ChatInterface.
+# Create Gradio components.
+# The HTML component displays our custom dropdown.
+html_dropdown = gr.HTML(value=dropdown_html)
+# The hidden textbox will hold the selected model ID.
+hidden_model = gr.Textbox(value=models[0]["id"], visible=False, elem_id="hidden_model")
+
+# Create the Gradio ChatInterface.
+# Note: Only components that supply a value are passed to the function.
+# The HTML component is for display only.
 demo = gr.ChatInterface(
-    respond,
+    fn=respond,
     additional_inputs=[
+        # hidden_model supplies the model_id.
+        hidden_model,
         gr.Textbox(value="You are a friendly Chatbot.", label="System message"),
         gr.Slider(minimum=1, maximum=2048, value=512, step=1, label="Max new tokens"),
         gr.Slider(minimum=0.1, maximum=4.0, value=0.7, step=0.1, label="Temperature"),
-        gr.Slider(minimum=0.1, maximum=1.0, value=0.95, step=0.05, label="Top-p (nucleus sampling)"),
+        gr.Slider(minimum=0.1, maximum=1.0, value=0.95, step=0.05, label="Top-p (nucleus sampling)")
     ],
+    # You can include the HTML dropdown in a layout so that it is visible to the user.
+    layout=[html_dropdown]
 )
 
 if __name__ == "__main__":