Merge pull request #726 from sharetribe/handle-missing-stripe-connection-in-checkout

Handle missing provider Stripe connection in CheckoutPage

src/containers/CheckoutPage/CheckoutPage.js

@@ -13,6 +13,7 @@ import { createSlug } from '../../util/urlHelpers';
 import {
   isTransactionInitiateAmountTooLowError,
   isTransactionInitiateListingNotFoundError,
+  isTransactionInitiateMissingStripeAccountError,
 } from '../../util/errors';
 import {
   AvatarMedium,
@@ -225,7 +226,8 @@ export class CheckoutPageComponent extends Component {
       currentUser &&
       hasRequiredData &&
       !listingNotFound &&
-      !initiateOrderError
+      !initiateOrderError &&
+      !speculateTransactionError
     );
 
     const listingTitle = currentListing.attributes.title;
@@ -270,6 +272,21 @@ export class CheckoutPageComponent extends Component {
         <FormattedMessage id="CheckoutPage.speculateTransactionError" />
       </p>
     ) : null;
+    let speculateErrorMessage = null;
+
+    if (isTransactionInitiateMissingStripeAccountError(speculateTransactionError)) {
+      speculateErrorMessage = (
+        <p className={css.orderError}>
+          <FormattedMessage id="CheckoutPage.providerStripeAccountMissingError" />
+        </p>
+      );
+    } else if (speculateTransactionError) {
+      speculateErrorMessage = (
+        <p className={css.orderError}>
+          <FormattedMessage id="CheckoutPage.speculateFailedMessage" />
+        </p>
+      );
+    }
 
     const topbar = (
       <div className={css.topbar}>
@@ -343,6 +360,7 @@ export class CheckoutPageComponent extends Component {
             <section className={css.paymentContainer}>
               {initiateOrderErrorMessage}
               {listingNotFoundErrorMessage}
+              {speculateErrorMessage}
               {showPaymentForm ? (
                 <StripePaymentForm
                   className={css.paymentForm}

src/translations/en.json

@@ -72,6 +72,8 @@
   "CheckoutPage.loadingData": "Loading checkout data…",
   "CheckoutPage.paymentInfo": "You'll only be charged if your request is accepted by the provider.",
   "CheckoutPage.priceBreakdownTitle": "Booking breakdown",
+  "CheckoutPage.providerStripeAccountMissingError": "The listing author has not added their payment information and the listing cannot be booked at the moment.",
+  "CheckoutPage.speculateFailedMessage": "Oops, something went wrong. Please refresh the page and try again.",
   "CheckoutPage.speculateTransactionError": "Failed to fetch breakdown information.",
   "CheckoutPage.title": "Book {listingTitle}",
   "ContactDetailsForm.confirmChangesInfo": "To change your email address, please enter your current password.",

src/util/errors.js

@@ -20,6 +20,7 @@ import {
   ERROR_CODE_EMAIL_NOT_VERIFIED,
   ERROR_CODE_TOO_MANY_VERIFICATION_REQUESTS,
   ERROR_CODE_UPLOAD_OVER_LIMIT,
+  ERROR_CODE_MISSING_STRIPE_ACCOUNT,
 } from './types';
 
 const errorAPIErrors = error => {
@@ -101,6 +102,14 @@ export const isPasswordRecoveryEmailNotVerifiedError = error =>
 export const isTransactionInitiateListingNotFoundError = error =>
   hasErrorWithCode(error, ERROR_CODE_TRANSACTION_LISTING_NOT_FOUND);
 
+/**
+ * Check if the given API error (from `sdk.transaction.initiate()` or
+ * `sdk.transaction.initiateSpeculative()`) is due to missign Stripe
+ * connection from the listing author.
+ */
+export const isTransactionInitiateMissingStripeAccountError = error =>
+  hasErrorWithCode(error, ERROR_CODE_MISSING_STRIPE_ACCOUNT);
+
 /**
  * Check if the given API error (from `sdk.transaction.initiate()`) is
  * due to the transaction total amount being too low for Stripe.

src/util/types.js

@@ -394,6 +394,7 @@ export const ERROR_CODE_UPLOAD_OVER_LIMIT = 'request-upload-over-limit';
 export const ERROR_CODE_VALIDATION_INVALID_PARAMS = 'validation-invalid-params';
 export const ERROR_CODE_NOT_FOUND = 'not-found';
 export const ERROR_CODE_FORBIDDEN = 'forbidden';
+export const ERROR_CODE_MISSING_STRIPE_ACCOUNT = 'transaction-missing-stripe-account';
 
 const ERROR_CODES = [
   ERROR_CODE_TRANSACTION_LISTING_NOT_FOUND,
@@ -409,6 +410,7 @@ const ERROR_CODES = [
   ERROR_CODE_VALIDATION_INVALID_PARAMS,
   ERROR_CODE_NOT_FOUND,
   ERROR_CODE_FORBIDDEN,
+  ERROR_CODE_MISSING_STRIPE_ACCOUNT,
 ];
 
 // API error