github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 01:38:56 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Logs Explorer] Update breadcrumbs content for Log Explorer app (#172612)

Browse source 
Resolves #172283

## Summary

Fixes breadcrumbs and document title for Log Explorer app.

## Screenshot

<img width="970" alt="Screenshot 2023-12-05 at 17 29 53"
src="d80fc9de-fbad-4c84-a61d-8ff8c5ad7271">
This commit is contained in:
Thom Heymann 2023-12-07 15:57:13 +00:00 • committed by GitHub
parent 71ed936685
commit fd5256acf1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 73 additions and 31 deletions
Download patch file Download diff file Expand all files Collapse all files

7
packages/deeplinks/observability/index.ts
View file

@ -6,7 +6,12 @@
* Side Public License, v 1.
*/
export { OBSERVABILITY_ONBOARDING_APP_ID } from './constants';
export {
OBSERVABILITY_ONBOARDING_APP_ID,
LOGS_APP_ID,
OBSERVABILITY_LOG_EXPLORER,
OBSERVABILITY_OVERVIEW_APP_ID,
} from './constants';
export type { AppId, DeepLinkId } from './deep_links';

8
x-pack/plugins/observability_log_explorer/common/constants.ts
View file

@ -1,8 +0,0 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0; you may not use this file except in compliance with the Elastic License
* 2.0.
*/
export const OBSERVABILITY_LOG_EXPLORER_APP_ID = 'observability-log-explorer';

22
x-pack/plugins/observability_log_explorer/common/locators/locators.test.ts
View file

@ -11,7 +11,7 @@ import {
AllDatasetsLocatorParams,
SingleDatasetLocatorParams,
} from '@kbn/deeplinks-observability/locators';
import { OBSERVABILITY_LOG_EXPLORER_APP_ID } from '../constants';
import { OBSERVABILITY_LOG_EXPLORER } from '@kbn/deeplinks-observability';
import { AllDatasetsLocatorDefinition } from './all_datasets/all_datasets_locator';
import { SingleDatasetLocatorDefinition } from './single_dataset';
import { DatasetLocatorDependencies } from './types';
@ -38,7 +38,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await allDatasetsLocator.getLocation({});
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: '/?_a=(index:BQZwpgNmDGAuCWB7AdgFQJ4AcwC4CGEEAlEA)',
state: {},
});
@ -53,7 +53,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await allDatasetsLocator.getLocation(params);
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: '/?_g=(time:(from:now-30m,to:now))&_a=(index:BQZwpgNmDGAuCWB7AdgFQJ4AcwC4CGEEAlEA)',
state: {},
});
@ -70,7 +70,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await allDatasetsLocator.getLocation(params);
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: '/?_a=(index:BQZwpgNmDGAuCWB7AdgFQJ4AcwC4CGEEAlEA,query:(language:kuery,query:foo))',
state: {},
});
@ -88,7 +88,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await allDatasetsLocator.getLocation(params);
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: '/?_g=(refreshInterval:(pause:!f,value:666))&_a=(index:BQZwpgNmDGAuCWB7AdgFQJ4AcwC4CGEEAlEA)',
state: {},
});
@ -104,7 +104,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await allDatasetsLocator.getLocation(params);
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: `/?_a=(columns:!(_source),index:BQZwpgNmDGAuCWB7AdgFQJ4AcwC4CGEEAlEA,sort:!(!('timestamp,%20asc')))`,
state: {},
});
@ -184,7 +184,7 @@ describe('Observability Logs Explorer Locators', () => {
});
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: `/?_a=(index:BQZwpgNmDGAuCWB7AdgLmAEwIay%2BW6yWAtmKgOQSIDmIAtLGCLHQFRvkA0CsUqjzAJScipVABUmsYeChwkycQE8ADmQCuyAE5NEEAG5gMgoA)`,
state: {},
});
@ -201,7 +201,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await singleDatasetLocator.getLocation(params);
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: `/?_g=(time:(from:now-30m,to:now))&_a=(index:BQZwpgNmDGAuCWB7AdgLmAEwIay%2BW6yWAtmKgOQSIDmIAtLGCLHQFRvkA0CsUqjzAJScipVABUmsYeChwkycQE8ADmQCuyAE5NEEAG5gMgoA)`,
state: {},
});
@ -221,7 +221,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await singleDatasetLocator.getLocation(params);
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: `/?_a=(index:BQZwpgNmDGAuCWB7AdgLmAEwIay%2BW6yWAtmKgOQSIDmIAtLGCLHQFRvkA0CsUqjzAJScipVABUmsYeChwkycQE8ADmQCuyAE5NEEAG5gMgoA,query:(language:kuery,query:foo))`,
state: {},
});
@ -241,7 +241,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await singleDatasetLocator.getLocation(params);
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: `/?_g=(refreshInterval:(pause:!f,value:666))&_a=(index:BQZwpgNmDGAuCWB7AdgLmAEwIay%2BW6yWAtmKgOQSIDmIAtLGCLHQFRvkA0CsUqjzAJScipVABUmsYeChwkycQE8ADmQCuyAE5NEEAG5gMgoA)`,
state: {},
});
@ -259,7 +259,7 @@ describe('Observability Logs Explorer Locators', () => {
const location = await singleDatasetLocator.getLocation(params);
expect(location).toMatchObject({
app: OBSERVABILITY_LOG_EXPLORER_APP_ID,
app: OBSERVABILITY_LOG_EXPLORER,
path: `/?_a=(columns:!(_source),index:BQZwpgNmDGAuCWB7AdgLmAEwIay%2BW6yWAtmKgOQSIDmIAtLGCLHQFRvkA0CsUqjzAJScipVABUmsYeChwkycQE8ADmQCuyAE5NEEAG5gMgoA,sort:!(!('timestamp,%20asc')))`,
state: {},
});

11
x-pack/plugins/observability_log_explorer/common/translations.ts
View file

@ -11,6 +11,17 @@ export const logExplorerAppTitle = i18n.translate('xpack.observabilityLogExplore
defaultMessage: 'Log Explorer',
});
export const logsAppTitle = i18n.translate('xpack.observabilityLogExplorer.logsAppTitle', {
defaultMessage: 'Logs',
});
export const observabilityAppTitle = i18n.translate(
'xpack.observabilityLogExplorer.observabilityAppTitle',
{
defaultMessage: 'Observability',
}
);
export const betaBadgeTitle = i18n.translate('xpack.observabilityLogExplorer.betaBadgeTitle', {
defaultMessage: 'Beta',
});

4
x-pack/plugins/observability_log_explorer/public/plugin.ts
View file

@ -13,13 +13,13 @@ import {
Plugin,
PluginInitializerContext,
} from '@kbn/core/public';
import { OBSERVABILITY_LOG_EXPLORER } from '@kbn/deeplinks-observability';
import {
ObservabilityLogExplorerLocators,
SingleDatasetLocatorDefinition,
AllDatasetsLocatorDefinition,
} from '../common/locators';
import { type ObservabilityLogExplorerConfig } from '../common/plugin_config';
import { OBSERVABILITY_LOG_EXPLORER_APP_ID } from '../common/constants';
import { logExplorerAppTitle } from '../common/translations';
import { renderObservabilityLogExplorer } from './applications/observability_log_explorer';
import type {
@ -48,7 +48,7 @@ export class ObservabilityLogExplorerPlugin
const useHash = core.uiSettings.get('state:storeInSessionStorage');
core.application.register({
id: OBSERVABILITY_LOG_EXPLORER_APP_ID,
id: OBSERVABILITY_LOG_EXPLORER,
title: logExplorerAppTitle,
category: DEFAULT_APP_CATEGORIES.observability,
euiIconType: 'logoLogging',

52
x-pack/plugins/observability_log_explorer/public/utils/breadcrumbs.tsx
View file

@ -9,16 +9,50 @@ import { EuiBreadcrumb } from '@elastic/eui';
import type { ChromeStart } from '@kbn/core-chrome-browser';
import type { ServerlessPluginStart } from '@kbn/serverless/public';
import { useEffect } from 'react';
import { logExplorerAppTitle } from '../../common/translations';
import { useLinkProps } from '@kbn/observability-shared-plugin/public';
import {
LOGS_APP_ID,
OBSERVABILITY_LOG_EXPLORER,
OBSERVABILITY_OVERVIEW_APP_ID,
} from '@kbn/deeplinks-observability';
import {
logExplorerAppTitle,
logsAppTitle,
observabilityAppTitle,
} from '../../common/translations';
export const useBreadcrumbs = (
breadcrumbs: EuiBreadcrumb[],
chromeService: ChromeStart,
serverlessService?: ServerlessPluginStart
) => {
const observabilityLinkProps = useLinkProps({ app: OBSERVABILITY_OVERVIEW_APP_ID });
const logsLinkProps = useLinkProps({ app: LOGS_APP_ID });
const logExplorerLinkProps = useLinkProps({ app: OBSERVABILITY_LOG_EXPLORER });
useEffect(() => {
setBreadcrumbs(breadcrumbs, chromeService, serverlessService);
}, [breadcrumbs, chromeService, serverlessService]);
setBreadcrumbs(
serverlessService
? breadcrumbs
: [
{
text: observabilityAppTitle,
...observabilityLinkProps,
},
{
text: logsAppTitle,
...logsLinkProps,
},
{
text: logExplorerAppTitle,
...logExplorerLinkProps,
},
...breadcrumbs,
],
chromeService,
serverlessService
);
}, [breadcrumbs, chromeService, serverlessService]); // eslint-disable-line react-hooks/exhaustive-deps
};
export function setBreadcrumbs(
@ -26,16 +60,16 @@ export function setBreadcrumbs(
chromeService: ChromeStart,
serverlessService?: ServerlessPluginStart
) {
chromeService.docTitle.change(getDocTitle(breadcrumbs));
if (serverlessService) {
serverlessService.setBreadcrumbs(breadcrumbs);
} else if (chromeService) {
chromeService.setBreadcrumbs([
{
text: logExplorerAppTitle,
},
...breadcrumbs,
]);
chromeService.setBreadcrumbs(breadcrumbs);
}
}
export function getDocTitle(breadcrumbs: EuiBreadcrumb[]) {
return breadcrumbs.map(({ text }) => text as string).reverse();
}
export const noBreadcrumbs: EuiBreadcrumb[] = [];