diff --git a/frontend/src/components/Modals/Settings/VectorDbs/index.jsx b/frontend/src/components/Modals/Settings/VectorDbs/index.jsx new file mode 100644 index 00000000..0c4f5a38 --- /dev/null +++ b/frontend/src/components/Modals/Settings/VectorDbs/index.jsx @@ -0,0 +1,232 @@ +import React, { useState } from "react"; +import System from "../../../../models/system"; +import ChromaLogo from "../../../../media/vectordbs/chroma.png"; +import PineconeLogo from "../../../../media/vectordbs/pinecone.png"; +import LanceDbLogo from "../../../../media/vectordbs/lancedb.png"; + +const noop = () => false; +export default function VectorDBSelection({ + hideModal = noop, + user, + settings = {}, +}) { + const [hasChanges, setHasChanges] = useState(false); + const [vectorDB, setVectorDB] = useState(settings?.VectorDB || "lancedb"); + const [saving, setSaving] = useState(false); + const [error, setError] = useState(null); + const canDebug = settings.MultiUserMode + ? settings?.CanDebug && user?.role === "admin" + : settings?.CanDebug; + + function updateVectorChoice(selection) { + if (!canDebug || selection === vectorDB) return false; + setHasChanges(true); + setVectorDB(selection); + } + + const handleSubmit = async (e) => { + e.preventDefault(); + setSaving(true); + setError(null); + const data = {}; + const form = new FormData(e.target); + for (var [key, value] of form.entries()) data[key] = value; + const { error } = await System.updateSystem(data); + setError(error); + setSaving(false); + setHasChanges(!!error ? true : false); + }; + return ( +
+
+
+

+ These are the credentials and settings for how your AnythingLLM + instance will function. Its important these keys are current and + correct. +

+
+ + {!!error && ( +
+

{error}

+
+ )} + +
setHasChanges(true)}> +
+
+

+ Vector database provider +

+
+ + + + +
+ {vectorDB === "pinecone" && ( + <> +
+ + +
+ +
+ + +
+ +
+ + +
+ + )} + + {vectorDB === "chroma" && ( + <> +
+ + +
+ + )} + {vectorDB === "lancedb" && ( +
+

+ There is no configuration needed for LanceDB. +

+
+ )} +
+
+
+ +
+
+
+ +
+
+
+ ); +} + +const VectorDBOption = ({ + name, + link, + description, + value, + image, + checked = false, + onClick, +}) => { + return ( +
onClick(value)}> + + +
+ ); +}; diff --git a/frontend/src/components/Modals/Settings/index.jsx b/frontend/src/components/Modals/Settings/index.jsx index 9d02d94e..a9ce6de2 100644 --- a/frontend/src/components/Modals/Settings/index.jsx +++ b/frontend/src/components/Modals/Settings/index.jsx @@ -1,26 +1,27 @@ import React, { useEffect, useState } from "react"; -import { Archive, Lock, Key, X, Users, LogOut } from "react-feather"; +import { Archive, Lock, Key, X, Users, Database } from "react-feather"; import SystemKeys from "./Keys"; import ExportOrImportData from "./ExportImport"; import PasswordProtection from "./PasswordProtection"; import System from "../../../models/system"; import MultiUserMode from "./MultiUserMode"; -import { AUTH_TOKEN, AUTH_USER } from "../../../utils/constants"; -import paths from "../../../utils/paths"; import useUser from "../../../hooks/useUser"; +import VectorDBSelection from "./VectorDbs"; const TABS = { keys: SystemKeys, exportimport: ExportOrImportData, password: PasswordProtection, multiuser: MultiUserMode, + vectordb: VectorDBSelection, }; const noop = () => false; export default function SystemSettingsModal({ hideModal = noop }) { const { user } = useUser(); const [loading, setLoading] = useState(true); - const [selectedTab, setSelectedTab] = useState("keys"); + // const [selectedTab, setSelectedTab] = useState("keys"); + const [selectedTab, setSelectedTab] = useState("vectordb"); const [settings, setSettings] = useState(null); const Component = TABS[selectedTab || "keys"]; @@ -93,6 +94,13 @@ function SettingTabs({ selectedTab, changeTab, settings, user }) { icon={} onClick={changeTab} /> + } + onClick={changeTab} + /> } onClick={changeTab} /> - {!settings?.MultiUserMode ? ( + {!settings?.MultiUserMode && ( <> - ) : ( - )} ); @@ -150,25 +156,6 @@ function SettingTab({ ); } -function LogoutTab({ user }) { - if (!user) return null; - - return ( -
  • - -
    • - ); -} - export function useSystemSettingsModal() { const [showing, setShowing] = useState(false); const showModal = () => { diff --git a/frontend/src/components/Sidebar/index.jsx b/frontend/src/components/Sidebar/index.jsx index 3b67abf3..8f453ca7 100644 --- a/frontend/src/components/Sidebar/index.jsx +++ b/frontend/src/components/Sidebar/index.jsx @@ -4,6 +4,7 @@ import { Briefcase, Cpu, GitHub, + LogOut, Menu, Plus, Shield, @@ -21,6 +22,8 @@ import ActiveWorkspaces from "./ActiveWorkspaces"; import paths from "../../utils/paths"; import Discord from "../Icons/Discord"; import useUser from "../../hooks/useUser"; +import { userFromStorage } from "../../utils/request"; +import { AUTH_TOKEN, AUTH_USER } from "../../utils/constants"; export default function Sidebar() { const sidebarRef = useRef(null); @@ -103,6 +106,7 @@ export default function Sidebar() { Enterprise Installation

    + {/* Footer */} @@ -269,6 +273,7 @@ export function SidebarMobileHeader() { Enterprise Installation

    + {/* Footer */} @@ -325,3 +330,25 @@ function AdminHome() { ); } + +function LogoutButton() { + if (!window.localStorage.getItem(AUTH_USER)) return null; + const user = userFromStorage(); + if (!user.username) return null; + + return ( + + ); +} diff --git a/frontend/src/media/vectordbs/chroma.png b/frontend/src/media/vectordbs/chroma.png new file mode 100644 index 00000000..fde25384 Binary files /dev/null and b/frontend/src/media/vectordbs/chroma.png differ diff --git a/frontend/src/media/vectordbs/lancedb.png b/frontend/src/media/vectordbs/lancedb.png new file mode 100644 index 00000000..dc653484 Binary files /dev/null and b/frontend/src/media/vectordbs/lancedb.png differ diff --git a/frontend/src/media/vectordbs/pinecone.png b/frontend/src/media/vectordbs/pinecone.png new file mode 100644 index 00000000..9f20d7f7 Binary files /dev/null and b/frontend/src/media/vectordbs/pinecone.png differ diff --git a/server/utils/helpers/updateENV.js b/server/utils/helpers/updateENV.js index 54eec1e5..0ff95fa4 100644 --- a/server/utils/helpers/updateENV.js +++ b/server/utils/helpers/updateENV.js @@ -92,8 +92,8 @@ function validChromaURL(input = "") { function updateENV(newENVs = {}) { let error = ""; const validKeys = Object.keys(KEY_MAPPING); - const ENV_KEYS = Object.keys(newENVs).filter((key) => - validKeys.includes(key) + const ENV_KEYS = Object.keys(newENVs).filter( + (key) => validKeys.includes(key) && !newENVs[key].includes("******") // strip out answers where the value is all asterisks ); const newValues = {};