chainlit app with multiple tools

.chainlit/config.toml

@@ -0,0 +1,84 @@
+[project]
+# Whether to enable telemetry (default: true). No personal data is collected.
+enable_telemetry = true
+
+# List of environment variables to be provided by each user to use the app.
+user_env = []
+
+# Duration (in seconds) during which the session is saved when the connection is lost
+session_timeout = 3600
+
+# Enable third parties caching (e.g LangChain cache)
+cache = false
+
+# Follow symlink for asset mount (see https://github.com/Chainlit/chainlit/issues/317)
+# follow_symlink = false
+
+[features]
+# Show the prompt playground
+prompt_playground = true
+
+# Process and display HTML in messages. This can be a security risk (see https://stackoverflow.com/questions/19603097/why-is-it-dangerous-to-render-user-generated-html-or-javascript)
+unsafe_allow_html = false
+
+# Process and display mathematical expressions. This can clash with "$" characters in messages.
+latex = false
+
+# Authorize users to upload files with messages
+multi_modal = true
+
+# Allows user to use speech to text
+[features.speech_to_text]
+    enabled = false
+    # See all languages here https://github.com/JamesBrill/react-speech-recognition/blob/HEAD/docs/API.md#language-string
+    # language = "en-US"
+
+[UI]
+# Name of the app and chatbot.
+name = "Chatbot"
+
+# Show the readme while the conversation is empty.
+show_readme_as_default = true
+
+# Description of the app and chatbot. This is used for HTML tags.
+# description = ""
+
+# Large size content are by default collapsed for a cleaner ui
+default_collapse_content = true
+
+# The default value for the expand messages settings.
+default_expand_messages = false
+
+# Hide the chain of thought details from the user in the UI.
+hide_cot = false
+
+# Link to your github repo. This will add a github button in the UI's header.
+# github = ""
+
+# Specify a CSS file that can be used to customize the user interface.
+# The CSS file can be served from the public directory or via an external link.
+# custom_css = "/public/test.css"
+
+# Override default MUI light theme. (Check theme.ts)
+[UI.theme.light]
+    #background = "#FAFAFA"
+    #paper = "#FFFFFF"
+
+    [UI.theme.light.primary]
+        #main = "#F80061"
+        #dark = "#980039"
+        #light = "#FFE7EB"
+
+# Override default MUI dark theme. (Check theme.ts)
+[UI.theme.dark]
+    #background = "#FAFAFA"
+    #paper = "#FFFFFF"
+
+    [UI.theme.dark.primary]
+        #main = "#F80061"
+        #dark = "#980039"
+        #light = "#FFE7EB"
+
+
+[meta]
+generated_by = "0.7.700"

.eslintrc.cjs

@@ -0,0 +1,84 @@
+/**
+ * This is intended to be a basic starting point for linting in your app.
+ * It relies on recommended configs out of the box for simplicity, but you can
+ * and should modify this configuration to best suit your team's needs.
+ */
+
+/** @type {import('eslint').Linter.Config} */
+module.exports = {
+  root: true,
+  parserOptions: {
+    ecmaVersion: "latest",
+    sourceType: "module",
+    ecmaFeatures: {
+      jsx: true,
+    },
+  },
+  env: {
+    browser: true,
+    commonjs: true,
+    es6: true,
+  },
+  ignorePatterns: ["!**/.server", "!**/.client"],
+
+  // Base config
+  extends: ["eslint:recommended"],
+
+  overrides: [
+    // React
+    {
+      files: ["**/*.{js,jsx,ts,tsx}"],
+      plugins: ["react", "jsx-a11y"],
+      extends: [
+        "plugin:react/recommended",
+        "plugin:react/jsx-runtime",
+        "plugin:react-hooks/recommended",
+        "plugin:jsx-a11y/recommended",
+      ],
+      settings: {
+        react: {
+          version: "detect",
+        },
+        formComponents: ["Form"],
+        linkComponents: [
+          { name: "Link", linkAttribute: "to" },
+          { name: "NavLink", linkAttribute: "to" },
+        ],
+        "import/resolver": {
+          typescript: {},
+        },
+      },
+    },
+
+    // Typescript
+    {
+      files: ["**/*.{ts,tsx}"],
+      plugins: ["@typescript-eslint", "import"],
+      parser: "@typescript-eslint/parser",
+      settings: {
+        "import/internal-regex": "^~/",
+        "import/resolver": {
+          node: {
+            extensions: [".ts", ".tsx"],
+          },
+          typescript: {
+            alwaysTryTypes: true,
+          },
+        },
+      },
+      extends: [
+        "plugin:@typescript-eslint/recommended",
+        "plugin:import/recommended",
+        "plugin:import/typescript",
+      ],
+    },
+
+    // Node
+    {
+      files: [".eslintrc.cjs"],
+      env: {
+        node: true,
+      },
+    },
+  ],
+};

.gitignore

@@ -0,0 +1,7 @@
+node_modules
+
+/__pycache__
+/.cache
+/build
+.venv
+.env

.python-version

@@ -0,0 +1 @@
+3.12

Dockerfile

@@ -1,16 +1,31 @@
-# Read the doc: https://huggingface.co/docs/hub/spaces-sdks-docker
-# you will also find guides on how best to write your Dockerfile
 
-FROM python:3.9
+# Get a distribution that has uv already installed
+FROM ghcr.io/astral-sh/uv:python3.13-bookworm-slim
 
+# Add user - this is the user that will run the app
+# If you do not set user, the app will run as root (undesirable)
 RUN useradd -m -u 1000 user
 USER user
-ENV PATH="/home/user/.local/bin:$PATH"
 
-WORKDIR /app
+# Set the home directory and path
+ENV HOME=/home/user \
+    PATH=/home/user/.local/bin:$PATH        
 
-COPY --chown=user ./requirements.txt requirements.txt
-RUN pip install --no-cache-dir --upgrade -r requirements.txt
+ENV UVICORN_WS_PROTOCOL=websockets
 
-COPY --chown=user . /app
-CMD ["uvicorn", "app:app", "--host", "0.0.0.0", "--port", "7860"]
+# Set the working directory
+WORKDIR $HOME/app
+
+# Copy the app to the container
+COPY --chown=user . $HOME/app
+
+# Install the dependencies
+# RUN uv sync --frozen
+RUN uv sync
+
+# Expose the port
+EXPOSE 7860
+
+# Run the app
+# CMD yarn build && uv run unicorn app:app --host 0.0.0.0 --port 7860
+CMD uv run chainlit run chainlit.py --host 0.0.0.0 --port 7860

README.md

@@ -9,3 +9,44 @@ license: mit
 ---
 
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+
+# Welcome to Remix!
+
+- 📖 [Remix docs](https://remix.run/docs)
+
+## Development
+
+Run the dev server:
+
+```shellscript
+npm run dev
+```
+
+## Deployment
+
+First, build your app for production:
+
+```sh
+npm run build
+```
+
+Then run the app in production mode:
+
+```sh
+npm start
+```
+
+Now you'll need to pick a host to deploy it to.
+
+### DIY
+
+If you're familiar with deploying Node applications, the built-in Remix app server is production-ready.
+
+Make sure to deploy the output of `npm run build`
+
+- `build/server`
+- `build/client`
+
+## Styling
+
+This template comes with [Tailwind CSS](https://tailwindcss.com/) already configured for a simple default starting experience. You can use whatever css framework you prefer. See the [Vite docs on css](https://vitejs.dev/guide/features.html#css) for more information.

app.py

@@ -1,7 +1,17 @@
-from fastapi import FastAPI
+import os
+import uvicorn
+from fastapi import FastAPI, Body
+from fastapi.staticfiles import StaticFiles
 
 app = FastAPI()
 
-@app.get("/")
-def greet_json():
+@app.get("/api/chat")
+def chat():
     return {"Hello": "World!"}
+
+if os.getenv("ENV") == "production":
+    app.mount("/", StaticFiles(directory="dist", html=True), name="static")
+    app.get("/")(StaticFiles(directory="dist", html=True))
+
+if __name__ == "__main__":
+    uvicorn.run(app, host="0.0.0.0", port=7860)

chainlit.md

@@ -0,0 +1,14 @@
+# Welcome to Chainlit! 🚀🤖
+
+Hi there, Developer! 👋 We're excited to have you on board. Chainlit is a powerful tool designed to help you prototype, debug and share applications built on top of LLMs.
+
+## Useful Links 🔗
+
+- **Documentation:** Get started with our comprehensive [Chainlit Documentation](https://docs.chainlit.io) 📚
+- **Discord Community:** Join our friendly [Chainlit Discord](https://discord.gg/k73SQ3FyUh) to ask questions, share your projects, and connect with other developers! 💬
+
+We can't wait to see what you create with Chainlit! Happy coding! 💻😊
+
+## Welcome screen
+
+To modify the welcome screen, edit the `chainlit.md` file at the root of your project. If you do not want a welcome screen, just leave this file empty.

chainlit.py

@@ -0,0 +1,126 @@
+from typing import Literal
+from langchain_openai import ChatOpenAI
+from langgraph.prebuilt import ToolNode
+from langchain.schema import StrOutputParser
+from langchain.prompts import ChatPromptTemplate
+from langchain.schema.runnable.config import RunnableConfig
+from langchain_core.messages import HumanMessage
+from langgraph.graph import END, StateGraph, START
+from langgraph.graph.message import MessagesState
+from langchain_core.messages import BaseMessage, SystemMessage, HumanMessage
+
+# tools
+from langchain_core.tools import tool
+from langchain_community.tools.arxiv.tool import ArxivQueryRun
+from langchain_community.tools.tavily_search import TavilySearchResults
+from langchain_community.tools.yahoo_finance_news import YahooFinanceNewsTool
+
+
+import chainlit as cl
+
+@tool
+def multiply(first_int: int, second_int: int) -> int:
+  """Multiply two integers together."""
+  return first_int * second_int
+
+yahoo_finance_news = YahooFinanceNewsTool()
+tavily_search = TavilySearchResults(max_results=5)
+arxiv_query = ArxivQueryRun()
+
+tools = [
+  yahoo_finance_news,  
+  tavily_search,
+  arxiv_query,
+  multiply,
+]
+
+model = ChatOpenAI(model_name="gpt-4o-mini", temperature=0)
+final_model = ChatOpenAI(model_name="gpt-4o-mini", temperature=0)
+
+model = model.bind_tools(tools)
+
+# NOTE: this is where we're adding a tag that we'll can use later to filter the model stream events to only the model called in the final node.
+# This is not necessary if you call a single LLM but might be important in case you call multiple models within the node and want to filter events
+# from only one of them.
+final_model = final_model.with_config(tags=["final_node"])
+tool_node = ToolNode(tools=tools)
+
+def should_continue(state: MessagesState) -> Literal["tools", "final"]:
+    messages = state["messages"]
+    last_message = messages[-1]
+    # If the LLM makes a tool call, then we route to the "tools" node
+    if last_message.tool_calls:
+        return "tools"
+    # Otherwise, we stop (reply to the user)
+    return "final"
+
+
+def call_model(state: MessagesState):
+    messages = state["messages"]
+    response = model.invoke(messages)
+    # We return a list, because this will get merged with the existing list
+    return {"messages": [response]}
+
+
+def call_final_model(state: MessagesState):
+    messages = state["messages"]
+    last_ai_message = messages[-1]
+    response = final_model.invoke(
+        [
+            SystemMessage("Provide a summary in point form notes of the following:"),
+            HumanMessage(last_ai_message.content),
+        ]
+    )
+    # overwrite the last AI message from the agent
+    response.id = last_ai_message.id
+    return {"messages": [response]}
+
+
+builder = StateGraph(MessagesState)
+
+builder.add_node("agent", call_model)
+builder.add_node("tools", tool_node)
+# add a separate final node
+builder.add_node("final", call_final_model)
+
+builder.add_edge(START, "agent")
+builder.add_conditional_edges(
+    "agent",
+    should_continue,
+)
+
+builder.add_edge("tools", "agent")
+builder.add_edge("final", END)
+
+graph = builder.compile()
+
+@cl.on_chat_start
+async def on_chat_start():
+    model = ChatOpenAI(streaming=True)
+    prompt = ChatPromptTemplate.from_messages(
+        [
+            (
+                "system",
+                "You're a very knowledgeable agent with access to several tools to get recent data and multiply numbers.",
+            ),
+            ("human", "{question}"),
+        ]
+    )
+    runnable = prompt | model | StrOutputParser()
+    cl.user_session.set("runnable", runnable)
+
+@cl.on_message
+async def on_message(msg: cl.Message):
+    config = {}
+    cb = cl.LangchainCallbackHandler()
+    final_answer = cl.Message(content="")
+    
+    for msg, metadata in graph.stream({"messages": [HumanMessage(content=msg.content)]}, stream_mode="messages", config=RunnableConfig(callbacks=[cb], **config)):
+        if (
+            msg.content
+            and not isinstance(msg, HumanMessage)
+            and metadata["langgraph_node"] == "final"
+        ):
+            await final_answer.stream_token(msg.content)
+
+    await final_answer.send()

graph.py

@@ -0,0 +1,77 @@
+import asyncio
+from typing import TypedDict, Annotated
+from langchain_openai import ChatOpenAI
+from langgraph.prebuilt import ToolNode
+from langgraph.graph import StateGraph, END
+from langgraph.graph.message import add_messages
+from langchain_core.messages import HumanMessage
+from langchain.schema.runnable import RunnableLambda
+
+# tools
+from langchain_core.tools import tool
+from langchain_community.tools.tavily_search import TavilySearchResults
+from langchain_community.tools.arxiv.tool import ArxivQueryRun
+from langchain_community.tools.openweathermap.tool import OpenWeatherMapQueryRun
+
+@tool
+def multiply(first_int: int, second_int: int) -> int:
+  """Multiply two integers together."""
+  return first_int * second_int
+
+tavily_search = TavilySearchResults(max_results=5)
+weather_query = OpenWeatherMapQueryRun()
+arxiv_query = ArxivQueryRun()
+
+tool_belt = [
+  tavily_search,
+  weather_query,
+  arxiv_query,
+  multiply,
+]
+
+llm = ChatOpenAI(model="gpt-4o-mini", temperature=0)
+llm = llm.bind_tools(tool_belt)
+
+class AgentState(TypedDict):
+  messages: Annotated[list, add_messages]
+  loop_count: int
+
+async def call_model(state):
+  messages = state["messages"]
+  response = llm.invoke(messages)
+  return {"messages" : [response]}
+
+def should_continue(state):
+  last_message = state["messages"][-1]
+  if last_message.tool_calls:
+    return "action"
+  return END
+
+tool_node = ToolNode(tool_belt)
+
+graph = StateGraph(AgentState)
+graph.add_node("agent", call_model)
+graph.add_node("action", tool_node)
+
+graph.set_entry_point("agent")
+graph.add_conditional_edges(
+  "agent",
+  should_continue
+)
+graph.add_edge("action", "agent")
+
+tool_call_graph = graph.compile()
+
+async def main():
+  inputs = {"messages" : [HumanMessage(content="Search Arxiv for the QLoRA paper, then search each of the authors to find out their latest Tweet using Tavily! and solve 5 x 5 please.")]}
+
+  async for chunk in tool_call_graph.astream(inputs, stream_mode="updates"):
+    for node, values in chunk.items():
+      # print(f"Receiving update from node: '{node}'")
+      # if node == "action":
+      #   print(f"Tool Used: {values['messages'][0].name}")
+      print(values["messages"])
+      print('\n')
+
+
+asyncio.run(main())

pyproject.toml

@@ -0,0 +1,17 @@
+[project]
+name = "langgraphsandbox"
+version = "0.1.0"
+description = "Add your description here"
+readme = "README.md"
+requires-python = ">=3.12"
+dependencies = [
+    "arxiv>=2.1.3",
+    "chainlit>=2.1.0",
+    "fastapi>=0.115.8",
+    "langchain>=0.3.17",
+    "langchain-community>=0.3.16",
+    "langchain-openai>=0.3.3",
+    "langgraph>=0.2.69",
+    "uvicorn[standard]>=0.34.0",
+    "yfinance>=0.2.52",
+]

requirements.txt

@@ -1,2 +0,0 @@
-fastapi
-uvicorn[standard]