From 6fe4e4e27d0054dc96006f0d4e98f47bc3ba279e Mon Sep 17 00:00:00 2001 From: leehuwuj Date: Tue, 15 Apr 2025 16:45:54 +0700 Subject: [PATCH 1/4] chore: bump chat UI version to 0.1.2 and rename generate_ui_for_workflow --- llama-index-server/llama_index/server/chat_ui.py | 2 +- llama-index-server/llama_index/server/gen_ui/main.py | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/llama-index-server/llama_index/server/chat_ui.py b/llama-index-server/llama_index/server/chat_ui.py index 6e3c6d8d8..130cae9ca 100644 --- a/llama-index-server/llama_index/server/chat_ui.py +++ b/llama-index-server/llama_index/server/chat_ui.py @@ -5,7 +5,7 @@ import requests -CHAT_UI_VERSION = "0.1.1" +CHAT_UI_VERSION = "0.1.2" def download_chat_ui( diff --git a/llama-index-server/llama_index/server/gen_ui/main.py b/llama-index-server/llama_index/server/gen_ui/main.py index e185f79c5..b1b637758 100644 --- a/llama-index-server/llama_index/server/gen_ui/main.py +++ b/llama-index-server/llama_index/server/gen_ui/main.py @@ -80,7 +80,7 @@ class GenUIWorkflow(Workflow): code_structure: str = """ ```jsx - // Note: Only shadcn/ui and lucide-react and tailwind css are allowed (but cn() is not supported yet). + // Note: Only shadcn/ui and lucide-react and tailwind css are allowed. // shadcn import pattern: import { ComponentName } from "@/components/ui/"; // e.g: import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/card"; // import { Button } from "@/components/ui/button"; @@ -264,7 +264,7 @@ async def write_ui_component( You should display the jump, run and meow actions in different ways. don't try to render "height" for the "run" and "meow" action. ## UI notice - - Use shadcn/ui and lucide-react and tailwind CSS for the UI (cn() is not supported yet). + - Use shadcn/ui and lucide-react and tailwind CSS for the UI. - Be careful on state handling, make sure the update should be updated in the state and there is no duplicate state. - For a long content, consider to use markdown along with dropdown to show the full content. e.g: @@ -350,7 +350,7 @@ async def refine_code( ) -async def generate_ui_for_workflow( +async def generate_event_component( workflow_file: Optional[str] = None, event_cls: Optional[Type[BaseModel]] = None, llm: Optional[LLM] = None, @@ -360,7 +360,7 @@ async def generate_ui_for_workflow( Either workflow_file or event_cls must be provided. Args: - workflow_file: The path to the workflow file to generate UI from. e.g: `app/workflow.py`. + workflow_file: The path to the workflow file that contains the event to generate UI for. e.g: `app/workflow.py`. event_cls: A Pydantic class to generate UI for. e.g: `DeepResearchEvent`. llm: The LLM to use for the generation. Default is Anthropic's Claude 3.7 Sonnet. We recommend using these LLMs: From 2040a1fae74bcbf1bb613b508e4e3f9a95b6eea2 Mon Sep 17 00:00:00 2001 From: leehuwuj Date: Tue, 15 Apr 2025 16:57:08 +0700 Subject: [PATCH 2/4] feat: add exports for event component generation in gen_ui module --- llama-index-server/llama_index/server/gen_ui/__init__.py | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/llama-index-server/llama_index/server/gen_ui/__init__.py b/llama-index-server/llama_index/server/gen_ui/__init__.py index e69de29bb..ce310dcad 100644 --- a/llama-index-server/llama_index/server/gen_ui/__init__.py +++ b/llama-index-server/llama_index/server/gen_ui/__init__.py @@ -0,0 +1,4 @@ +from .main import generate_event_component +from .parse_workflow_code import get_workflow_event_schemas + +__all__ = ["generate_event_component", "get_workflow_event_schemas"] From 472232ddc101754977cd874b6cbf2afb72e25b02 Mon Sep 17 00:00:00 2001 From: leehuwuj Date: Tue, 15 Apr 2025 17:01:45 +0700 Subject: [PATCH 3/4] update document --- llama-index-server/docs/custom_ui_component.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/llama-index-server/docs/custom_ui_component.md b/llama-index-server/docs/custom_ui_component.md index 06857a4ec..abb2e8891 100644 --- a/llama-index-server/docs/custom_ui_component.md +++ b/llama-index-server/docs/custom_ui_component.md @@ -76,21 +76,21 @@ server = LlamaIndexServer( ### Generate UI Component -We provide a `generate_ui_component` function that uses LLMs to automatically generate UI components for your workflow events. - -> **_Note:_** This feature requires the `ANTHROPIC_API_KEY` to be set in your environment. +We provide a `generate_event_component` function that uses LLMs to automatically generate UI components for your workflow events. ```python -from llama_index.server.gen_ui.main import generate_ui_component +from llama_index.server.gen_ui import generate_event_component +from llama_index.llms.openai import OpenAI # Generate a component using the event class you defined in your workflow from your_workflow import DeepResearchEvent -ui_code = await generate_ui_component( +ui_code = await generate_event_component( event_cls=DeepResearchEvent, + llm=OpenAI(model="gpt-4.1"), # Default LLM is Claude 3.7 Sonnet if not provided ) # Alternatively, generate from your workflow file -ui_code = await generate_ui_component( +ui_code = await generate_event_component( workflow_file="your_workflow.py", ) print(ui_code) @@ -100,4 +100,4 @@ with open("deep_research_event.jsx", "w") as f: f.write(ui_code) ``` -> **Tip:** For optimal results, add descriptive documentation to each field in your event data class. This helps the LLM better understand your data structure and generate more appropriate UI components. +> **Tip:** For optimal results, add descriptive documentation to each field in your event data class. This helps the LLM better understand your data structure and generate more appropriate UI components. We also recommend using GPT 4.1, Claude 3.7 Sonnet and Gemini 2.5 Pro for better results. From 6e2cc9a49f0062506f31d96caddd9cfd808a910c Mon Sep 17 00:00:00 2001 From: leehuwuj Date: Tue, 15 Apr 2025 17:20:26 +0700 Subject: [PATCH 4/4] refine prompt --- llama-index-server/llama_index/server/gen_ui/main.py | 1 + 1 file changed, 1 insertion(+) diff --git a/llama-index-server/llama_index/server/gen_ui/main.py b/llama-index-server/llama_index/server/gen_ui/main.py index b1b637758..f1731720a 100644 --- a/llama-index-server/llama_index/server/gen_ui/main.py +++ b/llama-index-server/llama_index/server/gen_ui/main.py @@ -84,6 +84,7 @@ class GenUIWorkflow(Workflow): // shadcn import pattern: import { ComponentName } from "@/components/ui/"; // e.g: import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/card"; // import { Button } from "@/components/ui/button"; + // import cn from "@/lib/utils"; // clsx is not supported // export the component export default function Component({ events }) {