feat(issues): Add archived issue tag (#49044)

static/app/components/actions/archive.tsx

@@ -7,7 +7,7 @@ import {openConfirmModal} from 'sentry/components/confirm';
 import {DropdownMenu} from 'sentry/components/dropdownMenu';
 import {IconChevron} from 'sentry/icons';
 import {t} from 'sentry/locale';
-import {GroupStatusResolution, GroupSubstatus, ResolutionStatus} from 'sentry/types';
+import {GroupStatusResolution, ResolutionStatus} from 'sentry/types';
 
 interface ArchiveActionProps {
   onUpdate: (params: GroupStatusResolution) => void;
@@ -24,7 +24,7 @@ interface ArchiveActionProps {
 const ARCHIVE_UNTIL_ESCALATING: GroupStatusResolution = {
   status: ResolutionStatus.IGNORED,
   statusDetails: {},
-  substatus: GroupSubstatus.UNTIL_ESCALATING,
+  substatus: 'until_escalating',
 };
 const ARCHIVE_FOREVER: GroupStatusResolution = {
   status: ResolutionStatus.IGNORED,

static/app/components/eventOrGroupExtraDetails.tsx

@@ -44,15 +44,27 @@ function EventOrGroupExtraDetails({
     lifetime,
     isUnhandled,
     inbox,
+    status,
+    substatus,
   } = data as Group;
 
   const issuesPath = `/organizations/${organization.slug}/issues/`;
 
   const showReplayCount = organization.features.includes('session-replay');
+  const hasEscalatingIssues = organization.features.includes('escalating-issues-ui');
 
   return (
     <GroupExtra>
       {inbox && <InboxReason inbox={inbox} showDateAdded={showInboxTime} />}
+      {hasEscalatingIssues && status === 'ignored' && (
+        <InboxReason
+          inbox={{
+            reason: 'archived',
+            reason_details: {substatus},
+          }}
+          showDateAdded={false}
+        />
+      )}
       {shortId && (
         <InboxShortId
           shortId={shortId}

static/app/components/eventOrGroupHeader.tsx

@@ -72,11 +72,13 @@ function EventOrGroupHeader({
             <GroupLevel level={level} />
           </Tooltip>
         )}
-        {!hideIcons && status === 'ignored' && (
-          <IconWrapper>
-            <IconMute color="red400" />
-          </IconWrapper>
-        )}
+        {!hideIcons &&
+          status === 'ignored' &&
+          !organization.features.includes('escalating-issues-ui') && (
+            <IconWrapper>
+              <IconMute color="red400" />
+            </IconWrapper>
+          )}
         {!hideIcons && isBookmarked && (
           <IconWrapper>
             <IconStar isSolid color="yellow400" />

static/app/components/group/inboxBadges/inboxReason.spec.jsx → static/app/components/group/inboxBadges/inboxReason.spec.tsx

@@ -1,16 +1,14 @@
 import {render, screen, userEvent} from 'sentry-test/reactTestingLibrary';
 
 import InboxReason from 'sentry/components/group/inboxBadges/inboxReason';
+import {GroupInboxReason, GroupSubstatus} from 'sentry/types';
 
 describe('InboxReason', () => {
-  let inbox;
-  beforeEach(() => {
-    inbox = {
-      reason: 0,
-      date_added: new Date(),
-      reason_details: null,
-    };
-  });
+  const inbox = {
+    reason: GroupInboxReason.NEW,
+    date_added: new Date().toISOString(),
+    reason_details: {},
+  };
 
   it('displays new issue inbox reason', () => {
     render(<InboxReason inbox={inbox} />);
@@ -23,6 +21,21 @@ describe('InboxReason', () => {
     expect(screen.getByText(/\d+(s|ms|m)/i)).toBeInTheDocument();
   });
 
+  it('displays archived until escalating', async () => {
+    render(
+      <InboxReason
+        inbox={{
+          reason: 'archived',
+          reason_details: {substatus: GroupSubstatus.ARCHIVED_UNTIL_ESCALATING},
+          date_added: inbox.date_added,
+        }}
+      />
+    );
+    expect(screen.getByText('Archived')).toBeInTheDocument();
+    await userEvent.hover(screen.getByText('Archived'));
+    expect(await screen.findByText('Archived until escalating')).toBeInTheDocument();
+  });
+
   it('has a tooltip', async () => {
     render(<InboxReason inbox={inbox} />);
     const tag = screen.getByText('New Issue');

static/app/components/group/inboxBadges/inboxReason.tsx

@@ -6,13 +6,20 @@ import DateTime from 'sentry/components/dateTime';
 import Tag from 'sentry/components/tag';
 import TimeSince from 'sentry/components/timeSince';
 import {t, tct} from 'sentry/locale';
-import {GroupInboxReason, InboxDetails} from 'sentry/types';
+import {Group, GroupInboxReason, GroupSubstatus, InboxDetails} from 'sentry/types';
 import {getDuration} from 'sentry/utils/formatters';
 import getDynamicText from 'sentry/utils/getDynamicText';
 import useOrganization from 'sentry/utils/useOrganization';
 
+/**
+ * Since archived issues are not actually in the inbox, we're faking the inbox reason
+ */
+type ArchivedReason = {
+  reason: 'archived';
+  reason_details: {substatus: Group['substatus']};
+} & Omit<InboxDetails, 'reason'>;
 type Props = {
-  inbox: InboxDetails;
+  inbox: InboxDetails | ArchivedReason;
   fontSize?: 'sm' | 'md';
   /** Displays the time an issue was added to inbox */
   showDateAdded?: boolean;
@@ -164,6 +171,17 @@ function InboxReason({inbox, fontSize = 'sm', showDateAdded}: Props) {
               relative: relativeDateAdded,
             }),
         };
+      case 'archived':
+        return {
+          tagType: 'info',
+          reasonBadgeText: t('Archived'),
+          tooltipText:
+            reasonDetails.substatus === GroupSubstatus.ARCHIVED_FOREVER
+              ? t('Archived forever')
+              : reasonDetails.substatus === GroupSubstatus.ARCHIVED_UNTIL_ESCALATING
+              ? t('Archived until escalating')
+              : t('Archived until condition met'),
+        };
       default:
         if (hasIssueStates) {
           return {

static/app/types/group.tsx

@@ -171,9 +171,9 @@ export type TagWithTopValues = {
 };
 
 export const enum GroupSubstatus {
-  UNTIL_ESCALATING = 'until_escalating',
-  UNTIL_CONDITION_MET = 'until_condition_met',
-  FOREVER = 'forever',
+  ARCHIVED_UNTIL_ESCALATING = 'archived_until_escalating',
+  ARCHIVED_UNTIL_CONDITION_MET = 'archived_until_condition_met',
+  ARCHIVED_FOREVER = 'archived_forever',
   ESCALATING = 'escalating',
   ONGOING = 'ongoing',
   REGRESSED = 'regressed',
@@ -510,7 +510,7 @@ export type ResolutionStatusDetails = {
 export type GroupStatusResolution = {
   status: ResolutionStatus;
   statusDetails: ResolutionStatusDetails;
-  substatus?: GroupSubstatus;
+  substatus?: 'until_escalating';
 };
 
 export type GroupRelease = {
@@ -571,7 +571,7 @@ export interface GroupResolution
   // A proper fix for this would be to make the status field an enum or string and correctly extend it.
   extends Omit<BaseGroup, 'status'>,
     GroupStats,
-    GroupStatusResolution {}
+    Omit<GroupStatusResolution, 'substatus'> {}
 
 export type Group = GroupResolution | GroupReprocessing;
 export interface GroupCollapseRelease