How to use the @commercetools-frontend/sentry.reportErrorToSentry function in @commercetools-frontend/sentry

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)
  );
};

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

loadLocaleData = async (locale: string) => {
    try {
      if (!this.isUnmounting) {
        const messages = await loadI18n(locale);
        const applicationMessages = await loadApplicationMessages(
          this.props.applicationMessages,
          locale
        );
        this.setState({
          isLoading: false,
          locale,
          messages: mergeMessages(messages, applicationMessages),
        });
      }
    } catch (error) {
      reportErrorToSentry(error, {});
    }
  };

componentDidMount() {
    if (this.props.error) reportErrorToSentry(this.props.error, {});
  }
  componentDidUpdate(prevProps) {

async function run() {
        try {
          const data = await loadLocale(locale);
          !cleaning && dispatch({ type: 'ok', data });
        } catch (error) {
          reportErrorToSentry(error);
          !cleaning && dispatch({ type: 'error', error });
        }
      }
      run();

        error => reportErrorToSentry(error, {})
      );