[Cloud Posture] Agent link now has underline (#141118)

elastic · Sep 20, 2022 · 53e1c8d · 53e1c8d
1 parent a9cf105
commit 53e1c8d
Showing 1 changed file with 32 additions and 37 deletions.
diff --git a/x-pack/plugins/cloud_security_posture/public/pages/benchmarks/benchmarks_table.tsx b/x-pack/plugins/cloud_security_posture/public/pages/benchmarks/benchmarks_table.tsx
@@ -11,9 +11,10 @@ import {
   type EuiBasicTableProps,
   type Pagination,
   type CriteriaWithPagination,
+  EuiLink,
 } from '@elastic/eui';
 import React from 'react';
-import { Link, useHistory, generatePath } from 'react-router-dom';
+import { generatePath } from 'react-router-dom';
 import { pagePathGetters } from '@kbn/fleet-plugin/public';
 import { i18n } from '@kbn/i18n';
 import { TimestampTableCell } from '../../components/timestamp_table_cell';
@@ -31,20 +32,34 @@ interface BenchmarksTableProps
 }
 
 const AgentPolicyButtonLink = ({ name, id: policyId }: { name: string; id: string }) => {
-  const { http, application } = useKibana().services;
+  const { http } = useKibana().services;
   const [fleetBase, path] = pagePathGetters.policy_details({ policyId });
+
+  return <EuiLink href={http.basePath.prepend([fleetBase, path].join(''))}>{name}</EuiLink>;
+};
+
+const IntegrationButtonLink = ({
+  packageName,
+  policyId,
+  packagePolicyId,
+}: {
+  packageName: string;
+  packagePolicyId: string;
+  policyId: string;
+}) => {
+  const { application } = useKibana().services;
+
   return (
-    <a
-      href={http.basePath.prepend([fleetBase, path].join(''))}
-      title={name}
-      onClick={(e) => {
-        e.stopPropagation();
-        e.preventDefault();
-        application.navigateToApp('fleet', { path });
-      }}
+    <EuiLink
+      href={application.getUrlForApp('security', {
+        path: generatePath(cloudPosturePages.rules.path, {
+          packagePolicyId,
+          policyId,
+        }),
+      })}
     >
-      {name}
-    </a>
+      {packageName}
+    </EuiLink>
   );
 };
 
@@ -55,18 +70,11 @@ const BENCHMARKS_TABLE_COLUMNS: Array<EuiBasicTableColumn<Benchmark>> = [
       defaultMessage: 'Integration',
     }),
     render: (packageName, benchmark) => (
-      <Link
-        to={generatePath(cloudPosturePages.rules.path, {
-          packagePolicyId: benchmark.package_policy.id,
-          policyId: benchmark.package_policy.policy_id,
-        })}
-        title={packageName}
-        onClick={(e) => {
-          e.stopPropagation();
-        }}
-      >
-        {packageName}
-      </Link>
+      <IntegrationButtonLink
+        packageName={packageName}
+        packagePolicyId={benchmark.package_policy.id}
+        policyId={benchmark.package_policy.policy_id}
+      />
     ),
     truncateText: true,
     sortable: true,
@@ -146,18 +154,6 @@ export const BenchmarksTable = ({
   sorting,
   ...rest
 }: BenchmarksTableProps) => {
-  const history = useHistory();
-
-  const getRowProps: EuiBasicTableProps<Benchmark>['rowProps'] = (benchmark) => ({
-    onClick: () =>
-      history.push(
-        generatePath(cloudPosturePages.rules.path, {
-          packagePolicyId: benchmark.package_policy.id,
-          policyId: benchmark.package_policy.policy_id,
-        })
-      ),
-  });
-
   const pagination: Pagination = {
     pageIndex: Math.max(pageIndex - 1, 0),
     pageSize,
@@ -173,7 +169,6 @@ export const BenchmarksTable = ({
       data-test-subj={rest['data-test-subj']}
       items={benchmarks}
       columns={BENCHMARKS_TABLE_COLUMNS}
-      rowProps={getRowProps}
       itemId={(item) => [item.agent_policy.id, item.package_policy.id].join('/')}
       pagination={pagination}
       onChange={onChange}