[Bug] Removed defualt option in MDS selector (#454) (#455)

* removed default option which was causing issue to fetch index * removed console logs * updated api calls to not trigger on initial load --------- (cherry picked from commit 017e1dc) Signed-off-by: sumukhswamy <[email protected]> Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
opensearch-project · Oct 16, 2024 · 768393f · 768393f
1 parent fafcc2a
commit 768393f
Show file tree

Hide file tree

Showing 4 changed files with 110 additions and 104 deletions.
diff --git a/public/components/query_compare/home.tsx b/public/components/query_compare/home.tsx
@@ -4,8 +4,17 @@
  */
 
 import React, { useEffect, useMemo, useState } from 'react';
-import { ChromeBreadcrumb, CoreStart, MountPoint, NotificationsStart, SavedObject } from '../../../../../src/core/public';
-import { DataSourceAggregatedViewConfig, DataSourceManagementPluginSetup } from '../../../../../src/plugins/data_source_management/public';
+import {
+  ChromeBreadcrumb,
+  CoreStart,
+  MountPoint,
+  NotificationsStart,
+  SavedObject,
+} from '../../../../../src/core/public';
+import {
+  DataSourceAggregatedViewConfig,
+  DataSourceManagementPluginSetup,
+} from '../../../../../src/plugins/data_source_management/public';
 import { NavigationPublicPluginStart } from '../../../../../src/plugins/navigation/public';
 import { QUERY_NUMBER_ONE, QUERY_NUMBER_TWO, ServiceEndpoints } from '../../../common';
 import '../../ace-themes/sql_console';
@@ -15,11 +24,15 @@ import { Flyout } from '../common/flyout';
 import { CreateIndex } from './create_index';
 import { SearchResult } from './search_result';
 
-import semver from "semver";
+import semver from 'semver';
 import { DataSourceAttributes } from '../../../../../src/plugins/data_source/common/data_sources';
-import { DataSourceMenuProps, DataSourceOption } from '../../../../../src/plugins/data_source_management/public/components/data_source_menu/types';
-import * as pluginManifest from "../../../opensearch_dashboards.json";
+import {
+  DataSourceMenuProps,
+  DataSourceOption,
+} from '../../../../../src/plugins/data_source_management/public/components/data_source_menu/types';
+import * as pluginManifest from '../../../opensearch_dashboards.json';
 import './home.scss';
+import { uiSettingsService } from '../common/utils';
 
 interface QueryExplorerProps {
   parentBreadCrumbs: ChromeBreadcrumb[];
@@ -30,7 +43,7 @@ interface QueryExplorerProps {
   setToast: (title: string, color?: string, text?: any, side?: string) => void;
   chrome: CoreStart['chrome'];
   savedObjects: CoreStart['savedObjects'];
-  dataSourceEnabled: boolean
+  dataSourceEnabled: boolean;
   dataSourceManagement: DataSourceManagementPluginSetup;
   setActionMenu: (menuMount: MountPoint | undefined) => void;
   application: CoreStart['application'];
@@ -59,117 +72,104 @@ export const Home = ({
     datasource2,
     setFetchedPipelines1,
     setFetchedPipelines2,
+    setDataSource1,
+    setDataSource2,
   } = useSearchRelevanceContext();
 
   useEffect(() => {
     setBreadcrumbs([...parentBreadCrumbs]);
   }, [setBreadcrumbs, parentBreadCrumbs]);
   const [dataSourceOptions, setDataSourceOptions] = useState<DataSourceOption[]>([]);
+  const [shouldShowCreateIndex, setShouldShowCreateIndex] = useState(false);
   const fetchIndexes = (dataConnectionId: string, queryNumber: string) => {
-    if(dataConnectionId){
-      http.get(`${ServiceEndpoints.GetIndexes}/${dataConnectionId}`).then((res: DocumentsIndex[]) => {
-            if(queryNumber == QUERY_NUMBER_ONE){
-              setDocumentsIndexes1(res)
-            }
-            else{
-              setDocumentsIndexes2(res)
-            }
-          }).catch((err) => {
-            if(queryNumber === QUERY_NUMBER_ONE){
-              setDocumentsIndexes1([])
-            }
-            else{
-              setDocumentsIndexes2([])
-            }
-            console.log(err)
-          });
-    }
-    else{
-      http.get(ServiceEndpoints.GetIndexes).then((res: DocumentsIndex[]) => {
-        if(queryNumber == QUERY_NUMBER_ONE){
-          setDocumentsIndexes1(res)
+    http
+      .get(`${ServiceEndpoints.GetIndexes}/${dataConnectionId}`)
+      .then((res: DocumentsIndex[]) => {
+        if (queryNumber == QUERY_NUMBER_ONE) {
+          setDocumentsIndexes1(res);
+        } else {
+          setDocumentsIndexes2(res);
         }
-        else{
-          setDocumentsIndexes2(res)
+      })
+      .catch((err) => {
+        if (queryNumber === QUERY_NUMBER_ONE) {
+          setDocumentsIndexes1([]);
+        } else {
+          setDocumentsIndexes2([]);
         }
-      }).catch((err) => {
-        if(queryNumber === QUERY_NUMBER_ONE){
-          setDocumentsIndexes1([])
+        console.log(err);
+      });
+  };
+  const fetchPipelines = (dataConnectionId: string, queryNumber: string) => {
+    http
+      .get(`${ServiceEndpoints.GetPipelines}/${dataConnectionId}`)
+      .then((res: {}) => {
+        if (queryNumber === QUERY_NUMBER_ONE) {
+          setFetchedPipelines1(res);
+        } else {
+          setFetchedPipelines2(res);
         }
-        else{
-          setDocumentsIndexes2([])
+      })
+      .catch((err) => {
+        if (queryNumber === QUERY_NUMBER_ONE) {
+          setFetchedPipelines1('');
+        } else {
+          setFetchedPipelines2('');
         }
-        console.log(err)
+        console.log(err);
       });
-    }
-  }
-  const fetchPipelines = (dataConnectionId: string, queryNumber: string) => {
-      if(dataConnectionId){
-        http.get(`${ServiceEndpoints.GetPipelines}/${dataConnectionId}`).then((res: {}) => {
-          if(queryNumber === QUERY_NUMBER_ONE){
-            console.log(res)
-            setFetchedPipelines1(res)
-          }
-          else{
-            setFetchedPipelines2(res)
-          }
-        }).catch((err) => {
-          if(queryNumber === QUERY_NUMBER_ONE){
-            setFetchedPipelines1('')
-          }
-          else{
-            setFetchedPipelines2('')
-          }
-          console.log(err)
-        });
-      }
-      else{
-        http.get(ServiceEndpoints.GetPipelines).then((res: {}) => {
-          if(queryNumber === QUERY_NUMBER_ONE){
-            console.log(res)
-            setFetchedPipelines1(res)
-          }
-          else{
-            setFetchedPipelines2(res)
-          }
-        }).catch((err) => {
-          if(queryNumber === QUERY_NUMBER_ONE){
-            setFetchedPipelines1('')
-          }
-          else{
-            setFetchedPipelines2('')
-          }
-          console.log(err)
-        });
-      }
-  }
-  let DataSourceMenu: React.JSX.IntrinsicAttributes | React.ComponentType<DataSourceMenuProps<DataSourceAggregatedViewConfig>>;
-  if(dataSourceEnabled){
-    DataSourceMenu = dataSourceManagement.ui.getDataSourceMenu<DataSourceAggregatedViewConfig>();
-  }
-
-  const dataSourceFilterFn = (dataSource: SavedObject<DataSourceAttributes>) => {
-    const dataSourceVersion = dataSource?.attributes?.dataSourceVersion || "";
-    return (
-      semver.satisfies(dataSourceVersion, pluginManifest.supportedOSDataSourceVersions)
-    );
   };
 
-  // Get Indexes and Pipelines
   useEffect(() => {
+    if (!documentsIndexes1.length && !documentsIndexes2.length) {
+      setShouldShowCreateIndex(true);
+    } else {
+      setShouldShowCreateIndex(false);
+    }
+  }, [documentsIndexes1, documentsIndexes2]);
 
-    fetchIndexes(datasource1,QUERY_NUMBER_ONE)
-    fetchIndexes(datasource2,QUERY_NUMBER_TWO)
-    fetchPipelines(datasource1,QUERY_NUMBER_ONE)
-    fetchPipelines(datasource2,QUERY_NUMBER_TWO)
-
-  }, [http, setDocumentsIndexes1, setDocumentsIndexes2, setFetchedPipelines1, setFetchedPipelines2, datasource1, datasource2]);
+  // Get Indexes and Pipelines
+  useEffect(() => {
+    if (dataSourceEnabled && datasource1 !== null && datasource2 !== null) {
+      fetchIndexes(datasource1, QUERY_NUMBER_ONE);
+      fetchIndexes(datasource2, QUERY_NUMBER_TWO);
+      fetchPipelines(datasource1, QUERY_NUMBER_ONE);
+      fetchPipelines(datasource2, QUERY_NUMBER_TWO);
+    } else if (!dataSourceEnabled) {
+      fetchIndexes('', QUERY_NUMBER_ONE);
+      fetchIndexes('', QUERY_NUMBER_TWO);
+      fetchPipelines('', QUERY_NUMBER_ONE);
+      fetchPipelines('', QUERY_NUMBER_TWO);
+    }
+  }, [
+    http,
+    setDocumentsIndexes1,
+    setDocumentsIndexes2,
+    setFetchedPipelines1,
+    setFetchedPipelines2,
+    datasource1,
+    datasource2,
+  ]);
 
   return (
     <>
-      {dataSourceEnabled}
       <div className="osdOverviewWrapper">
-        {documentsIndexes1.length || documentsIndexes2.length ? <SearchResult application={application} chrome={chrome} http={http} savedObjects={savedObjects} dataSourceEnabled={dataSourceEnabled} dataSourceManagement={dataSourceManagement} navigation={navigation} setActionMenu={setActionMenu} dataSourceOptions={dataSourceOptions} notifications={notifications}/> : <CreateIndex />}
+        {shouldShowCreateIndex ? (
+          <CreateIndex />
+        ) : (
+          <SearchResult
+            application={application}
+            chrome={chrome}
+            http={http}
+            savedObjects={savedObjects}
+            dataSourceEnabled={dataSourceEnabled}
+            dataSourceManagement={dataSourceManagement}
+            navigation={navigation}
+            setActionMenu={setActionMenu}
+            dataSourceOptions={dataSourceOptions}
+            notifications={notifications}
+          />
+        )}
       </div>
       {showFlyout && <Flyout />}
     </>

diff --git a/...components/query_compare/search_result/search_components/search_configs/search_config.tsx b/...components/query_compare/search_result/search_components/search_configs/search_config.tsx
@@ -17,12 +17,15 @@ import {
 } from '@elastic/eui';
 import React, { FunctionComponent, useEffect } from 'react';
 
-import { AppMountParameters, CoreStart, MountPoint, NotificationsStart, SavedObjectsStart, ToastsStart } from '../../../../../../../../src/core/public';
+import { AppMountParameters, CoreStart, MountPoint, NotificationsStart, SavedObject, SavedObjectsStart, ToastsStart } from '../../../../../../../../src/core/public';
 import { DataSourceManagementPluginSetup } from '../../../../../../../../src/plugins/data_source_management/public';
 import { DataSourceOption } from '../../../../../../../../src/plugins/data_source_management/public/components/data_source_menu/types';
 import { NavigationPublicPluginStart } from '../../../../../../../../src/plugins/navigation/public';
 import { useSearchRelevanceContext } from '../../../../../contexts';
 import { QueryError, QueryStringError, SelectIndexError } from '../../../../../types/index';
+import semver from "semver";
+import { DataSourceAttributes } from '../../../../../../../../src/plugins/data_source/common/data_sources';
+import * as pluginManifest from "../../../../../../opensearch_dashboards.json";
 
 export interface SearchRelevanceServices extends CoreStart {
   setHeaderActionMenu: AppMountParameters['setHeaderActionMenu'];
@@ -86,7 +89,6 @@ export const SearchConfig: FunctionComponent<SearchConfigProps> = ({
   };
 
   const documentIndex = queryNumber === 1? documentsIndexes1: documentsIndexes2
-  console.log(fetchedPipelines1)
   const pipelines = queryNumber === 1? fetchedPipelines1: fetchedPipelines2
   // Sort search pipelines based off of each individual pipeline name.
   const sortedPipelines = [...Object.keys(pipelines)]
@@ -156,6 +158,12 @@ export const SearchConfig: FunctionComponent<SearchConfigProps> = ({
   if (dataSourceEnabled) {
     DataSourceSelector = dataSourceManagement.ui.DataSourceSelector;
   }
+  const dataSourceFilterFn = (dataSource: SavedObject<DataSourceAttributes>) => {
+    const dataSourceVersion = dataSource?.attributes?.dataSourceVersion || "";
+    return (
+      semver.satisfies(dataSourceVersion, pluginManifest.supportedOSDataSourceVersions)
+    );
+  };
   return (
     <>
       <EuiTitle size="xs">
@@ -177,7 +185,7 @@ export const SearchConfig: FunctionComponent<SearchConfigProps> = ({
                 disabled={false}
                 fullWidth={false}
                 removePrepend={true}
-                defaultOption= {[]}
+                dataSourceFilter={dataSourceFilterFn}
               />
             </EuiCompressedFormRow>
             <EuiSpacer size="s" />

diff --git a/public/contexts/index.tsx b/public/contexts/index.tsx
@@ -71,8 +71,8 @@ export const SearchRelevanceContextProvider = ({ children }: { children: React.R
   const [pipelines, setPipelines] = useState<{}>({});
   const [pipeline1, setPipeline1] = useState('');
   const [pipeline2, setPipeline2] = useState('');
-  const [datasource1, setDataSource1] = useState('');
-  const [datasource2, setDataSource2] = useState('');
+  const [datasource1, setDataSource1] = useState(null);
+  const [datasource2, setDataSource2] = useState(null);
   const [fetchedPipelines1, setFetchedPipelines1] = useState<{}>({});
   const [fetchedPipelines2, setFetchedPipelines2] = useState<{}>({});
   const [dataSourceOptions, setDataSourceOptions] = useState<DataSourceOption[]>([])

diff --git a/server/routes/dsl_route.ts b/server/routes/dsl_route.ts
@@ -235,7 +235,6 @@ export function registerDslRoute(router: IRouter,  openSearchServiceSetup: OpenS
           });
         }
         resBody = resp.body;
-        console.log('inside pipleine',resBody)
         const end = performance.now();
         context.searchRelevance.metricsService.addMetric(
           METRIC_NAME.SEARCH_RELEVANCE,
@@ -255,7 +254,6 @@ export function registerDslRoute(router: IRouter,  openSearchServiceSetup: OpenS
           end - start
         );
         if (error.statusCode !== 404) console.error(error);
-        console.log(error,'inside error')
         return response.customError({
           statusCode: 404,
           body: error,