Refactor dev tool to use dataSourceManagement.ui interfaces to obtain…

… DataSourceSelector Signed-off-by: Zhongnan Su <[email protected]>
zhongnansu · Apr 16, 2024 · 62128f9 · 62128f9
1 parent be0f9d5
commit 62128f9
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 35 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -96,6 +96,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 - [Multiple Datasource] Add error state to all data source menu components to show error component and consolidate all fetch errors ([#6440](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6440))
 - [Workspace] Support workspace in saved objects client in server side. ([#6365](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6365))
 - [MD] Add dropdown header to data source single selector ([#6431](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6431))
+- [MD]Refactor dev tool to use dataSourceManagement.ui API to get DataSourceSelector ([#6477](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/6477))
 
 ### 🐛 Bug Fixes
 

diff --git a/src/plugins/dev_tools/opensearch_dashboards.json b/src/plugins/dev_tools/opensearch_dashboards.json
@@ -3,7 +3,6 @@
   "version": "opensearchDashboards",
   "server": false,
   "ui": true,
-  "optionalPlugins": ["dataSource", "managementOverview"],
-  "requiredPlugins": ["urlForwarding"],
-  "requiredBundles": ["dataSourceManagement"]
+  "optionalPlugins": ["dataSource", "managementOverview", "dataSourceManagement"],
+  "requiredPlugins": ["urlForwarding"]
 }
diff --git a/src/plugins/dev_tools/public/application.tsx b/src/plugins/dev_tools/public/application.tsx
@@ -39,13 +39,12 @@ import {
   ApplicationStart,
   ChromeStart,
   CoreStart,
-  IUiSettingsClient,
   NotificationsStart,
   SavedObjectsStart,
   ScopedHistory,
 } from 'src/core/public';
 
-import { DataSourceSelector } from '../../data_source_management/public';
+import { DataSourceManagementPluginSetup } from 'src/plugins/data_source_management/public';
 import { DevToolApp } from './dev_tool';
 import { DevToolsSetupDependencies } from './plugin';
 import { addHelpMenuToAppChrome } from './utils/util';
@@ -56,8 +55,7 @@ interface DevToolsWrapperProps {
   savedObjects: SavedObjectsStart;
   notifications: NotificationsStart;
   dataSourceEnabled: boolean;
-  hideLocalCluster: boolean;
-  uiSettings: IUiSettingsClient;
+  dataSourceManagement?: DataSourceManagementPluginSetup;
 }
 
 interface MountedDevToolDescriptor {
@@ -73,8 +71,7 @@ function DevToolsWrapper({
   savedObjects,
   notifications: { toasts },
   dataSourceEnabled,
-  hideLocalCluster,
-  uiSettings,
+  dataSourceManagement,
 }: DevToolsWrapperProps) {
   const mountedTool = useRef<MountedDevToolDescriptor | null>(null);
   const [isLoading, setIsLoading] = React.useState<boolean>(true);
@@ -117,6 +114,21 @@ function DevToolsWrapper({
     setIsLoading(false);
   };
 
+  const renderDataSourceSelector = () => {
+    const DataSourceSelector = dataSourceManagement!.ui.DataSourceSelector;
+    return (
+      <div className="devAppDataSourceSelector">
+        <DataSourceSelector
+          savedObjectsClient={savedObjects.client}
+          notifications={toasts}
+          onSelectedDataSource={onChange}
+          disabled={!dataSourceEnabled}
+          fullWidth={false}
+        />
+      </div>
+    );
+  };
+
   return (
     <main className="devApp">
       <EuiTabs className="devAppTabs">
@@ -135,19 +147,7 @@ function DevToolsWrapper({
             </EuiTab>
           </EuiToolTip>
         ))}
-        {dataSourceEnabled && !isLoading ? (
-          <div className="devAppDataSourceSelector">
-            <DataSourceSelector
-              savedObjectsClient={savedObjects.client}
-              notifications={toasts}
-              onSelectedDataSource={onChange}
-              disabled={!dataSourceEnabled}
-              hideLocalCluster={hideLocalCluster}
-              fullWidth={false}
-              uiSettings={uiSettings}
-            />
-          </div>
-        ) : null}
+        {dataSourceEnabled && !isLoading && dataSourceManagement && renderDataSourceSelector()}
       </EuiTabs>
 
       <div
@@ -161,12 +161,7 @@ function DevToolsWrapper({
               mountedTool.current.devTool !== activeDevTool ||
               mountedTool.current.mountpoint !== element)
           ) {
-            let initialDataSourceId;
-            if (!dataSourceEnabled || (dataSourceEnabled && !hideLocalCluster)) {
-              initialDataSourceId = '';
-            }
-
-            await remount(element, initialDataSourceId);
+            await remount(element);
           }
         }}
       />
@@ -218,14 +213,13 @@ function setBreadcrumbs(chrome: ChromeStart) {
 }
 
 export function renderApp(
-  { application, chrome, docLinks, savedObjects, notifications, uiSettings }: CoreStart,
+  { application, chrome, docLinks, savedObjects, notifications }: CoreStart,
   element: HTMLElement,
   history: ScopedHistory,
   devTools: readonly DevToolApp[],
-  { dataSource }: DevToolsSetupDependencies
+  { dataSourceManagement, dataSource }: DevToolsSetupDependencies
 ) {
   const dataSourceEnabled = !!dataSource;
-  const hideLocalCluster = dataSource?.hideLocalCluster ?? false;
   if (redirectOnMissingCapabilities(application)) {
     return () => {};
   }
@@ -255,8 +249,7 @@ export function renderApp(
                     savedObjects={savedObjects}
                     notifications={notifications}
                     dataSourceEnabled={dataSourceEnabled}
-                    hideLocalCluster={hideLocalCluster}
-                    uiSettings={uiSettings}
+                    dataSourceManagement={dataSourceManagement}
                   />
                 )}
               />

diff --git a/src/plugins/dev_tools/public/plugin.ts b/src/plugins/dev_tools/public/plugin.ts
@@ -33,7 +33,7 @@ import { Plugin, CoreSetup, AppMountParameters } from 'src/core/public';
 import { AppUpdater } from 'opensearch-dashboards/public';
 import { i18n } from '@osd/i18n';
 import { sortBy } from 'lodash';
-
+import { DataSourceManagementPluginSetup } from 'src/plugins/data_source_management/public';
 import { DataSourcePluginSetup } from 'src/plugins/data_source/public';
 import { AppNavLinkStatus, DEFAULT_APP_CATEGORIES } from '../../../core/public';
 import { UrlForwardingSetup } from '../../url_forwarding/public';
@@ -43,8 +43,9 @@ import './index.scss';
 import { ManagementOverViewPluginSetup } from '../../management_overview/public';
 
 export interface DevToolsSetupDependencies {
-  dataSource?: DataSourcePluginSetup;
   urlForwarding: UrlForwardingSetup;
+  dataSource?: DataSourcePluginSetup;
+  dataSourceManagement?: DataSourceManagementPluginSetup;
   managementOverview?: ManagementOverViewPluginSetup;
 }