implement threshold list fetch hook & context provider#57922
Conversation
| ReturnType<typeof useFetchThresholdsListData> | ||
| >(EMPTY_THRESHOLDS_LIST_DATA); | ||
|
|
||
| export function ThresholdsDataContext({children, ...listDataParams}: ProviderProps) { |
There was a problem hiding this comment.
Context provider is not utilized atm, but will be useful for https://github.com/getsentry/sentry/pull/55886/files
| // NOTE: If release thresholds are not enabled, API will return a 403 not found | ||
| // So capture this case and set enabled to false | ||
| setFeatureEnabledFlag(false); |
There was a problem hiding this comment.
Is the feature flag not available from the organization object?
There was a problem hiding this comment.
Yes - the feature should be available from the org object
This state flag isn't being utilized at all atm 🤷
i may remove it
| export default function useFetchThresholdsListData({ | ||
| selectedEnvs, | ||
| selectedProjects, | ||
| }: HookProps) { | ||
| const api = useApi(); | ||
| const organization = useOrganization(); | ||
|
|
||
| const [isLoading, setIsLoading] = useState<boolean>(true); | ||
| const [errors, setErrors] = useState<string | null>(); | ||
| const [_featureEnabledFlag, setFeatureEnabledFlag] = useState<boolean>(true); | ||
| const [thresholds, setThresholds] = useState<Threshold[]>([]); | ||
|
|
||
| const fetchThresholds = useCallback(async () => { | ||
| // ReleaseThresholdIndexEndpoint.as_view(), | ||
| // name="sentry-api-0-organization-release-thresholds", | ||
| const path = `/organizations/${organization.id}/releases/thresholds/`; | ||
| const query: ThresholdQuery = {}; | ||
| if (selectedProjects.length) { | ||
| query.project = selectedProjects; | ||
| } else { |
There was a problem hiding this comment.
this should be using useApiQuery unless there's some reason that this can't use it
There was a problem hiding this comment.
🤔
hmmm. why's that?
Seems like useApiQuery is just another abstraction on top of useApi.
it unnecessarily obfuscates the implementation here?
There was a problem hiding this comment.
useApiQuery is a small wrapper on react-query that uses our api client to fetch but it handles loading states, error states, stale time, refetching based on query parameters. basically everything you're doing here
There was a problem hiding this comment.
hmmm... i see 🤔
Ok that looks useful. will switch
There was a problem hiding this comment.
👍 might be helpful to start by looking at one like this one https://github.com/getsentry/sentry/blob/master/static/app/actionCreators/group.tsx#L518-L545
| } | ||
|
|
||
| const { | ||
| data: thresholds, |
There was a problem hiding this comment.
giving this a default can be kinda nice. since the type goes from Threshold[] | null to Threshold[]
| data: thresholds, | |
| data: thresholds = [], |
There was a problem hiding this comment.
actually - i'll just straight return the useApiQuery
Implements a context provider + hook to fetch release thresholds data