ui.py

import gradio as gr
import uuid
from langchain_core.messages import HumanMessage, AIMessage

def create_ui(app):
    """Gradioのインターフェースを作成して返す"""

    async def respond(message, history, session_id):
        config = {"configurable": {"thread_id": session_id}}
        
        input_message = HumanMessage(content=message)
        
        # システムプロンプトの注入やスタイルの管理はすべてagent.pyのグラフ内で行うため、
        # UIからは単純にユーザーの入力を投げるだけでOKです。
        inputs = {"messages": [input_message]}

        full_response = ""
        async for chunk in app.astream(inputs, config=config, stream_mode="values"):
            last_message = chunk["messages"][-1]
            if isinstance(last_message, AIMessage) and last_message.content:
                full_response = last_message.content
                yield full_response

    def init_session():
        return str(uuid.uuid4())

    with gr.Blocks() as demo:
        gr.Markdown(
            """
            <div style="text-align: center;">
                <h1>🍺 Craft Beer AI 🍺</h1>
                <p>あなたにぴったりのビールを提案してから、質問にお答えします。<br>
                まずは気になること（例：「IPAって何？」）を聞いてみてください。</p>
            </div>
            """
        )
        
        chatbot = gr.ChatInterface(
            fn=respond,
            additional_inputs=[gr.State(init_session)],
            examples=[
                ["IPAとはどんなビールですか？"],
                ["初心者におすすめのブルワリーは？"],
            ],
            chatbot=gr.Chatbot(
                elem_id="chatbot",
                height=400
            )
        )
    
    return demo