@sentry/remix/cjs/performance/client.js

Official Sentry SDK for Remix

Object.defineProperty(exports, '__esModule', { value: true });

var react = require('@sentry/react');
var utils = require('@sentry/utils');
var React = require('react');

var _jsxFileName = "/home/runner/work/sentry-javascript/sentry-javascript/packages/remix/src/performance/client.tsx";

var DEFAULT_TAGS = {
  'routing.instrumentation': 'remix-router',
} ;

let activeTransaction;

let _useEffect;
let _useLocation;
let _useMatches;

let _customStartTransaction;
let _startTransactionOnLocationChange;

var global = utils.getGlobalObject();

function getInitPathName() {
  if (global && global.location) {
    return global.location.pathname;
  }

  return undefined;
}

/**
 * Creates a react-router v6 instrumention for Remix applications.
 *
 * This implementation is slightly different (and simpler) from the react-router instrumentation
 * as in Remix, `useMatches` hook is available where in react-router-v6 it's not yet.
 */
function remixRouterInstrumentation(useEffect, useLocation, useMatches) {
  return (
    customStartTransaction,
    startTransactionOnPageLoad = true,
    startTransactionOnLocationChange = true,
  ) => {
    var initPathName = getInitPathName();
    if (startTransactionOnPageLoad && initPathName) {
      activeTransaction = customStartTransaction({
        name: initPathName,
        op: 'pageload',
        tags: DEFAULT_TAGS,
        metadata: {
          source: 'url',
        },
      });
    }

    _useEffect = useEffect;
    _useLocation = useLocation;
    _useMatches = useMatches;

    _customStartTransaction = customStartTransaction;
    _startTransactionOnLocationChange = startTransactionOnLocationChange;
  };
}

/**
 * Wraps a remix `root` (see: https://remix.run/docs/en/v1/guides/migrating-react-router-app#creating-the-root-route)
 * To enable pageload/navigation tracing on every route.
 * Also wraps the application with `ErrorBoundary`.
 *
 * @param OrigApp The Remix root to wrap
 * @param options The options for ErrorBoundary wrapper.
 */
function withSentry(
  OrigApp,
  options

 = {
    wrapWithErrorBoundary: true,
    errorBoundaryOptions: {},
  },
) {
  var SentryRoot = (props) => {
    // Early return when any of the required functions is not available.
    if (!_useEffect || !_useLocation || !_useMatches || !_customStartTransaction) {
      (typeof __SENTRY_DEBUG__ === 'undefined' || __SENTRY_DEBUG__) &&
        utils.logger.warn('Remix SDK was unable to wrap your root because of one or more missing parameters.');

      // @ts-ignore Setting more specific React Component typing for `R` generic above
      // will break advanced type inference done by react router params
      return React.createElement(OrigApp, { ...props, __self: this, __source: {fileName: _jsxFileName, lineNumber: 110}} );
    }

    let isBaseLocation = false;

    var location = _useLocation();
    var matches = _useMatches();

    _useEffect(() => {
      if (activeTransaction && matches && matches.length) {
        activeTransaction.setName(matches[matches.length - 1].id, 'route');
      }

      isBaseLocation = true;
    }, []);

    _useEffect(() => {
      if (isBaseLocation) {
        if (activeTransaction) {
          activeTransaction.finish();
        }

        return;
      }

      if (_startTransactionOnLocationChange && matches && matches.length) {
        if (activeTransaction) {
          activeTransaction.finish();
        }

        activeTransaction = _customStartTransaction({
          name: matches[matches.length - 1].id,
          op: 'navigation',
          tags: DEFAULT_TAGS,
          metadata: {
            source: 'route',
          },
        });
      }
    }, [location]);

    isBaseLocation = false;

    // @ts-ignore Setting more specific React Component typing for `R` generic above
    // will break advanced type inference done by react router params
    return React.createElement(OrigApp, { ...props, __self: this, __source: {fileName: _jsxFileName, lineNumber: 155}} );
  };

  if (options.wrapWithErrorBoundary) {
    // @ts-ignore Setting more specific React Component typing for `R` generic above
    // will break advanced type inference done by react router params
    return react.withErrorBoundary(SentryRoot, options.errorBoundaryOptions);
  }

  // @ts-ignore Setting more specific React Component typing for `R` generic above
  // will break advanced type inference done by react router params
  return SentryRoot;
}

exports.remixRouterInstrumentation = remixRouterInstrumentation;
exports.withSentry = withSentry;
//# sourceMappingURL=client.js.map