React Native Reader SDK Checkout Already In Progress

We have installed;
react-native-square-reader-sdk: 1.4.0
react-native: 0.63.2
on an iphone react-native app

When we are using the app we occasionally get “rn_checkout_already_in_progress” error and have no choice but to restart our app and thus need to recreate the order in order to checkout again. This becomes a huge hassle for our restaurant.

There is no way to cancel the checkout in progress. We’ve tried adding parameters to stop calling startCheckoutAsync if it’s in progress but this error still happens.
What can we do to prevent this?

import {
  CheckoutErrorCanceled,
  CheckoutErrorSdkNotAuthorized, ReaderSettingsErrorSdkNotAuthorized,
  startCheckoutAsync, startReaderSettingsAsync, UsageError,
} from 'react-native-square-reader-sdk';

// more code ...

  const onSquarePayment = useCallback(async () => {
    // A checkout parameter is required for this checkout method
    const checkoutParams = {
      amountMoney: {
        amount: total.value,
        currencyCode: CURRENCY,
      },
      skipReceipt: false,
      collectSignature: false,
      allowSplitTender: true,
      note: '',
      tipSettings: {
        showCustomTipField: true,
        showSeparateTipScreen: false,
        tipPercentages: [15, 20, 30],
      },
      additionalPaymentTypes: ['cash', 'manual_card_entry'],
    };

    Sentry.addBreadcrumb({ category: 'message', message: 'Square payment button pressed' });

    if (!squareReaderProcessInProgress) {
      Sentry.addBreadcrumb({ category: 'message', message: 'Starting square payment flow' });
      dispatch(setSquareReaderInProgress(true));
      try {
        const squareReaderSdkResponse = await startCheckoutAsync(checkoutParams);

        dispatch(setSquareReaderInProgress(false));
        Sentry.addBreadcrumb({ category: 'message', message: `Square checkout flow complete, charged ${centsToPrice(squareReaderSdkResponse.totalMoney.amount)}` });
        Sentry.captureMessage('Square payment flow completed successfully charged');
        onPaymentSuccess(squareReaderSdkResponse);
      } catch (e) {
        dispatch(setSquareReaderInProgress(false));
        const errorMessage = (e as Error).message;
        Sentry.captureMessage(errorMessage);
        switch (e.code) {
          case CheckoutErrorCanceled:
            onPaymentFailed('Checkout cancelled!');
            Sentry.captureException(new Error(`Checkout Cancelled: ${e.debugCode}:${e.debugMessage}`));
            break;
          case CheckoutErrorSdkNotAuthorized:
            Sentry.captureException(new Error(`Checkout Error (square SDK not authorized): ${e.debugCode}:${e.debugMessage}`));
            navigate(PAYMENT_SCREENS.Deauthorizing);
            break;
          case UsageError:
          default:
            onPaymentFailed(`Unknown error (code ${e.code}) ${errorMessage}`);
            Sentry.captureException(new Error(`Checkout Usage Error: ${e.debugCode}:${e.debugMessage}`));
            break;
        }

      }
    } else {
      Sentry.captureMessage('Attempted to start square payment flow while square process already in progress');
    }
  }, [squareReaderProcessInProgress, onPaymentSuccess, onPaymentFailed, totalValue]);

:wave: Thanks for reaching out. There is a fix for this in the latest version of the Readers SDK 1.5.3. If you update to that version it will take care of this error. :slightly_smiling_face:

@Bryan-Square thanks for the quick response, do you know if there is a new xcframework as well that I would need to download?

Hey Bryan, the latest version i see in github is 1.4.0 (aka perhaps you were thinking of square in app payments sdk)

The repo contains a React Native plugin for Square Reader SDK. Reader SDK for React Native supports iOS: 1.4.9 and above
Android: 1.4.4 and above . You will need to target the SDK version 1.5.3 if you to target other versions of Reader SDK. :slightly_smiling_face: