Release 0.5.8 (#573)

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

.github/workflows/e2e.yml

@@ -89,7 +89,7 @@ jobs:
     strategy:
       fail-fast: true
       matrix:
-        node-version: [18, 20]
+        node-version: [20, 22]
         python-version: ["3.11"]
         os: [macos-latest, windows-latest, ubuntu-22.04]
         frameworks: ["nextjs"]

CHANGELOG.md

@@ -1,5 +1,29 @@
 # create-llama
 
+## 0.5.8
+
+### Patch Changes
+
+- 765181a: chore: test typescript e2e with node 20 and 22
+
+## 0.5.7
+
+### Patch Changes
+
+- 5988657: chore: bump llmaindex
+
+## 0.5.6
+
+### Patch Changes
+
+- d363ced: Bump llamaindex server packages
+
+## 0.5.5
+
+### Patch Changes
+
+- ee85320: The default custom deep research component does not work.
+
 ## 0.5.4
 
 ### Patch Changes

e2e/shared/llamaindexserver_template.spec.ts

@@ -65,7 +65,9 @@ for (const useCase of templateUseCases) {
           templateFramework === "express",
       );
       await page.goto(`http://localhost:${port}`);
-      await expect(page.getByText("Built by LlamaIndex")).toBeVisible();
+      await expect(page.getByText("Built by LlamaIndex")).toBeVisible({
+        timeout: 5 * 60 * 1000,
+      });
     });
 
     test("Frontend should be able to submit a message and receive the start of a streamed response", async ({

llama-index-server/README.md

@@ -110,7 +110,7 @@ When enabled, the server provides a chat interface at the root path (`/`) with:
 ### Custom UI Components
 
 You can add custom UI components for your workflow by providing `component_dir` config and adding custom .jsx or .tsx files to the directory.
-See [Custom UI Components](docs/custom_ui_component.md) for more details.
+See [Custom UI Components](https://github.com/run-llama/create-llama/blob/main/llama-index-server/docs/custom_ui_component.md) for more details.
 
 ## Development Mode
 

llama-index-server/llama_index/server/chat_ui.py

@@ -5,7 +5,7 @@ from typing import Optional
 
 import requests
 
-CHAT_UI_VERSION = "0.1.2"
+CHAT_UI_VERSION = "0.1.5"
 
 
 def download_chat_ui(

llama-index-server/llama_index/server/gen_ui/main.py

@@ -1,6 +1,11 @@
 import re
 from typing import Any, Dict, List, Optional, Type
 
+from pydantic import BaseModel
+from rich.console import Console
+from rich.live import Live
+from rich.panel import Panel
+
 from llama_index.core.llms import LLM
 from llama_index.core.prompts import PromptTemplate
 from llama_index.core.workflow import (
@@ -12,10 +17,6 @@ from llama_index.core.workflow import (
     step,
 )
 from llama_index.server.gen_ui.parse_workflow_code import get_workflow_event_schemas
-from pydantic import BaseModel
-from rich.console import Console
-from rich.live import Live
-from rich.panel import Panel
 
 
 class PlanningEvent(Event):
@@ -80,11 +81,7 @@ class GenUIWorkflow(Workflow):
 
     code_structure: str = """
         ```jsx
-            // Note: Only shadcn/ui and lucide-react and tailwind css are allowed.
-            // shadcn import pattern: import { ComponentName } from "@/components/ui/<component_path>";
-            // 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
+            // Note: Only React, shadcn/ui, lucide-react, LlamaIndex's markdown-ui and tailwind css (cn) are allowed.
 
             // export the component
             export default function Component({ events }) {
@@ -103,6 +100,21 @@ class GenUIWorkflow(Workflow):
         ```
     """
 
+    supported_deps = """
+        - React: import { useState } from "react";
+        - shadcn/ui: import { ComponentName } from "@/components/ui/<component_path>";
+            Supported shadcn components:  
+                accordion, alert, alert-dialog, aspect-ratio, avatar, badge, 
+                breadcrumb, button, calendar, card, carousel, chart, checkbox, collapsible, command, 
+                context-menu, dialog, drawer, dropdown-menu, form, hover-card, input, input-otp, label, 
+                menubar, navigation-menu, pagination, popover, progress, radio-group, resizable, 
+                scroll-area, select, separator, sheet, sidebar, skeleton, slider, sonner, switch, table, 
+                tabs, textarea, toggle, toggle-group, tooltip  
+        - lucide-react: import { IconName } from "lucide-react";
+        - tailwind css: import { cn } from "@/lib/utils"; // Note: clsx is not supported
+        - LlamaIndex's markdown-ui: import { Markdown } from "@llamaindex/chat-ui/widgets";
+    """
+
     def __init__(self, llm: LLM, **kwargs: Any):
         super().__init__(**kwargs)
         self.llm = llm
@@ -239,7 +251,7 @@ class GenUIWorkflow(Workflow):
     ) -> RefineGeneratedCodeEvent:
         prompt_template = """
             # Your role
-            You are a frontend developer who is developing a React component using shadcn/ui (@/components/ui/<component_name>) and lucide-react for the UI.
+            You are a frontend developer who is developing a React component using shadcn/ui, lucide-react, LlamaIndex's chat-ui, and tailwind css (cn) for the UI.
             You are given a list of events and other context.
             Your task is to write a beautiful UI for the events that will be included in a chat UI.
 
@@ -251,8 +263,11 @@ class GenUIWorkflow(Workflow):
                 {ui_description}
             ```
 
+            # Supported dependencies:
+            {supported_deps}
+
             # Requirements:
-            - Write beautiful UI components for the events using shadcn/ui and lucide-react.
+            - Write beautiful UI components for the events using the supported dependencies
             - The component text/label should be specified for each event type.
 
             # Instructions:
@@ -265,7 +280,7 @@ class GenUIWorkflow(Workflow):
                 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.
+            - Use the supported dependencies 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:
@@ -287,6 +302,7 @@ class GenUIWorkflow(Workflow):
             aggregation_function_context=aggregation_function_context,
             code_structure=self.code_structure,
             ui_description=ev.ui_description,
+            supported_deps=self.supported_deps,
         )
         response = await self.llm.acomplete(prompt, formatted=True)
 
@@ -317,6 +333,7 @@ class GenUIWorkflow(Workflow):
             {code_structure}
 
             # Requirements:
+            - Only use supported dependencies: {supported_deps}
             - Refine the code if needed to ensure there are no potential bugs. 
             - Be careful on code placement, make sure it doesn't call any undefined code.
             - Make sure the import statements are correct. 
@@ -329,6 +346,7 @@ class GenUIWorkflow(Workflow):
             generated_code=ev.generated_code,
             code_structure=self.code_structure,
             aggregation_function_context=ev.aggregation_function_context,
+            supported_deps=self.supported_deps,
         )
 
         response = await self.llm.acomplete(prompt, formatted=True)

llama-index-server/pyproject.toml

@@ -26,7 +26,7 @@ license = "MIT"
 name = "llama-index-server"
 packages = [{include = "llama_index/"}]
 readme = "README.md"
-version = "0.1.12"
+version = "0.1.13"
 
 [tool.poetry.dependencies]
 python = ">=3.9,<4.0"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-llama",
-  "version": "0.5.4",
+  "version": "0.5.8",
   "description": "Create LlamaIndex-powered apps with one command",
   "keywords": [
     "rag",

templates/components/ui/workflows/deep_research/ui_event.jsx

@@ -1,4 +1,4 @@
-function Component({ events }) {
+export default function DeepResearchComponent({ events }) {
   // Aggregate events by type and track their state progression
   const aggregateEvents = () => {
     const retrieveEvents = events.filter((e) => e.event === "retrieve");

templates/types/llamaindexserver/fastapi/pyproject.toml

@@ -19,7 +19,7 @@ python-dotenv = "^1.0.0"
 pydantic = "<2.10"
 aiostream = "^0.5.2"
 llama-index-core = "^0.12.28"
-llama-index-server = "^0.1.12"
+llama-index-server = "^0.1.13"
 
 [tool.poetry.group.dev.dependencies]
 mypy = "^1.8.0"

templates/types/llamaindexserver/nextjs/package.json

@@ -9,10 +9,10 @@
   "dependencies": {
     "@llamaindex/openai": "0.2.0",
     "@llamaindex/readers": "^2.0.0",
-    "@llamaindex/server": "0.1.0",
+    "@llamaindex/server": "0.1.4",
     "@llamaindex/tools": "0.0.4",
     "dotenv": "^16.4.7",
-    "llamaindex": "0.9.17",
+    "llamaindex": "0.10.1",
     "zod": "^3.23.8"
   },
   "devDependencies": {