From 3f1543c0c7bbafe502f042a5e1b3df7dc7a10653 Mon Sep 17 00:00:00 2001
From: sumukhswamy <sumukhhs@amazon.com>
Date: Thu, 14 Mar 2024 15:52:11 -0700
Subject: [PATCH] added changes for selecting and filtering multiple data
 sources

Signed-off-by: sumukhswamy <sumukhhs@amazon.com>
---
 public/components/query_compare/home.tsx      | 19 +++++++++++++++----
 .../search_configs/search_config.tsx          |  3 ++-
 public/contexts/index.tsx                     |  8 +++++++-
 3 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/public/components/query_compare/home.tsx b/public/components/query_compare/home.tsx
index 198b7f2..5d5afc5 100644
--- a/public/components/query_compare/home.tsx
+++ b/public/components/query_compare/home.tsx
@@ -52,7 +52,9 @@ export const Home = ({
     datasource1,
     datasource2,
     setFetchedPipelines1,
-    setFetchedPipelines2
+    setFetchedPipelines2,
+    dataSourceOptions,
+    setDataSourceOptions
   } = useSearchRelevanceContext();
 
   useEffect(() => {
@@ -104,6 +106,16 @@ export const Home = ({
     }
   }
 
+  const selectedDatasources = (e) => {
+    console.log(e)
+    e.forEach(item  => {
+      if (item.checked === "on" && !dataSourceOptions.find(option => option.id === item.id)) {
+          dataSourceOptions.push({ id: item.id, label: item.name });;
+      }
+    });
+    setDataSourceOptions(dataSourceOptions)
+  }
+
   // Get Indexes and Pipelines
   useEffect(() => {
 
@@ -117,14 +129,13 @@ export const Home = ({
     <>
       <DataSourceMenu
         setMenuMountPoint={setActionMenu}
-        showDataSourceSelectable={true}
-        dataSourceCallBackFunc={(id, label) => console.log(id, label)}
+        showDataSourceMultiSelectable={true}
         disableDataSourceSelectable={true}
         savedObjects={savedObjects.client}
         notifications={notifications}
         appName={'searchRelevance'}
         hideLocalCluster={false}
-        selectedOption={[{label: 'Local Cluster', id: 'a'}]}
+        selectedDataSourcesCallBackFunc={selectedDatasources}
         fullWidth={true}
       />
       <div className="osdOverviewWrapper">
diff --git a/public/components/query_compare/search_result/search_components/search_configs/search_config.tsx b/public/components/query_compare/search_result/search_components/search_configs/search_config.tsx
index 7513182..cce849c 100644
--- a/public/components/query_compare/search_result/search_components/search_configs/search_config.tsx
+++ b/public/components/query_compare/search_result/search_components/search_configs/search_config.tsx
@@ -71,7 +71,7 @@ export const SearchConfig: FunctionComponent<SearchConfigProps> = ({
   navigation,
   setActionMenu,
 }) => {
-  const { documentsIndexes1, setDataSource1, setDataSource2, documentsIndexes2, fetchedPipelines1, fetchedPipelines2, setShowFlyout} = useSearchRelevanceContext();
+  const { documentsIndexes1, setDataSource1, setDataSource2, documentsIndexes2, fetchedPipelines1, fetchedPipelines2, setShowFlyout, dataSourceOptions} = useSearchRelevanceContext();
   // On select index
   const onChangeSelectedIndex: React.ChangeEventHandler<HTMLSelectElement> = (e) => {
     setSelectedIndex(e.target.value);
@@ -164,6 +164,7 @@ export const SearchConfig: FunctionComponent<SearchConfigProps> = ({
                hideLocalCluster={false} 
                fullWidth={false}
                removePrepend={true}
+               dataSourceOptions={dataSourceOptions}
             />
             </EuiFormRow>
           </EuiFlexItem> )}
diff --git a/public/contexts/index.tsx b/public/contexts/index.tsx
index e079985..22eb54d 100644
--- a/public/contexts/index.tsx
+++ b/public/contexts/index.tsx
@@ -5,6 +5,7 @@
 
 import React, { createContext, useContext, useState } from 'react';
 
+import { DataSourceOption } from '../../../../src/plugins/data_source_management/public/components/data_source_selector/data_source_selector';
 import { DocumentsIndex, SearchResults } from '../types/index';
 import { DocumentRank, getDocumentRank } from './utils';
 
@@ -41,6 +42,8 @@ export interface SearchRelevanceContextProps {
   setFetchedPipelines1: React.Dispatch<React.SetStateAction<{}>>;
   fetchedPipelines2: {};
   setFetchedPipelines2: React.Dispatch<React.SetStateAction<{}>>;
+  dataSourceOptions: DataSourceOption[]
+  setDataSourceOptions: React.Dispatch<React.SetStateAction<DataSourceOption[]>>;
 }
 
 export const SearchRelevanceContext = createContext<SearchRelevanceContextProps | null>(null);
@@ -72,6 +75,7 @@ export const SearchRelevanceContextProvider = ({ children }: { children: React.R
   const [datasource2, setDataSource2] = useState('');
   const [fetchedPipelines1, setFetchedPipelines1] = useState<{}>({});
   const [fetchedPipelines2, setFetchedPipelines2] = useState<{}>({});
+  const [dataSourceOptions, setDataSourceOptions] = useState<DataSourceOption[]>([])
 
   const updateComparedResult1 = (result: SearchResults) => {
     setComparedResult1(getDocumentRank(result?.hits?.hits));
@@ -113,7 +117,9 @@ export const SearchRelevanceContextProvider = ({ children }: { children: React.R
         fetchedPipelines1,
         setFetchedPipelines1,
         fetchedPipelines2,
-        setFetchedPipelines2
+        setFetchedPipelines2,
+        dataSourceOptions,
+        setDataSourceOptions
       }}
     >
       {children}