-
-
Notifications
You must be signed in to change notification settings - Fork 4.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
ref(metrics): Convert more shared code for metric issue details to ho…
…oks (#85385) Requires #85377 Adds a util file to a new directory to pull out some shared logic for the correlated section and the metrics graph. Will also make it a bit easier to read through both files. For the new `useMetricAlertId` hook, it mimics a pattern for cron/uptime ([example](https://github.com/getsentry/sentry/blob/cdd59af574fedd32005429827aefc06cdceab811/static/app/views/issueDetails/streamline/issueCronCheckTimeline.tsx#L36)) where by we fetch any event in 90d to have the best shot of finding a `alert_rule_id` ctx key since they are identical across all events. That way, even if a user picks small date range, or bad query, we don't unload the graph when the event isn't found. All this refactoring is to make it more reviewable as I take a look at changing the graph design
- Loading branch information
Showing
5 changed files
with
98 additions
and
88 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,77 @@ | ||
| import {Fragment, useMemo} from 'react'; | ||
| import moment from 'moment-timezone'; | ||
|
|
||
| import {DateTime} from 'sentry/components/dateTime'; | ||
| import {t} from 'sentry/locale'; | ||
| import type {Event} from 'sentry/types/event'; | ||
| import type {GroupOpenPeriod} from 'sentry/types/group'; | ||
| import {useApiQuery} from 'sentry/utils/queryClient'; | ||
| import useOrganization from 'sentry/utils/useOrganization'; | ||
| import {useUser} from 'sentry/utils/useUser'; | ||
| import type {TimePeriodType} from 'sentry/views/alerts/rules/metric/details/constants'; | ||
| import {TimePeriod} from 'sentry/views/alerts/rules/metric/types'; | ||
| import {useIssueDetails} from 'sentry/views/issueDetails/streamline/context'; | ||
| import {getGroupEventQueryKey} from 'sentry/views/issueDetails/utils'; | ||
|
|
||
| export function useMetricIssueAlertId({groupId}: {groupId: string}): string | undefined { | ||
| /** | ||
| * This should be removed once the metric alert rule ID is set on the issue. | ||
| * This will fetch an event from the max range if the detector details | ||
| * are not available (e.g. time range has changed and page refreshed) | ||
| */ | ||
| const user = useUser(); | ||
| const organization = useOrganization(); | ||
| const {detectorDetails} = useIssueDetails(); | ||
| const {detectorId, detectorType} = detectorDetails; | ||
|
|
||
| const hasMetricDetector = detectorId && detectorType === 'metric_alert'; | ||
|
|
||
| const {data: event} = useApiQuery<Event>( | ||
| getGroupEventQueryKey({ | ||
| orgSlug: organization.slug, | ||
| groupId, | ||
| eventId: user.options.defaultIssueEvent, | ||
| environments: [], | ||
| }), | ||
| { | ||
| staleTime: Infinity, | ||
| enabled: !hasMetricDetector, | ||
| retry: false, | ||
| } | ||
| ); | ||
|
|
||
| // Fall back to the fetched event in case the provider doesn't have the detector details | ||
| return hasMetricDetector ? detectorId : event?.contexts?.metric_alert?.alert_rule_id; | ||
| } | ||
|
|
||
| export function useMetricTimePeriod({ | ||
| openPeriod, | ||
| }: { | ||
| openPeriod?: GroupOpenPeriod; | ||
| }): TimePeriodType | null { | ||
| return useMemo((): TimePeriodType | null => { | ||
| if (!openPeriod) { | ||
| return null; | ||
| } | ||
| const start = openPeriod.start; | ||
| let end = openPeriod.end; | ||
| if (!end) { | ||
| end = new Date().toISOString(); | ||
| } | ||
| return { | ||
| start, | ||
| end, | ||
| period: TimePeriod.SEVEN_DAYS, | ||
| usingPeriod: false, | ||
| label: t('Custom time'), | ||
| display: ( | ||
| <Fragment> | ||
| <DateTime date={moment.utc(start)} /> | ||
| {' — '} | ||
| <DateTime date={moment.utc(end)} /> | ||
| </Fragment> | ||
| ), | ||
| custom: true, | ||
| }; | ||
| }, [openPeriod]); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters