diff --git a/src/components/BuySellForm/BuySellForm.tsx b/src/components/BuySellForm/BuySellForm.tsx index be93ae39..5e543064 100644 --- a/src/components/BuySellForm/BuySellForm.tsx +++ b/src/components/BuySellForm/BuySellForm.tsx @@ -132,6 +132,10 @@ const BuySellForm = ({ advertId, isModalOpen, onRequestClose }: TBuySellFormProp }; }); + const filteredAdvertiserPaymentMethods = advertiserPaymentMethods?.filter(method => + paymentMethodNames?.includes(method.display_name || '') + ); + const history = useHistory(); const { isDesktop } = useDevice(); const isBuy = type === BUY_SELL.BUY; @@ -343,7 +347,7 @@ const BuySellForm = ({ advertId, isModalOpen, onRequestClose }: TBuySellFormProp {isBuy && paymentMethodNames && paymentMethodNames?.length > 0 && ( { const { isDesktop } = useDevice(); - const sortedList = sortPaymentMethodsWithAvailability(availablePaymentMethods); + const sortedList = sortPaymentMethodsWithAvailability(availablePaymentMethods).filter(p => !p.isAvailable); + const disableAdvertiserPaymentMethods = selectedPaymentMethodIds.length === 3; const { localize } = useTranslations(); const [formState, dispatch] = useReducer( @@ -67,6 +68,20 @@ const BuySellPaymentSection = ({ )}
+ {advertiserPaymentMethods?.map((paymentMethod, index) => { + const isSelected = selectedPaymentMethodIds.includes(Number(paymentMethod.id)); + + return ( + + ); + })} {sortedList?.map((paymentMethod, index) => ( ', () => { render(); expect(screen.getByText('Receive payment to')).toBeInTheDocument(); }); - it('should render the payment method cards when there are available payment methods', async () => { - render(); + it('should render the payment method cards when there are advertiser payment methods', async () => { + render(); expect(screen.getByText('Receive payment to')).toBeInTheDocument(); - expect( - screen.getByText('To place an order, add one of the advertiser’s preferred payment methods:') - ).toBeInTheDocument(); + expect(screen.getByText('You may choose up to 3.')).toBeInTheDocument(); expect(screen.getByText('Other')).toBeInTheDocument(); const checkbox = screen.getByRole('checkbox'); await userEvent.click(checkbox);