Browse Source

feat(profiling): add useSentryEvent hook (#39550)

Fetch the sentry event (transaction) associated with the profile.
Jonas 2 years ago
parent
commit
8f3c65169a
1 changed files with 50 additions and 0 deletions
  1. 50 0
      static/app/utils/profiling/hooks/useSentryEvent.tsx

+ 50 - 0
static/app/utils/profiling/hooks/useSentryEvent.tsx

@@ -0,0 +1,50 @@
+import {useEffect, useState} from 'react';
+
+import {Client} from 'sentry/api';
+import {Event, RequestState} from 'sentry/types';
+import useApi from 'sentry/utils/useApi';
+
+function fetchSentryEvent<T extends Event>(
+  api: Client,
+  organizationSlug: string,
+  projectSlug: string,
+  eventId: string
+): Promise<T> {
+  return api.requestPromise(
+    `/projects/${organizationSlug}/${projectSlug}/events/${eventId}/`
+  );
+}
+
+export function useSentryEvent<T extends Event>(
+  organizationSlug: string,
+  projectSlug: string,
+  eventId: string | null
+): RequestState<T> {
+  const api = useApi();
+  const [requestState, setRequestState] = useState<RequestState<T>>({
+    type: 'initial',
+  });
+
+  useEffect(() => {
+    if (eventId === null) {
+      return undefined;
+    }
+
+    fetchSentryEvent<T>(api, organizationSlug, projectSlug, eventId)
+      .then(event => {
+        setRequestState({
+          type: 'resolved',
+          data: event,
+        });
+      })
+      .catch(err => {
+        setRequestState({type: 'errored', error: err});
+      });
+
+    return () => {
+      api.clear();
+    };
+  }, [api, organizationSlug, projectSlug, eventId]);
+
+  return requestState;
+}