feat: improve general UI

app.py

@@ -1,6 +1,9 @@
+from pathlib import Path
 from typing import NamedTuple
 
 import gradio as gr
+import gradio.themes as gr_themes
+import markdown
 
 from tdagent.tools.get_domain_information import (
     dns_enumeration_tool,
@@ -26,6 +29,21 @@ from tdagent.tools.virus_total import gr_virus_total_url_info
 ## Tools to load into the application interface ##
 
 
+def _read_markdown_body_as_html(path: str = "README.md") -> str:
+    with Path(path).open(encoding="utf-8") as f:  # Default mode is "r"
+        lines = f.readlines()
+
+    # Skip YAML front matter if present
+    if lines and lines[0].strip() == "---":
+        for i in range(1, len(lines)):
+            if lines[i].strip() == "---":
+                lines = lines[i + 1 :]  # skip metadata block
+                break
+
+    markdown_body = "".join(lines).strip()
+    return markdown.markdown(markdown_body)
+
+
 class ToolInfo(NamedTuple):
     """Gradio MCP tool info."""
 
@@ -55,11 +73,60 @@ TOOLS = (
 )
 
 ## Application Interface ##
-gr_app = gr.TabbedInterface(
-    interface_list=[t_info.interface for t_info in TOOLS],
-    tab_names=[t_info.name for t_info in TOOLS],
-    title="TDAgentTools",
-)
+
+custom_css = """
+.main-header {
+    background: linear-gradient(135deg, #00a388 0%, #ffae00 100%);
+    padding: 30px;
+    border-radius: 5px;
+    margin-bottom: 20px;
+    text-align: center;
+}
+"""
+with (
+    gr.Blocks(
+        theme=gr_themes.Origin(
+            primary_hue="teal",
+            spacing_size="sm",
+            font="sans-serif",
+        ),
+        title="TDAgent",
+        fill_height=True,
+        fill_width=True,
+        css=custom_css,
+    ) as gr_app,
+):
+    gr.HTML(
+        """
+    <div class="main-header">
+        <h1>👩‍💻 TDAgentTools & TDAgent 👨‍💻</h1>
+        <p style="font-size: 1.2em; margin: 10px 0 0 0;">
+            Empowering Cybersecurity with Agentic AI
+        </p>
+    </div>
+    """,
+    )
+    with gr.Tabs():
+        with gr.TabItem("About"):
+            html_content = _read_markdown_body_as_html("README.md")
+            gr.Markdown(html_content)
+        with gr.TabItem("TDAgentTools"):
+            gr.TabbedInterface(
+                interface_list=[t_info.interface for t_info in TOOLS],
+                tab_names=[t_info.name for t_info in TOOLS],
+                title="TDAgentTools",
+            )
+        with gr.TabItem("Demo"):
+            gr.Markdown(
+                """
+            This is a demo of TDAgentTools, a simple MCP server.
+            Be carefull with using well-known urls for malware distribution
+            when using the url content extractor tool.
+            """,
+            )
+            gr.HTML(
+                """<iframe width="560" height="315" src="https://youtube.com/embed/c7Yg_jOD6J0" frameborder="0" allowfullscreen></iframe>""",  # noqa: E501
+            )
 
 if __name__ == "__main__":
     gr_app.launch(mcp_server=True)