Website: Update self-service license dispenser (#12987)

Related to: https://github.com/fleetdm/confidential/issues/3219

Changes:
- Updated `save-billing-info-and-continue.js` to check a new
subscription's invoice before completing the order.
- Added a new error message to the self-service license dispenser to
tell users signing up if a card provided requires additional
verification.
...
...

website/api/controllers/customers/save-billing-info-and-subscribe.js

@@ -60,6 +60,11 @@ module.exports = {
       responseType: 'badRequest'
     },
 
+    cardVerificationRequired: {
+      description: 'The billing card provided requires additional verfication before it can be used.',
+      responseType: 'badRequest'
+    },
+
   },
 
 
@@ -103,6 +108,7 @@ module.exports = {
     });
 
     // Create the subscription for this order in Stripe
+    // [?]: https://stripe.com/docs/api/subscriptions/create?lang=node
     const subscription = await stripe.subscriptions.create({
       customer: this.req.me.stripeCustomerId,
       items: [
@@ -113,6 +119,18 @@ module.exports = {
       ],
     });
 
+    // Get the Stripe ID of the invoice for this subscription.
+    let latestInvoiceIdForThisSubscription = subscription.latest_invoice;
+
+    // Get the invoice from Stripe.
+    const invoice = await stripe.invoices.retrieve(latestInvoiceIdForThisSubscription);// [?]: https://stripe.com/docs/api/invoices/retrieve?lang=node
+
+    if(!invoice.paid) {
+      // If the invoice is not paid, we will throw an error, and ask the customer to contact support.
+      // FUTURE: Send an invoice to the customer and update the recieve-from-stripe webhook to handle off-website invoice payments.
+      throw 'cardVerificationRequired';
+    }
+
     // Generate the license key for this subscription
     let licenseKey = await sails.helpers.createLicenseKey.with({
       numberOfHosts: quoteRecord.numberOfHosts,

website/views/pages/customers/new-license.ejs

@@ -41,7 +41,7 @@
         </div>
         <div class="card card-body mt-3" v-if="showBillingForm">
           <h3 class="pb-3">Billing information</h3>
-          <ajax-form action="saveBillingInfoAndSubscribe" :syncing.sync="syncing" :cloud-error.sync="cloudError" :form-errors.sync="formErrors" :form-data="formData" :form-rules="billingFormRules" @submitted="submittedPaymentForm()" v-if="!cloudError || cloudError === 'couldNotSaveBillingInfo'">
+          <ajax-form action="saveBillingInfoAndSubscribe" :syncing.sync="syncing" :cloud-error.sync="cloudError" :form-errors.sync="formErrors" :form-data="formData" :form-rules="billingFormRules" @submitted="submittedPaymentForm()" v-if="!cloudError || cloudError === 'couldNotSaveBillingInfo' || cloudError === 'cardVerificationRequired'">
             <div class="form-group">
               <label for="card">Billing Card</label>
               <stripe-card-element class="mb-3" id="card" busy.sync="syncing" :is-errored.sync="formErrors.paymentSource" :stripe-publishable-key="stripePublishableKey"
@@ -71,7 +71,10 @@
               </div>
             </div>
             <cloud-error purpose="cloud-error" v-if="cloudError === 'couldNotSaveBillingInfo'">
-              <p>The billing card provided could not be used. Please use another card or <a href="/contact" target="_blank">contact support</a></p>
+              <p>The billing card provided could not be used. Please use another card or <a href="/contact" target="_blank">contact support</a>.</p>
+            </cloud-error>
+            <cloud-error purpose="cloud-error" v-else-if="cloudError === 'cardVerificationRequired'">
+              <p>The billing card provided could not be used without additional verification. Please use another card or <a href="/contact" target="_blank">contact support</a> to complete your order.</p>
             </cloud-error>
             <ajax-button style="height: 40px;" purpose="submit-button" spinner="true" :syncing="syncing" class="btn btn-block btn-lg btn-info mt-4">Get license key</ajax-button>
           </ajax-form>