diff --git a/static/app/components/events/featureFlags/eventFeatureFlagList.spec.tsx b/static/app/components/events/featureFlags/eventFeatureFlagList.spec.tsx index 0e8c82b5ccd04f..3dcba81e2fd468 100644 --- a/static/app/components/events/featureFlags/eventFeatureFlagList.spec.tsx +++ b/static/app/components/events/featureFlags/eventFeatureFlagList.spec.tsx @@ -16,6 +16,7 @@ import { MOCK_FLAGS, NO_FLAG_CONTEXT_SECTION_PROPS_CTA, NO_FLAG_CONTEXT_SECTION_PROPS_NO_CTA, + NO_FLAG_CONTEXT_WITH_FLAGS_SECTION_PROPS_NO_CTA, } from 'sentry/components/events/featureFlags/testUtils'; // Needed to mock useVirtualizer lists. @@ -247,6 +248,26 @@ describe('EventFeatureFlagList', function () { expect(screen.getByText('Feature Flags')).toBeInTheDocument(); }); + it('renders empty state if event.contexts.flags is not set but should not show cta - flags already sent', function () { + const org = OrganizationFixture({features: ['feature-flag-cta']}); + + render( + , + { + organization: org, + } + ); + + const control = screen.queryByRole('button', {name: 'Sort Flags'}); + expect(control).not.toBeInTheDocument(); + const search = screen.queryByRole('button', {name: 'Open Feature Flag Search'}); + expect(search).not.toBeInTheDocument(); + expect(screen.getByRole('button', {name: 'Set Up Integration'})).toBeInTheDocument(); + expect( + screen.getByText('No feature flags were found for this event') + ).toBeInTheDocument(); + }); + it('renders nothing if event.contexts.flags is not set and should not show cta - wrong platform', async function () { const org = OrganizationFixture({features: ['feature-flag-cta']}); diff --git a/static/app/components/events/featureFlags/eventFeatureFlagList.tsx b/static/app/components/events/featureFlags/eventFeatureFlagList.tsx index 13e84cc190047d..39dfab5c10538e 100644 --- a/static/app/components/events/featureFlags/eventFeatureFlagList.tsx +++ b/static/app/components/events/featureFlags/eventFeatureFlagList.tsx @@ -11,7 +11,6 @@ import { import FeatureFlagInlineCTA from 'sentry/components/events/featureFlags/featureFlagInlineCTA'; import FeatureFlagSort from 'sentry/components/events/featureFlags/featureFlagSort'; import {useFeatureFlagOnboarding} from 'sentry/components/events/featureFlags/useFeatureFlagOnboarding'; -import useIssueEvents from 'sentry/components/events/featureFlags/useIssueEvents'; import { FlagControlOptions, OrderBy, @@ -79,12 +78,6 @@ export function EventFeatureFlagList({ }, }); - const { - data: relatedEvents, - isPending: isRelatedEventsPending, - isError: isRelatedEventsError, - } = useIssueEvents({issueId: group.id}); - const {activateSidebarSkipConfigure} = useFeatureFlagOnboarding(); const { @@ -105,10 +98,6 @@ export function EventFeatureFlagList({ }, [isSuspectError, isSuspectPending, suspectFlags]); const hasFlagContext = Boolean(event.contexts?.flags?.values); - const anyEventHasContext = - isRelatedEventsPending || isRelatedEventsError - ? false - : relatedEvents.filter(e => Boolean(e.contexts?.flags?.values)).length > 0; const eventFlags: Required[] = useMemo(() => { // At runtime there's no type guarantees on the event flags. So we have to @@ -126,8 +115,8 @@ export function EventFeatureFlagList({ const hasFlags = hasFlagContext && eventFlags.length > 0; const showCTA = + !project.hasFlags && !hasFlagContext && - !anyEventHasContext && featureFlagOnboardingPlatforms.includes(project.platform ?? 'other') && organization.features.includes('feature-flag-cta'); @@ -207,8 +196,8 @@ export function EventFeatureFlagList({ return ; } - // if contexts.flags is not set, hide the section - if (!hasFlagContext) { + // if contexts.flags is not set and project has not set up flags, hide the section + if (!hasFlagContext && !project.hasFlags) { return null; } diff --git a/static/app/components/events/featureFlags/testUtils.tsx b/static/app/components/events/featureFlags/testUtils.tsx index 832cd223918135..c8f08891b018d8 100644 --- a/static/app/components/events/featureFlags/testUtils.tsx +++ b/static/app/components/events/featureFlags/testUtils.tsx @@ -57,6 +57,16 @@ export const NO_FLAG_CONTEXT_SECTION_PROPS_CTA = { contexts: {other: {}}, platform: 'javascript', }), - project: ProjectFixture({platform: 'javascript'}), + project: ProjectFixture({platform: 'javascript', hasFlags: false}), + group: GroupFixture({platform: 'javascript'}), +}; + +export const NO_FLAG_CONTEXT_WITH_FLAGS_SECTION_PROPS_NO_CTA = { + event: EventFixture({ + id: 'abc123def456ghi789jkl', + contexts: {other: {}}, + platform: 'javascript', + }), + project: ProjectFixture({platform: 'javascript', hasFlags: true}), group: GroupFixture({platform: 'javascript'}), }; diff --git a/static/app/components/events/featureFlags/useIssueEvents.tsx b/static/app/components/events/featureFlags/useIssueEvents.tsx deleted file mode 100644 index b4196feaedb113..00000000000000 --- a/static/app/components/events/featureFlags/useIssueEvents.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import type {Event} from '@sentry/core'; - -import {useApiQuery} from 'sentry/utils/queryClient'; -import useOrganization from 'sentry/utils/useOrganization'; - -export default function useIssueEvents({issueId}: {issueId: string}) { - const organization = useOrganization(); - return useApiQuery( - [ - `/organizations/${organization.slug}/issues/${issueId}/events/`, - { - query: { - statsPeriod: '14d', - limit: 20, - full: true, - }, - }, - ], - {staleTime: 0} - ); -} diff --git a/static/app/types/project.tsx b/static/app/types/project.tsx index 0381bb57ddfb58..cf95d4ed92527c 100644 --- a/static/app/types/project.tsx +++ b/static/app/types/project.tsx @@ -27,6 +27,7 @@ export type Project = { hasAccess: boolean; hasCustomMetrics: boolean; hasFeedbacks: boolean; + hasFlags: boolean; hasInsightsAppStart: boolean; hasInsightsAssets: boolean; hasInsightsCaches: boolean; diff --git a/tests/js/fixtures/project.ts b/tests/js/fixtures/project.ts index 01189b7ed928bb..e2d9672e44a29f 100644 --- a/tests/js/fixtures/project.ts +++ b/tests/js/fixtures/project.ts @@ -34,6 +34,7 @@ export function ProjectFixture(params: Partial = {}): Project { hasMinifiedStackTrace: false, hasProfiles: false, hasReplays: false, + hasFlags: false, hasSessions: false, hasMonitors: false, hasInsightsHttp: false,