big improvements to settings modal

reorproject · Nov 29, 2023 · 68c7ee1 · 68c7ee1
1 parent c4de3ff
commit 68c7ee1
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 10 deletions.
diff --git a/src/components/FileEditorContainer.tsx b/src/components/FileEditorContainer.tsx
@@ -4,7 +4,6 @@ import { MarkdownEditor } from "./File/MakdownEditor";
 import SimilarEntriesComponent from "./Similarity/SimilarFilesSidebar";
 import TitleBar from "./TitleBar";
 import ChatWithLLM from "./Chat/Chat";
-import SettingsModal from "./Settings/SettingsModal";
 import LeftSidebar from "./LeftSidebar/LeftSidebar";
 
 interface FileEditorContainerProps {}

diff --git a/src/components/LeftSidebar/LeftSidebar.tsx b/src/components/LeftSidebar/LeftSidebar.tsx
@@ -1,21 +1,20 @@
 import React, { useState } from "react";
-import SettingsModal from "../Settings/SettingsModal";
+import SettingsModal from "../Settings/Settings";
 import { MdSettings } from "react-icons/md"; // Importing Material Design settings icon
 
 const LeftSidebar: React.FC = () => {
   const [isModalOpen, setModalOpen] = useState(false);
 
   return (
     <div className="w-full h-full bg-gray-800 flex flex-col justify-between">
+      <div className="flex-grow"></div> {/* Spacer div */}
+      <SettingsModal isOpen={isModalOpen} onClose={() => setModalOpen(false)} />
       <button
         className="bg-transparent border-none pb-2 cursor-pointer"
         onClick={() => setModalOpen(!isModalOpen)}
       >
         <MdSettings className="h-6 w-6 text-gray-100" />
       </button>
-      {/* </button> */}
-      <SettingsModal isOpen={isModalOpen} onClose={() => setModalOpen(false)} />
-      {/* </div> */}
     </div>
   );
 };

diff --git a/src/components/Settings/Settings.tsx b/src/components/Settings/Settings.tsx
@@ -30,9 +30,24 @@ const SettingsModal: React.FC<ModalProps> = ({ isOpen, onClose }) => {
   return (
     <Modal isOpen={isOpen} onClose={onClose}>
       <div className="ml-2 mr-6 mt-0 h-full min-w-[400px]">
-        <h2 className="text-xl font-semibold mb-4 text-white">
-          Open AI Key Settings
-        </h2>
+        <h2 className="text-2xl font-semibold mb-4 text-white">Settings</h2>
+        <h4 className="font-semibold mb-2 text-white">Embedding Model</h4>
+        <input
+          type="text"
+          className="block w-full px-3 py-2 border border-gray-300 rounded-md bg-gray-200 cursor-not-allowed"
+          value={"BAAI/bge-base-en-v1.5"}
+          disabled
+          placeholder="Note Name"
+        />
+        <h4 className="font-semibold mb-2 text-white">LLM</h4>
+        <input
+          type="text"
+          className="block w-full px-3 py-2 border border-gray-300 rounded-md bg-gray-200 cursor-not-allowed"
+          value={"GPT-3.5-turbo"}
+          disabled
+          placeholder="Note Name"
+        />
+        <h4 className="font-semibold mb-2 text-white">Open AI Key</h4>
         <input
           type="text"
           className="block w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:shadow-outline-blue focus:border-blue-300 transition duration-150 ease-in-out"
@@ -41,12 +56,16 @@ const SettingsModal: React.FC<ModalProps> = ({ isOpen, onClose }) => {
           onKeyDown={handleKeyPress}
           placeholder="Note Name"
         />
+
         <Button
-          className="bg-slate-700 mt-2 border-none h-10 hover:bg-slate-900 cursor-pointer w-[80px] text-center pt-0 pb-0 pr-2 pl-2"
+          className="bg-slate-700 mt-4 border-none h-10 hover:bg-slate-900 cursor-pointer w-[80px] text-center pt-0 pb-0 pr-2 pl-2"
           onClick={handleSave}
         >
-          Save Key
+          Save
         </Button>
+        <p className="text-xs text-white">
+          *Models are currently hardcoded. Custom models are coming very soon :)
+        </p>
       </div>
     </Modal>
   );