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

part of #157985 ## 📝 Summary After implementing [infra locators](#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 https://github.com/elastic/kibana/assets/11225826/6646c496-1760-4788-9532-b318487070d1
elastic · May 30, 2023 · c06b5ef · c06b5ef
1 parent f895379
commit c06b5ef
Show file tree

Hide file tree

Showing 8 changed files with 39 additions and 61 deletions.
diff --git a/x-pack/plugins/infra/public/locators/discover_logs_locator.ts b/x-pack/plugins/infra/public/locators/discover_logs_locator.ts
@@ -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) {}
 

diff --git a/x-pack/plugins/infra/public/locators/discover_node_logs_locator.ts b/x-pack/plugins/infra/public/locators/discover_node_logs_locator.ts
@@ -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) {}
 

diff --git a/x-pack/plugins/infra/public/locators/logs_locator.ts b/x-pack/plugins/infra/public/locators/logs_locator.ts
@@ -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 */

diff --git a/x-pack/plugins/infra/public/locators/node_logs_locator.ts b/x-pack/plugins/infra/public/locators/node_logs_locator.ts
@@ -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;

diff --git a/x-pack/plugins/infra/public/pages/link_to/index.ts b/x-pack/plugins/infra/public/pages/link_to/index.ts
@@ -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';
diff --git a/x-pack/plugins/infra/public/pages/link_to/redirect_to_node_logs.tsx b/x-pack/plugins/infra/public/pages/link_to/redirect_to_node_logs.tsx
@@ -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,
-  };
-};
diff --git a/...k/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/logs.tsx b/...k/plugins/infra/public/pages/metrics/inventory_view/components/node_details/tabs/logs.tsx
@@ -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

diff --git a/...plugins/infra/public/pages/metrics/inventory_view/components/waffle/node_context_menu.tsx b/...plugins/infra/public/pages/metrics/inventory_view/components/waffle/node_context_menu.tsx
@@ -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,
     };