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: (
-
- ),
- icon: ,
+ onClick: handleDialog,
+ color: 'secondary',
+ icon: ,
};
return (