side nav changes for alerting

Signed-off-by: Riya Saxena <[email protected]>
riysaxen-amzn · Jul 18, 2024 · 70dfcc8 · 70dfcc8
1 parent 6500ea5
commit 70dfcc8
Show file tree

Hide file tree

Showing 4 changed files with 80 additions and 8 deletions.
diff --git a/public/app.js b/public/app.js
@@ -15,7 +15,7 @@ import { CoreContext } from './utils/CoreContext';
 import { ServicesContext, NotificationService, getDataSourceEnabled } from './services';
 import { initManageChannelsUrl } from './utils/helpers';
 
-export function renderApp(coreStart, params) {
+export function renderApp(coreStart, params, defaultRoute) {
   const isDarkMode = coreStart.uiSettings.get('theme:darkMode') || false;
   const http = coreStart.http;
   coreStart.chrome.setBreadcrumbs([{ text: 'Alerting' }]); // Set Breadcrumbs for the plugin
@@ -26,6 +26,10 @@ export function renderApp(coreStart, params) {
     dataSourceEnabled: getDataSourceEnabled()?.enabled,
   };
 
+  const navProps = {
+    defaultRoute: defaultRoute,
+  };
+
   // Load Chart's dark mode CSS
   if (isDarkMode) {
     require('@elastic/charts/dist/theme_only_dark.css');
@@ -45,9 +49,10 @@ export function renderApp(coreStart, params) {
             isDarkMode,
             notifications: coreStart.notifications,
             chrome: coreStart.chrome,
+            defaultRoute: defaultRoute,
           }}
         >
-          <Route render={(props) => <Main title="Alerting" {...mdsProps} {...props} />} />
+          <Route render={(props) => <Main title="Alerting" {...mdsProps} {...navProps} {...props} />} />
         </CoreContext.Provider>
       </ServicesContext.Provider>
     </Router>,

diff --git a/public/pages/Home/Home.js b/public/pages/Home/Home.js
@@ -10,7 +10,6 @@ import { EuiTab, EuiTabs } from '@elastic/eui';
 import Dashboard from '../Dashboard/containers/Dashboard';
 import Monitors from '../Monitors/containers/Monitors';
 import DestinationsList from '../Destinations/containers/DestinationsList';
-import { getDataSource, setDataSource } from '../../services';
 
 const getSelectedTabId = (pathname) => {
   if (pathname.includes('monitors')) return 'monitors';
@@ -79,10 +78,14 @@ export default class Home extends Component {
   );
 
   render() {
-    const { httpClient, notifications, setFlyout, landingDataSourceId } = this.props;
+    const { httpClient, notifications, setFlyout, landingDataSourceId, defaultRoute } = this.props;
     return (
       <div>
-        <EuiTabs size="s">{this.tabs.map(this.renderTab)}</EuiTabs>
+        {!defaultRoute && (
+          <EuiTabs size="s">
+            {this.tabs.map(this.renderTab)}
+          </EuiTabs>
+        )}
         <div style={{ padding: '25px 25px' }}>
           <Switch>
             <Route
@@ -122,7 +125,7 @@ export default class Home extends Component {
                 />
               )}
             />
-            <Redirect to="/dashboard" />
+            <Redirect to={defaultRoute || "/dashboard"} />
           </Switch>
         </div>
       </div>

diff --git a/public/pages/Main/Main.js b/public/pages/Main/Main.js
@@ -236,6 +236,7 @@ class Main extends Component {
                                   setFlyout={this.setFlyout}
                                   notifications={core.notifications}
                                   landingDataSourceId={this.state.selectedDataSourceId}
+                                  defaultRoute={core.chrome?.navGroup?.getNavGroupEnabled() ? this.props.defaultRoute : undefined}
                                 />
                               )}
                             />

diff --git a/public/plugin.tsx b/public/plugin.tsx
@@ -8,6 +8,9 @@ import {
   Plugin,
   CoreSetup,
   CoreStart,
+  DEFAULT_NAV_GROUPS,
+  WorkspaceAvailability,
+  AppMountParameters,
 } from '../../../src/core/public';
 import { ACTION_ALERTING } from './actions/alerting_dashboard_action';
 import { CONTEXT_MENU_TRIGGER, EmbeddableStart } from '../../../src/plugins/embeddable/public';
@@ -46,7 +49,15 @@ export interface AlertingStartDeps {
 }
 
 export class AlertingPlugin implements Plugin<AlertingSetup, AlertingStart, AlertingSetupDeps, AlertingStartDeps> {
+
   public setup(core: CoreSetup<AlertingStartDeps, AlertingStart>, { expressions, uiActions, dataSourceManagement, dataSource }: AlertingSetupDeps): AlertingSetup {
+
+    const mountWrapper = async (params: AppMountParameters, redirect: string) => {
+      const { renderApp } = await import("./app");
+      const [coreStart] = await core.getStartServices();
+      return renderApp(coreStart, params, redirect);
+    };
+
     core.application.register({
       id: PLUGIN_NAME,
       title: 'Alerting',
@@ -56,11 +67,12 @@ export class AlertingPlugin implements Plugin<AlertingSetup, AlertingStart, Aler
         label: 'OpenSearch Plugins',
         order: 2000,
       },
+      workspaceAvailability: WorkspaceAvailability.outsideWorkspace,
       order: 4000,
       mount: async (params) => {
         const { renderApp } = await import('./app');
         const [coreStart] = await core.getStartServices();
-        return renderApp(coreStart, params);
+        return renderApp(coreStart, params, "dashboard");
       },
     });
 
@@ -92,7 +104,58 @@ export class AlertingPlugin implements Plugin<AlertingSetup, AlertingStart, Aler
     uiActions.registerTrigger(alertingTriggerAd);
     uiActions.addTriggerAction(alertingTriggerAd.id, adAction);
 
-    return;
+    if (core.chrome.navGroup.getNavGroupEnabled()) {
+
+      // channels route
+      core.application.register({
+        id: `alerts`,
+        title: 'Alerts',
+        order: 9070,
+        mount: async (params: AppMountParameters) => {
+          return mountWrapper(params, "/dashboard");
+        },
+      });
+
+      core.application.register({
+        id: `monitors`,
+        title: 'Monitors',
+        order: 9070,
+        mount: async (params: AppMountParameters) => {
+          return mountWrapper(params, "/monitors");
+        },
+      });
+
+      core.application.register({
+        id: `destinations`,
+        title: 'Destinations',
+        order: 9070,
+        mount: async (params: AppMountParameters) => {
+          return mountWrapper(params, "/destinations");
+        },
+      });
+
+      core.chrome.navGroup.addNavLinksToGroup(
+        DEFAULT_NAV_GROUPS.observability,
+        [
+          {
+            id: PLUGIN_NAME,
+          },
+          {
+            id: `alerts`,
+            parentNavLinkId: PLUGIN_NAME
+          },
+          {
+            id: `monitors`,
+            parentNavLinkId: PLUGIN_NAME
+          },
+          {
+            id: `destinations`,
+            parentNavLinkId: PLUGIN_NAME
+          },
+
+        ]
+      );
+    }
   }
 
   public start(core: CoreStart, { visAugmenter, embeddable, data }: AlertingStartDeps): AlertingStart {