@riosst100/pwa-marketplace 2.6.3 → 2.6.5

package/package.json

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

package/src/components/FilterTop/FilterBlockList/filterTopItem.js

@@ -63,8 +63,10 @@ const FilterTopItem = props => {
 
     let newfilterSearchArr = search ? search.split('&') : [];
     newfilterSearchArr = newfilterSearchArr.filter(function(data) {
-        return !data.includes('card_game%5Bfilter%5D');
+        return !data.includes(group + '%5Bfilter%5D');
     });
+
+    // alert(group)
     
     let filterSearch = newfilterSearchArr.join('&')
 

package/src/components/PaymentMethod/PaypalExpress/index.js

@@ -0,0 +1 @@
+export {default} from './paypalExpress';

package/src/components/PaymentMethod/PaypalExpress/paypalExpress.css

@@ -0,0 +1,25 @@
+.root {
+    padding-top: 1.125rem;
+}
+
+.title {
+    font-weight: var(--venia-global-fontWeight-semibold);
+}
+
+.mailingAddressTitle {
+    font-weight: var(--venia-global-fontWeight-semibold);
+    padding-top: 1rem;
+}
+
+.note {
+    padding: 1rem 0;
+}
+
+.formatAddress {
+    padding: 0.5rem 0;
+}
+
+.addressLine {
+    display: block;
+    padding-bottom: 0.5rem;
+}

package/src/components/PaymentMethod/PaypalExpress/paypalExpress.js

@@ -0,0 +1,62 @@
+import React from 'react';
+import {mergeClasses} from '@magento/venia-ui/lib/classify';
+import {shape, string, bool, func} from 'prop-types';
+import BillingAddress from '@magento/venia-ui/lib/components/CheckoutPage/BillingAddress';
+
+import {usePaypalExpress} from '../../talons/PaymentMethod/PaypalExpress/usePaypalExpress';
+import defaultClasses from './paypalExpress.css';
+import {FormattedMessage} from 'react-intl';
+
+/**
+ *
+ * @param props
+ * @returns {JSX.Element}
+ * @constructor
+ */
+const PaypalExpress = props => {
+    const classes = mergeClasses(defaultClasses, props.classes);
+
+    const {
+        resetShouldSubmit,
+        onPaymentSuccess,
+        onPaymentError,
+        currentSelectedPaymentMethod
+    } = props;
+
+    const {
+        onBillingAddressChangedError,
+        onBillingAddressChangedSuccess
+    } = usePaypalExpress({
+        resetShouldSubmit,
+        onPaymentSuccess,
+        onPaymentError,
+        currentSelectedPaymentMethod
+    });
+
+    return (
+        <div className={classes.root}>
+            <p className={classes.note}>
+                <FormattedMessage
+                    id={'multiSafepayPayment.note'}
+                    defaultMessage={'Note: You will be redirected to the payment page.'}
+                />
+            </p>
+            <BillingAddress
+                shouldSubmit={props.shouldSubmit}
+                resetShouldSubmit={resetShouldSubmit}
+                onBillingAddressChangedError={onBillingAddressChangedError}
+                onBillingAddressChangedSuccess={onBillingAddressChangedSuccess}
+            />
+        </div>
+    );
+};
+
+PaypalExpress.propTypes = {
+    classes: shape({root: string}),
+    shouldSubmit: bool.isRequired,
+    onPaymentSuccess: func,
+    onPaymentError: func,
+    resetShouldSubmit: func.isRequired
+};
+
+export default PaypalExpress;

package/src/components/PaymentMethod/paypal_express/index.js

@@ -0,0 +1 @@
+export {default} from '../PaypalExpress/paypalExpress';

package/src/intercept.js

@@ -221,6 +221,22 @@ module.exports = targets => {
     return routesArray;
   });
 
+  const paymentMethods = [
+    'paypal_express'
+  ];
+
+  const veniaTargets = targets.of('@magento/venia-ui');
+  const gatewaysPath = '@riosst100/pwa-marketplace/src/components/PaymentMethod/';
+
+  paymentMethods.map(method =>
+    veniaTargets.checkoutPagePaymentTypes.tap(checkoutPagePaymentTypes =>
+      checkoutPagePaymentTypes.add({
+        paymentCode: method,
+        importPath: gatewaysPath + method
+      })
+    )
+  );
+
   // targets.of('@magento/venia-ui').checkoutPagePaymentTypes.tap(checkoutPagePaymentTypes =>
   //   checkoutPagePaymentTypes.add({
   //     paymentCode: 'xendit',

package/src/overwrites/venia-ui/lib/components/CheckoutPage/PaymentInformation/paymentMethods.js

@@ -37,6 +37,8 @@ const PaymentMethods = props => {
         return null;
     }
 
+    console.log('payments', payments)
+
     const radios = availablePaymentMethods
         .map(({ code, title }) => {
             // If we don't have an implementation for a method type, ignore it.

package/src/talons/PaymentMethod/PaypalExpress/paypalExpress.gql.js

@@ -0,0 +1,29 @@
+import {gql} from '@apollo/client';
+
+export const SelectedPaymentMethodsFragment = gql`
+    fragment SelectedPaymentMethodsFragment on Cart {
+        id
+        selected_payment_method {
+            code
+            title
+        }
+    }
+`;
+
+
+export const SET_PAYMENT_METHOD_ON_CART = gql`
+    mutation setPaymentMethodOnCart($cartId: String!, $selectedMethod: String!) {
+        setPaymentMethodOnCart(
+            input: { cart_id: $cartId, payment_method: { code: $selectedMethod } }
+        ) @connection(key: "setPaymentMethodOnCart") {
+            cart {
+                ...SelectedPaymentMethodsFragment
+            }
+        }
+    }
+    ${SelectedPaymentMethodsFragment}
+`;
+
+export default {
+    setPaymentMethodOnCartMutation: SET_PAYMENT_METHOD_ON_CART
+};

package/src/talons/PaymentMethod/PaypalExpress/usePaypalExpress.js

@@ -0,0 +1,69 @@
+import {useCallback, useEffect} from 'react';
+import {useMutation} from '@apollo/client';
+import mergeOperations from '@magento/peregrine/lib/util/shallowMerge';
+import {useCartContext} from '@magento/peregrine/lib/context/cart';
+
+import DEFAULT_OPERATIONS from './paypalExpress.gql';
+
+export const usePaypalExpress = props => {
+    const operations = mergeOperations(DEFAULT_OPERATIONS, props.operations);
+
+    const {
+        setPaymentMethodOnCartMutation
+    } = operations;
+
+    const [{cartId}] = useCartContext();
+    const {currentSelectedPaymentMethod: selectedMethod} = props;
+
+    const {resetShouldSubmit, onPaymentSuccess, onPaymentError} = props;
+
+    const [
+        updatePaymentMethod,
+        {
+            error: paymentMethodMutationError,
+            called: paymentMethodMutationCalled,
+            loading: paymentMethodMutationLoading
+        }
+    ] = useMutation(setPaymentMethodOnCartMutation);
+
+    /**
+     * This function will be called if cant not set address.
+     */
+    const onBillingAddressChangedError = useCallback(() => {
+        resetShouldSubmit();
+    }, [resetShouldSubmit]);
+
+    /**
+     * This function will be called if address was successfully set.
+     */
+    const onBillingAddressChangedSuccess = useCallback(() => {
+        updatePaymentMethod({
+            variables: {cartId, selectedMethod}
+        });
+    }, [updatePaymentMethod, cartId, selectedMethod]);
+
+    useEffect(() => {
+        const paymentMethodMutationCompleted =
+            paymentMethodMutationCalled && !paymentMethodMutationLoading;
+
+        if (paymentMethodMutationCompleted && !paymentMethodMutationError) {
+            onPaymentSuccess();
+        }
+
+        if (paymentMethodMutationCompleted && paymentMethodMutationError) {
+            onPaymentError();
+        }
+    }, [
+        paymentMethodMutationError,
+        paymentMethodMutationLoading,
+        paymentMethodMutationCalled,
+        onPaymentSuccess,
+        onPaymentError,
+        resetShouldSubmit
+    ]);
+
+    return {
+        onBillingAddressChangedError,
+        onBillingAddressChangedSuccess
+    };
+};