sentinel/static/app/views/performance/traceDetails/TraceDetailsRouting.tsx

import {useEffect} from 'react';
import {browserHistory} from 'react-router';
import type {LocationDescriptorObject} from 'history';

import {transactionTargetHash} from 'sentry/components/events/interfaces/spans/utils';
import LoadingIndicator from 'sentry/components/loadingIndicator';
import {normalizeDateTimeParams} from 'sentry/components/organizations/pageFilters/parse';
import type {Event} from 'sentry/types';
import type {TraceMetaQueryChildrenProps} from 'sentry/utils/performance/quickTrace/traceMetaQuery';
import {useLocation} from 'sentry/utils/useLocation';
import useOrganization from 'sentry/utils/useOrganization';

import {DEFAULT_TRACE_ROWS_LIMIT} from './limitExceededMessage';
import {getTraceDetailsUrl} from './utils';

type Props = {
  children: JSX.Element;
  event: Event;
  metaResults: TraceMetaQueryChildrenProps | undefined;
};

function TraceDetailsRouting(props: Props) {
  const {metaResults, event, children} = props;
  const organization = useOrganization();
  const location = useLocation();
  const datetimeSelection = normalizeDateTimeParams(location.query);

  useEffect(() => {
    const traceId = event.contexts?.trace?.trace_id ?? '';

    if (organization.features.includes('performance-trace-details')) {
      if (event?.groupID && event?.eventID) {
        const issuesLocation = `/organizations/${organization.slug}/issues/${event.groupID}/events/${event.eventID}`;
        browserHistory.replace({
          pathname: issuesLocation,
        });
      } else if (
        metaResults?.meta &&
        metaResults?.meta.transactions <= DEFAULT_TRACE_ROWS_LIMIT
      ) {
        const traceDetailsLocation: LocationDescriptorObject = getTraceDetailsUrl(
          organization,
          traceId,
          datetimeSelection,
          location.query
        );

        browserHistory.replace({
          pathname: traceDetailsLocation.pathname,
          query: traceDetailsLocation.query,
          hash: transactionTargetHash(event.eventID) + location.hash,
        });
      }
    }
  }, [event, metaResults, location, organization, datetimeSelection]);

  if (
    metaResults?.isLoading &&
    organization.features.includes('performance-trace-details')
  ) {
    return <LoadingIndicator />;
  }

  return children;
}

export default TraceDetailsRouting;