feat: enable default route

common/constants/shared.ts

@@ -53,6 +53,10 @@ export const observabilityTracesID = 'observability-traces';
 export const observabilityTracesTitle = 'Traces';
 export const observabilityTracesPluginOrder = 5093;
 
+export const observabilityServicesID = 'observability-services';
+export const observabilityServicesTitle = 'Services';
+export const observabilityServicesPluginOrder = 5092;
+
 export const observabilityNotebookID = 'observability-notebooks';
 export const observabilityNotebookTitle = 'Notebooks';
 export const observabilityNotebookPluginOrder = 5094;

public/components/app.tsx

@@ -25,16 +25,17 @@
 interface ObservabilityAppDeps {
   CoreStartProp: CoreStart;
   DepsStart: AppPluginStartDependencies;
   pplService: any;
   dslService: any;
   savedObjects: any;
   timestampUtils: any;
   queryManager: QueryManager;
   startPage: string;
   dataSourceEnabled: boolean;
   dataSourceManagement: DataSourceManagementPluginSetup;
   setActionMenu: (menuMount: MountPoint | undefined) => void;
   savedObjectsMDSClient: CoreStart['savedObjects'];
+  defaultRoute?: string;
 }
 
 // for cypress to test redux store
@@ -67,8 +68,9 @@
   setActionMenu,
   dataSourceEnabled,
   savedObjectsMDSClient,
+  defaultRoute,
 }: ObservabilityAppDeps) => {
   const { chrome, http, notifications, savedObjects: coreSavedObjects } = CoreStartProp;
   const parentBreadcrumb = {
     text: observabilityTitle,
     href: `${observabilityID}#/`,
@@ -102,6 +104,7 @@
             dataSourceEnabled={dataSourceEnabled}
             setActionMenu={setActionMenu}
             savedObjectsMDSClient={savedObjectsMDSClient}
+            defaultRoute={defaultRoute}
           />
         </MetricsListener>
       </I18nProvider>

public/components/index.tsx

@@ -15,15 +15,16 @@
   CoreStartProp: CoreStart,
   DepsStart: AppPluginStartDependencies,
   AppMountParametersProp: AppMountParameters,
   pplService: any,
   dslService: any,
   savedObjects: any,
   timestampUtils: any,
   queryManager: QueryManager,
   startPage: string,
   dataSourcePluggables,
   dataSourceManagement: DataSourceManagementPluginSetup,
-  savedObjectsMDSClient: CoreStart['savedObjects']
+  savedObjectsMDSClient: CoreStart['savedObjects'],
+  defaultRoute?: string,
 ) => {
   const { setHeaderActionMenu } = AppMountParametersProp;
   const { dataSource } = DepsStart;
@@ -42,6 +43,7 @@
       setActionMenu={setHeaderActionMenu}
       dataSourceEnabled={!!dataSource}
       savedObjectsMDSClient={savedObjectsMDSClient}
+      defaultRoute={defaultRoute}
     />,
     AppMountParametersProp.element
   );

public/components/trace_analytics/home.tsx

@@ -6,7 +6,7 @@
 import { EuiGlobalToastList } from '@elastic/eui';
 import { Toast } from '@elastic/eui/src/components/toast/global_toast_list';
 import React, { ReactChild, useEffect, useState } from 'react';
-import { HashRouter, Route, RouteComponentProps } from 'react-router-dom';
+import { HashRouter, Route, RouteComponentProps, Redirect } from 'react-router-dom';
 import {
   ChromeBreadcrumb,
   ChromeStart,
@@ -44,6 +44,7 @@
   dataSourceManagement: DataSourceManagementPluginSetup;
   setActionMenu: (menuMount: MountPoint | undefined) => void;
   savedObjectsMDSClient: SavedObjectsStart;
+  defaultRoute?: string;
 }
 
 interface HomeProps extends RouteComponentProps, TraceAnalyticsCoreDeps {}
@@ -69,7 +70,7 @@
   }: {
     spanId: string;
     isFlyoutVisible: boolean;
     addSpanFilter: (field: string, value: any) => void;
     spanMode: TraceAnalyticsMode;
     spanDataSourceMDSId: string;
   }) => void;
@@ -119,6 +120,7 @@
 
   const [dataSourceMDSId, setDataSourceMDSId] = useState([{ id: '', label: '' }]);
   const [currentSelectedService, setCurrentSelectedService] = useState('');
+  const { defaultRoute = '/services' } = props;
 
   useEffect(() => {
     handleDataPrepperIndicesExistRequest(
@@ -127,7 +129,7 @@
       dataSourceMDSId[0].id
     );
     handleJaegerIndicesExistRequest(props.http, setJaegerIndicesExist, dataSourceMDSId[0].id);
   }, [dataSourceMDSId]);
 
   const modes = [
     { id: 'jaeger', title: 'Jaeger', 'data-test-subj': 'jaeger-mode' },
@@ -326,7 +328,7 @@
         />
         <Route
           exact
-          path={['/services', '/']}
+          path={['/services']}
           render={(_routerProps) => (
             <TraceSideBar>
               <Services
@@ -364,6 +366,12 @@
             />
           )}
         />
+        <Route
+          path="/"
+          render={() => (
+            <Redirect to={defaultRoute} />
+          )}
+        />
       </HashRouter>
       {flyout}
       {spanFlyoutComponent}

public/plugin.tsx

@@ -52,6 +52,8 @@
   observabilityPanelsTitle,
   observabilityPanelsTitleForNav,
   observabilityPluginOrder,
+  observabilityServicesPluginOrder,
+  observabilityServicesTitle,
   observabilityTracesID,
   observabilityTracesPluginOrder,
   observabilityTracesTitle,
@@ -269,7 +271,7 @@
       // prometheus: openSearchLocalDataSourcePluggable
     };
 
-    const appMountWithStartPage = (startPage: string) => async (params: AppMountParameters) => {
+    const appMountWithStartPage = (startPage: string, defaultRoute?: string) => async (params: AppMountParameters) => {
       const { Observability } = await import('./components/index');
       const [coreStart, depsStart] = await core.getStartServices();
       const dslService = new DSLService(coreStart.http);
@@ -288,7 +290,8 @@
         startPage,
         dataSourcePluggables, // just pass down for now due to time constraint, later may better expose this as context
         dataSourceManagement,
-        coreStart.savedObjects
+        coreStart.savedObjects,
+        defaultRoute,
       );
     };
 
@@ -326,15 +329,23 @@
 
     // NEEDS CORRECTION OR REFACTOR //ADAM
     // The new-added applications need to be wrapped by a feature flag check.
-    // if (core.chrome.navGroup.getNavGroupEnabled()) {
-    //   core.application.register({
-    //     id: "observability-traces-nav",
-    //     title: observabilityTracesTitle,
-    //     order: observabilityTracesPluginOrder,
-    //     category: DEFAULT_APP_CATEGORIES.investigate,
-    //     mount: appMountWithStartPage('traces'),
-    //   });
-    // }
+    if (core.chrome.navGroup.getNavGroupEnabled()) {
+      core.application.register({
+        id: "observability-traces-nav",
+        title: observabilityTracesTitle,
+        order: observabilityTracesPluginOrder,
+        category: DEFAULT_APP_CATEGORIES.investigate,
+        mount: appMountWithStartPage('traces', '/traces'),
+      });
+
+      core.application.register({
+        id: "observability-services-nav",
+        title: observabilityServicesTitle,
+        order: observabilityServicesPluginOrder,
+        category: DEFAULT_APP_CATEGORIES.investigate,
+        mount: appMountWithStartPage('traces', '/services'),
+      });
+    }
 
     core.application.register({
       id: observabilityNotebookID,

public/plugin_nav.tsx

@@ -124,4 +124,15 @@ export function registerAllPluginNavGroups(core: CoreSetup<AppPluginStartDepende
       category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
     },
   ]);
+
+  core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.analytics, [
+    {
+      id: 'observability-traces-nav',
+      category: DEFAULT_APP_CATEGORIES.investigate,
+    },
+    {
+      id: 'observability-services-nav',
+      category: DEFAULT_APP_CATEGORIES.investigate,
+    },
+  ]);
 }