Mintplex-Labs · tonytrill · Feb 24, 2025 · Feb 24, 2025 · Feb 25, 2025
diff --git a/frontend/src/components/VectorDBSelection/ChromaDBOptions/index.jsx b/frontend/src/components/VectorDBSelection/ChromaDBOptions/index.jsx
@@ -1,9 +1,13 @@
+import { useState } from "react";
+
 export default function ChromaDBOptions({ settings }) {
+  const [isCloud, setIsCloud] = useState(settings?.ChromaCloud === "true");
+
   return (
-    <div className="w-full flex flex-col gap-y-7">
+    <div className="flex flex-col w-full gap-y-7">
       <div className="w-full flex items-center gap-[36px] mt-1.5">
         <div className="flex flex-col w-60">
-          <label className="text-white text-sm font-semibold block mb-3">
+          <label className="block mb-3 text-sm font-semibold text-white">
             Chroma Endpoint
           </label>
           <input
@@ -19,7 +23,7 @@ export default function ChromaDBOptions({ settings }) {
         </div>
 
         <div className="flex flex-col w-60">
-          <label className="text-white text-sm font-semibold block mb-3">
+          <label className="block mb-3 text-sm font-semibold text-white">
             API Header
           </label>
           <input
@@ -33,7 +37,7 @@ export default function ChromaDBOptions({ settings }) {
         </div>
 
         <div className="flex flex-col w-60">
-          <label className="text-white text-sm font-semibold block mb-3">
+          <label className="block mb-3 text-sm font-semibold text-white">
             API Key
           </label>
           <input
@@ -46,6 +50,77 @@ export default function ChromaDBOptions({ settings }) {
           />
         </div>
       </div>
+      <div className="relative w-full max-h-full">
+        <div className="relative rounded-lg">
+          <div className="flex items-start justify-between px-6 py-4"></div>
+          <div className="flex w-full h-full space-y-6">
+            <div className="flex flex-col w-full gap-y-4">
+              <div className="">
+                <label className="block mb-3 text-sm font-semibold text-white">
+                  Using Chroma Cloud?
+                </label>
+                <label className="relative inline-flex items-center cursor-pointer">
+                  <input
+                    name="ChromaCloudController"
+                    type="checkbox"
+                    onChange={(e) => {
+                      setIsCloud(e.target.checked);
+                    }}
+                    checked={isCloud}
+                    className="sr-only peer"
+                  />
+                  <input
+                    name="ChromaCloud"
+                    type="hidden"
+                    value={isCloud.toString()}
+                  />
+                  <div className="peer h-6 w-11 rounded-full bg-[#CFCFD0] after:absolute after:left-[2px] after:top-[2px] after:h-5 after:w-5 after:rounded-full after:shadow-xl after:border-none after:bg-white after:box-shadow-md after:transition-all after:content-[''] peer-checked:bg-[#32D583] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-transparent" />
+                </label>
+              </div>
+              <div
+                className={`w-full flex items-center gap-[36px] mt-1.5 ${
+                  !isCloud ? "hidden" : ""
+                }`}
+              >
+                <div className="flex flex-col w-60">
+                  <label className="block mb-3 text-sm font-semibold text-white">
+                    Tenant ID
+                  </label>
+                  <input
+                    name="ChromaTenantId"
+                    type="text"
+                    className="border-none bg-theme-settings-input-bg text-white text-sm rounded-lg focus:outline-primary-button active:outline-primary-button outline-none block w-full p-2.5"
+                    placeholder="Your Chroma Cloud Tenant ID"
+                    defaultValue={settings?.ChromaTenantId}
+                    required={isCloud}
+                    autoComplete="off"
+                  />
+                </div>
+                <div className="flex flex-col w-60">
+                  <label className="block mb-3 text-sm font-semibold text-white">
+                    Database Name
+                  </label>
+                  <input
+                    name="ChromaDatabaseName"
+                    type="text"
+                    className="border-none bg-theme-settings-input-bg text-white text-sm rounded-lg focus:outline-primary-button active:outline-primary-button outline-none block w-full p-2.5"
+                    placeholder="Your Chroma Cloud Database"
+                    defaultValue={settings?.ChromaDatabaseName}
+                    required={isCloud}
+                    autoComplete="off"
+                  />
+                </div>
+              </div>
+              {!isCloud && (
+                <>
+                  <input type="hidden" name="ChromaTenantId" value="" />
+                  <input type="hidden" name="ChromaDatabaseName" value="" />
+                </>
+              )}
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
   );
 }
diff --git a/server/.env.example b/server/.env.example
@@ -176,6 +176,9 @@ SIG_SALT='salt' # Please generate random string at least 32 chars long.
 # CHROMA_ENDPOINT='http://localhost:8000'
 # CHROMA_API_HEADER="X-Api-Key"
 # CHROMA_API_KEY="sk-123abc"
+# CHROMA_CLOUD="false"
+# CHROMA_TENANT_ID="your-tenant-id"
+# CHROMA_DATABASE_NAME="your-database-name"
 
 # Enable all below if you are using vector database: Pinecone.
 # VECTOR_DB="pinecone"

diff --git a/server/models/systemSettings.js b/server/models/systemSettings.js
@@ -406,6 +406,9 @@ const SystemSettings = {
       ChromaEndpoint: process.env.CHROMA_ENDPOINT,
       ChromaApiHeader: process.env.CHROMA_API_HEADER,
       ChromaApiKey: !!process.env.CHROMA_API_KEY,
+      ChromaCloud: process.env.CHROMA_CLOUD,
+      ChromaTenantId: process.env.CHROMA_TENANT_ID,
+      ChromaDatabaseName: process.env.CHROMA_DATABASE_NAME,
 
       // Weaviate DB Keys
       WeaviateEndpoint: process.env.WEAVIATE_ENDPOINT,

diff --git a/server/package.json b/server/package.json
@@ -44,7 +44,7 @@
     "chalk": "^4",
     "check-disk-space": "^3.4.0",
     "cheerio": "^1.0.0",
-    "chromadb": "^1.5.2",
+    "chromadb": "^1.10.4",
     "cohere-ai": "^7.9.5",
     "cors": "^2.8.5",
     "dotenv": "^16.0.3",

diff --git a/server/utils/helpers/updateENV.js b/server/utils/helpers/updateENV.js
@@ -301,6 +301,19 @@ const KEY_MAPPING = {
     envKey: "CHROMA_API_KEY",
     checks: [],
   },
+  // Chroma Cloud Options
+  ChromaCloud: {
+    envKey: "CHROMA_CLOUD",
+    checks: [],
+  },
+  ChromaTenantId: {
+    envKey: "CHROMA_TENANT_ID",
+    checks: [],
+  },
+  ChromaDatabaseName: {
+    envKey: "CHROMA_DATABASE_NAME",
+    checks: [],
+  },
 
   // Weaviate Options
   WeaviateEndpoint: {

diff --git a/server/utils/vectorDbProviders/chroma/CHROMA_SETUP.md b/server/utils/vectorDbProviders/chroma/CHROMA_SETUP.md
@@ -26,3 +26,28 @@ CHROMA_ENDPOINT='http://localhost:8000'
 # CHROMA_API_HEADER="X-Api-Key" // If you have an Auth middleware on your instance.
 # CHROMA_API_KEY="sk-123abc" // If you have an Auth middleware on your instance.
 ```
+
+# How to setup a connection to Chroma Cloud
+
+### How to get started
+
+**Requirements**
+
+- A Chroma Cloud Account
+
+**Instructions**
+
+- Go to trychroma.com and login to Chroma Cloud.
+- Create a new database.
+- Click "Connection String"
+- Capture your host, tenant id, database name, API Header, and API key.
+
+```
+VECTOR_DB="chroma"
+CHROMA_ENDPOINT='https://api.trychroma.com'
+CHROMA_API_HEADER="X-CHROMA-TOKEN"
+CHROMA_API_KEY="sk-123abc"
+CHROMA_CLOUD="true"
+CHROMA_TENANT_ID="your-tenant-id"
+CHROMA_DATABASE_NAME="your-database-name"
+```
diff --git a/server/utils/vectorDbProviders/chroma/index.js b/server/utils/vectorDbProviders/chroma/index.js
@@ -60,17 +60,24 @@ const Chroma = {
       throw new Error("Chroma::Invalid ENV settings");
 
     const client = new ChromaClient({
-      path: process.env.CHROMA_ENDPOINT, // if not set will fallback to localhost:8000
-      ...(!!process.env.CHROMA_API_HEADER && !!process.env.CHROMA_API_KEY
+      path: process.env.CHROMA_ENDPOINT,
+      ...(process.env.CHROMA_API_KEY && process.env.CHROMA_API_HEADER
         ? {
-            fetchOptions: {
-              headers: parseAuthHeader(
-                process.env.CHROMA_API_HEADER || "X-Api-Key",
-                process.env.CHROMA_API_KEY
-              ),
+            auth: {
+              provider: "token",
+              credentials: process.env.CHROMA_API_KEY,
+              tokenHeaderType: process.env.CHROMA_API_HEADER || "X-Api-Key",
             },
           }
         : {}),
+      ...(process.env.CHROMA_CLOUD === "true" &&
+      process.env.CHROMA_TENANT_ID &&
+      process.env.CHROMA_DATABASE_NAME
+        ? {
+            tenant: process.env.CHROMA_TENANT_ID,
+            database: process.env.CHROMA_DATABASE_NAME,
+          }
+        : {}),
     });
 
     const isAlive = await client.heartbeat();
@@ -296,15 +303,14 @@ const Chroma = {
         name: this.normalize(namespace),
         metadata: { "hnsw:space": "cosine" },
       });
-
       if (vectors.length > 0) {
         const chunks = [];
 
         console.log("Inserting vectorized chunks into Chroma collection.");
         for (const chunk of toChunks(vectors, 500)) chunks.push(chunk);
 
         const additionResult = await collection.add(submission);
-        if (!additionResult)
+        if (additionResult && additionResult.error)
           throw new Error("Error embedding into ChromaDB", additionResult);
 
         await storeVectorResult(chunks, fullFilePath);
@@ -409,7 +415,7 @@ const Chroma = {
       if (Object.keys(metadata).length > 0) {
         documents.push({
           ...metadata,
-          ...(source.hasOwnProperty("pageContent")
+          ...(Object.prototype.hasOwnProperty.call(source, "pageContent")
             ? { text: source.pageContent }
             : {}),
         });

diff --git a/server/yarn.lock b/server/yarn.lock
@@ -2544,10 +2544,10 @@ chownr@^2.0.0:
   resolved "https://registry.yarnpkg.com/chownr/-/chownr-2.0.0.tgz#15bfbe53d2eab4cf70f18a8cd68ebe5b3cb1dece"
   integrity sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ==
 
-chromadb@^1.5.2:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/chromadb/-/chromadb-1.8.1.tgz#d2563a67c650187b5d79f171c46b2a1abbb4f056"
-  integrity sha512-NpbYydbg4Uqt/9BXKgkZXn0fqpsh2Z1yjhkhKH+rcHMoq0pwI18BFSU2QU7Fk/ZypwGefW2AvqyE/3ZJIgy4QA==
+chromadb@^1.10.4:
+  version "1.10.4"
+  resolved "https://registry.yarnpkg.com/chromadb/-/chromadb-1.10.4.tgz#6831984312b3623eae907c0552a278039412ffd6"
+  integrity sha512-K6HLpTvOby7GVQi2CftNGS2/mW0x1A+4Zo6TRFfbJCywgBKFBKZSJXbT75fJ+JGPe+8ULi7eUNjsRdSRIdOq4A==
   dependencies:
     cliui "^8.0.1"
     isomorphic-fetch "^3.0.0"