feat(supergroups): Use issues search to highlight supergroup drawer issues

static/app/components/stream/supergroups/supergroupRow.tsx

@@ -1,4 +1,4 @@
-import {useMemo, useState} from 'react';
+import {useState} from 'react';
 import styled from '@emotion/styled';
 
 import InteractionStateLayer from '@sentry/scraps/interactionStateLayer';
@@ -11,33 +11,25 @@ import {Count} from 'sentry/components/count';
 import {useDrawer} from 'sentry/components/globalDrawer';
 import {PanelItem} from 'sentry/components/panels/panelItem';
 import {Placeholder} from 'sentry/components/placeholder';
-import {
-  CheckboxLabel,
-  SupergroupCheckbox,
-} from 'sentry/components/stream/supergroups/supergroupCheckbox';
 import {TimeSince} from 'sentry/components/timeSince';
 import {IconStack} from 'sentry/icons';
 import {t} from 'sentry/locale';
 import {COLUMN_BREAKPOINTS} from 'sentry/views/issueList/actions/utils';
-import {useOptionalIssueSelectionSummary} from 'sentry/views/issueList/issueSelectionContext';
 import type {AggregatedSupergroupStats} from 'sentry/views/issueList/supergroups/aggregateSupergroupStats';
 import {SupergroupDetailDrawer} from 'sentry/views/issueList/supergroups/supergroupDrawer';
 import type {SupergroupDetail} from 'sentry/views/issueList/supergroups/types';
 
 interface SupergroupRowProps {
-  matchedGroupIds: string[];
   supergroup: SupergroupDetail;
   aggregatedStats?: AggregatedSupergroupStats | null;
   memberList?: IndexedMembersByProject;
 }
 
 export function SupergroupRow({
   supergroup,
-  matchedGroupIds,
   aggregatedStats,
   memberList,
 }: SupergroupRowProps) {
-  const matchedCount = matchedGroupIds.length;
   const {openDrawer, isDrawerOpen} = useDrawer();
   const [isActive, setIsActive] = useState(false);
   const handleClick = () => {
@@ -46,8 +38,8 @@ export function SupergroupRow({
       () => (
         <SupergroupDetailDrawer
           supergroup={supergroup}
-          matchedGroupIds={matchedGroupIds}
           memberList={memberList}
+          filterWithCurrentSearch
         />
       ),
       {
@@ -58,59 +50,31 @@ export function SupergroupRow({
     );
   };
 
-  const summary = useOptionalIssueSelectionSummary();
-  const selectedCount = useMemo(() => {
-    if (!summary) {
-      return 0;
-    }
-    let count = 0;
-    for (const id of matchedGroupIds) {
-      if (summary.records.get(id)) {
-        count++;
-      }
-    }
-    return count;
-  }, [summary, matchedGroupIds]);
-
   const highlighted = isActive && isDrawerOpen;
 
   return (
     <Wrapper onClick={handleClick} highlighted={highlighted}>
       <InteractionStateLayer />
       <IconArea>
         <AccentIcon size="md" />
-        <SupergroupCheckbox
-          matchedGroupIds={matchedGroupIds}
-          selectedCount={selectedCount}
-        />
       </IconArea>
       <Summary>
-        {supergroup.error_type ? (
-          <Text size="md" bold ellipsis>
-            {supergroup.error_type}
-          </Text>
-        ) : null}
-        <Text size="sm" variant="muted" ellipsis>
+        <Text size="md" bold ellipsis>
           {supergroup.title}
         </Text>
+        <Text size="sm" variant="muted" ellipsis>
+          {supergroup.error_type}
+        </Text>
         <MetaRow>
           {supergroup.code_area ? (
             <Text size="sm" variant="muted" ellipsis>
               {supergroup.code_area}
             </Text>
           ) : null}
-          {supergroup.code_area && matchedCount > 0 ? <Dot /> : null}
-          {matchedCount > 0 ? (
-            <Text
-              size="sm"
-              variant={selectedCount > 0 ? 'primary' : 'muted'}
-              bold={selectedCount > 0}
-            >
-              {selectedCount > 0
-                ? `${selectedCount} / ${supergroup.group_ids.length} ${t('issues selected')}`
-                : `${matchedCount} / ${supergroup.group_ids.length} ${t('issues matched')}`}
-            </Text>
-          ) : null}
+          {supergroup.code_area ? <Dot /> : null}
+          <Text size="sm" variant="muted">
+            {`${supergroup.group_ids.length} ${t('issues')}`}
+          </Text>
         </MetaRow>
       </Summary>
 
@@ -196,12 +160,6 @@ const Wrapper = styled(PanelItem)<{highlighted: boolean}>`
   min-height: 82px;
   background: ${p =>
     p.highlighted ? p.theme.tokens.background.secondary : 'transparent'};
-
-  &:not(:hover):not(:has(input:checked)):not(:has(input:indeterminate)) {
-    ${CheckboxLabel} {
-      ${p => p.theme.visuallyHidden};
-    }
-  }
 `;
 
 const Summary = styled('div')`

static/app/views/issueDetails/streamline/sidebar/supergroupSection.tsx

@@ -35,15 +35,10 @@ export function SupergroupSection({group}: SupergroupSectionProps) {
   const issueCount = supergroup.group_ids.length;
 
   const handleClick = () => {
-    openDrawer(
-      () => (
-        <SupergroupDetailDrawer supergroup={supergroup} matchedGroupIds={[group.id]} />
-      ),
-      {
-        ariaLabel: t('Supergroup details'),
-        drawerKey: 'supergroup-drawer',
-      }
-    );
+    openDrawer(() => <SupergroupDetailDrawer supergroup={supergroup} />, {
+      ariaLabel: t('Supergroup details'),
+      drawerKey: 'supergroup-drawer',
+    });
   };
 
   return (

static/app/views/issueList/groupListBody.tsx

@@ -237,7 +237,6 @@ function GroupList({
           <SupergroupRow
             key={`sg-${supergroup.id}`}
             supergroup={supergroup}
-            matchedGroupIds={matchingIds}
             aggregatedStats={stats}
             memberList={memberList}
           />