From b57a8abc59bdc7af0a3f8817cd27b2401de861ca Mon Sep 17 00:00:00 2001
From: Romamo <romamo@yandex.ru>
Date: Tue, 25 Mar 2025 17:34:56 +0200
Subject: [PATCH] Added environment variables to bypass the initial setup form

---
 .env.example             |  4 ++++
 README.md                | 18 ++++++++++++++++++
 src/providers/Stream.tsx | 23 ++++++++++++++++++-----
 3 files changed, 40 insertions(+), 5 deletions(-)
 create mode 100644 .env.example

diff --git a/.env.example b/.env.example
new file mode 100644
index 0000000..1269e38
--- /dev/null
+++ b/.env.example
@@ -0,0 +1,4 @@
+# LangGraph Configuration
+VITE_API_URL=http://localhost:2024
+VITE_ASSISTANT_ID=agent
+VITE_LANGSMITH_API_KEY=
diff --git a/README.md b/README.md
index aa78848..3097bb0 100644
--- a/README.md
+++ b/README.md
@@ -47,3 +47,21 @@ Once the app is running (or if using the deployed site), you'll be prompted to e
 - **LangSmith API Key**: (only required for connecting to deployed LangGraph servers) Your LangSmith API key to use when authenticating requests sent to LangGraph servers.
 
 After entering these values, click `Continue`. You'll then be redirected to a chat interface where you can start chatting with your LangGraph server.
+
+## Environment Variables
+
+You can bypass the initial setup form by setting the following environment variables:
+
+```
+VITE_API_URL=http://localhost:2024
+VITE_ASSISTANT_ID=agent
+VITE_LANGSMITH_API_KEY=your_api_key_if_needed
+```
+
+To use these variables:
+
+1. Copy the `.env.example` file to a new file named `.env`
+2. Fill in the values in the `.env` file
+3. Restart the application
+
+When these environment variables are set, the application will use them instead of showing the setup form.
diff --git a/src/providers/Stream.tsx b/src/providers/Stream.tsx
index 5f40efa..2b4b065 100644
--- a/src/providers/Stream.tsx
+++ b/src/providers/Stream.tsx
@@ -123,9 +123,19 @@ const StreamSession = ({
 export const StreamProvider: React.FC<{ children: ReactNode }> = ({
   children,
 }) => {
-  const [apiUrl, setApiUrl] = useQueryState("apiUrl");
+  // Get environment variables
+  const envApiUrl = import.meta.env.VITE_API_URL as string;
+  const envAssistantId = import.meta.env.VITE_ASSISTANT_ID as string;
+  const envApiKey = import.meta.env.VITE_LANGSMITH_API_KEY as string;
+
+  // Use URL params with env var fallbacks
+  const [apiUrl, setApiUrl] = useQueryState("apiUrl", { defaultValue: envApiUrl || "" });
+  const [assistantId, setAssistantId] = useQueryState("assistantId", { defaultValue: envAssistantId || "" });
+  
+  // For API key, use localStorage with env var fallback
   const [apiKey, _setApiKey] = useState(() => {
-    return getApiKey();
+    const storedKey = getApiKey();
+    return storedKey || envApiKey || "";
   });
 
   const setApiKey = (key: string) => {
@@ -133,9 +143,12 @@ export const StreamProvider: React.FC<{ children: ReactNode }> = ({
     _setApiKey(key);
   };
 
-  const [assistantId, setAssistantId] = useQueryState("assistantId");
-
-  if (!apiUrl || !assistantId) {
+  // Determine final values to use, prioritizing URL params then env vars
+  const finalApiUrl = apiUrl || envApiUrl;
+  const finalAssistantId = assistantId || envAssistantId;
+  
+  // If we're missing any required values, show the form
+  if (!finalApiUrl || !finalAssistantId) {
     return (
       <div className="flex items-center justify-center min-h-screen w-full p-4">
         <div className="animate-in fade-in-0 zoom-in-95 flex flex-col border bg-background shadow-lg rounded-lg max-w-3xl">