{"cells": [{"cell_type": "markdown", "id": "302934307671667531413257853548643485645", "metadata": {}, "source": ["# Gradio Demo: chatbot_thoughts"]}, {"cell_type": "code", "execution_count": null, "id": "272996653310673477252411125948039410165", "metadata": {}, "outputs": [], "source": ["!pip install -q gradio "]}, {"cell_type": "code", "execution_count": null, "id": "288918539441861185822528903084949547379", "metadata": {}, "outputs": [], "source": ["import gradio as gr\n", "from gradio import ChatMessage\n", "import time\n", "\n", "def simulate_thinking_chat(message: str, history: list):\n", "    \"\"\"Mimicking thinking process and response\"\"\"\n", "    # Add initial empty thinking message to chat history\n", "\n", "    history.append(  # Adds new message to the chat history list\n", "        ChatMessage(  # Creates a new chat message\n", "            role=\"assistant\",  # Specifies this is from the assistant\n", "            content=\"\",  # Initially empty content\n", "            metadata={\"title\": \"Thinking... \"}  # Setting a thinking header here\n", "        )\n", "    )\n", "    time.sleep(0.5)\n", "    yield history  # Returns current state of chat history\n", "    \n", "    # Define the thoughts that LLM will \"think\" through\n", "    thoughts = [\n", "        \"First, I need to understand the core aspects of the query...\",\n", "        \"Now, considering the broader context and implications...\",\n", "        \"Analyzing potential approaches to formulate a comprehensive answer...\",\n", "        \"Finally, structuring the response for clarity and completeness...\"\n", "    ]\n", "    \n", "    # Variable to store all thoughts as they accumulate\n", "    accumulated_thoughts = \"\"\n", "    \n", "    # Loop through each thought\n", "    for thought in thoughts:\n", "        time.sleep(0.5)  # Add a samll delay for realism\n", "        \n", "        # Add new thought to accumulated thoughts with markdown bullet point\n", "        accumulated_thoughts += f\"- {thought}\\n\\n\"  # \\n\\n creates line breaks\n", "        \n", "        # Update the thinking message with all thoughts so far\n", "        history[-1] = ChatMessage(  # Updates last message in history\n", "            role=\"assistant\",\n", "            content=accumulated_thoughts.strip(),  # Remove extra whitespace\n", "            metadata={\"title\": \"Thinking...\"}  # Shows thinking header\n", "        )\n", "        yield history  # Returns updated chat history\n", "    \n", "    # After thinking is complete, adding the final response\n", "    history.append(\n", "        ChatMessage(\n", "            role=\"assistant\",\n", "            content=\"Based on my thoughts and analysis above, my response is: This dummy repro shows how thoughts of a thinking LLM can be progressively shown before providing its final answer.\"\n", "        )\n", "    )\n", "    yield history  # Returns final state of chat history\n", "\n", "# Gradio blocks with gr.chatbot\n", "with gr.Blocks() as demo:\n", "    gr.Markdown(\"# Thinking LLM Demo \ud83e\udd14\")\n", "    chatbot = gr.Chatbot(type=\"messages\", render_markdown=True)\n", "    msg = gr.Textbox(placeholder=\"Type your message...\")\n", "    \n", "    msg.submit(\n", "        lambda m, h: (m, h + [ChatMessage(role=\"user\", content=m)]),\n", "        [msg, chatbot],\n", "        [msg, chatbot]\n", "    ).then(\n", "        simulate_thinking_chat,\n", "        [msg, chatbot],\n", "        chatbot\n", "    )\n", "\n", "if __name__ == \"__main__\":\n", "    demo.launch()"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5}