Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Navigation] Register all plugins to NavGroups #1926

Merged
merged 32 commits into from
Jul 19, 2024
Merged

[Navigation] Register all plugins to NavGroups #1926

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
32 commits
Select commit Hold shift + click to select a range
43ff505
Add a function to register all plugin Nav groups and categories
Jun 27, 2024
27641b5
Updated addNavLinkGroups path rename dashboards
Jul 2, 2024
bfa82c8
Fixing Naming
Jul 4, 2024
1519828
feat: enable default route
SuZhou-Joe Jul 5, 2024
f5e26f3
Merge pull request #1 from SuZhou-Joe/feature/enable_default_route
TackAdam Jul 5, 2024
6abb8ed
Update breadcrumb for Trace to default to service page
Jul 5, 2024
60ebb7c
Update snapshots
Jul 10, 2024
393815a
feat: update
SuZhou-Joe Jul 12, 2024
9b58c3a
feat: add some features to all use case
SuZhou-Joe Jul 17, 2024
1488866
Merge pull request #2 from SuZhou-Joe/poc/context-menu-navigation
TackAdam Jul 17, 2024
289451c
Depreciated logs, application. Dashboards/Traces adjusted
Jul 17, 2024
30e164a
Not registering logs/applications/dashboards when left nav used
Jul 17, 2024
080c17c
Update snapshots
Jul 17, 2024
ec684c5
fixing lint errors
Jul 17, 2024
493c16c
Put applications back
Jul 17, 2024
7825747
update snapshots
Jul 17, 2024
65fc08c
Merge branch 'main' into navObs
TackAdam Jul 17, 2024
f7a416d
Update public/plugin_nav.tsx
TackAdam Jul 18, 2024
6c821ed
Update public/plugin_nav.tsx
TackAdam Jul 18, 2024
8bdc12a
Update public/plugin_nav.tsx
TackAdam Jul 18, 2024
ef393c7
Update public/plugin_nav.tsx
TackAdam Jul 18, 2024
59e5500
Update public/plugin_nav.tsx
TackAdam Jul 18, 2024
2b92e6e
Update public/plugin_nav.tsx
TackAdam Jul 18, 2024
6fdc251
Update public/plugin_nav.tsx
TackAdam Jul 18, 2024
158c8a7
Update public/plugin_nav.tsx
TackAdam Jul 18, 2024
17994c2
Update public/plugin.tsx
TackAdam Jul 18, 2024
1917733
Removed applications from new nav
Jul 18, 2024
7396203
Add applications back, remove in app nav for trace, remove breadcrumb…
Jul 18, 2024
0bbc6d4
update snapshots
Jul 18, 2024
453f171
Adjust order of metrics/traces/services/applications as per guidance …
Jul 18, 2024
50d44d4
function for nav breadcrumbs added
Jul 19, 2024
4755904
Merge branch 'main' into navObs
sumukhswamy Jul 19, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions common/constants/shared.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,12 +53,17 @@ 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;

export const observabilityPanelsID = 'observability-dashboards';
export const observabilityPanelsTitle = 'Dashboards';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

can't change this here as it also changes in the name existing side-nav

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

+1

export const observabilityPanelsTitleForNav = 'Observability-Dashboards';
export const observabilityPanelsPluginOrder = 5095;

export const observabilityIntegrationsID = 'integrations';
Expand Down
3 changes: 3 additions & 0 deletions public/components/app.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,16 +25,17 @@
interface ObservabilityAppDeps {
CoreStartProp: CoreStart;
DepsStart: AppPluginStartDependencies;
pplService: any;

Check warning on line 28 in public/components/app.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
dslService: any;

Check warning on line 29 in public/components/app.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
savedObjects: any;

Check warning on line 30 in public/components/app.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
timestampUtils: any;

Check warning on line 31 in public/components/app.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
queryManager: QueryManager;
startPage: string;
dataSourceEnabled: boolean;
dataSourceManagement: DataSourceManagementPluginSetup;
setActionMenu: (menuMount: MountPoint | undefined) => void;
savedObjectsMDSClient: CoreStart['savedObjects'];
defaultRoute?: string;
}

// for cypress to test redux store
Expand Down Expand Up @@ -67,8 +68,9 @@
setActionMenu,
dataSourceEnabled,
savedObjectsMDSClient,
defaultRoute,
}: ObservabilityAppDeps) => {
const { chrome, http, notifications, savedObjects: coreSavedObjects } = CoreStartProp;

Check failure on line 73 in public/components/app.tsx

View workflow job for this annotation

GitHub Actions / Lint 

'coreSavedObjects' is assigned a value but never used. Allowed unused vars must match /^_/u
const parentBreadcrumb = {
text: observabilityTitle,
href: `${observabilityID}#/`,
Expand Down Expand Up @@ -102,6 +104,7 @@
dataSourceEnabled={dataSourceEnabled}
setActionMenu={setActionMenu}
savedObjectsMDSClient={savedObjectsMDSClient}
defaultRoute={defaultRoute}
/>
</MetricsListener>
</I18nProvider>
Expand Down
4 changes: 3 additions & 1 deletion public/components/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,16 @@
CoreStartProp: CoreStart,
DepsStart: AppPluginStartDependencies,
AppMountParametersProp: AppMountParameters,
pplService: any,

Check warning on line 18 in public/components/index.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
dslService: any,

Check warning on line 19 in public/components/index.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
savedObjects: any,

Check warning on line 20 in public/components/index.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
timestampUtils: any,

Check warning on line 21 in public/components/index.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
queryManager: QueryManager,
startPage: string,
dataSourcePluggables,
dataSourceManagement: DataSourceManagementPluginSetup,
savedObjectsMDSClient: CoreStart['savedObjects']
savedObjectsMDSClient: CoreStart['savedObjects'],
defaultRoute?: string,

Check failure on line 27 in public/components/index.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Delete `,`
) => {
const { setHeaderActionMenu } = AppMountParametersProp;
const { dataSource } = DepsStart;
Expand All @@ -42,6 +43,7 @@
setActionMenu={setHeaderActionMenu}
dataSourceEnabled={!!dataSource}
savedObjectsMDSClient={savedObjectsMDSClient}
defaultRoute={defaultRoute}
/>,
AppMountParametersProp.element
);
Expand Down
11 changes: 7 additions & 4 deletions public/components/trace_analytics/home.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down Expand Up @@ -44,6 +44,7 @@
dataSourceManagement: DataSourceManagementPluginSetup;
setActionMenu: (menuMount: MountPoint | undefined) => void;
savedObjectsMDSClient: SavedObjectsStart;
defaultRoute?: string;
}

interface HomeProps extends RouteComponentProps, TraceAnalyticsCoreDeps {}
Expand All @@ -69,7 +70,7 @@
}: {
spanId: string;
isFlyoutVisible: boolean;
addSpanFilter: (field: string, value: any) => void;

Check warning on line 73 in public/components/trace_analytics/home.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
spanMode: TraceAnalyticsMode;
spanDataSourceMDSId: string;
}) => void;
Expand Down Expand Up @@ -119,6 +120,7 @@

const [dataSourceMDSId, setDataSourceMDSId] = useState([{ id: '', label: '' }]);
const [currentSelectedService, setCurrentSelectedService] = useState('');
const { defaultRoute = '/services' } = props;

useEffect(() => {
handleDataPrepperIndicesExistRequest(
Expand All @@ -127,7 +129,7 @@
dataSourceMDSId[0].id
);
handleJaegerIndicesExistRequest(props.http, setJaegerIndicesExist, dataSourceMDSId[0].id);
}, [dataSourceMDSId]);

Check warning on line 132 in public/components/trace_analytics/home.tsx

View workflow job for this annotation

GitHub Actions / Lint 

React Hook useEffect has a missing dependency: 'props.http'. Either include it or remove the dependency array

const modes = [
{ id: 'jaeger', title: 'Jaeger', 'data-test-subj': 'jaeger-mode' },
Expand Down Expand Up @@ -161,7 +163,7 @@
const serviceBreadcrumbs = [
{
text: 'Trace analytics',
href: '#/',
href: '#/services',
},
{
text: 'Services',
Expand All @@ -172,7 +174,7 @@
const traceBreadcrumbs = [
{
text: 'Trace analytics',
href: '#/',
href: '#/services',
},
{
text: 'Traces',
Expand Down Expand Up @@ -326,7 +328,7 @@
/>
<Route
exact
path={['/services', '/']}
path={['/services']}
render={(_routerProps) => (
<TraceSideBar>
<Services
Expand Down Expand Up @@ -364,6 +366,7 @@
/>
)}
/>
<Route path="/" render={() => <Redirect to={defaultRoute} />} />
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why this change?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because we need to remove in-app navigation when the new navigation is enabled. In such case, different apps registered to new left navigation will have difference landing pages.

</HashRouter>
{flyout}
{spanFlyoutComponent}
Expand Down
55 changes: 46 additions & 9 deletions public/plugin.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,10 @@ import {
observabilityPanelsID,
observabilityPanelsPluginOrder,
observabilityPanelsTitle,
observabilityPanelsTitleForNav,
observabilityPluginOrder,
observabilityServicesPluginOrder,
observabilityServicesTitle,
observabilityTracesID,
observabilityTracesPluginOrder,
observabilityTracesTitle,
Expand Down Expand Up @@ -108,6 +111,7 @@ import {
SetupDependencies,
} from './types';
import { TablesFlyout } from './components/event_analytics/explorer/datasources/tables_flyout';
import { registerAllPluginNavGroups } from './plugin_nav';

interface PublicConfig {
query_assist: {
Expand Down Expand Up @@ -267,7 +271,9 @@ export class ObservabilityPlugin
// 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);
Expand All @@ -286,7 +292,8 @@ export class ObservabilityPlugin
startPage,
dataSourcePluggables, // just pass down for now due to time constraint, later may better expose this as context
dataSourceManagement,
coreStart.savedObjects
coreStart.savedObjects,
defaultRoute
);
};

Expand Down Expand Up @@ -322,6 +329,24 @@ export class ObservabilityPlugin
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,
title: observabilityNotebookTitle,
Expand All @@ -330,13 +355,23 @@ export class ObservabilityPlugin
mount: appMountWithStartPage('notebooks'),
});

core.application.register({
id: observabilityPanelsID,
title: observabilityPanelsTitle,
category: OBSERVABILITY_APP_CATEGORIES.observability,
order: observabilityPanelsPluginOrder,
mount: appMountWithStartPage('dashboards'),
});
if (core.chrome.navGroup.getNavGroupEnabled()) {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just for my knowledge, is this like a feature flag?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, the navigation change can be toggled, and the UI plan currently list regular dashboards as going into the same category. Until it is depreciated the idea was to rename ours for clarity while using the new navigation.

core.application.register({
id: observabilityPanelsID,
title: observabilityPanelsTitleForNav,
category: OBSERVABILITY_APP_CATEGORIES.observability,
order: observabilityPanelsPluginOrder,
mount: appMountWithStartPage('dashboards'),
});
} else {
core.application.register({
id: observabilityPanelsID,
title: observabilityPanelsTitle,
category: OBSERVABILITY_APP_CATEGORIES.observability,
order: observabilityPanelsPluginOrder,
mount: appMountWithStartPage('dashboards'),
});
}

core.application.register({
id: observabilityIntegrationsID,
Expand All @@ -346,6 +381,8 @@ export class ObservabilityPlugin
mount: appMountWithStartPage('integrations'),
});

registerAllPluginNavGroups(core);

core.application.register({
id: observabilityDataConnectionsID,
title: observabilityDataConnectionsTitle,
Expand Down
138 changes: 138 additions & 0 deletions public/plugin_nav.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,138 @@
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/
import {
observabilityApplicationsID,
observabilityIntegrationsID,
observabilityLogsID,
observabilityMetricsID,
observabilityNotebookID,
observabilityPanelsID,
observabilityTracesID,
} from '../common/constants/shared';
import { CoreSetup } from '../../../src/core/public';
import { AppPluginStartDependencies } from './types';
import { DEFAULT_NAV_GROUPS, DEFAULT_APP_CATEGORIES } from '../../../src/core/public';

export function registerAllPluginNavGroups(core: CoreSetup<AppPluginStartDependencies>) {
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.observability, [
TackAdam marked this conversation as resolved.
Show resolved Hide resolved
{
id: observabilityApplicationsID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OSD core has changed the category to visualizeAndReport but keep the dashboardAndReport to keep backward compatible. Could you please change to use visualizeAndReport?

},
]);

core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.observability, [
{
id: observabilityLogsID,
category: DEFAULT_APP_CATEGORIES.investigate,
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS[`security-analytics`], [
{
id: observabilityLogsID,
category: DEFAULT_APP_CATEGORIES.investigate,
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.analytics, [
{
id: observabilityLogsID,
category: DEFAULT_APP_CATEGORIES.investigate,
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.search, [
{
id: observabilityLogsID,
category: DEFAULT_APP_CATEGORIES.analyzeSearch,
},
]);

core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.observability, [
{
id: observabilityMetricsID,
category: DEFAULT_APP_CATEGORIES.investigate,
},
]);

core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.observability, [
{
id: observabilityTracesID,
category: DEFAULT_APP_CATEGORIES.investigate,
},
]);

core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.observability, [
{
id: observabilityNotebookID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
TackAdam marked this conversation as resolved.
Show resolved Hide resolved
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS[`security-analytics`], [
{
id: observabilityNotebookID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
TackAdam marked this conversation as resolved.
Show resolved Hide resolved
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.analytics, [
{
id: observabilityNotebookID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
TackAdam marked this conversation as resolved.
Show resolved Hide resolved
},
]);

core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.observability, [
{
id: observabilityPanelsID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS[`security-analytics`], [
{
id: observabilityPanelsID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.analytics, [
{
id: observabilityPanelsID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.search, [
{
id: observabilityPanelsID,
category: DEFAULT_APP_CATEGORIES.analyzeSearch,
},
]);

core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.observability, [
{
id: observabilityIntegrationsID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
TackAdam marked this conversation as resolved.
Show resolved Hide resolved
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS[`security-analytics`], [
{
id: observabilityIntegrationsID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
TackAdam marked this conversation as resolved.
Show resolved Hide resolved
},
]);
core.chrome.navGroup.addNavLinksToGroup(DEFAULT_NAV_GROUPS.analytics, [
{
id: observabilityIntegrationsID,
category: DEFAULT_APP_CATEGORIES.dashboardAndReport,
TackAdam marked this conversation as resolved.
Show resolved Hide resolved
},
]);

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,
},
]);
}
Loading