How to use the @sentry/browser.withScope function in @sentry/browser

export function captureException(error: any, extra: any = {}) {
  Sentry.withScope((scope) => {
    each(extra, (data, key) => {
      scope.setExtra(key, extra[key]);
    });

    Sentry.captureException(error);

    console.error(error); // eslint-disable-line no-console
    if (size(extra) > 0) console.error(extra); // eslint-disable-line no-console
  });
}

componentDidCatch(error, errorInfo) {
    // Catch errors in any components below and re-render with error message
    this.setState({
      error: error,
      errorInfo: errorInfo
    });
    // You can also log error messages to an error reporting service here
    Sentry.withScope(scope => {
      Object.keys(errorInfo).forEach(key => {
        scope.setExtra(key, errorInfo[key]);
      });
      Sentry.captureException(error);
    });
  }
  refresh() {

componentDidMount() {
    Sentry.withScope(() => {
      Sentry.captureMessage('404 - Module Not Found');
    });

    // If we think this is a module, try checking for archived modules
    if (this.props.moduleCode.match(MODULE_CODE_REGEX)) {
      this.props.fetchModuleArchive(this.props.moduleCode);
    }
  }

function reportError(
  error: Error,
  extra?: {
    [key: string]: any
  },
) {
  if (!IN_PRODUCTION_MODE) {
    console.error(error)
    console.error('Extra:\n', extra)
    return
  }

  Sentry.withScope(scope => {
    if (extra) {
      Object.keys(extra).forEach(key => {
        scope.setExtra(key, extra[key])
      })
    }
    Sentry.captureException(error)
  })
}

componentDidCatch(error, errorInfo) {
        this.setState({ error });

        Sentry.withScope(scope => {
            scope.setExtras(errorInfo);
            const eventId = Sentry.captureException(error);
            this.setState({ eventId });
        });
    }

componentDidCatch(error, errorInfo) {
    Sentry.withScope(scope => {
      Object.keys(errorInfo).forEach(key => {
        scope.setExtra(key, errorInfo[key]);
      });

      Sentry.captureException(error);
    });

    super.componentDidCatch(error, errorInfo);
  }

componentDidCatch(error, errorInfo) {
		this.setState({
			error: true,
		});
		Sentry.withScope(scope => {
			Object.keys(errorInfo).forEach(key => {
				scope.setExtra(key, errorInfo[key]);
			});
			Sentry.captureException(error);
		});
	}

public componentDidCatch(error: any, errorInfo: React.ErrorInfo): void {
        sentry.withScope(scope => {
            for (const [key, value] of Object.entries(errorInfo)) {
                scope.setExtra(key, value)
            }
            sentry.captureException(error)
        })
    }