feat: added paypal param redirect (#13)

* feat: Added paypal redirect (#11) REV-4049 * feat: remove cybersource script (#7) * fix: Added paypal redirect feature triggered buy the frontastic checkout * fix: commit message * fix: resolved new function referencing * fix: Updated a typo * feat: Added new paypal payment redirect test coverage * fix: removed duplicate function * fix: paypal redirect to only happen once --------- Co-authored-by: Juliana Kang <[email protected]> Co-authored-by: Chris Pappas <[email protected]> Co-authored-by: Batanayi Matuku <[email protected]> Co-authored-by: Batanayi Matuku <[email protected]>
edx · Jul 8, 2024 · 69836b7 · 69836b7
1 parent 5a61584
commit 69836b7
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 1 deletion.
diff --git a/audit-ci.json b/audit-ci.json
@@ -1,7 +1,9 @@
 {
     "allowlist": [
         "GHSA-wf5p-g6vw-rhxx",
-        "GHSA-rv95-896h-c2vc"
+        "GHSA-rv95-896h-c2vc",
+        "GHSA-grv7-fg5c-xmjg",
+        "GHSA-3h5v-q93c-6h6q"
     ],
     "moderate": true
 }
diff --git a/src/payment/checkout/Checkout.jsx b/src/payment/checkout/Checkout.jsx
@@ -26,10 +26,28 @@ import { PayPalButton } from '../payment-methods/paypal';
 import { ORDER_TYPES } from '../data/constants';
 
 class Checkout extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      hasRedirectedToPaypal: false,
+    };
+  }
+
   componentDidMount() {
     this.props.fetchClientSecret();
   }
 
+  handleRedirectToPaypal = () => {
+    const { loading, isBasketProcessing, isPaypalRedirect } = this.props;
+    const { hasRedirectedToPaypal } = this.state;
+    const submissionDisabled = loading || isBasketProcessing;
+
+    if (!submissionDisabled && isPaypalRedirect && !hasRedirectedToPaypal) {
+      this.setState({ hasRedirectedToPaypal: true });
+      this.handleSubmitPayPal();
+    }
+  };
+
   handleSubmitPayPal = () => {
     // TO DO: after event parity, track data should be
     // sent only if the payment is processed, not on click
@@ -161,6 +179,8 @@ class Checkout extends React.Component {
     const isBulkOrder = orderType === ORDER_TYPES.BULK_ENROLLMENT;
     const isQuantityUpdating = isBasketProcessing && loaded;
 
+    this.handleRedirectToPaypal();
+
     // Stripe element config
     // TODO: Move these to a better home
     const options = {
@@ -314,6 +334,7 @@ Checkout.propTypes = {
   enableStripePaymentProcessor: PropTypes.bool,
   stripe: PropTypes.object, // eslint-disable-line react/forbid-prop-types
   clientSecretId: PropTypes.string,
+  isPaypalRedirect: PropTypes.bool,
 };
 
 Checkout.defaultProps = {
@@ -327,6 +348,7 @@ Checkout.defaultProps = {
   enableStripePaymentProcessor: false,
   stripe: null,
   clientSecretId: null,
+  isPaypalRedirect: false,
 };
 
 const mapStateToProps = (state) => ({

diff --git a/src/payment/data/redux.test.js b/src/payment/data/redux.test.js
@@ -114,6 +114,7 @@ describe('redux tests', () => {
           isEmpty: false,
           isPaymentRedirect: false,
           isRedirect: false,
+          isPaypalRedirect: false,
         });
       });
 
@@ -135,6 +136,7 @@ describe('redux tests', () => {
           isEmpty: false,
           isPaymentRedirect: false,
           isRedirect: true, // this is also now true.
+          isPaypalRedirect: false,
         });
       });
 
@@ -156,6 +158,7 @@ describe('redux tests', () => {
           isEmpty: false,
           isPaymentRedirect: true, // this is now true
           isRedirect: false,
+          isPaypalRedirect: false,
         });
       });
     });

diff --git a/src/payment/data/selectors.js b/src/payment/data/selectors.js
@@ -39,10 +39,13 @@ export const paymentSelector = createSelector(
       && queryParams.coupon_redeem_redirect == 1; // eslint-disable-line eqeqeq
     const isPaymentRedirect = !!queryParams
       && Boolean(queryParams.payment_intent); // Only klarna has redirect_status on URL
+    const isPaypalRedirect = !!queryParams
+      && queryParams.paypal_redirect == 1; // eslint-disable-line eqeqeq
     return {
       ...basket,
       isCouponRedeemRedirect,
       isPaymentRedirect,
+      isPaypalRedirect,
       isEmpty:
         basket.loaded && !basket.redirect && (!basket.products || basket.products.length === 0),
       isRedirect: