[MDS] Refactor DataSourceAggregatedView (opensearch-project#6500) (op…

…ensearch-project#6542) * Refactor aggregated view * Add empty state support --------- (cherry picked from commit bd0ea35) Signed-off-by: Huy Nguyen <[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>
SuZhou-Joe · Apr 18, 2024 · 88c5dfa · 88c5dfa
1 parent c9dcb83
commit 88c5dfa
Show file tree

Hide file tree

Showing 12 changed files with 2,433 additions and 902 deletions.
diff --git a/examples/multiple_data_source_examples/public/application.tsx b/examples/multiple_data_source_examples/public/application.tsx
@@ -11,7 +11,7 @@ import { CoreStart, AppMountParameters } from '../../../src/core/public';
 import { Home } from './components/home';
 
 export const renderApp = (
-  { notifications, http, savedObjects, application }: CoreStart,
+  { notifications, http, savedObjects, application, uiSettings }: CoreStart,
   dataSource: DataSourcePluginSetup,
   dataSourceManagement: DataSourceManagementPluginSetup,
   { appBasePath, element, setHeaderActionMenu }: AppMountParameters,
@@ -28,6 +28,7 @@ export const renderApp = (
       dataSourceManagement={dataSourceManagement}
       navigateToApp={application.navigateToApp}
       navigation={navigation}
+      uiSettings={uiSettings}
     />,
     element
   );

diff --git a/examples/multiple_data_source_examples/public/components/data_source_list_active_example.tsx b/examples/multiple_data_source_examples/public/components/data_source_list_active_example.tsx
@@ -28,6 +28,7 @@ interface DataSourceListActiveExampleProps {
   notifications: CoreStart['notifications'];
   setActionMenu?: (menuMount: MountPoint | undefined) => void;
   dataSourceManagement: DataSourceManagementPluginSetup;
+  uiSettings: CoreStart['uiSettings'];
 }
 
 export const DataSourceListActiveExample = ({
@@ -36,6 +37,7 @@ export const DataSourceListActiveExample = ({
   notifications,
   setActionMenu,
   dataSourceManagement,
+  uiSettings,
 }: DataSourceListActiveExampleProps) => {
   const DataSourceMenu = dataSourceManagement.ui.getDataSourceMenu<
     DataSourceAggregatedViewConfig
@@ -106,7 +108,10 @@ export const DataSourceListActiveExample = ({
               fullWidth: false,
               savedObjects: savedObjects.client,
               notifications,
-              displayAllCompatibleDataSources: true,
+              displayAllCompatibleDataSources: false,
+              // To see selected options, obtain the datasource id and paste it here. Note that this needs to be defined when displayAllCompatibleDataSources is false
+              activeDataSourceIds: [],
+              uiSettings,
             }}
           />
         )}

diff --git a/examples/multiple_data_source_examples/public/components/data_source_list_all_example.tsx b/examples/multiple_data_source_examples/public/components/data_source_list_all_example.tsx
@@ -28,6 +28,7 @@ interface DataSourceListAllExampleProps {
   notifications: CoreStart['notifications'];
   setActionMenu?: (menuMount: MountPoint | undefined) => void;
   dataSourceManagement: DataSourceManagementPluginSetup;
+  uiSettings: CoreStart['uiSettings'];
 }
 
 export const DataSourceListAllExample = ({
@@ -36,6 +37,7 @@ export const DataSourceListAllExample = ({
   notifications,
   setActionMenu,
   dataSourceManagement,
+  uiSettings,
 }: DataSourceListAllExampleProps) => {
   const DataSourceMenu = dataSourceManagement.ui.getDataSourceMenu<
     DataSourceAggregatedViewConfig
@@ -100,6 +102,7 @@ export const DataSourceListAllExample = ({
               savedObjects: savedObjects.client,
               notifications,
               displayAllCompatibleDataSources: true,
+              uiSettings,
             }}
           />
         )}

diff --git a/examples/multiple_data_source_examples/public/components/home.tsx b/examples/multiple_data_source_examples/public/components/home.tsx
@@ -22,6 +22,7 @@ export interface HomeProps {
   notifications: CoreStart['notifications'];
   http: CoreStart['http'];
   savedObjects: CoreStart['savedObjects'];
+  uiSettings: CoreStart['uiSettings'];
   dataSourceEnabled: boolean;
   dataSourceManagement: DataSourceManagementPluginSetup;
   navigateToApp: CoreStart['application']['navigateToApp'];
@@ -65,6 +66,7 @@ export const Home = ({
   basename,
   notifications,
   savedObjects,
+  uiSettings,
   dataSourceEnabled,
   setActionMenu,
   dataSourceManagement,
@@ -133,6 +135,7 @@ export const Home = ({
           dataSourceEnabled={dataSourceEnabled}
           setActionMenu={setActionMenu}
           dataSourceManagement={dataSourceManagement}
+          uiSettings={uiSettings}
         />
       ),
     },
@@ -146,6 +149,7 @@ export const Home = ({
           dataSourceEnabled={dataSourceEnabled}
           setActionMenu={setActionMenu}
           dataSourceManagement={dataSourceManagement}
+          uiSettings={uiSettings}
         />
       ),
     },