feat(issues): Add context tooltips for issue header status (#92081)

For a new Sentry user, the issue header is an overwhelming amount of
information, and it's not clear what the information is.

We add tooltips for all issue statuses and provide a link to learn more
in our docs.


refs
https://linear.app/getsentry/issue/RTC-854/issue-details-add-explanatory-mouseovers-to-titles


<img width="221" alt="Screenshot 2025-05-21 at 7 11 48 PM"
src="https://github.com/user-attachments/assets/193735d0-74ec-4066-8f29-c864e2db75da"
/>

Author: JoshFerge

static/app/components/group/inboxBadges/statusBadge.spec.tsx

@@ -12,7 +12,7 @@ describe('GroupStatusBadge', () => {
       />
     );
     await userEvent.hover(screen.getByText('Archived'));
-    expect(await screen.findByText('Archived until escalating')).toBeInTheDocument();
+    expect(await screen.findByText('Archived until escalating.')).toBeInTheDocument();
   });
   it('should display new', () => {
     render(

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

@@ -18,30 +18,37 @@ export function getBadgeProperties(
     return {
       tagType: 'highlight',
       status: t('Resolved'),
+      tooltip: t('This issue was marked as fixed.'),
     };
   }
   if (status === 'unresolved') {
     if (substatus === GroupSubstatus.REGRESSED) {
       return {
         tagType: 'highlight',
         status: t('Regressed'),
+        tooltip: t('This issue was resolved then occurred again.'),
       };
     }
     if (substatus === GroupSubstatus.ESCALATING) {
       return {
         tagType: 'error',
         status: t('Escalating'),
+        tooltip: t('This issue is occurring significantly more often it used to.'),
       };
     }
     if (substatus === GroupSubstatus.NEW) {
       return {
         tagType: 'warning',
         status: t('New'),
+        tooltip: t('This issue first occurred in the last 7 days.'),
       };
     }
     return {
       tagType: 'default',
       status: t('Ongoing'),
+      tooltip: t(
+        'This issue was created more than 7 days ago or has manually been marked as reviewed.'
+      ),
     };
   }
   if (status === 'ignored') {
@@ -50,10 +57,10 @@ export function getBadgeProperties(
       status: t('Archived'),
       tooltip:
         substatus === GroupSubstatus.ARCHIVED_FOREVER
-          ? t('Archived forever')
+          ? t('Archived forever.')
           : substatus === GroupSubstatus.ARCHIVED_UNTIL_ESCALATING
-            ? t('Archived until escalating')
-            : t('Archived until condition met'),
+            ? t('Archived until escalating.')
+            : t('Archived until condition met.'),
     };
   }
   return undefined;

static/app/views/issueDetails/streamline/header/header.tsx

@@ -12,11 +12,12 @@ import ErrorBoundary from 'sentry/components/errorBoundary';
 import EventMessage from 'sentry/components/events/eventMessage';
 import {getBadgeProperties} from 'sentry/components/group/inboxBadges/statusBadge';
 import UnhandledTag from 'sentry/components/group/inboxBadges/unhandledTag';
+import ExternalLink from 'sentry/components/links/externalLink';
 import Link from 'sentry/components/links/link';
 import {TourElement} from 'sentry/components/tours/components';
 import {MAX_PICKABLE_DAYS} from 'sentry/constants';
 import {IconInfo} from 'sentry/icons';
-import {t} from 'sentry/locale';
+import {t, tct} from 'sentry/locale';
 import HookStore from 'sentry/stores/hookStore';
 import {space} from 'sentry/styles/space';
 import type {Event} from 'sentry/types/event';
@@ -177,7 +178,15 @@ export default function StreamlinedGroupHeader({
             )}
             {statusProps?.status ? (
               <Fragment>
-                <Tooltip title={statusProps?.tooltip}>
+                <Tooltip
+                  isHoverable
+                  title={tct('[tooltip] [link:Learn more]', {
+                    tooltip: statusProps?.tooltip ?? '',
+                    link: (
+                      <ExternalLink href="https://docs.sentry.io/product/issues/states-triage/" />
+                    ),
+                  })}
+                >
                   <Subtext>{statusProps?.status}</Subtext>
                 </Tooltip>
               </Fragment>