diff --git a/static/app/router/routes.tsx b/static/app/router/routes.tsx index a4845e4ca8dd1d..f17ba425ae14db 100644 --- a/static/app/router/routes.tsx +++ b/static/app/router/routes.tsx @@ -2546,10 +2546,6 @@ function buildRoutes(): RouteObject[] { path: 'autofix/recent/', component: make(() => import('sentry/views/issueList/pages/autofix/recentlyRun')), }, - { - path: 'supergroups/', - component: make(() => import('sentry/views/issueList/pages/supergroups')), - }, { path: 'views/:viewId/', component: errorHandler(OverviewWrapper), diff --git a/static/app/views/issueList/pages/supergroups.tsx b/static/app/views/issueList/pages/supergroups.tsx deleted file mode 100644 index cbdd890146f43a..00000000000000 --- a/static/app/views/issueList/pages/supergroups.tsx +++ /dev/null @@ -1,204 +0,0 @@ -import styled from '@emotion/styled'; - -import {FeatureBadge} from '@sentry/scraps/badge'; -import {inlineCodeStyles} from '@sentry/scraps/code'; -import {Container, Flex, Grid, Stack} from '@sentry/scraps/layout'; -import {Heading, Text} from '@sentry/scraps/text'; - -import {FeedbackButton} from 'sentry/components/feedbackButton/feedbackButton'; -import {useDrawer} from 'sentry/components/globalDrawer'; -import * as Layout from 'sentry/components/layouts/thirds'; -import {LoadingError} from 'sentry/components/loadingError'; -import {LoadingIndicator} from 'sentry/components/loadingIndicator'; -import {Redirect} from 'sentry/components/redirect'; -import {IconFocus} from 'sentry/icons'; -import {t, tn} from 'sentry/locale'; -import {getApiUrl} from 'sentry/utils/api/getApiUrl'; -import {MarkedText} from 'sentry/utils/marked/markedText'; -import {useApiQuery} from 'sentry/utils/queryClient'; -import {useOrganization} from 'sentry/utils/useOrganization'; -import {SupergroupDetailDrawer} from 'sentry/views/issueList/supergroups/supergroupDrawer'; -import type {SupergroupDetail} from 'sentry/views/issueList/supergroups/types'; - -interface ListSupergroupsResponse { - data: SupergroupDetail[]; -} - -function SupergroupCard({ - supergroup, - onClick, -}: { - onClick: () => void; - supergroup: SupergroupDetail; -}) { - return ( - - - - {supergroup.title} - - - - - {tn('%s issue', '%s issues', supergroup.group_ids.length)} - - {supergroup.error_type && ( - - - {t('Error:')} - - - {supergroup.error_type} - - - )} - {supergroup.code_area && ( - - - {t('Location:')} - - - {supergroup.code_area} - - - )} - - - {supergroup.summary && ( - - - - - - {t('Root Cause')} - - - - - - - - )} - - - ); -} - -function Supergroups() { - const organization = useOrganization(); - const hasTopIssuesUI = organization.features.includes('top-issues-ui'); - const {openDrawer} = useDrawer(); - - const { - data: response, - isPending, - isError, - refetch, - } = useApiQuery( - [ - getApiUrl('/organizations/$organizationIdOrSlug/seer/supergroups/', { - path: {organizationIdOrSlug: organization.slug}, - }), - ], - { - staleTime: 60000, - enabled: hasTopIssuesUI, - } - ); - - const supergroups = (response?.data ?? []).filter(sg => sg.group_ids.length > 1); - - const handleSupergroupClick = (supergroup: SupergroupDetail) => { - openDrawer( - () => , - { - ariaLabel: t('Supergroup details'), - drawerKey: 'supergroup-drawer', - } - ); - }; - - if (!hasTopIssuesUI) { - return ; - } - - return ( - - - - - {t('Supergroups')} - - - - - - - - - - - {isPending ? ( - - ) : isError ? ( - - ) : supergroups.length === 0 ? ( - - - {t('No supergroups found')} - - - ) : ( - - - {tn('%s supergroup', '%s supergroups', supergroups.length)} - - - {supergroups.map(sg => ( - handleSupergroupClick(sg)} - /> - ))} - - - )} - - - - ); -} - -const CardContainer = styled(Container)` - position: relative; - overflow: hidden; - cursor: pointer; - transition: - background-color 0.2s ease, - border-color 0.2s ease, - box-shadow 0.2s ease; - - &:hover { - background: ${p => p.theme.tokens.background.secondary}; - border-color: ${p => p.theme.tokens.border.accent.moderate}; - box-shadow: ${p => p.theme.dropShadowMedium}; - } -`; - -export const StyledMarkedText = styled(MarkedText)` - code:not(pre code) { - ${p => inlineCodeStyles(p.theme)}; - } -`; - -export default Supergroups; diff --git a/static/app/views/issueList/supergroups/supergroupDrawer.tsx b/static/app/views/issueList/supergroups/supergroupDrawer.tsx index 6db963cbdd620f..45028396f09d25 100644 --- a/static/app/views/issueList/supergroups/supergroupDrawer.tsx +++ b/static/app/views/issueList/supergroups/supergroupDrawer.tsx @@ -4,6 +4,7 @@ import styled from '@emotion/styled'; import {Badge} from '@sentry/scraps/badge'; import {Button} from '@sentry/scraps/button'; +import {inlineCodeStyles} from '@sentry/scraps/code'; import {Container, Flex, Stack} from '@sentry/scraps/layout'; import {Heading, Text} from '@sentry/scraps/text'; @@ -29,9 +30,9 @@ import {t} from 'sentry/locale'; import {GroupStore} from 'sentry/stores/groupStore'; import type {Group} from 'sentry/types/group'; import {getApiUrl} from 'sentry/utils/api/getApiUrl'; +import {MarkedText} from 'sentry/utils/marked/markedText'; import {useApiQuery} from 'sentry/utils/queryClient'; import {useOrganization} from 'sentry/utils/useOrganization'; -import {StyledMarkedText} from 'sentry/views/issueList/pages/supergroups'; import {SupergroupFeedback} from 'sentry/views/issueList/supergroups/supergroupFeedback'; import type {SupergroupDetail} from 'sentry/views/issueList/supergroups/types'; @@ -306,3 +307,9 @@ const HighlightableRow = styled('div')<{highlighted: boolean}>` border-left: 3px solid ${p.theme.tokens.border.accent.vibrant}; `} `; + +const StyledMarkedText = styled(MarkedText)` + code:not(pre code) { + ${p => inlineCodeStyles(p.theme)}; + } +`; diff --git a/static/app/views/navigation/secondary/sections/issues/issuesSecondaryNavigation.tsx b/static/app/views/navigation/secondary/sections/issues/issuesSecondaryNavigation.tsx index 0922df43bc238e..1705e53df9a7a7 100644 --- a/static/app/views/navigation/secondary/sections/issues/issuesSecondaryNavigation.tsx +++ b/static/app/views/navigation/secondary/sections/issues/issuesSecondaryNavigation.tsx @@ -13,8 +13,6 @@ import {IssueViews} from 'sentry/views/navigation/secondary/sections/issues/issu export function IssuesSecondaryNavigation() { const organization = useOrganization(); const baseUrl = `/organizations/${organization.slug}/issues`; - const hasTopIssuesUI = organization.features.includes('top-issues-ui'); - return ( {t('Issues')} @@ -30,16 +28,6 @@ export function IssuesSecondaryNavigation() { {t('Feed')} - {hasTopIssuesUI && ( - - - {t('Supergroups')} - - - )}