import gradio as gr

from gradio_agentvisualizer import AgentVisualizer, agent_to_dict
from gradio_mcp_tools_visualizer import mcp_tools_visualizer

from demo_agents.custom_agent import manager_agent

#
# Agent Configuration
#

smolagent_dict = agent_to_dict(manager_agent)

#
# MCP Configuration
#

#server_parameters = {"url": "https://huggingface.co/mcp/", "transport": "streamable-http"}
server_parameters = {"url": "https://abidlabs-mcp-tools2.hf.space/gradio_api/mcp/sse", "transport": "sse"}

with gr.Blocks() as demo:
    gr.Markdown("""
    # 🚀 AI & MCP Visualization
    
    This project provides clear visualizations for **Agents** and **MCP Tools**.

    ### Use Cases
    - **Agent Description**: Clearly visualize agent hierarchy, tools, and models.
    - **MCP Setup**: Display MCP configurations and example inputs.
    - **Technical Presentations**: Optimize technical communication and workflows.
    """)

    with gr.Tab("Agent Visualizer"):
        gr.Markdown("""
        ## Installation and Usage Instructions

        ### gradio-agentvisualizer
        
        [Pypi Package](https://pypi.org/project/gradio-agentvisualizer/0.0.3/)
        
        **Installation**:

        Install using pip:

        ```bash
        pip install gradio-agentvisualizer==0.0.3
        ```

        **Example Usage**:

        ```python
        from gradio_agentvisualizer import AgentVisualizer, agent_to_dict

        # Convert your agent to dictionary format
        smolagent_dict = agent_to_dict(manager_agent) # manager_agent -> Being your agent that you want to visualize

        # Visualize using AgentVisualizer
        AgentVisualizer(value=smolagent_dict)
        ```
        """)
        
        AgentVisualizer(value=smolagent_dict)

    with gr.Tab("MCP Tool Visualizer"):
        gr.Markdown("""
        ### gradio-mcp-tools-visualizer

        [Pypi Package](https://pypi.org/project/gradio-mcp-tools-visualizer/0.0.4/)

        **Installation**:

        Install using pip:

        ```bash
        pip install gradio-mcp-tools-visualizer==0.0.4
        ```

        **Example Usage**:

        ```python
        from gradio_mcp_tools_visualizer import mcp_tools_visualizer

        # Define MCP server configuration
        server_parameters = {
            "url": "https://abidlabs-mcp-tools2.hf.space/gradio_api/mcp/sse",
            "transport": "sse"
        }

        # Visualize MCP tools configuration
        mcp_tools_visualizer(value={
            'server_parameters': server_parameters
        })
        ```
        """)
        mcp_tools_visualizer(
            value={
                'server_parameters': server_parameters
            },
        )

if __name__ == "__main__":
    demo.launch()




       
# https://pypi.org/project/gradio-mcp-tools-visualizer/0.0.1/

# https://pypi.org/project/gradio-agentvisualizer/0.0.1/