From 1a074cfe5e00da81c916282cca7371ff034cac67 Mon Sep 17 00:00:00 2001
From: Juan Lulkin <jmaiz@spotify.com>
Date: Thu, 25 Feb 2021 13:37:02 +0100
Subject: [PATCH] Makes SplunkOnCallCard comply with new IconLinkVertical APIs

---
 .../HeaderIconLinkRow/IconLinkVertical.tsx      |  3 +++
 .../src/components/SplunkOnCallCard.test.tsx    |  3 ++-
 .../src/components/SplunkOnCallCard.tsx         | 17 +++++------------
 3 files changed, 10 insertions(+), 13 deletions(-)

diff --git a/packages/core/src/components/HeaderIconLinkRow/IconLinkVertical.tsx b/packages/core/src/components/HeaderIconLinkRow/IconLinkVertical.tsx
index c3c817362a..b3e665820a 100644
--- a/packages/core/src/components/HeaderIconLinkRow/IconLinkVertical.tsx
+++ b/packages/core/src/components/HeaderIconLinkRow/IconLinkVertical.tsx
@@ -35,6 +35,9 @@ const useIconStyles = makeStyles(theme => ({
     justifyItems: 'center',
     gridGap: 4,
     textAlign: 'center',
+    '&:active': {
+      cursor: 'grabbing',
+    },
   },
   disabled: {
     color: 'gray',
diff --git a/plugins/splunk-on-call/src/components/SplunkOnCallCard.test.tsx b/plugins/splunk-on-call/src/components/SplunkOnCallCard.test.tsx
index b1280ab21c..8a32dc58b2 100644
--- a/plugins/splunk-on-call/src/components/SplunkOnCallCard.test.tsx
+++ b/plugins/splunk-on-call/src/components/SplunkOnCallCard.test.tsx
@@ -132,6 +132,7 @@ describe('SplunkOnCallCard', () => {
       ),
     ).toBeInTheDocument();
   });
+
   it('opens the dialog when trigger button is clicked', async () => {
     mockSplunkOnCallApi.getUsers = jest
       .fn()
@@ -146,7 +147,7 @@ describe('SplunkOnCallCard', () => {
     );
     await waitFor(() => !queryByTestId('progress'));
     expect(getByText('Create Incident')).toBeInTheDocument();
-    const triggerButton = getByTestId('trigger-button');
+    const triggerButton = getByText('Create Incident');
     await act(async () => {
       fireEvent.click(triggerButton);
     });
diff --git a/plugins/splunk-on-call/src/components/SplunkOnCallCard.tsx b/plugins/splunk-on-call/src/components/SplunkOnCallCard.tsx
index 84d94d60d3..ae6b0420b0 100644
--- a/plugins/splunk-on-call/src/components/SplunkOnCallCard.tsx
+++ b/plugins/splunk-on-call/src/components/SplunkOnCallCard.tsx
@@ -21,6 +21,7 @@ import {
   MissingAnnotationEmptyState,
   configApiRef,
   EmptyState,
+  IconLinkVerticalProps,
 } from '@backstage/core';
 import { Entity } from '@backstage/catalog-model';
 import {
@@ -159,19 +160,11 @@ export const SplunkOnCallCard = ({ entity }: Props) => {
     );
   };
 
-  const triggerLink = {
+  const triggerLink: IconLinkVerticalProps = {
     label: 'Create Incident',
-    action: (
-      <Button
-        data-testid="trigger-button"
-        color="secondary"
-        onClick={handleDialog}
-        className={classes.triggerAlarm}
-      >
-        Create Incident
-      </Button>
-    ),
-    icon: <AlarmAddIcon onClick={handleDialog} />,
+    onClick: handleDialog,
+    color: 'secondary',
+    icon: <AlarmAddIcon />,
   };
 
   return (