From 2aa9157132552ee369632c01c603bf4f3cf5b619 Mon Sep 17 00:00:00 2001
From: Jason Rhodes <jason.matthew.rhodes@gmail.com>
Date: Mon, 29 Oct 2018 23:07:07 -0400
Subject: [PATCH] [APM] Removes action menus (#24748)

* Removes infra links and replaces context menu with single discover links for now

* Changes discover links to use empty button style
---
 .../Transaction/ActionMenu.tsx                | 28 +++++++++++++------
 .../Waterfall/TransactionFlyout/index.tsx     |  9 ++++--
 .../TransactionDetails/Transaction/index.tsx  |  9 ++++--
 .../components/shared/DiscoverButton.js       |  6 ++--
 4 files changed, 36 insertions(+), 16 deletions(-)

diff --git a/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/ActionMenu.tsx b/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/ActionMenu.tsx
index 29da7e2b9ac2a..64c5f2cf7f29f 100644
--- a/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/ActionMenu.tsx
+++ b/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/ActionMenu.tsx
@@ -64,6 +64,23 @@ interface ActionMenuState {
   readonly isOpen: boolean;
 }
 
+export const DiscoverTransactionLink: React.SFC<ActionMenuProps> = ({
+  transaction,
+  children
+}) => {
+  return (
+    <KibanaLink
+      pathname="/app/kibana"
+      hash="/discover"
+      query={getDiscoverQuery(
+        transaction.transaction.id,
+        transaction.version === 'v2' ? transaction.trace.id : undefined
+      )}
+      children={children}
+    />
+  );
+};
+
 export class ActionMenu extends React.Component<
   ActionMenuProps,
   ActionMenuState
@@ -114,16 +131,9 @@ export class ActionMenu extends React.Component<
 
     const items = [
       <EuiContextMenuItem icon="discoverApp" key="discover-transaction">
-        <KibanaLink
-          pathname="/app/kibana"
-          hash="/discover"
-          query={getDiscoverQuery(
-            transaction.transaction.id,
-            transaction.version === 'v2' ? transaction.trace.id : undefined
-          )}
-        >
+        <DiscoverTransactionLink transaction={transaction}>
           View sample document
-        </KibanaLink>
+        </DiscoverTransactionLink>
       </EuiContextMenuItem>,
       ...this.getInfraActions(transaction)
     ];
diff --git a/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/WaterfallContainer/Waterfall/TransactionFlyout/index.tsx b/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/WaterfallContainer/Waterfall/TransactionFlyout/index.tsx
index 4460404066fba..350962e0c345a 100644
--- a/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/WaterfallContainer/Waterfall/TransactionFlyout/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/WaterfallContainer/Waterfall/TransactionFlyout/index.tsx
@@ -5,6 +5,7 @@
  */
 
 import {
+  EuiButtonEmpty,
   EuiFlexGroup,
   EuiFlexItem,
   EuiFlyout,
@@ -17,7 +18,7 @@ import {
 import React from 'react';
 import { IUrlParams } from 'x-pack/plugins/apm/public/store/urlParams';
 import { Transaction } from 'x-pack/plugins/apm/typings/Transaction';
-import { ActionMenu } from '../../../ActionMenu';
+import { DiscoverTransactionLink } from '../../../ActionMenu';
 import { StickyTransactionProperties } from '../../../StickyTransactionProperties';
 import { TransactionPropertiesTableForFlyout } from '../../../TransactionPropertiesTableForFlyout';
 import { FlyoutTopLevelProperties } from '../FlyoutTopLevelProperties';
@@ -54,7 +55,11 @@ export function TransactionFlyout({
             </EuiFlexItem>
 
             <EuiFlexItem grow={false}>
-              <ActionMenu transaction={transactionDoc} />
+              <DiscoverTransactionLink transaction={transactionDoc}>
+                <EuiButtonEmpty iconType="discoverApp">
+                  View transaction in Discover
+                </EuiButtonEmpty>
+              </DiscoverTransactionLink>
             </EuiFlexItem>
           </EuiFlexGroup>
         </EuiFlyoutHeader>
diff --git a/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/index.tsx b/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/index.tsx
index 76c8eada51a0d..94ad794ed88f0 100644
--- a/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/index.tsx
+++ b/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/index.tsx
@@ -6,6 +6,7 @@
 
 import {
   EuiButton,
+  EuiButtonEmpty,
   EuiFlexGroup,
   EuiFlexItem,
   EuiPanel,
@@ -19,7 +20,7 @@ import { Transaction as ITransaction } from '../../../../../typings/Transaction'
 import { IUrlParams } from '../../../../store/urlParams';
 import EmptyMessage from '../../../shared/EmptyMessage';
 import { TransactionLink } from '../../../shared/TransactionLink';
-import { ActionMenu } from './ActionMenu';
+import { DiscoverTransactionLink } from './ActionMenu';
 import { StickyTransactionProperties } from './StickyTransactionProperties';
 // @ts-ignore
 import { TransactionPropertiesTable } from './TransactionPropertiesTable';
@@ -89,7 +90,11 @@ export const Transaction: React.SFC<Props> = ({
         <EuiFlexItem>
           <EuiFlexGroup justifyContent="flexEnd">
             <EuiFlexItem grow={false}>
-              <ActionMenu transaction={transaction} />
+              <DiscoverTransactionLink transaction={transaction}>
+                <EuiButtonEmpty iconType="discoverApp">
+                  View transaction in Discover
+                </EuiButtonEmpty>
+              </DiscoverTransactionLink>
             </EuiFlexItem>
             <MaybeViewTraceLink transaction={transaction} root={root} />
           </EuiFlexGroup>
diff --git a/x-pack/plugins/apm/public/components/shared/DiscoverButton.js b/x-pack/plugins/apm/public/components/shared/DiscoverButton.js
index 153a1a0282eba..5d8e4f209e281 100644
--- a/x-pack/plugins/apm/public/components/shared/DiscoverButton.js
+++ b/x-pack/plugins/apm/public/components/shared/DiscoverButton.js
@@ -6,7 +6,7 @@
 
 import React from 'react';
 import { KibanaLink } from '../../utils/url';
-import { EuiButton } from '@elastic/eui';
+import { EuiButtonEmpty } from '@elastic/eui';
 
 function DiscoverButton({ query, children, ...rest }) {
   return (
@@ -16,9 +16,9 @@ function DiscoverButton({ query, children, ...rest }) {
       query={query}
       {...rest}
     >
-      <EuiButton iconType="discoverApp">
+      <EuiButtonEmpty iconType="discoverApp">
         {children || 'View in Discover'}
-      </EuiButton>
+      </EuiButtonEmpty>
     </KibanaLink>
   );
 }