@riosst100/pwa-marketplace 3.0.5 → 3.0.6

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@riosst100/pwa-marketplace",
   "author": "riosst100@gmail.com",
-  "version": "3.0.5",
+  "version": "3.0.6",
   "main": "src/index.js",
   "pwa-studio": {
     "targets": {

package/src/componentOverrideMapping.js

@@ -1,4 +1,5 @@
 module.exports = componentOverrideMapping = {
+    ['@magento/peregrine/lib/talons/CheckoutPage/PaymentInformation/usePaymentMethods.js']: '@riosst100/pwa-marketplace/src/overwrites/peregrine/lib/talons/CheckoutPage/PaymentInformation/usePaymentMethods.js',
     ['@magento/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode/couponCode.js']: '@riosst100/pwa-marketplace/src/overwrites/venia-ui/lib/components/CartPage/PriceAdjustments/CouponCode/couponCode.js',
     ['@magento/peregrine/lib/talons/Header/useCartTrigger.js']: '@riosst100/pwa-marketplace/src/overwrites/peregrine/lib/talons/Header/useCartTrigger.js',
     ['@magento/peregrine/lib/talons/CartPage/useCartPage.js']: '@riosst100/pwa-marketplace/src/overwrites/peregrine/lib/talons/CartPage/useCartPage.js',

package/src/overwrites/peregrine/lib/talons/CheckoutPage/PaymentInformation/usePaymentMethods.js

@@ -0,0 +1,84 @@
+import { useCallback } from 'react';
+import { useMutation, useQuery } from '@apollo/client';
+import useFieldState from '@magento/peregrine/lib/hooks/hook-wrappers/useInformedFieldStateWrapper';
+import DEFAULT_OPERATIONS from '@magento/peregrine/lib/talons/CheckoutPage/PaymentInformation/paymentMethods.gql';
+import mergeOperations from '@magento/peregrine/lib/util/shallowMerge';
+
+import { useCartContext } from '@magento/peregrine/lib/context/cart';
+
+export const usePaymentMethods = props => {
+    const operations = mergeOperations(DEFAULT_OPERATIONS, props.operations);
+    const {
+        getPaymentMethodsQuery,
+        setPaymentMethodOnCartMutation
+    } = operations;
+
+    const [setPaymentMethod] = useMutation(setPaymentMethodOnCartMutation);
+
+    const [{ cartId }] = useCartContext();
+
+    const { data, loading } = useQuery(getPaymentMethodsQuery, {
+        skip: !cartId,
+        variables: { cartId }
+    });
+
+    const { value: currentSelectedPaymentMethod } = useFieldState(
+        'selectedPaymentMethod'
+    );
+
+    const availablePaymentMethods =
+        (data && data.cart.available_payment_methods) || [];
+
+    // If there is one payment method, select it by default.
+    // If more than one, none should be selected by default.
+    const defaultPaymentCode =
+        (availablePaymentMethods.length && availablePaymentMethods[0].code) ||
+        null;
+    const selectedPaymentCode =
+        (data && data.cart.selected_payment_method.code) || null;
+
+    const initialSelectedMethod =
+        availablePaymentMethods.length > 1
+            ? selectedPaymentCode
+            : null;
+
+    console.log('availablePaymentMethods.length',availablePaymentMethods.length)
+    console.log('defaultPaymentCode',defaultPaymentCode)
+    console.log('selectedPaymentCode',selectedPaymentCode)
+    console.log('initialSelectedMethod',initialSelectedMethod)
+
+    const handlePaymentMethodSelection = useCallback(
+        element => {
+            const value = element.target.value;
+
+            const paymentMethodData =
+                value == 'braintree'
+                    ? {
+                          code: value,
+                          braintree: {
+                              payment_method_nonce: value,
+                              is_active_payment_token_enabler: false
+                          }
+                      }
+                    : {
+                          code: value
+                      };
+
+            setPaymentMethod({
+                variables: {
+                    cartId,
+                    paymentMethod: paymentMethodData
+                }
+            });
+        },
+        [cartId, setPaymentMethod]
+    );
+
+    return {
+        availablePaymentMethods,
+        currentSelectedPaymentMethod,
+        handlePaymentMethodSelection,
+        initialSelectedMethod,
+        isLoading: loading
+    };
+};