Javier-Jimenez99 commited on
Commit
769b5b1
·
1 Parent(s): 51f0bbf

Actualizar README.md con una introducción detallada del agente y enlaces útiles. Integrar el contenido del README en la interfaz de usuario y ajustar el título de la interfaz combinada.

Browse files
Files changed (3) hide show
  1. README.md +61 -2
  2. app.py +12 -2
  3. media/reactAgent.png +0 -0
README.md CHANGED
@@ -11,5 +11,64 @@ tags:
11
  - mcp-server-track
12
  ---
13
 
14
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
15
- Hello!
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
11
  - mcp-server-track
12
  ---
13
 
14
+ # 🧙‍♂️ LLM Game Master Agent 🐉
15
+
16
+ ## Useful Links:
17
+ - [Owlbear Rodeo Chat Interface](https://github.com/Agamador/OwlBear-llm-chat)
18
+ - [MCP server](https://huggingface.co/spaces/Agents-MCP-Hackathon/LLM-GameMaster-MPC-Server)
19
+ - [Video Demo](https://www.youtube.com/watch?v=8b1k2g3Z4aY)
20
+
21
+ ## 🌟 Introduction
22
+
23
+ The **LLM Game Master Agent** is a sophisticated AI system designed as a Game Master (GM) for solo medieval fantasy role-playing sessions. This cutting-edge application showcases the power of LangGraph React architecture combined with Model Context Protocol (MCP) technology, creating an immersive and highly adaptive gaming experience unlike anything seen before.
24
+
25
+ Unlike conventional chatbots, this intelligent agent generates dynamic and personalized narratives where YOU become the protagonist in epic fantasy stories. The application leverages state-of-the-art language models to deliver a gaming experience comparable to traditional sessions with a human Game Master, but with the added benefits of AI-powered adaptability and endless creative possibilities.
26
+
27
+ ## 🧠 LangGraph React: The System Core
28
+
29
+ The LLM Game Master Agent utilizes [LangGraph](https://github.com/langchain-ai/langgraph) as the central component of its architecture, implementing the React pattern for complex task management.
30
+
31
+ The implementation uses LangGraph's `create_react_agent` function to create a reactive agent that can maintain conversation state, reason over multiple steps, and make informed decisions based on the complete tools execution trace.
32
+
33
+ ![./media/reactAgent.png](./media/reactagent.png)
34
+
35
+ ## 🔌 MCP Client: Integration with External Tools
36
+
37
+ The system implements a [Model Context Protocol (MCP)](https://github.com/microsoft/model-context-protocol) client that connects to an external MCP server. This client-server architecture allows the agent to access specialized gaming tools without implementing them directly in the codebase.
38
+
39
+ The implementation uses MCP-specific adapters for LangChain that facilitate communication between the agent and the tools server.
40
+
41
+ This architecture separates the agent logic from the tool implementation, making the system more modular and easier to maintain. The agent can invoke tools as needed through the MCP connection, while focusing on its core narrative generation and decision-making capabilities.
42
+
43
+ ## 🤖 Language Model Orchestration
44
+
45
+ The system uses [LangChain](https://www.langchain.com/) to orchestrate language models, offering compatibility with:
46
+
47
+ - **Anthropic Claude**: Claude 3 models via API
48
+ - **Ollama**: Local deployment of models for self-hosted scenarios
49
+
50
+ This flexibility allows selecting the most suitable model based on performance requirements and availability.
51
+
52
+ ## 🖥️ Gradio User Interface
53
+
54
+ The application features a complete web interface built with Gradio, offering two main views:
55
+
56
+ 1. **Complete View with History**: Shows the conversation along with detailed execution tracking including tools and agent messages.
57
+ 2. **Original API**: A simpler interface for API access.
58
+
59
+ The interface includes features for:
60
+
61
+ - Tracking multiple sessions via tab IDs
62
+ - Detailed visualization of tool calls and their results
63
+ - Session management controls
64
+ - API key configuration
65
+
66
+ The execution history provides complete transparency into the agent's decision-making process, showing each step of the interaction between the user, agent, and tools.
67
+
68
+
69
+ ## 🔗 Links & Resources
70
+
71
+ - [LangGraph Documentation](https://github.com/langchain-ai/langgraph)
72
+ - [Model Context Protocol (MCP)](https://github.com/microsoft/model-context-protocol)
73
+ - [LangChain](https://www.langchain.com/)
74
+ - [Gradio](https://www.gradio.app/)
app.py CHANGED
@@ -353,11 +353,21 @@ api_demo = gr.Interface(
353
  outputs="text", title="OwlBear Agent - Original API"
354
  )
355
 
 
 
 
 
 
 
 
 
 
 
356
  # Combined interface with tabs
357
  combined_demo = gr.TabbedInterface(
358
- [demo, api_demo],
359
  ["Complete View with History", "Original API"],
360
- title="🦉 OwlBear Agent - Complete Interface"
361
  )
362
 
363
  if __name__ == "__main__":
 
353
  outputs="text", title="OwlBear Agent - Original API"
354
  )
355
 
356
+ with open("README.md", "r") as f:
357
+ readme = f.read()
358
+
359
+ intro_demo = gr.Markdown(
360
+ readme,
361
+ title="🧙🏼‍♂️ LLM Game Master - Agen",
362
+ description="This interface introduces the Agent",
363
+ api_name=False,
364
+ )
365
+
366
  # Combined interface with tabs
367
  combined_demo = gr.TabbedInterface(
368
+ [intro_demo, demo, api_demo],
369
  ["Complete View with History", "Original API"],
370
+ title="🧙🏼‍♂️ LLM Game Master - Agent"
371
  )
372
 
373
  if __name__ == "__main__":
media/reactAgent.png ADDED