From 02124b3d3872223b53369f6e6493cb811a99d61f Mon Sep 17 00:00:00 2001 From: Siddhant Rai Date: Wed, 10 Apr 2024 12:11:34 +0530 Subject: [PATCH 1/3] fix: missing fields from API Keys section --- frontend/src/components/Dropdown.tsx | 10 +- frontend/src/models/misc.ts | 7 +- frontend/src/preferences/PromptsModal.tsx | 195 +++++++++++----------- frontend/src/settings/APIKeys.tsx | 93 +++++++++-- frontend/src/upload/Upload.tsx | 3 +- 5 files changed, 188 insertions(+), 120 deletions(-) diff --git a/frontend/src/components/Dropdown.tsx b/frontend/src/components/Dropdown.tsx index 75a22a7..b08bbd1 100644 --- a/frontend/src/components/Dropdown.tsx +++ b/frontend/src/components/Dropdown.tsx @@ -14,8 +14,6 @@ function Dropdown({ showDelete, onDelete, placeholder, - fullWidth, - alignMidddle, }: { options: | string[] @@ -33,8 +31,6 @@ function Dropdown({ showDelete?: boolean; onDelete?: (value: string) => void; placeholder?: string; - fullWidth?: boolean; - alignMidddle?: boolean; }) { const [isOpen, setIsOpen] = React.useState(false); return ( @@ -58,9 +54,7 @@ function Dropdown({ ) : ( @@ -91,7 +85,7 @@ function Dropdown({ onSelect(option); setIsOpen(false); }} - className="ml-2 flex-1 overflow-hidden overflow-ellipsis whitespace-nowrap py-3 dark:text-light-gray" + className="ml-5 flex-1 overflow-hidden overflow-ellipsis whitespace-nowrap py-3 dark:text-light-gray" > {typeof option === 'string' ? option diff --git a/frontend/src/models/misc.ts b/frontend/src/models/misc.ts index 08445dc..ca7694b 100644 --- a/frontend/src/models/misc.ts +++ b/frontend/src/models/misc.ts @@ -30,7 +30,12 @@ export type DocumentsProps = { export type CreateAPIKeyModalProps = { close: () => void; - createAPIKey: (payload: { name: string; source: string }) => void; + createAPIKey: (payload: { + name: string; + source: string; + prompt_id: string; + chunks: string; + }) => void; }; export type SaveAPIKeyModalProps = { diff --git a/frontend/src/preferences/PromptsModal.tsx b/frontend/src/preferences/PromptsModal.tsx index 596c9f5..721564e 100644 --- a/frontend/src/preferences/PromptsModal.tsx +++ b/frontend/src/preferences/PromptsModal.tsx @@ -1,4 +1,5 @@ import { ActiveState } from '../models/misc'; +import Exit from '../assets/exit.svg'; function AddPrompt({ setModalState, @@ -16,50 +17,54 @@ function AddPrompt({ setNewPromptContent: (content: string) => void; }) { return ( -
-

Add Prompt

-

- Add your custom prompt and save it to DocsGPT -

-
- setNewPromptName(e.target.value)} - > -
- - Prompt Name - +
+ +
+

+ Add Prompt +

+

+ Add your custom prompt and save it to DocsGPT +

+
+ setNewPromptName(e.target.value)} + > +
+ + Prompt Name + +
+
+ + Prompt Text + +
+
-
- - Prompt Text - +
+
- -
-
- -
); @@ -83,58 +88,62 @@ function EditPrompt({ currentPromptEdit: { name: string; id: string; type: string }; }) { return ( -
-

Edit Prompt

-

- Edit your custom prompt and save it to DocsGPT -

-
- setEditPromptName(e.target.value)} - > -
- - Prompt Name - +
+ +
+

+ Edit Prompt +

+

+ Edit your custom prompt and save it to DocsGPT +

+
+ setEditPromptName(e.target.value)} + > +
+ + Prompt Name + +
+
+ + Prompt Text + +
+
-
- - Prompt Text - +
+
- -
-
- -
); @@ -205,7 +214,7 @@ export default function PromptsModal({ modalState === 'ACTIVE' ? 'visible' : 'hidden' } fixed top-0 left-0 z-30 h-screen w-screen bg-gray-alpha`} > -
+
{view}
diff --git a/frontend/src/settings/APIKeys.tsx b/frontend/src/settings/APIKeys.tsx index 05c21ab..a043272 100644 --- a/frontend/src/settings/APIKeys.tsx +++ b/frontend/src/settings/APIKeys.tsx @@ -59,7 +59,12 @@ const APIKeys: React.FC = () => { console.log(error); } }; - const createAPIKey = (payload: { name: string; source: string }) => { + const createAPIKey = (payload: { + name: string; + source: string; + prompt_id: string; + chunks: string; + }) => { fetch(`${apiHost}/api/create_api_key`, { method: 'POST', headers: { @@ -75,9 +80,9 @@ const APIKeys: React.FC = () => { }) .then((data) => { setApiKeys([...apiKeys, data]); - setCreateModal(false); //close the create key modal + setCreateModal(false); setNewKey(data.key); - setSaveKeyModal(true); // render the newly created key + setSaveKeyModal(true); fetchAPIKeys(); }) .catch((error) => { @@ -90,9 +95,9 @@ const APIKeys: React.FC = () => {
{isCreateModalOpen && ( @@ -155,7 +160,33 @@ const CreateAPIKeyModal: React.FC = ({ label: string; value: string; } | null>(null); + + const chunkOptions = ['0', '2', '4', '6', '8', '10']; + const [chunk, setChunk] = React.useState('2'); + const [activePrompts, setActivePrompts] = React.useState< + { name: string; id: string; type: string }[] + >([]); + const [prompt, setPrompt] = React.useState<{ + name: string; + id: string; + type: string; + } | null>(null); const docs = useSelector(selectSourceDocs); + React.useEffect(() => { + const fetchPrompts = async () => { + try { + const response = await fetch(`${apiHost}/api/get_prompts`); + if (!response.ok) { + throw new Error('Failed to fetch prompts'); + } + const promptsData = await response.json(); + setActivePrompts(promptsData); + } catch (error) { + console.error(error); + } + }; + fetchPrompts(); + }, []); const extractDocPaths = () => docs ? docs @@ -188,14 +219,14 @@ const CreateAPIKeyModal: React.FC = ({ return (
-
- - + Create New API Key -
+
API Key Name @@ -208,21 +239,51 @@ const CreateAPIKeyModal: React.FC = ({
setSourcePath(selection) } options={extractDocPaths()} + size="w-full" + rounded="xl" + /> +
+
+ + setPrompt(value) + } + size="w-full" + /> +
+
+

+ Chunks processed per query +

+ setChunk(value)} + size="w-full" />
@@ -239,8 +300,8 @@ const SaveAPIKeyModal: React.FC = ({ apiKey, close }) => { }; return (
-
-

Please save your Key

@@ -253,7 +314,7 @@ const SaveAPIKeyModal: React.FC = ({ apiKey, close }) => { {apiKey}
@@ -130,7 +130,7 @@ function EditPrompt({
@@ -450,4 +450,3 @@ export default function Upload({ ); } -// TODO: sanitize all inputs From 00b663915537c12bc1464ca070c2de48e9dba4e9 Mon Sep 17 00:00:00 2001 From: Siddhant Rai Date: Wed, 10 Apr 2024 12:37:29 +0530 Subject: [PATCH 3/3] fix: minor ui changes --- frontend/src/settings/APIKeys.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/frontend/src/settings/APIKeys.tsx b/frontend/src/settings/APIKeys.tsx index a043272..7803ff4 100644 --- a/frontend/src/settings/APIKeys.tsx +++ b/frontend/src/settings/APIKeys.tsx @@ -219,13 +219,15 @@ const CreateAPIKeyModal: React.FC = ({ return (
-
+
- - Create New API Key - +
+ + Create New API Key + +
API Key Name