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

[Backport 2.x][Navigation] Register all plugins to NavGroups (#1926) #1948

Merged
merged 2 commits into from
Jul 19, 2024
Merged

[Backport 2.x][Navigation] Register all plugins to NavGroups (#1926) #1948

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c8be3ed
[Navigation] Register all plugins to NavGroups (#1926)
TackAdam Jul 19, 2024
82aa64e
remove error
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
4 changes: 4 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,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;
Expand Down
19 changes: 19 additions & 0 deletions common/utils/set_nav_bread_crumbs.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/

import { EuiBreadcrumb } from '@elastic/eui';
import { coreRefs } from '../../public/framework/core_refs';

export const setNavBreadCrumbs = (
parentBreadCrumb: EuiBreadcrumb[],
pageBreadCrumb: EuiBreadcrumb[]
) => {
const isNavGroupEnabled = coreRefs?.chrome?.navGroup.getNavGroupEnabled();
if (isNavGroupEnabled) {
coreRefs?.chrome?.setBreadcrumbs([...pageBreadCrumb]);
} else {
coreRefs?.chrome?.setBreadcrumbs([...parentBreadCrumb, ...pageBreadCrumb]);
}
};
5 changes: 4 additions & 1 deletion 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;
const { chrome, http, notifications, savedObjects: _coreSavedObjects } = CoreStartProp;
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: 4 additions & 0 deletions public/components/application_analytics/__tests__/__snapshots__/log_config.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,9 +84,11 @@ exports[`Log Config component renders empty log config 1`] = `
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down Expand Up @@ -713,9 +715,11 @@ exports[`Log Config component renders with query 1`] = `
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down
4 changes: 4 additions & 0 deletions public/components/application_analytics/__tests__/__snapshots__/service_config.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,9 +84,11 @@ exports[`Service Config component renders empty service config 1`] = `
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down Expand Up @@ -1283,9 +1285,11 @@ exports[`Service Config component renders with one service selected 1`] = `
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down
4 changes: 4 additions & 0 deletions public/components/application_analytics/__tests__/__snapshots__/trace_config.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,9 +83,11 @@ exports[`Trace Config component renders empty trace config 1`] = `
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down Expand Up @@ -995,9 +997,11 @@ exports[`Trace Config component renders with one trace selected 1`] = `
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down
25 changes: 11 additions & 14 deletions public/components/application_analytics/components/app_table.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,13 +37,9 @@ import moment from 'moment';
import { DeleteModal } from '../../common/helpers/delete_modal';
import { AppAnalyticsComponentDeps } from '../home';
import { getCustomModal } from '../../custom_panels/helpers/modal_containers';
import {
observabilityID,
observabilityTitle,
pageStyles,
UI_DATE_FORMAT,
} from '../../../../common/constants/shared';
import { pageStyles, UI_DATE_FORMAT } from '../../../../common/constants/shared';
import { ApplicationType, AvailabilityType } from '../../../../common/types/application_analytics';
import { setNavBreadCrumbs } from '../../../../common/utils/set_nav_bread_crumbs';

interface AppTableProps extends AppAnalyticsComponentDeps {
loading: boolean;
Expand All @@ -57,7 +53,6 @@ interface AppTableProps extends AppAnalyticsComponentDeps {

export function AppTable(props: AppTableProps) {
const {
chrome,
applications,
parentBreadcrumbs,
fetchApplications,
Expand All @@ -74,13 +69,15 @@ export function AppTable(props: AppTableProps) {
const createButtonText = 'Create application';

useEffect(() => {
chrome.setBreadcrumbs([
...parentBreadcrumbs,
{
text: 'Applications',
href: '#/',
},
]);
setNavBreadCrumbs(
[...parentBreadcrumbs],
[
{
text: 'Applications',
href: '#/',
},
]
);
clear();
fetchApplications();
}, []);
Expand Down
30 changes: 15 additions & 15 deletions public/components/application_analytics/components/application.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,9 @@
import React, { ReactChild, useEffect, useState } from 'react';
import { useHistory } from 'react-router-dom';
import { useDispatch } from 'react-redux';
import { last } from 'lodash';

Check failure on line 28 in public/components/application_analytics/components/application.tsx

View workflow job for this annotation

GitHub Actions / Lint 

'last' is defined but never used. Allowed unused vars must match /^_/u
import { VisualizationType } from 'common/types/custom_panels';
import { TracesContent } from '../../../components/trace_analytics/components/traces/traces_content';
import { DashboardContent } from '../../../components/trace_analytics/components/dashboard/dashboard_content';
import { ServicesContent } from '../../trace_analytics/components/services/services_content';
import {
filtersToDsl,
Expand All @@ -43,7 +42,6 @@
TAB_LOG_ID,
TAB_LOG_TITLE,
TAB_OVERVIEW_ID,
TAB_OVERVIEW_TITLE,
TAB_PANEL_ID,
TAB_PANEL_TITLE,
TAB_SERVICE_ID,
Expand All @@ -66,7 +64,7 @@
import { TraceDetailFlyout } from './flyout_components/trace_detail_flyout';
import { fetchAppById, initializeTabData } from '../helpers/utils';
import { QueryManager } from '../../../../common/query_manager/ppl_query_manager';
import { observabilityApplicationsID } from '../../../../common/constants/shared';
import { setNavBreadCrumbs } from '../../../../common/utils/set_nav_bread_crumbs';

const searchBarConfigs = {
[TAB_EVENT_ID]: {
Expand Down Expand Up @@ -111,7 +109,6 @@
updateApp,
setAppConfigs,
setToasts,
toasts,
setFilters,
callback,
queryManager,
Expand All @@ -136,7 +133,7 @@
const [serviceFlyoutName, setServiceFlyoutName] = useState<string>('');
const [traceFlyoutId, setTraceFlyoutId] = useState<string>('');
const [spanFlyoutId, setSpanFlyoutId] = useState<string>('');
const [spanDSL, setSpanDSL] = useState<any>({});

Check warning on line 136 in public/components/application_analytics/components/application.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
const [totalSpans, setTotalSpans] = useState<number>(0);
const [editVizId, setEditVizId] = useState<string>('');
const [visWithAvailability, setVisWithAvailability] = useState<EuiSelectOption[]>([]);
Expand All @@ -159,7 +156,7 @@
sessionStorage.setItem(`${application.name}EndTime`, newEndTime);
};

const addSpanFilter = (field: string, value: any) => {

Check warning on line 159 in public/components/application_analytics/components/application.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
const newFilters = [...filters];
const index = newFilters.findIndex(({ field: filterField }) => field === filterField);
if (index === -1) {
Expand Down Expand Up @@ -218,17 +215,20 @@
}, [appId]);

useEffect(() => {
chrome.setBreadcrumbs([
...parentBreadcrumbs,
{
text: 'Applications',
href: '#/',
},
{
text: application.name,
href: `#/${appId}`,
},
]);
setNavBreadCrumbs(
[...parentBreadcrumbs],
[
{
text: 'Applications',
href: '#/',
},
{
text: application.name,
href: `#/${appId}`,
},
]
);

setStartTimeForApp(sessionStorage.getItem(`${application.name}StartTime`) || 'now-24h');
setEndTimeForApp(sessionStorage.getItem(`${application.name}EndTime`) || 'now');
}, [appId, application.name]);
Expand Down Expand Up @@ -285,7 +285,7 @@
},
];

const nameColumnAction = (item: any) => openServiceFlyout(item);

Check warning on line 288 in public/components/application_analytics/components/application.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type
const traceColumnAction = () => switchToTrace();

const getService = () => {
Expand All @@ -312,7 +312,7 @@
setSelectedTab(TAB_TRACE_ID);
};

const traceIdColumnAction = (item: any) => openTraceFlyout(item);

Check warning on line 315 in public/components/application_analytics/components/application.tsx

View workflow job for this annotation

GitHub Actions / Lint 

Unexpected any. Specify a different type

const getTrace = () => {
return (
Expand Down
33 changes: 16 additions & 17 deletions public/components/application_analytics/components/create.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
import DSLService from 'public/services/requests/dsl';
import React, { ReactChild, useEffect, useState } from 'react';
import PPLService from 'public/services/requests/ppl';
import { last } from 'lodash';

Check failure on line 29 in public/components/application_analytics/components/create.tsx

View workflow job for this annotation

GitHub Actions / Lint 

'last' is defined but never used. Allowed unused vars must match /^_/u
import { AppAnalyticsComponentDeps } from '../home';
import { TraceConfig } from './config_components/trace_config';
import { ServiceConfig } from './config_components/service_config';
Expand All @@ -38,11 +38,8 @@
OptionType,
} from '../../../../common/types/application_analytics';
import { fetchAppById } from '../helpers/utils';
import {
observabilityApplicationsID,
observabilityID,
observabilityTitle,
} from '../../../../common/constants/shared';
import { observabilityApplicationsID } from '../../../../common/constants/shared';
import { setNavBreadCrumbs } from '../../../../common/utils/set_nav_bread_crumbs';

interface CreateAppProps extends AppAnalyticsComponentDeps {
dslService: DSLService;
Expand All @@ -57,7 +54,6 @@
export const CreateApp = (props: CreateAppProps) => {
const {
parentBreadcrumbs,
chrome,
http,
query,
name,
Expand Down Expand Up @@ -92,17 +88,20 @@
});

useEffect(() => {
chrome.setBreadcrumbs([
...parentBreadcrumbs,
{
text: 'Applications',
href: '#/',
},
{
text: editMode ? 'Edit' : 'Create',
href: `#/${editMode ? 'edit' : 'create'}`,
},
]);
setNavBreadCrumbs(
[...parentBreadcrumbs],
[
...parentBreadcrumbs,
{
text: 'Applications',
href: '#/',
},
{
text: editMode ? 'Edit' : 'Create',
href: `#/${editMode ? 'edit' : 'create'}`,
},
]
);
}, []);

useEffect(() => {
Expand Down
8 changes: 8 additions & 0 deletions public/components/custom_panels/__tests__/__snapshots__/custom_panel_view.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1225,9 +1225,11 @@ exports[`Panels View Component renders panel view container with visualizations
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down Expand Up @@ -3020,9 +3022,11 @@ exports[`Panels View Component renders panel view container with visualizations
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down Expand Up @@ -3472,9 +3476,11 @@ exports[`Panels View Component renders panel view container without visualizatio
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down Expand Up @@ -5151,9 +5157,11 @@ exports[`Panels View Component renders panel view container without visualizatio
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down
2 changes: 2 additions & 0 deletions ...s/custom_panels/panel_modules/panel_grid/__tests__/__snapshots__/panel_grid.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -241,9 +241,11 @@ exports[`Panel Grid Component renders panel grid component with empty visualizat
"navControls": Object {
"getCenter$": [MockFunction],
"getLeft$": [MockFunction],
"getLeftBottom$": [MockFunction],
"getRight$": [MockFunction],
"registerCenter": [MockFunction],
"registerLeft": [MockFunction],
"registerLeftBottom": [MockFunction],
"registerRight": [MockFunction],
},
"navGroup": Object {
Expand Down
6 changes: 4 additions & 2 deletions 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,
timestampUtils: any,
queryManager: QueryManager,
startPage: string,
dataSourcePluggables,
dataSourcePluggables: any,
dataSourceManagement: DataSourceManagementPluginSetup,
savedObjectsMDSClient: CoreStart['savedObjects']
savedObjectsMDSClient: CoreStart['savedObjects'],
defaultRoute?: string
) => {
const { setHeaderActionMenu } = AppMountParametersProp;
const { dataSource } = DepsStart;
Expand All @@ -42,6 +43,7 @@
setActionMenu={setHeaderActionMenu}
dataSourceEnabled={!!dataSource}
savedObjectsMDSClient={savedObjectsMDSClient}
defaultRoute={defaultRoute}
/>,
AppMountParametersProp.element
);
Expand Down
Loading
Loading