diff --git a/assets/images/Swile_black.png b/assets/images/Swile_black.png new file mode 100644 index 000000000..f6114890e Binary files /dev/null and b/assets/images/Swile_black.png differ diff --git a/assets/images/restoflash.png b/assets/images/restoflash.png new file mode 100644 index 000000000..9c31d5be7 Binary files /dev/null and b/assets/images/restoflash.png differ diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json index 087d40b6f..be6b60483 100644 --- a/src/i18n/locales/en.json +++ b/src/i18n/locales/en.json @@ -425,7 +425,10 @@ "card": "Credit card", "cash_on_delivery": "Cash on delivery", "edenred": "Edenred", - "edenred+card": "Edenred" + "edenred+card": "Edenred", + "conecs": "Titres-restaurant", + "swile": "Swile", + "restoflash": "Restoflash" }, "CASH_ON_DELIVERY_DISCLAIMER": "You are going to pay by cash on delivery. Please prepare the exact amount and make sure to be reachable.", "STORES": "Stores", diff --git a/src/navigation/checkout/Payment.js b/src/navigation/checkout/Payment.js index b5e0b9691..159918c08 100644 --- a/src/navigation/checkout/Payment.js +++ b/src/navigation/checkout/Payment.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import { Center } from 'native-base'; -import { View } from 'react-native'; +import { Linking, View } from 'react-native'; import { connect } from 'react-redux'; import { @@ -42,8 +42,12 @@ class CreditCard extends Component { 'edenred+card': 'CheckoutPaymentMethodEdenred', }; - this.props.setPaymentMethod(type, () => { - this.props.navigation.navigate(routesByMethod[type]); + this.props.setPaymentMethod(type, (result) => { + if (result.redirectUrl) { + Linking.openURL(result.redirectUrl); + } else { + this.props.navigation.navigate(routesByMethod[type]); + } }) } diff --git a/src/navigation/checkout/components/CreditCardPaygreen.js b/src/navigation/checkout/components/CreditCardPaygreen.js index 222424e03..1471857ec 100644 --- a/src/navigation/checkout/components/CreditCardPaygreen.js +++ b/src/navigation/checkout/components/CreditCardPaygreen.js @@ -29,6 +29,8 @@ const CreditCardPaygreen = ({ baseURL, paymentDetails, loadPaymentDetails, cart, loadPaymentDetails() }, []); + console.log('paymentDetails', paymentDetails) + if (!paymentDetails?.paygreenWebviewUrl) { return LOADING } diff --git a/src/navigation/checkout/components/PaymentMethodIcon.js b/src/navigation/checkout/components/PaymentMethodIcon.js index de793ccd2..b7b153476 100644 --- a/src/navigation/checkout/components/PaymentMethodIcon.js +++ b/src/navigation/checkout/components/PaymentMethodIcon.js @@ -1,7 +1,9 @@ import React from 'react'; -import { Icon } from 'native-base'; +import { Image } from 'react-native'; +import { Box, Icon } from 'native-base'; import Foundation from 'react-native-vector-icons/Foundation'; import Svg, { Path, G } from 'react-native-svg'; +import ConecsIcon from './PaymentMethodIcon/ConecsIcon'; const icons = { card: 'credit-card', @@ -19,9 +21,39 @@ const PaymentMethodIcon = ({ type }) => { />) } + if (type === 'conecs') { + return ( + + + + ) + } + + if (type === 'restoflash') { + return ( + + + + ) + } + + if (type === 'swile') { + return ( + + + + ) + } + if (type === 'edenred' || type === 'edenred+card') { return ( - + { x={0} y={0} fill={ '#000000' } + viewBox="0 0 413.24 265.47" > ( + + + + + + + + + + + + +) + +export default SvgComponent diff --git a/src/redux/Checkout/actions.js b/src/redux/Checkout/actions.js index d2b3044c1..5de51cfe9 100644 --- a/src/redux/Checkout/actions.js +++ b/src/redux/Checkout/actions.js @@ -1937,12 +1937,14 @@ export function setPaymentMethod(paymentMethod, cb) { }, ) .then(res => { + console.log('setPaymentMethod', JSON.stringify(res)) + console.log('redirectUrl', res.redirectUrl) // We update the state with the same cart // We can't use response, because it's not a cart // TODO Use the payments returned // https://github.com/coopcycle/coopcycle-app/issues/1925 dispatch(updateCartSuccess(cart)); - cb() + cb(res) }) .catch(e => dispatch(checkoutFailure(e))); };