From 68c7ee17b1467b3f1ec728f25cc433cb3c193af3 Mon Sep 17 00:00:00 2001
From: samlhuillier <sam.jansa123@gmail.com>
Date: Wed, 29 Nov 2023 17:54:10 -0600
Subject: [PATCH] big improvements to settings modal

---
 src/components/FileEditorContainer.tsx     |  1 -
 src/components/LeftSidebar/LeftSidebar.tsx |  7 +++---
 src/components/Settings/Settings.tsx       | 29 ++++++++++++++++++----
 3 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/src/components/FileEditorContainer.tsx b/src/components/FileEditorContainer.tsx
index 53c0690a..042ec1fa 100644
--- 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
index 29722d77..02b8dc63 100644
--- a/src/components/LeftSidebar/LeftSidebar.tsx
+++ b/src/components/LeftSidebar/LeftSidebar.tsx
@@ -1,5 +1,5 @@
 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 = () => {
@@ -7,15 +7,14 @@ const LeftSidebar: React.FC = () => {
 
   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
index 2f8300db..38977c67 100644
--- 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>
   );