[Logs+] Replace infra public usages of link-to routes (#158362)

part of #157985

## 📝  Summary

After implementing [infra
locators](https://github.com/elastic/kibana/pull/155156) to allow
navigation to the logs UI we need to replace all usages of the old
link-to routes so that we have strongly typed navigation to the logs UI.

This PR focuses on replacing `link-to` usages in the Infra Public
plugin.

##   Testing

A) 
1. Navigate to Observability -> Infrastructure -> Inventory
2. Choose any of the Host from the waffle
3. Click logs tab
4. Click open in logs link

B) 
1. Navigate to Observability -> Infrastructure -> Inventory
2. Switch to table view
3. Click any of the Host from the table
4. Click Host Logs


6646c496-1760-4788-9532-b318487070d1
This commit is contained in:
mohamedhamed-ahmed 2023-05-30 14:08:40 +01:00 committed by GitHub
parent f89537909c
commit c06b5efe17
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 39 additions and 61 deletions

View file

@ -7,13 +7,12 @@
import { LocatorDefinition, LocatorPublic } from '@kbn/share-plugin/public';
import type { LogsLocatorDependencies, LogsLocatorParams } from './logs_locator';
const DISCOVER_LOGS_LOCATOR_ID = 'DISCOVER_LOGS_LOCATOR';
import { LOGS_LOCATOR_ID } from './logs_locator';
export type DiscoverLogsLocator = LocatorPublic<LogsLocatorParams>;
export class DiscoverLogsLocatorDefinition implements LocatorDefinition<LogsLocatorParams> {
public readonly id = DISCOVER_LOGS_LOCATOR_ID;
public readonly id = LOGS_LOCATOR_ID;
constructor(protected readonly deps: LogsLocatorDependencies) {}

View file

@ -7,13 +7,12 @@
import { LocatorDefinition, LocatorPublic } from '@kbn/share-plugin/public';
import type { NodeLogsLocatorDependencies, NodeLogsLocatorParams } from './node_logs_locator';
const DISCOVER_NODE_LOGS_LOCATOR_ID = 'DISCOVER_NODE_LOGS_LOCATOR';
import { NODE_LOGS_LOCATOR_ID } from './node_logs_locator';
export type DiscoverNodeLogsLocator = LocatorPublic<NodeLogsLocatorParams>;
export class DiscoverNodeLogsLocatorDefinition implements LocatorDefinition<NodeLogsLocatorParams> {
public readonly id = DISCOVER_NODE_LOGS_LOCATOR_ID;
public readonly id = NODE_LOGS_LOCATOR_ID;
constructor(protected readonly deps: NodeLogsLocatorDependencies) {}

View file

@ -11,7 +11,7 @@ import type { LogViewReference } from '../../common/log_views';
import type { TimeRange } from '../../common/time';
import type { InfraClientCoreSetup } from '../types';
const LOGS_LOCATOR_ID = 'LOGS_LOCATOR';
export const LOGS_LOCATOR_ID = 'LOGS_LOCATOR';
export interface LogsLocatorParams extends SerializableRecord {
/** Defines log position */

View file

@ -9,7 +9,7 @@ import { LocatorDefinition, LocatorPublic } from '@kbn/share-plugin/public';
import type { InventoryItemType } from '../../common/inventory_models/types';
import type { LogsLocatorDependencies, LogsLocatorParams } from './logs_locator';
const NODE_LOGS_LOCATOR_ID = 'NODE_LOGS_LOCATOR';
export const NODE_LOGS_LOCATOR_ID = 'NODE_LOGS_LOCATOR';
export interface NodeLogsLocatorParams extends LogsLocatorParams {
nodeId: string;

View file

@ -7,5 +7,5 @@
export { LinkToLogsPage } from './link_to_logs';
export { LinkToMetricsPage } from './link_to_metrics';
export { getNodeLogsUrl, RedirectToNodeLogs } from './redirect_to_node_logs';
export { RedirectToNodeLogs } from './redirect_to_node_logs';
export { getNodeDetailUrl, RedirectToNodeDetail } from './redirect_to_node_detail';

View file

@ -5,7 +5,6 @@
* 2.0.
*/
import { LinkDescriptor } from '@kbn/observability-shared-plugin/public';
import { useEffect } from 'react';
import { RouteComponentProps } from 'react-router-dom';
import { InventoryItemType } from '../../../common/inventory_models/types';
@ -47,23 +46,3 @@ export const RedirectToNodeLogs = ({
return null;
};
export const getNodeLogsUrl = ({
nodeId,
nodeType,
time,
}: {
nodeId: string;
nodeType: InventoryItemType;
time?: number;
}): LinkDescriptor => {
return {
app: 'logs',
pathname: `link-to/${nodeType}-logs/${nodeId}`,
search: time
? {
time: `${time}`,
}
: undefined,
};
};

View file

@ -13,14 +13,16 @@ import { EuiFieldSearch } from '@elastic/eui';
import { EuiFlexGroup } from '@elastic/eui';
import { EuiFlexItem } from '@elastic/eui';
import { EuiButtonEmpty } from '@elastic/eui';
import { useLinkProps } from '@kbn/observability-shared-plugin/public';
import { RedirectAppLinks } from '@kbn/shared-ux-link-redirect-app';
import { useKibanaContextForPlugin } from '../../../../../../hooks/use_kibana';
import { TabContent, TabProps } from './shared';
import { LogStream } from '../../../../../../components/log_stream';
import { useWaffleOptionsContext } from '../../../hooks/use_waffle_options';
import { findInventoryFields } from '../../../../../../../common/inventory_models';
import { getNodeLogsUrl } from '../../../../../link_to';
const TabComponent = (props: TabProps) => {
const { services } = useKibanaContextForPlugin();
const { locators } = services;
const [textQuery, setTextQuery] = useState('');
const [textQueryDebounced, setTextQueryDebounced] = useState('');
const endTimestamp = props.currentTime;
@ -46,13 +48,14 @@ const TabComponent = (props: TabProps) => {
setTextQuery(e.target.value);
}, []);
const nodeLogsMenuItemLinkProps = useLinkProps(
getNodeLogsUrl({
const logsUrl = useMemo(() => {
return locators.nodeLogsLocator.getRedirectUrl({
nodeType,
nodeId: node.id,
time: startTimestamp,
})
);
filter: textQueryDebounced,
});
}, [locators.nodeLogsLocator, node.id, nodeType, startTimestamp, textQueryDebounced]);
return (
<TabContent>
@ -70,18 +73,20 @@ const TabComponent = (props: TabProps) => {
/>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiButtonEmpty
data-test-subj="infraTabComponentOpenInLogsButton"
size={'xs'}
flush={'both'}
iconType={'popout'}
{...nodeLogsMenuItemLinkProps}
>
<FormattedMessage
id="xpack.infra.nodeDetails.logs.openLogsLink"
defaultMessage="Open in Logs"
/>
</EuiButtonEmpty>
<RedirectAppLinks coreStart={services}>
<EuiButtonEmpty
data-test-subj="infraTabComponentOpenInLogsButton"
size={'xs'}
flush={'both'}
iconType={'popout'}
href={logsUrl}
>
<FormattedMessage
id="xpack.infra.nodeDetails.logs.openLogsLink"
defaultMessage="Open in Logs"
/>
</EuiButtonEmpty>
</RedirectAppLinks>
</EuiFlexItem>
</EuiFlexGroup>
<LogStream

View file

@ -10,7 +10,6 @@ import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';
import React, { useMemo, useState } from 'react';
import { useKibana } from '@kbn/kibana-react-plugin/public';
import { withTheme, EuiTheme } from '@kbn/kibana-react-plugin/common';
import {
Section,
@ -22,13 +21,13 @@ import {
ActionMenuDivider,
useLinkProps,
} from '@kbn/observability-shared-plugin/public';
import { useKibanaContextForPlugin } from '../../../../../hooks/use_kibana';
import { AlertFlyout } from '../../../../../alerting/inventory/components/alert_flyout';
import { InfraWaffleMapNode, InfraWaffleMapOptions } from '../../../../../lib/lib';
import { getNodeDetailUrl, getNodeLogsUrl } from '../../../../link_to';
import { getNodeDetailUrl } from '../../../../link_to';
import { findInventoryModel, findInventoryFields } from '../../../../../../common/inventory_models';
import { InventoryItemType } from '../../../../../../common/inventory_models/types';
import { navigateToUptime } from '../../lib/navigate_to_uptime';
import { InfraClientCoreStart, InfraClientStartDeps } from '../../../../../types';
interface Props {
options: InfraWaffleMapOptions;
@ -42,8 +41,8 @@ export const NodeContextMenu: React.FC<Props & { theme?: EuiTheme }> = withTheme
const [flyoutVisible, setFlyoutVisible] = useState(false);
const inventoryModel = findInventoryModel(nodeType);
const nodeDetailFrom = currentTime - inventoryModel.metrics.defaultTimeRangeInSeconds * 1000;
const { application, share } = useKibana<InfraClientCoreStart & InfraClientStartDeps>()
.services;
const { services } = useKibanaContextForPlugin();
const { application, share, locators } = services;
const uiCapabilities = application?.capabilities;
// Due to the changing nature of the fields between APM and this UI,
// We need to have some exceptions until 7.0 & ECS is finalized. Reference
@ -76,13 +75,6 @@ export const NodeContextMenu: React.FC<Props & { theme?: EuiTheme }> = withTheme
return { label: '', value: '' };
}, [nodeType, node.ip, node.id]);
const nodeLogsMenuItemLinkProps = useLinkProps(
getNodeLogsUrl({
nodeType,
nodeId: node.id,
time: currentTime,
})
);
const nodeDetailMenuItemLinkProps = useLinkProps({
...getNodeDetailUrl({
nodeType,
@ -104,7 +96,11 @@ export const NodeContextMenu: React.FC<Props & { theme?: EuiTheme }> = withTheme
defaultMessage: '{inventoryName} logs',
values: { inventoryName: inventoryModel.singularDisplayName },
}),
...nodeLogsMenuItemLinkProps,
href: locators.nodeLogsLocator.getRedirectUrl({
nodeType,
nodeId: node.id,
time: currentTime,
}),
'data-test-subj': 'viewLogsContextMenuItem',
isDisabled: !showLogsLink,
};