Browse Source

ref(metrics): Make red banner dismissible for 2 weeks (#74064)

Priscila Oliveira 8 months ago
parent
commit
c3e3ece36a
1 changed files with 28 additions and 2 deletions
  1. 28 2
      static/app/views/metrics/metricsIngestionStopAlert.tsx

+ 28 - 2
static/app/views/metrics/metricsIngestionStopAlert.tsx

@@ -1,10 +1,36 @@
 import Alert from 'sentry/components/alert';
+import {Button} from 'sentry/components/button';
 import ExternalLink from 'sentry/components/links/externalLink';
-import {tct} from 'sentry/locale';
+import {IconClose} from 'sentry/icons/iconClose';
+import {t, tct} from 'sentry/locale';
+import useDismissAlert from 'sentry/utils/useDismissAlert';
+
+const LOCAL_STORAGE_KEY = 'custom-metrics-stop-being-ingested-alert-dismissed';
 
 export function MetricsStopIngestionAlert() {
+  const {dismiss, isDismissed} = useDismissAlert({
+    key: LOCAL_STORAGE_KEY,
+    expirationDays: 14, // 2 weeks
+  });
+
+  if (isDismissed) {
+    return null;
+  }
+
   return (
-    <Alert type="error" showIcon>
+    <Alert
+      type="error"
+      showIcon
+      trailingItems={
+        <Button
+          aria-label={t('Dismiss banner')}
+          icon={<IconClose />}
+          onClick={dismiss}
+          size="zero"
+          borderless
+        />
+      }
+    >
       {
         // the exact date will be provided later
         tct(