Skip to content

Commit

Permalink
Left-Nav app registrations for Observability - WIP (opensearch-projec…
Browse files Browse the repository at this point in the history 
…t#350)

* Left Nav links.  Working for Notebook.
* Remove observability side bar
* Events URL working
* Fix metrics link from left nav
* Fix applications link

---------

Signed-off-by: Peter Fitzgibbons <pjfitz@amazon.com>
Signed-off-by: Rupal Mahajan <maharup@amazon.com>
Signed-off-by: Kavitha Conjeevaram Mohan <mohakavi@amazon.com>
Signed-off-by: Derek Ho <dxho@amazon.com>
Signed-off-by: Eric Wei <menwe@amazon.com>
Co-authored-by: Peter Fitzgibbons <pjfitz@amazon.com>
Co-authored-by: Rupal Mahajan <maharup@amazon.com>
Co-authored-by: Kavitha Conjeevaram Mohan <mohakavi@amazon.com>
Co-authored-by: Eric Wei <menwe@amazon.com>
Co-authored-by: Derek Ho <dxho@amazon.com>
  • Loading branch information
@pjfitzgibbons @rupal-bq
@kavithacm @mengweieric @derek-ho @joshuali925
6 people authored and joshuali925 committed Apr 18, 2023
1 parent d11d1ee commit e2f40f3
Show file tree
Hide file tree
Showing 24 changed files with 629 additions and 441 deletions.
8 changes: 4 additions & 4 deletions .cypress/integration/3_panels.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,8 +110,8 @@ describe.only('Testing panels table', () => {
expectUuid(duplicate)
});

it.only('Duplicates a legacy panel', () => {
createLegacyPanel()
it.only('Duplicates a saved object panel', () => {
createSavedObjectPanel()
selectThePanel();
openActionsDropdown();
cy.get('button[data-test-subj="duplicateContextMenuItem"]').click();
Expand Down Expand Up @@ -516,13 +516,13 @@ describe('Clean up all test data', () => {


const moveToEventsHome = () => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/event_analytics/`);
cy.visit(`${Cypress.env('opensearchDashboards')}/app/observability-events#/`);
cy.wait(delay * 3);
};

const moveToPanelHome = () => {
cy.visit(
`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/operational_panels/`
`${Cypress.env('opensearchDashboards')}/app/observability-dashboards#/`
, { timeout: 3000 });
cy.wait(delay * 3);
};
Expand Down
24 changes: 24 additions & 0 deletions common/constants/shared.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,30 @@ export const observabilityID = 'observability-dashboards';
export const observabilityTitle = 'Observability';
export const observabilityPluginOrder = 6000;

export const observabilityApplicationsID = 'observability-applications';
export const observabilityApplicationsTitle = 'Applications';
export const observabilityApplicationsPluginOrder = 5090;

export const observabilityLogsID = 'observability-logs';
export const observabilityLogsTitle = 'Logs';
export const observabilityLogsPluginOrder = 5091;

export const observabilityMetricsID = 'observability-metrics';
export const observabilityMetricsTitle = 'Metrics';
export const observabilityMetricsPluginOrder = 5092;

export const observabilityTracesID = 'observability-traces';
export const observabilityTracesTitle = 'Traces';
export const observabilityTracesPluginOrder = 5093;

export const observabilityNotebookID = 'observability-notebooks';
export const observabilityNotebookTitle = 'Notebooks';
export const observabilityNotebookPluginOrder = 5094;

export const observabilityPanelsID = 'observability-dashboards';
export const observabilityPanelsTitle = 'Dashboards';
export const observabilityPanelsPluginOrder = 5095;

// Shared Constants
export const SQL_DOCUMENTATION_URL = 'https://opensearch.org/docs/latest/search-plugins/sql/index/';
export const PPL_DOCUMENTATION_URL =
Expand Down
4 changes: 3 additions & 1 deletion common/types/explorer.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ import {
SavedObjectAttributes,
SavedObjectsStart,
} from '../../../../src/core/public/saved_objects';
import { ChromeBreadcrumb } from '../../../../src/core/public/chrome';

export interface IQueryTab {
id: string;
Expand Down Expand Up @@ -318,14 +319,15 @@ export interface Breadcrumbs {

export interface EventAnalyticsProps {
chrome: CoreSetup;
parentBreadcrumbs: Breadcrumbs[];
parentBreadcrumbs: ChromeBreadcrumb;
pplService: any;
dslService: any;
savedObjects: SavedObjectsStart;
timestampUtils: TimestampUtils;
http: HttpStart;
notifications: NotificationsStart;
queryManager: QueryManager;
setBreadcrumbs:(newBreadcrumbs: ChromeBreadcrumb[]) => void;
}

export interface DataConfigPanelProps {
Expand Down
269 changes: 158 additions & 111 deletions public/components/app.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,10 @@
import { I18nProvider } from '@osd/i18n/react';
import { QueryManager } from 'common/query_manager';
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { HashRouter, Route, Switch } from 'react-router-dom';
import { CoreStart } from '../../../../src/core/public';
import { AppMountParameters, CoreStart } from '../../../../src/core/public';
import { observabilityID, observabilityTitle } from '../../common/constants/shared';
import { store } from '../framework/redux/store';
import { AppPluginStartDependencies } from '../types';
Expand All @@ -28,13 +29,24 @@ interface ObservabilityAppDeps {
savedObjects: any;
timestampUtils: any;
queryManager: QueryManager;
startPage: string;
// mountParams: AppMountParameters;
}

// for cypress to test redux store
if (window.Cypress) {
window.store = store;
}

const pages = {
applications: ApplicationAnalyticsHome,
logs: EventAnalytics,
metrics: MetricsHome,
traces: TraceAnalyticsHome,
notebooks: NotebooksHome,
dashboards: CustomPanelsHome,
};

export const App = ({
CoreStartProp,
DepsStart,
Expand All @@ -43,6 +55,8 @@ export const App = ({
savedObjects,
timestampUtils,
queryManager,
// mountParams,
startPage,
}: ObservabilityAppDeps) => {
const { chrome, http, notifications, savedObjects: coreSavedObjects } = CoreStartProp;
const parentBreadcrumb = {
Expand All @@ -55,118 +69,151 @@ export const App = ({
href: '#/operational_panels/',
};

const ModuleComponent = pages[startPage];

return (
<Provider store={store}>
<HashRouter>
<I18nProvider>
<MetricsListener http={http}>
<Switch>
<Route
path="/metrics_analytics/"
render={(props) => {
chrome.setBreadcrumbs([
parentBreadcrumb,
{ text: 'Metrics analytics', href: '#/metrics_analytics/' },
]);
return (
<MetricsHome
http={http}
chrome={chrome}
parentBreadcrumb={parentBreadcrumb}
renderProps={props}
pplService={pplService}
savedObjects={savedObjects}
/>
);
}}
/>
<Route
path={'/application_analytics'}
render={(props) => {
return (
<ApplicationAnalyticsHome
{...props}
chrome={chrome}
http={http}
notifications={notifications}
parentBreadcrumbs={[parentBreadcrumb]}
pplService={pplService}
dslService={dslService}
savedObjects={savedObjects}
timestampUtils={timestampUtils}
queryManager={queryManager}
/>
);
}}
/>
<Route
path="/notebooks"
render={(props) => (
<NotebooksHome
{...props}
DashboardContainerByValueRenderer={
DepsStart.dashboard.DashboardContainerByValueRenderer
}
http={http}
pplService={pplService}
setBreadcrumbs={chrome.setBreadcrumbs}
parentBreadcrumb={parentBreadcrumb}
notifications={notifications}
/>
)}
/>
<Route
path="/operational_panels"
render={(props) => {
chrome.setBreadcrumbs([parentBreadcrumb, customPanelBreadcrumb]);
return (
<CustomPanelsHome
http={http}
chrome={chrome}
parentBreadcrumbs={[parentBreadcrumb, customPanelBreadcrumb]}
pplService={pplService}
dslService={dslService}
renderProps={props}
savedObjects={savedObjects}
coreSavedObjects={coreSavedObjects}
/>
);
}}
/>
<Route
path={['/trace_analytics', '/trace_analytics/home']}
render={(props) => (
<TraceAnalyticsHome
{...props}
chrome={chrome}
http={http}
parentBreadcrumbs={[parentBreadcrumb]}
/>
)}
/>
<Route
path={['/', '/event_analytics']}
render={(props) => {
return (
<EventAnalytics
chrome={chrome}
parentBreadcrumbs={[parentBreadcrumb]}
pplService={pplService}
dslService={dslService}
savedObjects={savedObjects}
timestampUtils={timestampUtils}
http={http}
notifications={notifications}
queryManager={queryManager}
{...props}
/>
);
}}
/>
</Switch>
</MetricsListener>
</I18nProvider>
</HashRouter>
<I18nProvider>
<MetricsListener http={http}>
<ModuleComponent
http={http}
chrome={chrome}
notifications={notifications}
CoreStartProp={CoreStartProp}
DepsStart={DepsStart}
DashboardContainerByValueRenderer={
DepsStart.dashboard.DashboardContainerByValueRenderer
}
pplService={pplService}
dslService={dslService}
savedObjects={savedObjects}
timestampUtils={timestampUtils}
queryManager={queryManager}
parentBreadcrumb={parentBreadcrumb}
parentBreadcrumbs={[parentBreadcrumb]}
setBreadcrumbs={chrome.setBreadcrumbs}
/>
</MetricsListener>
</I18nProvider>
</Provider>
);
};

// // redirect legacy notebooks URL to current URL under observability
// if (window.location.pathname.includes('application_analytics')) {
// window.location.assign(convertLegacyAppAnalyticsUrl(window.location));
// }

// return (
// <Provider store={store}>
// <HashRouter>
// <I18nProvider>
// <MetricsListener http={http}>
// <Switch>
// <Route
// path="/metrics_analytics/"
// render={(props) => {
// chrome.setBreadcrumbs([
// parentBreadcrumb,
// { text: 'Metrics analytics', href: '#/metrics_analytics/' },
// ]);
// return (
// <MetricsHome
// http={http}
// chrome={chrome}
// parentBreadcrumb={parentBreadcrumb}
// renderProps={props}
// pplService={pplService}
// savedObjects={savedObjects}
// />
// );
// }}
// />
// <Route
// path={'/application_analytics'}
// render={(props) => {
// return (
// <ApplicationAnalyticsHome
// {...props}
// chrome={chrome}
// http={http}
// notifications={notifications}
// parentBreadcrumbs={[parentBreadcrumb]}
// pplService={pplService}
// dslService={dslService}
// savedObjects={savedObjects}
// timestampUtils={timestampUtils}
// queryManager={queryManager}
// />
// );
// }}
// />
// <Route
// path="/notebooks"
// render={(props) => (
// <NotebooksHome
// {...props}
// DashboardContainerByValueRenderer={
// DepsStart.dashboard.DashboardContainerByValueRenderer
// }
// http={http}
// pplService={pplService}
// setBreadcrumbs={chrome.setBreadcrumbs}
// parentBreadcrumb={parentBreadcrumb}
// notifications={notifications}
// />
// )}
// />
// <Route
// path="/operational_panels"
// render={(props) => {
// chrome.setBreadcrumbs([parentBreadcrumb, customPanelBreadcrumb]);
// return (
// <CustomPanelsHome
// http={http}
// chrome={chrome}
// parentBreadcrumbs={[parentBreadcrumb, customPanelBreadcrumb]}
// pplService={pplService}
// dslService={dslService}
// renderProps={props}
// />
// );
// }}
// />
// <Route
// path={['/trace_analytics', '/trace_analytics/home']}
// render={(props) => (
// <TraceAnalyticsHome
// {...props}
// chrome={chrome}
// http={http}
// parentBreadcrumbs={[parentBreadcrumb]}
// />
// )}
// />
// <Route
// path={['/', '/event_analytics']}
// render={(props) => {
// return (
// <EventAnalytics
// chrome={chrome}
// parentBreadcrumbs={[parentBreadcrumb]}
// pplService={pplService}
// dslService={dslService}
// savedObjects={savedObjects}
// timestampUtils={timestampUtils}
// http={http}
// notifications={notifications}
// queryManager={queryManager}
// {...props}
// />
// );
// }}
// />
// </Switch>
// </MetricsListener>
// </I18nProvider>
// </HashRouter>
// </Provider>
// );
// };
Loading

0 comments on commit e2f40f3

Please sign in to comment.