diff --git a/plugins/woocommerce-admin/client/tasks/fills/PaymentGatewaySuggestions/components/List/Item.js b/plugins/woocommerce-admin/client/tasks/fills/PaymentGatewaySuggestions/components/List/Item.js
index 80bdede39d2c3..9055968902163 100644
--- a/plugins/woocommerce-admin/client/tasks/fills/PaymentGatewaySuggestions/components/List/Item.js
+++ b/plugins/woocommerce-admin/client/tasks/fills/PaymentGatewaySuggestions/components/List/Item.js
@@ -31,6 +31,7 @@ export const Item = ( { isRecommended, markConfigured, paymentGateway } ) => {
settingsUrl: manageUrl,
is_local_partner: isLocalPartner,
external_link: externalLink,
+ transaction_processors: transactionProcessors,
} = paymentGateway;
const connectSlot = useSlot(
@@ -88,6 +89,20 @@ export const Item = ( { isRecommended, markConfigured, paymentGateway } ) => {
{ content }
+ { transactionProcessors && (
+
+ { Object.keys( transactionProcessors ).map(
+ ( key ) => {
+ return (
+
+ );
+ }
+ ) }
+
+ ) }
+
+
+
+
+
diff --git a/plugins/woocommerce/assets/images/payment_methods/transaction_processors/cartesbancaires.svg b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/cartesbancaires.svg
new file mode 100644
index 0000000000000..4316b3ee72106
--- /dev/null
+++ b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/cartesbancaires.svg
@@ -0,0 +1,12 @@
+
diff --git a/plugins/woocommerce/assets/images/payment_methods/transaction_processors/eps.svg b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/eps.svg
new file mode 100644
index 0000000000000..28b20597d24e0
--- /dev/null
+++ b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/eps.svg
@@ -0,0 +1,9 @@
+
diff --git a/plugins/woocommerce/assets/images/payment_methods/transaction_processors/giropay.svg b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/giropay.svg
new file mode 100644
index 0000000000000..5e69b5d418b0b
--- /dev/null
+++ b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/giropay.svg
@@ -0,0 +1,9 @@
+
diff --git a/plugins/woocommerce/assets/images/payment_methods/transaction_processors/ideal.svg b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/ideal.svg
new file mode 100644
index 0000000000000..1eace8bf3d911
--- /dev/null
+++ b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/ideal.svg
@@ -0,0 +1,20 @@
+
diff --git a/plugins/woocommerce/assets/images/payment_methods/transaction_processors/sofort.svg b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/sofort.svg
new file mode 100644
index 0000000000000..5c99e8c2bc95e
--- /dev/null
+++ b/plugins/woocommerce/assets/images/payment_methods/transaction_processors/sofort.svg
@@ -0,0 +1,7 @@
+
diff --git a/plugins/woocommerce/changelog/add-payment-recommendations-images b/plugins/woocommerce/changelog/add-payment-recommendations-images
new file mode 100644
index 0000000000000..69dce25d360ae
--- /dev/null
+++ b/plugins/woocommerce/changelog/add-payment-recommendations-images
@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Added images support for the payment recommendations transaction processors
diff --git a/plugins/woocommerce/src/Admin/API/PaymentGatewaySuggestions.php b/plugins/woocommerce/src/Admin/API/PaymentGatewaySuggestions.php
index d0a83050b499d..14d51cb4485c2 100644
--- a/plugins/woocommerce/src/Admin/API/PaymentGatewaySuggestions.php
+++ b/plugins/woocommerce/src/Admin/API/PaymentGatewaySuggestions.php
@@ -168,6 +168,16 @@ public function get_item_schema() {
'context' => array( 'view', 'edit' ),
'readonly' => true,
),
+ 'transaction_processors' => array(
+ 'description' => __( 'Array of transaction processors and their images.', 'woocommerce' ),
+ 'type' => 'object',
+ 'addtionalProperties' => array(
+ 'type' => 'string',
+ 'format' => 'uri',
+ ),
+ 'context' => array( 'view', 'edit' ),
+ 'readonly' => true,
+ ),
),
);
diff --git a/plugins/woocommerce/src/Admin/Features/PaymentGatewaySuggestions/DefaultPaymentGateways.php b/plugins/woocommerce/src/Admin/Features/PaymentGatewaySuggestions/DefaultPaymentGateways.php
index b9f8999fca380..398d7068620c7 100644
--- a/plugins/woocommerce/src/Admin/Features/PaymentGatewaySuggestions/DefaultPaymentGateways.php
+++ b/plugins/woocommerce/src/Admin/Features/PaymentGatewaySuggestions/DefaultPaymentGateways.php
@@ -152,13 +152,21 @@ public static function get_all() {
'category_additional' => array(),
),
array(
- 'id' => 'ppcp-gateway',
- 'title' => __( 'PayPal Payments', 'woocommerce' ),
- 'content' => __( "Safe and secure payments using credit cards or your customer's PayPal account.", 'woocommerce' ),
- 'image' => WC_ADMIN_IMAGES_FOLDER_URL . '/paypal.png',
- 'image_72x72' => WC_ADMIN_IMAGES_FOLDER_URL . '/payment_methods/72x72/paypal.png',
- 'plugins' => array( 'woocommerce-paypal-payments' ),
- 'is_visible' => array(
+ 'id' => 'ppcp-gateway',
+ 'title' => __( 'PayPal Payments', 'woocommerce' ),
+ 'content' => __( "Safe and secure payments using credit cards or your customer's PayPal account.", 'woocommerce' ),
+ 'transaction_processors' => array(
+ 'cartesbancaires' => WC_ADMIN_IMAGES_FOLDER_URL . '/payment_methods/transaction_processors/cartesbancaires.svg',
+ 'bancontact' => WC_ADMIN_IMAGES_FOLDER_URL . '/payment_methods/transaction_processors/bancontact.svg',
+ 'eps' => WC_ADMIN_IMAGES_FOLDER_URL . '/payment_methods/transaction_processors/eps.svg',
+ 'giropay' => WC_ADMIN_IMAGES_FOLDER_URL . '/payment_methods/transaction_processors/giropay.svg',
+ 'ideal' => WC_ADMIN_IMAGES_FOLDER_URL . '/payment_methods/transaction_processors/ideal.svg',
+ 'sofort' => WC_ADMIN_IMAGES_FOLDER_URL . '/payment_methods/transaction_processors/sofort.svg',
+ ),
+ 'image' => WC_ADMIN_IMAGES_FOLDER_URL . '/paypal.png',
+ 'image_72x72' => WC_ADMIN_IMAGES_FOLDER_URL . '/payment_methods/72x72/paypal.png',
+ 'plugins' => array( 'woocommerce-paypal-payments' ),
+ 'is_visible' => array(
(object) array(
'type' => 'base_location_country',
'value' => 'IN',
@@ -166,8 +174,8 @@ public static function get_all() {
),
self::get_rules_for_cbd( false ),
),
- 'category_other' => array( 'US', 'CA', 'AT', 'BE', 'BG', 'HR', 'CH', 'CY', 'CZ', 'DK', 'EE', 'ES', 'FI', 'FR', 'DE', 'GB', 'GR', 'HU', 'IE', 'IT', 'LV', 'LT', 'LU', 'MT', 'NL', 'NO', 'PL', 'PT', 'RO', 'SK', 'SL', 'SE', 'MX', 'BR', 'AR', 'CL', 'CO', 'EC', 'PE', 'UY', 'VE', 'AU', 'NZ', 'HK', 'JP', 'SG', 'CN', 'ID', 'ZA', 'NG', 'GH' ),
- 'category_additional' => array( 'US', 'CA', 'AT', 'BE', 'BG', 'HR', 'CH', 'CY', 'CZ', 'DK', 'EE', 'ES', 'FI', 'FR', 'DE', 'GB', 'GR', 'HU', 'IE', 'IT', 'LV', 'LT', 'LU', 'MT', 'NL', 'NO', 'PL', 'PT', 'RO', 'SK', 'SL', 'SE', 'MX', 'BR', 'AR', 'CL', 'CO', 'EC', 'PE', 'UY', 'VE', 'AU', 'NZ', 'HK', 'JP', 'SG', 'CN', 'ID', 'IN', 'ZA', 'NG', 'GH' ),
+ 'category_other' => array( 'US', 'CA', 'AT', 'BE', 'BG', 'HR', 'CH', 'CY', 'CZ', 'DK', 'EE', 'ES', 'FI', 'FR', 'DE', 'GB', 'GR', 'HU', 'IE', 'IT', 'LV', 'LT', 'LU', 'MT', 'NL', 'NO', 'PL', 'PT', 'RO', 'SK', 'SL', 'SE', 'MX', 'BR', 'AR', 'CL', 'CO', 'EC', 'PE', 'UY', 'VE', 'AU', 'NZ', 'HK', 'JP', 'SG', 'CN', 'ID', 'ZA', 'NG', 'GH' ),
+ 'category_additional' => array( 'US', 'CA', 'AT', 'BE', 'BG', 'HR', 'CH', 'CY', 'CZ', 'DK', 'EE', 'ES', 'FI', 'FR', 'DE', 'GB', 'GR', 'HU', 'IE', 'IT', 'LV', 'LT', 'LU', 'MT', 'NL', 'NO', 'PL', 'PT', 'RO', 'SK', 'SL', 'SE', 'MX', 'BR', 'AR', 'CL', 'CO', 'EC', 'PE', 'UY', 'VE', 'AU', 'NZ', 'HK', 'JP', 'SG', 'CN', 'ID', 'IN', 'ZA', 'NG', 'GH' ),
),
array(
'id' => 'cod',