Payment method will now throw an error in onComplete to handle obscur…

…e errors

.changeset/dull-olives-tap.md

@@ -0,0 +1,8 @@
+---
+'@graphcommerce/magento-payment-multisafepay': patch
+'@graphcommerce/magento-payment-included': patch
+'@graphcommerce/mollie-magento-payment': patch
+'@graphcommerce/magento-payment-adyen': patch
+---
+
+Payment method will now throw an error in onComplete to handle obscure errors

packages/magento-cart-payment-method/PaymentMethodPlaceOrderNoop/PaymentMethodPlaceOrderNoop.tsx

@@ -1,5 +1,6 @@
 import { useFormGqlMutationCart } from '@graphcommerce/magento-cart'
 import { useFormCompose } from '@graphcommerce/react-hook-form'
+import { t } from '@lingui/macro'
 import { PaymentPlaceOrderProps } from '../Api/PaymentMethod'
 import { usePaymentMethodContext } from '../PaymentMethodContext/paymentMethodContextType'
 import { PaymentMethodPlaceOrderNoopDocument } from './PaymentMethodPlaceOrderNoop.gql'
@@ -10,7 +11,11 @@ export function PaymentMethodPlaceOrderNoop(props: PaymentPlaceOrderProps) {
 
   const form = useFormGqlMutationCart(PaymentMethodPlaceOrderNoopDocument, {
     onComplete: async (result) => {
-      if (!result.data?.placeOrder?.order) return
+      if (!result.data?.placeOrder?.order)
+        throw Error(
+          t`An error occurred while processing your payment. Please contact the store owner`,
+        )
+
       await onSuccess(result.data.placeOrder.order.order_number)
     },
     submitWhileLocked: true,

packages/magento-payment-adyen/components/AdyenPaymentOptionsAndPlaceOrder/AdyenPaymentOptionsAndPlaceOrder.tsx

@@ -5,13 +5,14 @@ import {
   usePaymentMethodContext,
 } from '@graphcommerce/magento-cart-payment-method'
 import { FormRow } from '@graphcommerce/next-ui'
+import { t } from '@lingui/macro'
 import { useRouter } from 'next/router'
 import { useAdyenCartLock } from '../../hooks/useAdyenCartLock'
 import { useAdyenPaymentMethod } from '../../hooks/useAdyenPaymentMethod'
 import {
+  AdyenPaymentOptionsAndPlaceOrderDocument,
   AdyenPaymentOptionsAndPlaceOrderMutation,
   AdyenPaymentOptionsAndPlaceOrderMutationVariables,
-  AdyenPaymentOptionsAndPlaceOrderDocument,
 } from './AdyenPaymentOptionsAndPlaceOrder.gql'
 
 /** It sets the selected payment method on the cart. */
@@ -44,7 +45,13 @@ export function HppOptions(props: PaymentOptionsProps) {
       const merchantReference = result.data?.placeOrder?.order.order_number
       const action = result?.data?.placeOrder?.order.adyen_payment_status?.action
 
-      if (result.errors || !merchantReference || !selectedMethod?.code || !action) return
+      if (result.errors) return
+
+      if (!merchantReference || !selectedMethod?.code || !action) {
+        throw Error(
+          t`An error occurred while processing your payment. Please contact the store owner`,
+        )
+      }
 
       const url = JSON.parse(action).url as string
       await lock({ method: selectedMethod.code, adyen: '1', merchantReference })

packages/magento-payment-braintree/methods/braintree_paypal/PaymentMethodOptions.tsx

@@ -8,7 +8,6 @@ import { useFormCompose } from '@graphcommerce/react-hook-form'
 import type { FlowType, Intent } from 'paypal-checkout-components'
 import { useEffect } from 'react'
 import { BraintreePaymentMethodOptionsDocument } from '../../BraintreePaymentMethodOptions.gql'
-import { StartPaymentOptions } from '../../hooks/useBraintree'
 import { useBraintreeCartLock } from '../../hooks/useBraintreeCartLock'
 import { useBraintreePaypal } from '../../hooks/useBraintreePaypal'
 import { isBraintreeError } from '../../utils/isBraintreeError'
@@ -44,8 +43,6 @@ export function PaymentMethodOptions(props: PaymentOptionsProps) {
 
       const address = cartData.cart.shipping_addresses?.[0]
 
-      console.log('hoi')
-
       const nonce = await paypal.createPayment({
         flow: 'checkout' as FlowType, // Required
         amount: cartData.cart.prices.grand_total.value,

packages/magento-payment-multisafepay/components/MSPPaymentPlaceOrder/MSPPaymentPlaceOrder.tsx

@@ -1,4 +1,4 @@
-import { useFormCompose, ApolloErrorSnackbar } from '@graphcommerce/ecommerce-ui'
+import { ApolloErrorSnackbar, useFormCompose } from '@graphcommerce/ecommerce-ui'
 import { useMutation } from '@graphcommerce/graphql'
 import { useCartQuery, useFormGqlMutationCart } from '@graphcommerce/magento-cart'
 import { BillingPageDocument } from '@graphcommerce/magento-cart-checkout'
@@ -7,6 +7,7 @@ import {
   usePaymentMethodContext,
 } from '@graphcommerce/magento-cart-payment-method'
 import { ErrorSnackbar } from '@graphcommerce/next-ui'
+import { t } from '@lingui/macro'
 import { useRouter } from 'next/router'
 import { useMSPCartLock } from '../../hooks/useMSPCartLock'
 import { MSPPaymentHandlerDocument } from '../MSPPaymentHandler/MSPPaymentHandler.gql'
@@ -30,14 +31,12 @@ export function MSPPaymentPlaceOrder(props: PaymentPlaceOrderProps) {
     onComplete: async (result, variables) => {
       const url = result.data?.placeOrder?.order.multisafepay_payment_url
 
-      if (result.errors) {
-        console.error('<MSPPaymentOptionsAndPlaceOrder/>', result.errors)
-        return
-      }
+      if (result.errors) return
 
       if (!selectedMethod?.code) {
-        console.error('<MSPPaymentOptionsAndPlaceOrder/> not selectedMethod.code')
-        return
+        throw Error(
+          t`An error occurred while processing your payment. Please contact the store owner`,
+        )
       }
 
       if (url?.error || !url?.payment_url) {

packages/mollie-magento-payment/components/MolliePlaceOrder/MolliePlaceOrder.tsx

@@ -1,6 +1,7 @@
 import { useFormGqlMutationCart } from '@graphcommerce/magento-cart'
 import { PaymentPlaceOrderProps } from '@graphcommerce/magento-cart-payment-method'
 import { useFormCompose } from '@graphcommerce/react-hook-form'
+import { t } from '@lingui/macro'
 import { useRouter } from 'next/router'
 import { useCartLockWithToken } from '../../hooks/useCartLockWithToken'
 import { MolliePlaceOrderDocument } from './MolliePlaceOrder.gql'
@@ -37,12 +38,9 @@ export function MolliePlaceOrder(props: PaymentPlaceOrderProps) {
 
         await push(mollie_redirect_url)
       } else {
-        console.error(`incomplete mollie response, cannot redirect`, data.placeOrder)
-
-        form.setError('root', {
-          message:
-            'An error occurred while processing your payment. Please contact the store owner',
-        })
+        throw Error(
+          t`An error occurred while processing your payment. Please contact the store owner`,
+        )
       }
     },
   })