feat: kb_data multi select added to create project flow

ui/app/components/FetchKbModels.vue

@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import { useQuery, useMutation } from '@tanstack/vue-query';
+
+const modelValue = defineModel<string>()
+
+const props = defineProps<{
+    modelName : string,
+    selectedValue : string;
+}>()
+
+const emit = defineEmits(['kbModels']);
+
+const modelsList = ref([])
+const selectedModel = ref('')
+
+const { mutateAsync: fetchAllKbModels, isPending: isLoading } = useMutation({
+  mutationFn: async () => {
+    const response = await useFetchAllKbModels()
+    selectedModel.value = props.selectedValue;
+    modelsList.value = response.map(model=>{
+      return {
+        ...model,
+      label : model.name,
+      value : model.kb_id
+      }
+
+    });
+    return response
+  }
+})
+
+onMounted(() => {
+  fetchAllKbModels(props.modelName as string)
+})
+
+</script>
+
+<template>
+
+  <div class="flex gap-2">
+    <UFormField name="kb_data" label=" Knowledge base data " class="flex-11 text-ellipsis overflow-hidden">
+       <USelectMenu v-model="selectedModel" :loading="isLoading" :items="modelsList" multiple  class="w-full my-1" value-key="value" @change="emit('kbModels', {value:selectedModel})" />
+    </UFormField>
+        <UFormField name="refetch_kb_model" label=" " class="flex-1">
+        <UButton
+          label="Fetch Kb Model"
+          trailing-icon="i-lucide-repeat-2"
+          class=""
+          @click.prevent="fetchAllKbModels()"
+        />
+        <template #hint>
+          <FieldTooltip field-name="kb_data" />
+        </template>
+      </UFormField>
+    </div>
+
+</template>

ui/app/components/Project/Create/DataStrategyStep.vue

@@ -1,69 +1,88 @@
 <script setup lang="ts">
-import type { FormSubmitEvent } from '@nuxt/ui';
-import { useQuery, useMutation } from '@tanstack/vue-query';
-
+import type { FormSubmitEvent } from "@nuxt/ui";
+import { useQuery, useMutation } from "@tanstack/vue-query";
 
 const modelValue = defineModel<ProjectCreateDataStrategy>({
   default: () => {
-    return {}
-  }
-})
+    return {};
+  },
+});
 
 // const { data: presignedUploadUrl } = useQuery({
 //   queryKey: ["presignedUploadUrl"],
 //   queryFn: () => usePresignedUploadUrl(),
 // })
 
-const presignedUploadUrl = ref()
+const presignedUploadUrl = ref();
 
-const { mutateAsync: getPresignedUploadUrl, isPending: isFetchingPresignedUploadUrl } = useMutation({
+const {
+  mutateAsync: getPresignedUploadUrl,
+  isPending: isFetchingPresignedUploadUrl,
+} = useMutation({
   mutationFn: async (uuid: string) => {
-    const response = await usePresignedUploadUrl(uuid)
-    presignedUploadUrl.value = response
-    return response
-  }
-})
+    const response = await usePresignedUploadUrl(uuid);
+    presignedUploadUrl.value = response;
+    return response;
+  },
+});
 
 onMounted(() => {
-  getPresignedUploadUrl(props.fileUploadId as string)
-})
-
-const props = withDefaults(defineProps<{
-  showBackButton?: boolean,
-  nextButtonLabel?: string,
-  fileUploadId?: string,
-  kbFilesUploadedData?: string[],
-}>(), {
-  showBackButton: true,
-  nextButtonLabel: "Next"
-})
+  getPresignedUploadUrl(props.fileUploadId as string);
+});
+
+const props = withDefaults(
+  defineProps<{
+    showBackButton?: boolean;
+    nextButtonLabel?: string;
+    fileUploadId?: string;
+    kbFilesUploadedData?: string[];
+  }>(),
+  {
+    showBackButton: true,
+    nextButtonLabel: "Next",
+  }
+);
 
 const kb_data_uploadedFiles = ref();
 const fetchKbFiles = (files: String[]) => {
-  kb_data_uploadedFiles.value = files
-  emits('kbFilesUpload', files);
-}
+  kb_data_uploadedFiles.value = files;
+  emits("kbFilesUpload", files);
+};
 
 const state = reactive<Partial<ProjectCreateDataStrategy>>({
   name: modelValue.value?.name || undefined,
   region: modelValue.value?.region || undefined,
+  kb_model: modelValue.value?.kb_model || undefined,
   kb_data: modelValue.value?.kb_data || undefined,
   gt_data: modelValue.value?.gt_data || undefined,
   // kb_data_uploadedFiles: modelValue.value?.kb_data_uploadedFiles || undefined,
-})
+});
 
-const emits = defineEmits(["next", "previous", "kbFilesUpload"])
+const emits = defineEmits(["next", "previous", "kbFilesUpload"]);
 
 const onSubmit = (event: FormSubmitEvent<ProjectCreateDataStrategy>) => {
-  modelValue.value = event.data
-  emits("next")
-}
-</script>
+  modelValue.value = event.data;
+  emits("next");
+};
+
+const meta = useKnowledgeBaseModel();
 
+const updateKbModels = (event: any) => {
+  state.kb_data = event.value;
+};
 
+const resetKbModel = (event: any) => {
+  state.kb_data = [];
+};
+</script>
 
 <template>
-  <UForm :schema="ProjectCreateDataStrategySchema" :state="state" :validate-on="['input']" @submit="onSubmit">
+  <UForm
+    :schema="ProjectCreateDataStrategySchema"
+    :state="state"
+    :validate-on="['input']"
+    @submit="onSubmit"
+  >
     <UFormField id="name" name="name" label="Project Name" required>
       <UInput v-model="state.name" type="text" />
       <template #hint>
@@ -76,27 +95,82 @@ const onSubmit = (event: FormSubmitEvent<ProjectCreateDataStrategy>) => {
         <FieldTooltip field-name="region" />
       </template>
     </UFormField>
-    <UFormField id="kb_data" name="kb_data" label="Knowledge Base Data" required>
-      <!-- <FileUploadModal v-if="presignedUploadUrl?.kb_data" key="kb_data" v-model="state.kb_data" accept="application/pdf" :data="presignedUploadUrl.kb_data"/> -->
-      <FileUploadKb @kbFiles="fetchKbFiles" :kbFilesUploaded="props.kbFilesUploadedData" :file-upload-id="fileUploadId" key="kb_data" v-model="state.kb_data" accept="application/pdf" />
+
+    <UFormField
+      id="kb_model"
+      name="kb_model"
+      label="Select Knowledge Base Type"
+      required
+    >
+      <USelectMenu
+        :items="meta.kb_model"
+        v-model="state.kb_model"
+        class="w-full"
+        value-key="value"
+        @change="resetKbModel"
+
+      />
       <template #hint>
-        <FieldTooltip field-name="kb_data" />
+        <FieldTooltip field-name="kb_model" />
       </template>
     </UFormField>
+      <p class="text-blue-500">[Note]: Indexing Strategy tab will be skipped if you select knowledge base type is bedrock </p>
+
+    <template v-if="state.kb_model && state.kb_model === 'default-upload'">
+      <UFormField
+        id="kb_data"
+        name="kb_data"
+        label="Knowledge Base Data"
+        required
+      >
+        <FileUploadKb
+          @kbFiles="fetchKbFiles"
+          :kbFilesUploaded="props.kbFilesUploadedData"
+          :file-upload-id="fileUploadId"
+          key="kb_data"
+          v-model="state.kb_data"
+          accept="application/pdf"
+        /> 
+      </UFormField>
+    </template>
+    <template v-if="state.kb_model && state.kb_model !== 'default-upload'">
+        <FetchKbModels
+          @kbModels="updateKbModels"
+          v-model="state.kb_data"
+          key="kb_data"
+          :selectedValue="state.kb_data"
+        />
+
+    </template>
     <UFormField id="gt_data" name="gt_data" label="Ground Truth Data" required>
-      <FileUpload v-if="presignedUploadUrl?.gt_data" key="gt_data" v-model="state.gt_data" accept="application/json"
-        :data="presignedUploadUrl.gt_data" />
+      <FileUpload
+        v-if="presignedUploadUrl?.gt_data"
+        key="gt_data"
+        v-model="state.gt_data"
+        accept="application/json"
+        :data="presignedUploadUrl.gt_data"
+      />
       <template #hint>
         <FieldTooltip field-name="gt_data" />
       </template>
     </UFormField>
     <div class="flex justify-between items-center w-full mt-6">
       <div>
-        <UButton v-if="showBackButton" type="button" icon="i-lucide-arrow-left" label="Back" variant="outline"
-          @click.prevent="emits('previous')" />
+        <UButton
+          v-if="showBackButton"
+          type="button"
+          icon="i-lucide-arrow-left"
+          label="Back"
+          variant="outline"
+          @click.prevent="emits('previous')"
+        />
       </div>
       <div>
-        <UButton  trailing-icon="i-lucide-arrow-right" :label="nextButtonLabel" type="submit" />
+        <UButton
+          trailing-icon="i-lucide-arrow-right"
+          :label="nextButtonLabel"
+          type="submit"
+        />
       </div>
     </div>
   </UForm>

ui/app/components/Project/Create/Form.vue

@@ -46,21 +46,30 @@ const nextStep = () => {
       prestep: {
         region: state.prestep?.region,
         gt_data: state.prestep?.gt_data,
-        kb_data: state.prestep?.kb_data
+        kb_data: state.prestep?.kb_data,
+        bedrock_knowledge_base : state.prestep?.kb_model === 'default-upload' ? false : true
       },
       indexing: {
-        chunking_strategy: state.indexing?.chunking_strategy,
-        ...(state.indexing?.chunking_strategy.includes('fixed') ? { chunk_size: state.indexing?.chunk_size, chunk_overlap: state.indexing?.chunk_overlap } : {}),
-        ...(state.indexing?.chunking_strategy.includes('hierarchical') ? { hierarchical_parent_chunk_size: state.indexing?.hierarchical_parent_chunk_size, hierarchical_child_chunk_size: state.indexing?.hierarchical_child_chunk_size, hierarchical_chunk_overlap_percentage: state.indexing?.hierarchical_chunk_overlap_percentage } : {}),
-        vector_dimension: state.indexing?.vector_dimension,
-        indexing_algorithm: state.indexing?.indexing_algorithm,
+        chunking_strategy: state.indexing?.chunking_strategy || '',
+        ...(state.indexing?.chunking_strategy.includes('fixed') ? { chunk_size: state.indexing?.chunk_size, chunk_overlap: state.indexing?.chunk_overlap } : {chunk_size:[],chunk_overlap:[]}),
+        ...(state.indexing?.chunking_strategy.includes('hierarchical') ? { hierarchical_parent_chunk_size: state.indexing?.hierarchical_parent_chunk_size, hierarchical_child_chunk_size: state.indexing?.hierarchical_child_chunk_size, hierarchical_chunk_overlap_percentage: state.indexing?.hierarchical_chunk_overlap_percentage } : {
+          hierarchical_parent_chunk_size : [],
+          hierarchical_child_chunk_size : [],
+          hierarchical_chunk_overlap_percentage : []
+        }),
+        vector_dimension: state.indexing?.vector_dimension || [],
+        indexing_algorithm: state.indexing?.indexing_algorithm || '',
         embedding: state.indexing?.embedding?.map((pc) => {
           return {
             model: pc.value,
             service: pc.service,
             label: pc.label
           }
-        })
+        }) || [{
+                "model": "",
+                "service": "",
+                "label": ""
+            }]
       },
       retrieval: {
         n_shot_prompts: state.retrieval?.n_shot_prompts,
@@ -89,12 +98,22 @@ const nextStep = () => {
     }
     mutate(submitData)
   } else {
+    if(state.prestep.kb_model !== 'default-upload' && currentStep.value == 1){
+      currentStep.value = currentStep.value + 2;
+      kbFilesUploadedData.value = undefined; 
+    }else{
     currentStep.value++
+
+    }
   }
 }
 
 const previousStep = () => {
-  currentStep.value--
+   if(state.prestep.kb_model !== 'default-upload' && currentStep.value == 3){
+      currentStep.value = currentStep.value - 2;
+    }else{
+    currentStep.value--
+    }
 }
 
 const kbFilesUploadedData = ref();

ui/app/components/Project/Experiment/DetailsButton.vue

@@ -29,40 +29,41 @@ const props = defineProps<{
           </tr>
           <tr>
             <td class="font-medium">Chunking</td>
-            <td>{{ props.experimentsData?.config?.chunking_strategy }}</td>
+            <td>{{ props.experimentsData?.config.bedrock_knowledge_base ? 'NA' :  props.experimentsData?.config?.chunking_strategy }}</td>
           </tr>
           <tr>
             <td class="font-medium">Vector Dimensions</td>
-            <td>{{ props.experimentsData?.config?.vector_dimension }}</td>
+            <td>{{ props.experimentsData?.config.bedrock_knowledge_base ? 'NA' : props.experimentsData?.config?.vector_dimension }}</td>
           </tr>
           <tr>
             <td class="font-medium">Chunk Size</td>
-            <td>{{ useHumanChunkingStrategy(props.experimentsData?.config?.chunking_strategy) === 'Fixed' ? props.experimentsData?.config?.chunk_size : [props.experimentsData?.config?.hierarchical_child_chunk_size, props.experimentsData?.config?.hierarchical_parent_chunk_size]}}</td>
+            <td>{{ props.experimentsData?.config.bedrock_knowledge_base ? 'NA' : useHumanChunkingStrategy(props.experimentsData?.config?.chunking_strategy) === 'Fixed' ? props.experimentsData?.config?.chunk_size : [props.experimentsData?.config?.hierarchical_child_chunk_size, props.experimentsData?.config?.hierarchical_parent_chunk_size]}}</td>
           </tr>
           <tr>
             <td class="font-medium">Chunk Overlap Percentage</td>
-            <td>{{ useHumanChunkingStrategy(props.experimentsData?.config?.chunking_strategy) === 'Fixed' ? props.experimentsData?.config?.chunk_overlap : props.experimentsData?.config?.hierarchical_chunk_overlap_percentage}}</td>
+            <td>{{props.experimentsData?.config.bedrock_knowledge_base ? 'NA' : useHumanChunkingStrategy(props.experimentsData?.config?.chunking_strategy) === 'Fixed' ? props.experimentsData?.config?.chunk_overlap : props.experimentsData?.config?.hierarchical_chunk_overlap_percentage}}</td>
           </tr>
           <tr>
             <td class="font-medium">N Shot Prompts</td>
             <td>{{ props.experimentsData?.config?.n_shot_prompts }}</td>
           </tr>
           <tr>
             <td class="font-medium">KNN</td>
-            <td>{{ props.experimentsData?.config?.knn_num }}</td>
+            <td>{{props.experimentsData?.config?.knn_num }}</td>
           </tr>
           <tr>
             <td class="font-medium">Inferencing Model Temperature</td>
-            <td>{{ props.experimentsData?.config?.temp_retrieval_llm }}</td>
+            <td>{{props.experimentsData?.config?.temp_retrieval_llm }}</td>
           </tr>
           <tr>
             <td class="font-medium">Indexing Algorithm</td>
-            <td>{{ useHumanIndexingAlgorithm(props.experimentsData?.config?.indexing_algorithm!) }}</td>
+            <td>{{props.experimentsData?.config.bedrock_knowledge_base ? 'NA' : useHumanIndexingAlgorithm(props.experimentsData?.config?.indexing_algorithm!) }}</td>
           </tr>
           <tr>
             <td class="font-medium">Embedding Model</td>
-            <td>{{ useModelName("indexing", props.experimentsData?.config?.embedding_model!) }} ({{
-              useHumanModelService(props.experimentsData?.config?.embedding_service!) }})
+            <td>{{ useModelName("indexing", props.experimentsData?.config?.embedding_model!) }} {{
+              props.experimentsData?.config.bedrock_knowledge_base ? 'NA' :
+              (useHumanModelService(props.experimentsData?.config?.embedding_service!)) }}
             </td>
           </tr>
           <tr>

ui/app/components/Project/Experiment/List.vue

@@ -553,6 +553,11 @@ const columnVisibility = ref({
       </UDropdownMenu>
     </div>
     <UTable class="h-100" sticky v-model:column-visibility="columnVisibility" ref="table" :columns="columns" :data="experiments">
+       <template #empty>
+        <div  class="flex flex-col items-center justify-center py-6">
+          <p class="text-gray-500">No experiments found...!</p>
+        </div>
+      </template>
       <template #id-cell="{ row }">
         <a 
           href="#"