fix(payment): PAYMENTS-4886 Disable vaulting if isPaymentDataSubmitte…

…d is true When we start the payment process from the cart we can't offer vaulting functionality and the customer has already picked their payment method, we should not show the dropdown or options to vault instruments.
bigcommerce · Oct 30, 2019 · b816ad6 · b816ad6
1 parent 44f6c9b
commit b816ad6
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 13 deletions.
diff --git a/src/app/payment/paymentMethod/HostedPaymentMethod.spec.tsx b/src/app/payment/paymentMethod/HostedPaymentMethod.spec.tsx
@@ -165,8 +165,8 @@ describe('HostedPaymentMethod', () => {
 
             const component = mount(<HostedPaymentMethodTest { ...defaultProps } />);
 
-            expect(component.find(storedInstrumentModule.AccountInstrumentFieldset).length)
-                .toBe(1);
+            expect(component.find(storedInstrumentModule.AccountInstrumentFieldset))
+                .toHaveLength(1);
         });
 
         it('does not show instruments fieldset when there are no stored instruments', () => {
@@ -179,6 +179,16 @@ describe('HostedPaymentMethod', () => {
                 .toHaveLength(0);
         });
 
+        it('does not show instruments fieldset when starting from the cart', () => {
+            jest.spyOn(checkoutState.data, 'isPaymentDataSubmitted')
+                .mockReturnValue(true);
+
+            const component = mount(<HostedPaymentMethodTest { ...defaultProps } />);
+
+            expect(component.find(storedInstrumentModule.AccountInstrumentFieldset))
+                .toHaveLength(0);
+        });
+
         it('shows save account checkbox when there are no stored instruments', () => {
             jest.spyOn(checkoutState.data, 'getInstruments')
                 .mockReturnValue([]);
@@ -207,8 +217,8 @@ describe('HostedPaymentMethod', () => {
             it('does not render the dropdown', () => {
                 const component = mount(<HostedPaymentMethodTest { ...defaultProps } />);
 
-                expect(component.find(storedInstrumentModule.AccountInstrumentFieldset).length)
-                    .toBe(0);
+                expect(component.find(storedInstrumentModule.AccountInstrumentFieldset))
+                    .toHaveLength(0);
             });
 
             it('does not prompt to save the instrument', () => {
@@ -220,8 +230,8 @@ describe('HostedPaymentMethod', () => {
                     { ...defaultProps }
                 />);
 
-                expect(component.find('.form-field--saveInstrument').length)
-                    .toBe(0);
+                expect(component.find('.form-field--saveInstrument'))
+                    .toHaveLength(0);
             });
         });
     });

diff --git a/src/app/payment/paymentMethod/HostedPaymentMethod.tsx b/src/app/payment/paymentMethod/HostedPaymentMethod.tsx
@@ -175,7 +175,6 @@ function mapFromCheckoutProps(): MapToProps<
     const filterTrustedInstruments = memoizeOne((instruments: AccountInstrument[] = []) => instruments.filter(({ trustedShippingAddress }) => trustedShippingAddress));
 
     return (context, props) => {
-
         const {
             formik: { values },
             isUsingMultiShipping = false,
@@ -191,6 +190,7 @@ function mapFromCheckoutProps(): MapToProps<
                 getCustomer,
                 getInstruments,
                 isPaymentDataRequired,
+                isPaymentDataSubmitted,
             },
             statuses: {
                 isLoadingInstruments,
@@ -214,12 +214,14 @@ function mapFromCheckoutProps(): MapToProps<
         return {
             instruments: trustedInstruments,
             isNewAddress: trustedInstruments.length === 0 && currentMethodInstruments.length > 0,
-            isInstrumentFeatureAvailable: features['PAYMENTS-4579.braintree_paypal_vaulting'] && isInstrumentFeatureAvailable({
-                config,
-                customer,
-                isUsingMultiShipping,
-                paymentMethod: method,
-            }),
+            isInstrumentFeatureAvailable: features['PAYMENTS-4579.braintree_paypal_vaulting']
+                && !isPaymentDataSubmitted(method.id, method.gateway)
+                && isInstrumentFeatureAvailable({
+                    config,
+                    customer,
+                    isUsingMultiShipping,
+                    paymentMethod: method,
+                }),
             isLoadingInstruments: isLoadingInstruments(),
             isPaymentDataRequired: isPaymentDataRequired(values.useStoreCredit),
             loadInstruments: checkoutService.loadInstruments,