frontend: adapting to migration

frontend/src/components/Dropdown.tsx

@@ -26,6 +26,7 @@ function Dropdown({
     | string
     | { label: string; value: string }
     | { value: number; description: string }
+    | { name: string; id: string; type: string }
     | null;
   onSelect:
     | ((value: string) => void)
@@ -96,6 +97,10 @@ function Dropdown({
                     ? selectedValue.value + ` (${selectedValue.description})`
                     : selectedValue.description
                 }`
+              : selectedValue &&
+                'name' in selectedValue &&
+                'id' in selectedValue
+              ? `${selectedValue.name}`
               : placeholder
               ? placeholder
               : 'From URL'}

frontend/src/conversation/conversationHandlers.ts

@@ -1,32 +1,6 @@
 import conversationService from '../api/services/conversationService';
 import { Doc } from '../preferences/preferenceApi';
-import { Answer, FEEDBACK } from './conversationModels';
-
-function getDocPath(selectedDocs: Doc | null): string {
-  let docPath = 'default';
-  if (selectedDocs) {
-    let namePath = selectedDocs.name;
-    if (selectedDocs.language === namePath) {
-      namePath = '.project';
-    }
-    if (selectedDocs.location === 'local') {
-      docPath = 'local' + '/' + selectedDocs.name + '/';
-    } else if (selectedDocs.location === 'remote') {
-      docPath =
-        selectedDocs.language +
-        '/' +
-        namePath +
-        '/' +
-        selectedDocs.version +
-        '/' +
-        selectedDocs.model +
-        '/';
-    } else if (selectedDocs.location === 'custom') {
-      docPath = selectedDocs.docLink;
-    }
-  }
-  return docPath;
-}
+import { Answer, FEEDBACK, RetrievalPayload } from './conversationModels';
 
 export function handleFetchAnswer(
   question: string,
@@ -54,23 +28,22 @@ export function handleFetchAnswer(
       title: any;
     }
 > {
-  const docPath = getDocPath(selectedDocs);
   history = history.map((item) => {
     return { prompt: item.prompt, response: item.response };
   });
+  const payload: RetrievalPayload = {
+    question: question,
+    history: JSON.stringify(history),
+    conversation_id: conversationId,
+    prompt_id: promptId,
+    chunks: chunks,
+    token_limit: token_limit,
+  };
+  if (selectedDocs && 'id' in selectedDocs)
+    payload.active_docs = selectedDocs.id as string;
+  else payload.retriever = selectedDocs?.docLink as string;
   return conversationService
-    .answer(
-      {
-        question: question,
-        history: history,
-        active_docs: docPath,
-        conversation_id: conversationId,
-        prompt_id: promptId,
-        chunks: chunks,
-        token_limit: token_limit,
-      },
-      signal,
-    )
+    .answer(payload, signal)
     .then((response) => {
       if (response.ok) {
         return response.json();
@@ -101,24 +74,24 @@ export function handleFetchAnswerSteaming(
   token_limit: number,
   onEvent: (event: MessageEvent) => void,
 ): Promise<Answer> {
-  const docPath = getDocPath(selectedDocs);
   history = history.map((item) => {
     return { prompt: item.prompt, response: item.response };
   });
+  const payload: RetrievalPayload = {
+    question: question,
+    history: JSON.stringify(history),
+    conversation_id: conversationId,
+    prompt_id: promptId,
+    chunks: chunks,
+    token_limit: token_limit,
+  };
+  if (selectedDocs && 'id' in selectedDocs)
+    payload.active_docs = selectedDocs.id as string;
+  else payload.retriever = selectedDocs?.docLink as string;
+
   return new Promise<Answer>((resolve, reject) => {
     conversationService
-      .answerStream(
-        {
-          question: question,
-          active_docs: docPath,
-          history: JSON.stringify(history),
-          conversation_id: conversationId,
-          prompt_id: promptId,
-          chunks: chunks,
-          token_limit: token_limit,
-        },
-        signal,
-      )
+      .answerStream(payload, signal)
       .then((response) => {
         if (!response.body) throw Error('No response body');
 
@@ -175,16 +148,21 @@ export function handleSearch(
   chunks: string,
   token_limit: number,
 ) {
-  const docPath = getDocPath(selectedDocs);
+  history = history.map((item) => {
+    return { prompt: item.prompt, response: item.response };
+  });
+  const payload: RetrievalPayload = {
+    question: question,
+    history: JSON.stringify(history),
+    conversation_id: conversation_id,
+    chunks: chunks,
+    token_limit: token_limit,
+  };
+  if (selectedDocs && 'id' in selectedDocs)
+    payload.active_docs = selectedDocs.id as string;
+  else payload.retriever = selectedDocs?.docLink as string;
   return conversationService
-    .search({
-      question: question,
-      active_docs: docPath,
-      conversation_id,
-      history,
-      chunks: chunks,
-      token_limit: token_limit,
-    })
+    .search(payload)
     .then((response) => response.json())
     .then((data) => {
       return data;

frontend/src/conversation/conversationModels.ts

@@ -31,3 +31,13 @@ export interface Query {
   conversationId?: string | null;
   title?: string | null;
 }
+export interface RetrievalPayload {
+  question: string;
+  active_docs?: string;
+  retriever?: string;
+  history: string;
+  conversation_id: string | null;
+  prompt_id?: string | null;
+  chunks: string;
+  token_limit: number;
+}

frontend/src/modals/CreateAPIKeyModal.tsx

@@ -22,8 +22,9 @@ export default function CreateAPIKeyModal({
 
   const [APIKeyName, setAPIKeyName] = React.useState<string>('');
   const [sourcePath, setSourcePath] = React.useState<{
-    label: string;
-    value: string;
+    name: string;
+    id: string;
+    type: string;
   } | null>(null);
   const [prompt, setPrompt] = React.useState<{
     name: string;
@@ -41,27 +42,17 @@ export default function CreateAPIKeyModal({
       ? docs
           .filter((doc) => doc.model === embeddingsName)
           .map((doc: Doc) => {
-            let namePath = doc.name;
-            if (doc.language === namePath) {
-              namePath = '.project';
-            }
-            let docPath = 'default';
-            if (doc.location === 'local') {
-              docPath = 'local' + '/' + doc.name + '/';
-            } else if (doc.location === 'remote') {
-              docPath =
-                doc.language +
-                '/' +
-                namePath +
-                '/' +
-                doc.version +
-                '/' +
-                doc.model +
-                '/';
+            if ('id' in doc) {
+              return {
+                name: doc.name,
+                id: doc.id as string,
+                type: 'local',
+              };
             }
             return {
-              label: doc.name,
-              value: docPath,
+              name: doc.name as string,
+              id: doc.docLink as string,
+              type: 'default',
             };
           })
       : [];
@@ -107,9 +98,14 @@ export default function CreateAPIKeyModal({
           <Dropdown
             placeholder={t('modals.createAPIKey.sourceDoc')}
             selectedValue={sourcePath}
-            onSelect={(selection: { label: string; value: string }) =>
-              setSourcePath(selection)
-            }
+            onSelect={(selection: {
+              name: string;
+              id: string;
+              type: string;
+            }) => {
+              setSourcePath(selection);
+              console.log(selection);
+            }}
             options={extractDocPaths()}
             size="w-full"
             rounded="xl"
@@ -142,16 +138,22 @@ export default function CreateAPIKeyModal({
         </div>
         <button
           disabled={!sourcePath || APIKeyName.length === 0 || !prompt}
-          onClick={() =>
-            sourcePath &&
-            prompt &&
-            createAPIKey({
-              name: APIKeyName,
-              source: sourcePath.value,
-              prompt_id: prompt.id,
-              chunks: chunk,
-            })
-          }
+          onClick={() => {
+            if (sourcePath && prompt) {
+              const payload: any = {
+                name: APIKeyName,
+                prompt_id: prompt.id,
+                chunks: chunk,
+              };
+              if (sourcePath.type === 'default') {
+                payload.retriever = sourcePath.id;
+              }
+              if (sourcePath.type === 'local') {
+                payload.source = sourcePath.id;
+              }
+              createAPIKey(payload);
+            }
+          }}
           className="float-right mt-4 rounded-full bg-purple-30 px-5 py-2 text-sm text-white hover:bg-[#6F3FD1] disabled:opacity-50"
         >
           {t('modals.createAPIKey.create')}

frontend/src/models/misc.ts

@@ -4,6 +4,7 @@ export type User = {
   avatar: string;
 };
 export type Doc = {
+  id?: string;
   location: string;
   name: string;
   language: string;

frontend/src/settings/APIKeys.tsx

@@ -48,7 +48,8 @@ export default function APIKeys() {
 
   const handleCreateKey = (payload: {
     name: string;
-    source: string;
+    source?: string;
+    retriever?: string;
     prompt_id: string;
     chunks: string;
   }) => {