create getter and setter for dataSourceManagement plugin

Signed-off-by: Jackie Han <jkhanjob@gmail.com>

Author: jackiehanyang

public/anomaly_detection_app.tsx

@@ -17,13 +17,11 @@ import { Main } from './pages/main';
 import { Provider } from 'react-redux';
 import configureStore from './redux/configureStore';
 import { CoreServicesContext } from './components/CoreServices/CoreServices';
-import { DataSourceManagementPluginSetup } from '../../../src/plugins/data_source_management/public';
 import { DataSourcePluginSetup } from '../../../src/plugins/data_source/public';
 
 export function renderApp(
   coreStart: CoreStart,
   params: AppMountParameters,
-  dataSourceManagement: DataSourceManagementPluginSetup,
   dataSource: DataSourcePluginSetup
 ) {
   const http = coreStart.http;
@@ -45,7 +43,6 @@ export function renderApp(
             <CoreServicesContext.Provider value={coreStart}>
               <Main
                 dataSourceEnabled={dataSource.dataSourceEnabled}
-                dataSourceManagement={dataSourceManagement}
                 setHeaderActionMenu={params.setHeaderActionMenu}
                 {...props}
               />

public/pages/DetectorDetail/containers/DetectorDetail.tsx

@@ -58,15 +58,14 @@ import {
 import { DETECTOR_STATE } from '../../../../server/utils/constants';
 import { CatIndex } from '../../../../server/models/types';
 import { containsIndex } from '../utils/helpers';
-import { DataSourceManagementPluginSetup, DataSourceViewConfig } from '../../../../../../src/plugins/data_source_management/public';
-import { getNotifications, getSavedObjectsClient } from '../../../services';
+import { DataSourceViewConfig } from '../../../../../../src/plugins/data_source_management/public';
+import { getDataSourceManagementPlugin, getNotifications, getSavedObjectsClient } from '../../../services';
 
 export interface DetectorRouterProps {
   detectorId?: string;
 }
 interface DetectorDetailProps extends RouteComponentProps<DetectorRouterProps> {
   dataSourceEnabled: boolean;
-  dataSourceManagement: DataSourceManagementPluginSetup;
   setActionMenu: (menuMount: MountPoint | undefined) => void;
 }
 
@@ -360,7 +359,7 @@ export const DetectorDetail = (props: DetectorDetailProps) => {
       ></EuiCallOut>
     ) : null;
 
-  const DataSourceMenu = props.dataSourceManagement.ui.getDataSourceMenu<DataSourceViewConfig>();
+  const DataSourceMenu = getDataSourceManagementPlugin().ui.getDataSourceMenu<DataSourceViewConfig>();
 
   return (
     <React.Fragment>

public/pages/DetectorsList/containers/List/List.tsx

@@ -84,10 +84,9 @@ import {
 import { CoreStart, MountPoint } from '../../../../../../../src/core/public';
 import { CoreServicesContext } from '../../../../components/CoreServices/CoreServices';
 import {
-  DataSourceManagementPluginSetup,
   DataSourceSelectableConfig,
 } from '../../../../../../../src/plugins/data_source_management/public';
-import { getNotifications, getSavedObjectsClient } from '../../../../services';
+import { getDataSourceManagementPlugin, getNotifications, getSavedObjectsClient } from '../../../../services';
 
 export interface ListRouterParams {
   from: string;
@@ -100,7 +99,6 @@ export interface ListRouterParams {
 }
 interface ListProps extends RouteComponentProps<ListRouterParams> {
   dataSourceEnabled: boolean;
-  dataSourceManagement: DataSourceManagementPluginSetup;
   setActionMenu: (menuMount: MountPoint | undefined) => void;
 }
 interface ListState {
@@ -661,7 +659,7 @@ export const DetectorList = (props: ListProps) => {
   const confirmModal = getConfirmModal();
 
   const DataSourceMenu =
-    props.dataSourceManagement.ui.getDataSourceMenu<DataSourceSelectableConfig>();
+    getDataSourceManagementPlugin().ui.getDataSourceMenu<DataSourceSelectableConfig>();
   const renderDataSourceComponent = useMemo(() => {
     return (
       <DataSourceMenu

public/pages/main/Main.tsx

@@ -25,7 +25,6 @@ import { DashboardOverview } from '../Dashboard/Container/DashboardOverview';
 import { CoreServicesConsumer } from '../../components/CoreServices/CoreServices';
 import { CoreStart, MountPoint } from '../../../../../src/core/public';
 import { AnomalyDetectionOverview } from '../Overview';
-import { DataSourceManagementPluginSetup } from '../../../../../src/plugins/data_source_management/public';
 
 enum Navigation {
   AnomalyDetection = 'Anomaly detection',
@@ -35,12 +34,11 @@ enum Navigation {
 
 interface MainProps extends RouteComponentProps {
   dataSourceEnabled: boolean;
-  dataSourceManagement: DataSourceManagementPluginSetup;
   setHeaderActionMenu: (menuMount: MountPoint | undefined) => void;
 }
 
 export function Main(props: MainProps) {
-  const { dataSourceEnabled, dataSourceManagement, setHeaderActionMenu } =
+  const { dataSourceEnabled, setHeaderActionMenu } =
     props;
 
   const hideSideNavBar = useSelector(
@@ -93,7 +91,6 @@ export function Main(props: MainProps) {
                   render={(props: RouteComponentProps<ListRouterParams>) => (
                     <DetectorList
                       dataSourceEnabled={dataSourceEnabled}
-                      dataSourceManagement={dataSourceManagement}
                       setActionMenu={setHeaderActionMenu}
                       {...props}
                     />
@@ -125,7 +122,6 @@ export function Main(props: MainProps) {
                   render={(props: RouteComponentProps) => (
                     <DetectorDetail 
                       dataSourceEnabled={dataSourceEnabled}
-                      dataSourceManagement={dataSourceManagement}
                       setActionMenu={setHeaderActionMenu}
                       {...props} />
                   )}

public/plugin.ts

@@ -36,6 +36,7 @@ import {
   setUISettings,
   setQueryService,
   setSavedObjectsClient,
+  setDataSourceManagementPlugin,
 } from './services';
 import { AnomalyDetectionOpenSearchDashboardsPluginStart } from 'public';
 import {
@@ -88,7 +89,6 @@ export class AnomalyDetectionOpenSearchDashboardsPlugin
         return renderApp(
           coreStart,
           params,
-          plugins.dataSourceManagement,
           plugins.dataSource
         );
       },
@@ -100,6 +100,8 @@ export class AnomalyDetectionOpenSearchDashboardsPlugin
     // direct server-side calls
     setClient(core.http);
 
+    setDataSourceManagementPlugin(plugins.dataSourceManagement);
+
     // Create context menu actions
     const actions = getActions();
 

public/services.ts

@@ -10,6 +10,7 @@ import {
   OverlayStart,
 } from '../../../src/core/public';
 import { DataPublicPluginStart } from '../../../src/plugins/data/public';
+import { DataSourceManagementPluginSetup } from '../../../src/plugins/data_source_management/public';
 import { EmbeddableStart } from '../../../src/plugins/embeddable/public';
 import { createGetterSetter } from '../../../src/plugins/opensearch_dashboards_utils/public';
 import { UiActionsStart } from '../../../src/plugins/ui_actions/public';
@@ -42,6 +43,9 @@ export const [getQueryService, setQueryService] =
 export const [getSavedObjectsClient, setSavedObjectsClient] =
   createGetterSetter<CoreStart['savedObjects']['client']>('SavedObjectsClient');
 
+export const [getDataSourceManagementPlugin, setDataSourceManagementPlugin] = 
+  createGetterSetter<DataSourceManagementPluginSetup>('DataSourceManagement');
+
 // This is primarily used for mocking this module and each of its fns in tests.
 export default {
   getSavedFeatureAnywhereLoader,