feature: fetch top chunks in group for reference images

Author: vid277

clients/search-component/src/utils/hooks/chat-context.tsx

@@ -1116,21 +1116,47 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
 
     if (referenceImageUrls.length > 0 || curGroup) {
       if (referenceImageUrls.length == 0 && curGroup) {
-          const chunksInGroupPromise = await trieveSDK.getChunksInGroup(
+          const fulltextSearchPromise = trieveSDK.searchInGroup(
+            {
+              query: questionProp || currentQuestion,
+              search_type: "fulltext",
+              page_size: 10,
+              group_id: curGroup.id,
+              user_id: fingerprint,
+            },
+            searchAbortController.current.signal,
+          );
+
+          const chunksInGroupPromise = trieveSDK.getChunksInGroup(
             {
               groupId: curGroup.id,
               page: 1,
             },
             searchAbortController.current.signal,
           );
 
-          if (chunksInGroupPromise.chunks[0].image_urls) {
-            chunksInGroupPromise.chunks[0].image_urls.forEach((url) => {
-              referenceImageUrls.push(url ?? "");
+          const [fulltextSearchResp, chunksInGroupResp] = await Promise.all([
+            fulltextSearchPromise,
+            chunksInGroupPromise,
+          ]);
+
+          const chunkIds = fulltextSearchResp.chunks.map(
+            (score_chunk) => score_chunk.chunk.id,
+          );
+          
+          chunksInGroupResp.chunks.filter((chunk) => chunkIds.includes(chunk.id));
+
+          const topChunk = chunksInGroupResp.chunks[0];
+          
+          if (topChunk) {
+            topChunk.image_urls?.forEach((url) => {
+              if (url) {
+                referenceImageUrls.push(url);
+              }
             });
           }
 
-          referenceImageUrls.slice(0, 5);
+          referenceImageUrls.slice(0, 3);
       }
 
       if (await handleImageEdit()) {

frontends/shared/ui/MultiStringInput.tsx

@@ -1,4 +1,4 @@
-import { createEffect, For, Show } from "solid-js";
+import { For, Show } from "solid-js";
 import { createStore } from "solid-js/store";
 import { cn } from "../utils";
 import { FiPlus, FiX } from "solid-icons/fi";
@@ -29,14 +29,29 @@ export const MultiStringInput = (props: MultiStringInputProps) => {
     })),
   );
 
-  createEffect(() => {
+  const updateValue = (id: string, value: string) => {
+    setProxyStore((v) => v.id == id, "value", value);
     props.onChange(
       proxyStore.map((item) => item.value).filter((i) => i !== ""),
     );
-  });
+  };
 
-  const updateValue = (id: string, value: string) => {
-    setProxyStore((v) => v.id == id, "value", value);
+  const removeValue = (id: string) => {
+    if (proxyStore.length === 1) {
+      updateValue(id, "");
+    } else {
+      setProxyStore((v) => v.filter((item) => item.id != id));
+      props.onChange(
+        proxyStore.map((item) => item.value).filter((i) => i !== ""),
+      );
+    }
+  };
+
+  const addValue = () => {
+    setProxyStore((v) => [
+      ...v,
+      { value: "", id: Math.random().toString(36).slice(2) },
+    ]);
   };
 
   return (
@@ -60,13 +75,7 @@ export const MultiStringInput = (props: MultiStringInputProps) => {
               type="button"
               disabled={props.disabled}
               class="text-neutral-400 hover:text-neutral-500 dark:text-neutral-300 dark:hover:text-neutral-400"
-              onClick={() => {
-                if (proxyStore.length === 1) {
-                  updateValue(entry.id, "");
-                } else {
-                  setProxyStore((v) => v.filter((item) => item.id != entry.id));
-                }
-              }}
+              onClick={() => removeValue(entry.id)}
             >
               <FiX />
             </button>
@@ -77,12 +86,7 @@ export const MultiStringInput = (props: MultiStringInputProps) => {
         type="button"
         disabled={props.disabled}
         class={cn("flex gap-2 items-center justify-center", props.addClass)}
-        onClick={() => {
-          setProxyStore((v) => [
-            ...v,
-            { value: "", id: Math.random().toString(36).slice(2) },
-          ]);
-        }}
+        onClick={addValue}
       >
         <Show when={props.addLabel}>{props.addLabel}</Show>
         <FiPlus />