incidentRedirect.tsx 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import {useCallback, useEffect, useState} from 'react';
  2. import type {RouteComponentProps} from 'react-router';
  3. import {browserHistory} from 'react-router';
  4. import LoadingError from 'sentry/components/loadingError';
  5. import LoadingIndicator from 'sentry/components/loadingIndicator';
  6. import type {Organization} from 'sentry/types';
  7. import {trackAnalytics} from 'sentry/utils/analytics';
  8. import useApi from 'sentry/utils/useApi';
  9. import {useLocation} from 'sentry/utils/useLocation';
  10. import {normalizeUrl} from 'sentry/utils/withDomainRequired';
  11. import {fetchIncident} from './utils/apiCalls';
  12. import {alertDetailsLink} from './utils';
  13. type Props = {
  14. organization: Organization;
  15. } & RouteComponentProps<{alertId: string}, {}>;
  16. /**
  17. * Reirects from an incident to the incident's metric alert details page
  18. */
  19. function IncidentRedirect({organization, params}: Props) {
  20. const api = useApi();
  21. const location = useLocation();
  22. const [hasError, setHasError] = useState(false);
  23. const track = useCallback(() => {
  24. trackAnalytics('alert_details.viewed', {
  25. organization,
  26. alert_id: parseInt(params.alertId, 10),
  27. });
  28. }, [organization, params.alertId]);
  29. const fetchData = useCallback(async () => {
  30. setHasError(false);
  31. try {
  32. const incident = await fetchIncident(api, organization.slug, params.alertId);
  33. browserHistory.replace(
  34. normalizeUrl({
  35. pathname: alertDetailsLink(organization, incident),
  36. query: {...location.query, alert: incident.identifier},
  37. })
  38. );
  39. } catch (err) {
  40. setHasError(true);
  41. }
  42. }, [setHasError, api, params.alertId, organization, location.query]);
  43. useEffect(() => {
  44. fetchData();
  45. track();
  46. }, [fetchData, track]);
  47. if (hasError) {
  48. return <LoadingError onRetry={fetchData} />;
  49. }
  50. return <LoadingIndicator />;
  51. }
  52. export default IncidentRedirect;