diff --git a/static/app/views/dashboards/metrics/widgetCard.tsx b/static/app/views/dashboards/metrics/widgetCard.tsx
index 94a416851d60e8..59fbd329f7527d 100644
--- a/static/app/views/dashboards/metrics/widgetCard.tsx
+++ b/static/app/views/dashboards/metrics/widgetCard.tsx
@@ -32,7 +32,11 @@ import {
} from 'sentry/views/dashboards/metrics/utils';
import type {DashboardFilters, Widget} from 'sentry/views/dashboards/types';
import {DisplayType} from 'sentry/views/dashboards/types';
-import {WidgetCardPanel, WidgetTitleRow} from 'sentry/views/dashboards/widgetCard';
+import {
+ WidgetCardContextMenuContainer,
+ WidgetCardPanel,
+ WidgetTitleRow,
+} from 'sentry/views/dashboards/widgetCard';
import {DashboardsMEPContext} from 'sentry/views/dashboards/widgetCard/dashboardsMEPContext';
import {Toolbar} from 'sentry/views/dashboards/widgetCard/toolbar';
import WidgetCardContextMenu from 'sentry/views/dashboards/widgetCard/widgetCardContextMenu';
@@ -196,26 +200,28 @@ export function MetricWidgetCard({
{showContextMenu && !isEditingDashboard && (
- {
- router.push({
- pathname: `${location.pathname}${
- location.pathname.endsWith('/') ? '' : '/'
- }widget/${widget.id}/`,
- query: location.query,
- });
- }}
- router={router}
- location={location}
- onDelete={onDelete}
- onDuplicate={onDuplicate}
- />
+
+ {
+ router.push({
+ pathname: `${location.pathname}${
+ location.pathname.endsWith('/') ? '' : '/'
+ }widget/${widget.id}/`,
+ query: location.query,
+ });
+ }}
+ router={router}
+ location={location}
+ onDelete={onDelete}
+ onDuplicate={onDuplicate}
+ />
+
)}
diff --git a/static/app/views/dashboards/widgetCard/index.tsx b/static/app/views/dashboards/widgetCard/index.tsx
index 8d085308813118..4451addfaf23b5 100644
--- a/static/app/views/dashboards/widgetCard/index.tsx
+++ b/static/app/views/dashboards/widgetCard/index.tsx
@@ -170,7 +170,7 @@ class WidgetCard extends Component {
}
return (
-
+
{
description={widget.description}
title={widget.title}
/>
-
+
);
}
@@ -493,7 +493,7 @@ const ErrorCard = styled(Placeholder)`
margin-bottom: ${space(2)};
`;
-const StyledWidgetCardContextMenuContainer = styled('div')`
+export const WidgetCardContextMenuContainer = styled('div')`
opacity: 1;
transition: opacity 0.1s;
`;
@@ -512,7 +512,7 @@ export const WidgetCardPanel = styled(Panel, {
flex-direction: column;
&:not(:hover):not(:focus-within) {
- ${StyledWidgetCardContextMenuContainer} {
+ ${WidgetCardContextMenuContainer} {
opacity: 0;
clip: rect(0 0 0 0);
clip-path: inset(50%);