diff --git a/Model/Config/Cc.php b/Model/Config/Cc.php
index 89180e8d..1338ffb6 100644
--- a/Model/Config/Cc.php
+++ b/Model/Config/Cc.php
@@ -26,4 +26,15 @@ public function getCardTheme()
{
return $this->getValue('card_form_theme', self::CODE);
}
+
+ /**
+ * Get the card brands icons enabled in the payment configuration.
+ *
+ * @return array
+ */
+ public function getSupportedCardIcons()
+ {
+ $supportedCardIcons = $this->getValue('supported_card_icons', self::CODE);
+ return $supportedCardIcons ? explode(',', $supportedCardIcons) : [];
+ }
}
diff --git a/Model/Source/CardBrandIcon.php b/Model/Source/CardBrandIcon.php
new file mode 100644
index 00000000..9d586460
--- /dev/null
+++ b/Model/Source/CardBrandIcon.php
@@ -0,0 +1,42 @@
+ 'visa',
+ 'label' => __('Visa'),
+ ],
+ [
+ 'value' => 'mastercard',
+ 'label' => __('Mastercard'),
+ ],
+ [
+ 'value' => 'amex',
+ 'label' => __('American Express'),
+ ],
+ [
+ 'value' => 'jcb',
+ 'label' => __('JCB'),
+ ],
+ [
+ 'value' => 'diners',
+ 'label' => __('Diners Club'),
+ ],
+ [
+ 'value' => 'discover',
+ 'label' => __('Discover'),
+ ],
+ ];
+ }
+}
diff --git a/Model/Ui/CcConfigProvider.php b/Model/Ui/CcConfigProvider.php
index 8d0abaaf..53fb410d 100644
--- a/Model/Ui/CcConfigProvider.php
+++ b/Model/Ui/CcConfigProvider.php
@@ -57,7 +57,8 @@ public function getConfig()
'cards' => $this->getCards(),
'locale' => $this->omiseCcConfig->getStoreLocale(),
'formDesign' => $theme->getFormDesign($selectedTheme, $customDesign),
- 'theme' => $selectedTheme
+ 'theme' => $selectedTheme,
+ 'supported_card_icons' => $this->omiseCcConfig->getSupportedCardIcons()
],
]
];
diff --git a/Test/Unit/Model/Config/CcConfigTest.php b/Test/Unit/Model/Config/CcConfigTest.php
new file mode 100644
index 00000000..c07608dc
--- /dev/null
+++ b/Test/Unit/Model/Config/CcConfigTest.php
@@ -0,0 +1,53 @@
+createConfigMock('visa,mastercard,amex');
+
+ $this->assertSame(['visa', 'mastercard', 'amex'], $config->getSupportedCardIcons());
+ }
+
+ /**
+ * @covers \Omise\Payment\Model\Config\Cc::getSupportedCardIcons
+ * @dataProvider emptyConfigValueProvider
+ */
+ public function testGetSupportedCardIconsReturnsEmptyArrayWhenNoIconsAreConfigured($emptyValue): void
+ {
+ $config = $this->createConfigMock($emptyValue);
+
+ $this->assertSame([], $config->getSupportedCardIcons());
+ }
+
+ public static function emptyConfigValueProvider(): array
+ {
+ return [
+ 'null' => [null],
+ 'empty string' => [''],
+ ];
+ }
+
+ private function createConfigMock($value): Cc
+ {
+ $config = $this->getMockBuilder(Cc::class)
+ ->disableOriginalConstructor()
+ ->onlyMethods(['getValue'])
+ ->getMock();
+
+ $config->expects($this->once())
+ ->method('getValue')
+ ->with('supported_card_icons', Cc::CODE)
+ ->willReturn($value);
+
+ return $config;
+ }
+}
diff --git a/Test/Unit/Model/Source/CardBrandIconTest.php b/Test/Unit/Model/Source/CardBrandIconTest.php
new file mode 100644
index 00000000..14a81b8c
--- /dev/null
+++ b/Test/Unit/Model/Source/CardBrandIconTest.php
@@ -0,0 +1,38 @@
+toOptionArray();
+
+ $this->assertSame(
+ [
+ ['value' => 'visa', 'label' => 'Visa'],
+ ['value' => 'mastercard', 'label' => 'Mastercard'],
+ ['value' => 'amex', 'label' => 'American Express'],
+ ['value' => 'jcb', 'label' => 'JCB'],
+ ['value' => 'diners', 'label' => 'Diners Club'],
+ ['value' => 'discover', 'label' => 'Discover'],
+ ],
+ array_map(
+ static function (array $option): array {
+ return [
+ 'value' => $option['value'],
+ 'label' => (string) $option['label'],
+ ];
+ },
+ $options
+ )
+ );
+ }
+}
diff --git a/etc/adminhtml/system.xml b/etc/adminhtml/system.xml
index 6564f801..a2435603 100644
--- a/etc/adminhtml/system.xml
+++ b/etc/adminhtml/system.xml
@@ -109,6 +109,11 @@
Click here for more secure card form customization.]]>
+
+
+ payment/omise_cc/supported_card_icons
+ Omise\Payment\Model\Source\CardBrandIcon
+
payment/omise_cc/card_form_theme_config
Omise\Payment\Block\Adminhtml\System\Config\CardFormCustomization\FormModal
@@ -940,4 +945,4 @@
-
\ No newline at end of file
+
diff --git a/view/frontend/web/js/view/payment/method-renderer/omise-cc-method.js b/view/frontend/web/js/view/payment/method-renderer/omise-cc-method.js
index ebe0ba32..6f52bed8 100644
--- a/view/frontend/web/js/view/payment/method-renderer/omise-cc-method.js
+++ b/view/frontend/web/js/view/payment/method-renderer/omise-cc-method.js
@@ -124,6 +124,7 @@ define(
}
const { theme, locale, formDesign } = window.checkoutConfig.payment.omise_cc
+ const supportedCardIcons = window.checkoutConfig.payment.omise_cc.supported_card_icons
const { font, input, checkbox } = formDesign
let iframeElementHeight = iframeHeightMatching[input.height]
if (hideRememberCard) {
@@ -131,7 +132,7 @@ define(
}
element.style.height = iframeElementHeight + 'px'
- OmiseCard.configure({
+ const cardFormConfig = {
publicKey: self.getPublicKey(),
element,
locale: localeMatching[locale] ?? 'en',
@@ -157,7 +158,14 @@ define(
}
},
customCardFormHideRememberCard: hideRememberCard
- })
+ }
+
+ if (Array.isArray(supportedCardIcons) && supportedCardIcons.length > 0) {
+ cardFormConfig.customCardFormBrandIcons = supportedCardIcons
+ cardFormConfig.cardBrands = supportedCardIcons.join(' ')
+ }
+
+ OmiseCard.configure(cardFormConfig)
OmiseCard.open({
onCreateTokenSuccess: (payload) => {