From cee91430d6368023bde8ece3e0c0ceae84fbe9b6 Mon Sep 17 00:00:00 2001 From: Valerio Como Date: Fri, 14 Mar 2025 08:57:27 +0000 Subject: [PATCH 1/3] chore: devcontainer setup --- .devcontainer/devcontainer.json | 9 +++++++++ .devcontainer/hooks/postCreateCommand.sh | 16 ++++++++++++++++ .gitignore | 1 + README.md | 12 ++++++++++++ 4 files changed, 38 insertions(+) create mode 100644 .devcontainer/devcontainer.json create mode 100644 .devcontainer/hooks/postCreateCommand.sh diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json new file mode 100644 index 0000000..e69f8ba --- /dev/null +++ b/.devcontainer/devcontainer.json @@ -0,0 +1,9 @@ +{ + "name": "LanggraphjsGenUIExamples", + "image": "mcr.microsoft.com/devcontainers/javascript-node:1-22-bookworm", + "mounts": [ + "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume", + "source=${localWorkspaceFolderBasename}-pnpm-store,target=${containerWorkspaceFolder}/.pnpm-store,type=volume" + ], + "postCreateCommand": "sh .devcontainer/hooks/postCreateCommand.sh" +} diff --git a/.devcontainer/hooks/postCreateCommand.sh b/.devcontainer/hooks/postCreateCommand.sh new file mode 100644 index 0000000..3ec19b7 --- /dev/null +++ b/.devcontainer/hooks/postCreateCommand.sh @@ -0,0 +1,16 @@ +#!/bin/bash +sudo chown -R node:node node_modules +sudo chown -R node:node .pnpm-store + +FILE=".env" + +if [ ! -f "$FILE" ]; then + echo "$FILE doesn't exist. Creating..." + cp .env.example .env + echo "$FILE file created." +else + echo "$FILE already created." +fi + +sudo corepack enable +pnpm i \ No newline at end of file diff --git a/.gitignore b/.gitignore index 494dcfd..6028ea0 100644 --- a/.gitignore +++ b/.gitignore @@ -11,6 +11,7 @@ node_modules dist dist-ssr *.local +.pnpm-store # Editor directories and files .vscode/* diff --git a/README.md b/README.md index defcbf4..6410fb0 100644 --- a/README.md +++ b/README.md @@ -84,6 +84,18 @@ The following are some prompts, and corresponding graph IDs you can use to test - Graph ID: `email_agent`: - `Write me an email to about ` - Will generate an email for you, addressed to the email address you specified. Used to demonstrate how you can trigger the built in Human in the Loop (HITL) UI in the Agent Chat UI. This agent will throw an `interrupt`, with the standard [`HumanInterrupt`](https://github.com/langchain-ai/langgraph/blob/84c956bc8c3b2643819677bea962425e02e15ba4/libs/prebuilt/langgraph/prebuilt/interrupt.py#L42) schema, which the Agent Chat UI is able to automatically detect, and render a HITL UI component to manage the interrupt. + ## Devcontainer setup + +If you wanna run the project in a devcontainer, you could skip some of the previous steps. + +You need to set you all the required API keys in `.env` file, created automatically by the devcontainer setup process, as described above. + +Start the LangGraph server: + +```bash +pnpm agent --host 127.0.0.1 +``` + # Agents Key From 5191c35ff884f22b8fe103c747e5b38b5cf9b2a2 Mon Sep 17 00:00:00 2001 From: Valerio Como Date: Tue, 18 Mar 2025 17:09:19 +0000 Subject: [PATCH 2/3] docs: README.md updated --- README.md | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 6410fb0..8716636 100644 --- a/README.md +++ b/README.md @@ -86,9 +86,15 @@ The following are some prompts, and corresponding graph IDs you can use to test ## Devcontainer setup -If you wanna run the project in a devcontainer, you could skip some of the previous steps. +[![Open in Dev Containers](https://img.shields.io/static/v1?label=Dev%20Containers&message=Open&color=blue)](https://vscode.dev/redirect?url=vscode://ms-vscode-remote.remote-containers/cloneInVolume?url=https://github.com/langchain-ai/langgraphjs-gen-ui-examples) -You need to set you all the required API keys in `.env` file, created automatically by the devcontainer setup process, as described above. +Click the badge above if you wanna, you can run the project in a devcontainer. + +Otherwise, clone the repo and open the directory with VSCode and run it in a devcontainer. + +During the startup process a `.env` file will be created, starting from `.env.example`. All dependecies will be installed automatically, so no need for a `pnpm i `. + +You need to set you all the required API keys in `.env` file. Start the LangGraph server: From 691fc914c28ac91ea0c2f3bc05d26ed350aac4e0 Mon Sep 17 00:00:00 2001 From: Valerio Como Date: Tue, 18 Mar 2025 17:14:45 +0000 Subject: [PATCH 3/3] chore: added prettier extension to devcontainer.json --- .devcontainer/devcontainer.json | 19 ++++++++++++------- README.md | 2 +- 2 files changed, 13 insertions(+), 8 deletions(-) diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json index e69f8ba..04c1874 100644 --- a/.devcontainer/devcontainer.json +++ b/.devcontainer/devcontainer.json @@ -1,9 +1,14 @@ { - "name": "LanggraphjsGenUIExamples", - "image": "mcr.microsoft.com/devcontainers/javascript-node:1-22-bookworm", - "mounts": [ - "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume", - "source=${localWorkspaceFolderBasename}-pnpm-store,target=${containerWorkspaceFolder}/.pnpm-store,type=volume" - ], - "postCreateCommand": "sh .devcontainer/hooks/postCreateCommand.sh" + "name": "LanggraphjsGenUIExamples", + "image": "mcr.microsoft.com/devcontainers/javascript-node:1-22-bookworm", + "mounts": [ + "source=${localWorkspaceFolderBasename}-node_modules,target=${containerWorkspaceFolder}/node_modules,type=volume", + "source=${localWorkspaceFolderBasename}-pnpm-store,target=${containerWorkspaceFolder}/.pnpm-store,type=volume" + ], + "postCreateCommand": "sh .devcontainer/hooks/postCreateCommand.sh", + "customizations": { + "vscode": { + "extensions": ["esbenp.prettier-vscode"] + } + } } diff --git a/README.md b/README.md index 8716636..635bae1 100644 --- a/README.md +++ b/README.md @@ -84,7 +84,7 @@ The following are some prompts, and corresponding graph IDs you can use to test - Graph ID: `email_agent`: - `Write me an email to about ` - Will generate an email for you, addressed to the email address you specified. Used to demonstrate how you can trigger the built in Human in the Loop (HITL) UI in the Agent Chat UI. This agent will throw an `interrupt`, with the standard [`HumanInterrupt`](https://github.com/langchain-ai/langgraph/blob/84c956bc8c3b2643819677bea962425e02e15ba4/libs/prebuilt/langgraph/prebuilt/interrupt.py#L42) schema, which the Agent Chat UI is able to automatically detect, and render a HITL UI component to manage the interrupt. - ## Devcontainer setup +## Devcontainer setup [![Open in Dev Containers](https://img.shields.io/static/v1?label=Dev%20Containers&message=Open&color=blue)](https://vscode.dev/redirect?url=vscode://ms-vscode-remote.remote-containers/cloneInVolume?url=https://github.com/langchain-ai/langgraphjs-gen-ui-examples)