How to use @commercetools-frontend/sentry - 10 common examples

applicationContext => applicationContext.permissions
  );
  const actualActionRights = useApplicationContext(
    applicationContext => applicationContext.actionRights
  );
  const actualDataFences = useApplicationContext(
    applicationContext => applicationContext.dataFences
  );

  // if the user has no permissions and no dataFences assigned to them, they are not authorized
  if (!actualPermissions && !actualDataFences) return false;

  let hasDemandeDataFences = false;
  if (demandedDataFences && demandedDataFences.length > 0) {
    if (!selectDataFenceData) {
      reportErrorToSentry(
        new Error(
          `@commercetools-frontend/permissions/Authorized: Missing data fences selector "selectDataFenceData".`
        )
      );
    }
    hasDemandeDataFences = hasAppliedDataFence({
      demandedDataFences,
      actualDataFences,
      selectDataFenceData,
    });
  }

  const hasDemandedPermissions = shouldMatchSomePermissions
    ? hasSomePermissions(demandedPermissions, actualPermissions)
    : hasEveryPermissions(demandedPermissions, actualPermissions);

export default (requestsInFlight, action) => {
  if (!requestsInFlight) return [];

  if (action && action.type === 'SHOW_LOADING')
    return [...requestsInFlight, action.payload];

  if (action && action.type === 'HIDE_LOADING') {
    // may only remove first occurence
    if (!requestsInFlight.includes(action.payload)) {
      reportErrorToSentry(
        new Error(
          `Tried to hide "${action.payload}", but it was not progressing!`
        )
      );
      return requestsInFlight;
    }
    return excludeFirstOccurrence(requestsInFlight, action.payload);
  }

  return requestsInFlight;
};

React.useEffect(() => {
    if (!message) {
      // This error is not mapped / translated yet,
      // we log, report it to sentry and show the original error, unless `error.code` is `invalid_scope`
      // which an error code emitted for expired project(s)
      if (
        props.error.code !== 'invalid_scope' &&
        !props.error.message.includes('has expired')
      ) {
        reportErrorToSentry(new Error('Unmapped error'), {
          extra: props.error,
        });
      }
    }
  }, [message]);
  if (!message) {

componentDidCatch(error, errorInfo) {
    this.setState({ hasError: true });
    // Note: In development mode componentDidCatch is not based on try-catch
    // to catch exceptions. Thus exceptions caught here will also be caught in
    // the global `error` event listener (setup-global-error-listener.js).
    // see: https://github.com/facebook/react/issues/10474
    reportErrorToSentry(error, { extra: errorInfo });
  }
  // Makes it easier to test

const hasDemandedPermission = hasPermission(options.demandedDataFence.name, {
    [options.actualDataFence.name]: true,
  });

  if (!hasDemandedPermission) return false;

  const selectedDataFenceData = options.selectDataFenceData({
    type: options.demandedDataFence.type,
    group: options.demandedDataFence.group,
    name: options.demandedDataFence.name,
    actualDataFenceValues: options.actualDataFence.dataFenceValue.values,
  });

  if (!selectedDataFenceData) {
    reportErrorToSentry(
      new Error(`missing mapper for type "${options.demandedDataFence.type}"`),
      { extra: options.demandedDataFence.type }
    );
    return false;
  }

  // it is enough to only have a subset of demanded dataFence data belonging to actual dataFence values
  return selectedDataFenceData.some(value =>
    options.actualDataFence.dataFenceValue.values.includes(value)
  );
};

it('should report error to sentry', async () => {
      console.error = jest.fn();
      reportErrorToSentry.mockClear();
      const error = new Error('Oops');
      const { getByText } = renderApp(
        ,
        {
          mocks: [
            {
              request: {
                query: FetchApplicationsMenu,
              },
              error,
            },
          ],

beforeEach(() => {
        reportErrorToSentry.mockClear();
        props = createTestProps();
        wrapper = shallow()
          .find(FetchUser)
          .renderProp('children')(userData);
      });
      it('should pass "user" to ', () => {

beforeEach(() => {
        reportErrorToSentry.mockClear();
        wrapper.instance().componentDidMount();
      });
      it('should report the error to sentry', () => {

beforeEach(() => {
        reportErrorToSentry.mockClear();
        wrapper.instance().componentDidMount();
      });
      it('should report the error to sentry', () => {

componentDidUpdate(prevProps) {
    if (prevProps.error !== this.props.error)
      reportErrorToSentry(this.props.error, {});
  }
  render() {