@storecraft/payments-stripe 1.0.17 → 1.3.0

package/README.md

@@ -71,13 +71,10 @@ const app = new App(config)
 .withPlatform(new NodePlatform())
 .withDatabase(new MongoDB())
 .withStorage(new GoogleStorage())
-.withPaymentGateways(
-  {
-    'stripe': new Stripe() // config can be inferred from env variables
-  }
-);
-
-await app.init();
+.withPaymentGateways({
+  stripe: new Stripe() // config can be inferred from env variables
+})
+.init();
 
 ```
 

package/adapter.html.js

@@ -13,7 +13,7 @@
  * Or use the following dummy details:
  * https://docs.stripe.com/testing?testing-method=card-numbers
  * - Card number: 4242424242424242
- * - Expiry date: 12/2027
+ * - Expiry date:   
  * - CVC code: 897
  * 
  * @param {Config} config 
@@ -37,7 +37,33 @@ export default function html_buy_ui(config, order_data) {
     <script defer>
       // This is your test publishable API key.
       const stripe = new Stripe("${config.publishable_key}");
+      const dispatchEvent = (event, data) => {
+        window?.parent?.postMessage(
+          {
+            who: "storecraft",
+            event,
+            data
+          },
+          "*"
+        );
+      }
+      // Override console.log to send messages to the parent window
+      console.log = function(...args) {
+        // Log to console
+        dispatchEvent(
+          "storecraft/checkout-log",
+          args
+        );
+      };
 
+      console.error = function(...args) {
+        // Log to console
+        dispatchEvent(
+          "storecraft/checkout-error",
+          args
+        );
+      };
+              
       let elements;
 
       window.onload = function() {
@@ -73,20 +99,34 @@ export default function html_buy_ui(config, order_data) {
         const { error } = await stripe.confirmPayment({
           elements,
           confirmParams: {
-            // Make sure to change this to your payment completion page
-            return_url: "https://storecraft.app/",
+            // return to this same page, which can also interpret the
+            // payment intent status from the URL parameters
+            return_url: window.location.href,
           },
+          redirect: 'if_required'
         });
 
         // This point will only be reached if there is an immediate error when
         // confirming the payment. Otherwise, your customer will be redirected to
-        // your \`return_url\`. For some payment methods like iDEAL, your customer will
+        // your \`return_url\` unless 'if_required' ise set. For some payment methods like iDEAL, your customer will
         // be redirected to an intermediate site first to authorize the payment, then
         // redirected to the \`return_url\`.
-        if (error.type === "card_error" || error.type === "validation_error") {
-          showMessage(error.message);
+        if(error) {
+          dispatchEvent("storecraft/checkout-error", {
+            order_id: "${order_data.id}"
+          }); 
+
+          if (error.type === "card_error" || error.type === "validation_error") {
+            showMessage(error.message);
+          } else if(error) {
+            showMessage("An unexpected error occurred.");
+          }
         } else {
-          showMessage("An unexpected error occurred.");
+          // if 'if_required' is set and no redirect is needed,
+          // Payment succeeded, you can show a success message to your customer
+          dispatchEvent("storecraft/checkout-complete", {
+            order_id: "${order_data.id}"
+          }); 
         }
 
         setLoading(false);
@@ -107,6 +147,10 @@ export default function html_buy_ui(config, order_data) {
         switch (paymentIntent.status) {
           case "succeeded":
             showMessage("Payment succeeded!");
+            dispatchEvent("storecraft/checkout-complete", {
+              order_id: "${order_data.id}"
+            }); 
+
             break;
           case "processing":
             showMessage("Your payment is processing.");
@@ -116,6 +160,9 @@ export default function html_buy_ui(config, order_data) {
             break;
           default:
             showMessage("Something went wrong.");
+            dispatchEvent("storecraft/checkout-error", {
+              order_id: "${order_data.id}"
+            }); 
             break;
         }
       }
@@ -128,6 +175,8 @@ export default function html_buy_ui(config, order_data) {
         messageContainer.classList.remove("hidden");
         messageContainer.textContent = messageText;
 
+        console.log(messageText);
+
         setTimeout(function () {
           messageContainer.classList.add("hidden");
           messageContainer.textContent = "";
@@ -158,23 +207,21 @@ export default function html_buy_ui(config, order_data) {
 
       body {
         font-family: -apple-system, BlinkMacSystemFont, sans-serif;
-        font-size: 16px;
+        font-size: 10px;
         -webkit-font-smoothing: antialiased;
+        height: content;
+        background-color: white;
         display: flex;
-        justify-content: center;
-        align-content: center;
-        height: 100vh;
-        width: 100vw;
+        flex-direction: column;
+        justify-content: start;
+        align-items: center;
       }
 
       form {
-        width: 30vw;
-        min-width: 500px;
+        width: 100%;
+        max-width: 500px;
+        mmmin-width: 500px;
         align-self: center;
-        box-shadow: 0px 0px 0px 0.5px rgba(50, 50, 93, 0.1),
-          0px 2px 5px 0px rgba(50, 50, 93, 0.1), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.07);
-        border-radius: 7px;
-        padding: 40px;
       }
 
       .hidden {
@@ -287,12 +334,6 @@ export default function html_buy_ui(config, order_data) {
         }
       }
 
-      @media only screen and (max-width: 600px) {
-        form {
-          width: 80vw;
-          min-width: initial;
-        }
-      }
 
     </style>
   </head>

package/adapter.js

@@ -20,20 +20,22 @@ import { Stripe as StripeCls } from 'stripe'
  */
 
 /**
- * @description in a {@link StripeCls.PaymentIntent}, is a `metadata` key-value
- * storage where we store the `order_id` of the `storecraft` order.
+ * @description in a {@link StripeCls.PaymentIntent}, 
+ * is a `metadata` key-value storage where we store the 
+ * `order_id` of the `storecraft` order.
  */
 export const metadata_storecraft_order_id = 'storecraft_order_id'
 
 /**
  * @implements {Impl}
  * 
- * @description **Stripe** gateway (https://docs.stripe.com/payments/place-a-hold-on-a-payment-method)
+ * @description **Stripe** gateway 
+ * (https://docs.stripe.com/payments/place-a-hold-on-a-payment-method)
  */
 export class Stripe {
   
   /** @satisfies {ENV<Config>} */
-  static EnvConfig = /** @type{const} */ ({
+  static EnvConfig = /** @type {const} */ ({
     publishable_key: 'STRIPE_PUBLISHABLE_KEY',
     secret_key: 'STRIPE_SECRET_KEY',
     webhook_endpoint_secret: 'STRIPE_WEBHOOK_SECRET',
@@ -43,7 +45,6 @@ export class Stripe {
   /** @type {StripeCls} */ #stripe;
 
   /**
-   * 
    * @param {Config} config 
    */
   constructor(config={}) {
@@ -56,6 +57,7 @@ export class Stripe {
         automatic_payment_methods: {
           enabled: true,
         },
+        capture_method: 'manual',
         payment_method_options: {
           card: {
             capture_method: 'manual',
@@ -69,15 +71,18 @@ export class Stripe {
   /** @type {Impl["onInit"]} */
   onInit = (app) => {
     this.config.publishable_key ??=
-        app.platform.env[Stripe.EnvConfig.publishable_key];
+      app.env[Stripe.EnvConfig.publishable_key];
+
     this.config.secret_key ??= 
-        app.platform.env[Stripe.EnvConfig.secret_key];
+      app.env[Stripe.EnvConfig.secret_key];
+      
     this.config.webhook_endpoint_secret ??= 
-        app.platform.env[Stripe.EnvConfig.webhook_endpoint_secret];
+      app.env[Stripe.EnvConfig.webhook_endpoint_secret];
   }
 
   get stripe() {
-    const is_valid = this.config.publishable_key && this.config.secret_key;
+    const is_valid = this.config.publishable_key && 
+      this.config.secret_key;
 
     if(!is_valid) {
       throw new StorecraftError(
@@ -96,7 +101,7 @@ export class Stripe {
   get info() {
     return {
       name: 'Stripe',
-      description: `Stripe powers online and in-person payment processing and financial solutions for businesses of all sizes.`,
+      description: `Pay with Credit Card and other payment methods`,
       url: 'https://docs.stripe.com/payments/place-a-hold-on-a-payment-method',
       logo_url: 'https://images.ctfassets.net/fzn2n1nzq965/HTTOloNPhisV9P4hlMPNA/cacf1bb88b9fc492dfad34378d844280/Stripe_icon_-_square.svg?q=80&w=256'
     }
@@ -127,7 +132,6 @@ export class Stripe {
   }
 
   /**
-   * 
    * @type {Impl["invokeAction"]}
    */
   invokeAction(action_handle) {
@@ -146,7 +150,6 @@ export class Stripe {
 
   /**
    * @description (Optional) buy link ui
-   * 
    * @type {Impl["onBuyLinkHtml"]}
    */
   async onBuyLinkHtml(order) {
@@ -158,7 +161,6 @@ export class Stripe {
 
   /**
    * @description on checkout create `hook`
-   * 
    * @type {Impl["onCheckoutCreate"]}
    */
   async onCheckoutCreate(order) {
@@ -182,7 +184,6 @@ export class Stripe {
    * They advocate async flows where confirmation happens async from
    * client side into their servers, and then you are notified via a
    * webhook.
-   * 
    * @type {Impl["onCheckoutComplete"]}  
    */
   async onCheckoutComplete(create_result) {
@@ -226,7 +227,6 @@ export class Stripe {
 
   /**
    * @description Fetch the order and analyze it's status
-   * 
    * @type {Impl["status"]}
    */
   async status(create_result) {
@@ -255,7 +255,10 @@ export class Stripe {
       );
     }
     if(lc?.refunded) {
-      const date = lc?.refunds?.data?.[0]?.created ? (new Date(lc?.refunds?.data?.[0]?.created).toUTCString()) : 'unknown time';
+      const date = lc?.refunds?.data?.[0]?.created ? 
+        (new Date(lc?.refunds?.data?.[0]?.created).toUTCString()) : 
+        'unknown time';
+
       stat.messages.push(
         `**${fmt(lc.amount_refunded)}** was \`REFUNDED\` at \`${date}\``,
       );
@@ -266,7 +269,8 @@ export class Stripe {
       stat.messages.push(
         ...[
           `Intent was \`CANCELLED\` at \`${date}\`.`,
-          o.cancellation_reason && `Cancellation reason is ${o.cancellation_reason}`
+          o.cancellation_reason && 
+            `Cancellation reason is ${o.cancellation_reason}`
         ].filter(Boolean)
       );
     }
@@ -276,24 +280,20 @@ export class Stripe {
 
   /**
    * @description [https://docs.stripe.com/webhooks](https://docs.stripe.com/webhooks)
-   * 
    * @type {Impl["webhook"]}
    */
   async webhook(request, response) {
     const sig = request.headers.get('Stripe-Signature');
 
-    let event;
-  
-    event = await this.stripe.webhooks.constructEventAsync(
+    let event = await this.stripe.webhooks.constructEventAsync(
       request.rawBody, sig, this.config.webhook_endpoint_secret, undefined,
       StripeCls.createSubtleCryptoProvider()
     );
-  
-    let order_id;
-    /** @type {StripeCls.PaymentIntent} */
-    let payment_intent;
 
-    /** @type {PaymentOptionsEnum[keyof PaymentOptionsEnum]} */
+    /** @type {string} */
+    let order_id = undefined;
+
+    /** @type {typeof PaymentOptionsEnum[keyof typeof PaymentOptionsEnum]} */
     let payment_status = PaymentOptionsEnum.unpaid;
     
     // Handle the event
@@ -302,34 +302,41 @@ export class Stripe {
       case 'payment_intent.payment_failed':
       case 'payment_intent.requires_action':
       case 'payment_intent.amount_capturable_updated':
-      case 'payment_intent.canceled':
-        payment_intent = event.data.object;
+      case 'payment_intent.canceled': {
+        const payment_intent = event.data.object;
         order_id = payment_intent.metadata[metadata_storecraft_order_id];
 
         if(payment_intent.status==='requires_capture')
           payment_status = PaymentOptionsEnum.authorized;
         else if(payment_intent.status==='canceled')
-          payment_status = PaymentOptionsEnum.unpaid;
+          payment_status = PaymentOptionsEnum.cancelled;
         else if(payment_intent.status==='processing')
           payment_status = PaymentOptionsEnum.unpaid;
         else if(payment_intent.status==='requires_action')
           payment_status = PaymentOptionsEnum.unpaid;
         else if(payment_intent.status==='succeeded')
           payment_status = PaymentOptionsEnum.captured;
-        
+
         break;
+      }
       case 'charge.refunded':
       case 'charge.refund.updated':
+        const payment_intent = event.data.object;
+        order_id = payment_intent.metadata[metadata_storecraft_order_id];
         payment_status = PaymentOptionsEnum.refunded;
         break;
       default: {
-        console.log(`Unhandled event type ${event.type}`);
-
-
+        console.log(`Stripe:: We don't handle event of type ${event.type}`);
 
         return undefined;
       }
     }
+
+    if(!order_id) {
+      throw new Error(
+        `No 'storecraft' 'order_id' found in metadata for event type ${event.type}`
+      )
+    }
   
     // Return a response to acknowledge receipt of the event
     response.sendJson({received: true});    
@@ -345,9 +352,8 @@ export class Stripe {
 
   /**
    * @description Retrieve latest order payload
-   * 
-   * @param {CheckoutCreateResult} create_result first create result, holds `Stripe` intent
-   * 
+   * @param {CheckoutCreateResult} create_result 
+   * first create result, holds `Stripe` intent
    */
   retrieve_order = (create_result) => {
     return this.stripe.paymentIntents.retrieve(
@@ -362,7 +368,6 @@ export class Stripe {
 
   /**
    * @description todo: logic for if user wanted capture at approval
-   * 
    * @param {CheckoutCreateResult} create_result 
    */
   async cancel(create_result) {
@@ -378,7 +383,6 @@ export class Stripe {
 
   /**
    * @description todo: logic for if user wanted capture at approval
-   * 
    * @param {CheckoutCreateResult} create_result 
    */
   async capture(create_result) {
@@ -394,7 +398,6 @@ export class Stripe {
 
   /**
    * @description todo: logic for if user wanted capture at approval
-   * 
    * @param {CheckoutCreateResult} create_result 
    */
   async refund(create_result) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storecraft/payments-stripe",
-  "version": "1.0.17",
+  "version": "1.3.0",
   "description": "Official Storecraft <-> Stripe integration",
   "license": "MIT",
   "author": "Tomer Shalev (https://github.com/store-craft)",
@@ -21,8 +21,7 @@
   "types": "types.public.d.ts",
   "scripts": {
     "payments-stripe:test": "uvu -c",
-    "test": "npm run payments-stripe:test",
-    "prepublishOnly": "npm version patch --force"
+    "test": "npm run payments-stripe:test"
   },
   "dependencies": {
     "stripe": "^16.6.0"