combinedAlertBadge.tsx 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. import AlertBadge from 'sentry/components/badge/alertBadge';
  2. import {Tooltip} from 'sentry/components/tooltip';
  3. import {t, tct} from 'sentry/locale';
  4. import {getAggregateEnvStatus} from 'sentry/views/alerts/rules/crons/utils';
  5. import {UptimeMonitorStatus} from 'sentry/views/alerts/rules/uptime/types';
  6. import {
  7. type CombinedAlerts,
  8. CombinedAlertType,
  9. IncidentStatus,
  10. } from 'sentry/views/alerts/types';
  11. import {isIssueAlert} from 'sentry/views/alerts/utils';
  12. import {MonitorStatus} from 'sentry/views/monitors/types';
  13. interface Props {
  14. rule: CombinedAlerts;
  15. }
  16. const IncidentStatusText: Record<IncidentStatus, string> = {
  17. [IncidentStatus.CRITICAL]: t('Critical'),
  18. [IncidentStatus.WARNING]: t('Warning'),
  19. [IncidentStatus.CLOSED]: t('Resolved'),
  20. [IncidentStatus.OPENED]: t('Open'),
  21. };
  22. const UptimeStatusText: Record<
  23. UptimeMonitorStatus,
  24. {incidentStatus: IncidentStatus; statusText: string}
  25. > = {
  26. [UptimeMonitorStatus.OK]: {statusText: t('Up'), incidentStatus: IncidentStatus.CLOSED},
  27. [UptimeMonitorStatus.FAILED]: {
  28. statusText: t('Down'),
  29. incidentStatus: IncidentStatus.WARNING,
  30. },
  31. };
  32. const CronsStatusText: Record<
  33. MonitorStatus,
  34. {statusText: string; disabled?: boolean; incidentStatus?: IncidentStatus}
  35. > = {
  36. [MonitorStatus.ACTIVE]: {
  37. statusText: t('Active'),
  38. incidentStatus: IncidentStatus.CLOSED,
  39. },
  40. [MonitorStatus.OK]: {statusText: t('Ok'), incidentStatus: IncidentStatus.CLOSED},
  41. [MonitorStatus.ERROR]: {
  42. statusText: t('Failing'),
  43. incidentStatus: IncidentStatus.CRITICAL,
  44. },
  45. [MonitorStatus.DISABLED]: {
  46. statusText: t('Disabled'),
  47. disabled: true,
  48. },
  49. };
  50. /**
  51. * Takes in an alert rule (metric or issue) and renders the
  52. * appropriate tooltip and AlertBadge
  53. */
  54. export default function CombinedAlertBadge({rule}: Props) {
  55. if (rule.type === CombinedAlertType.UPTIME) {
  56. const {statusText, incidentStatus} = UptimeStatusText[rule.status];
  57. return (
  58. <Tooltip title={tct('Uptime Alert Status: [statusText]', {statusText})}>
  59. <AlertBadge status={incidentStatus} />
  60. </Tooltip>
  61. );
  62. }
  63. if (rule.type === CombinedAlertType.CRONS) {
  64. const envStatus = getAggregateEnvStatus(rule.environments);
  65. const {statusText, incidentStatus, disabled} = CronsStatusText[envStatus];
  66. return (
  67. <Tooltip title={tct('Cron Monitor Status: [statusText]', {statusText})}>
  68. <AlertBadge status={incidentStatus} isDisabled={disabled} />
  69. </Tooltip>
  70. );
  71. }
  72. return (
  73. <Tooltip
  74. title={
  75. isIssueAlert(rule)
  76. ? t('Issue Alert')
  77. : tct('Metric Alert Status: [status]', {
  78. status:
  79. IncidentStatusText[rule?.latestIncident?.status ?? IncidentStatus.CLOSED],
  80. })
  81. }
  82. >
  83. <AlertBadge status={rule?.latestIncident?.status} isIssue={isIssueAlert(rule)} />
  84. </Tooltip>
  85. );
  86. }