Enable Klarna and PayPal on the Banxa buy path

Banxa already exposes Klarna (KLARNACKO, SEK) and PayPal (PRIMERPAYPAL,
EUR) via its payment-methods API, but the GUI dropped both because their
payment-type codes were not recognized. Add a klarna FiatPaymentType,
map the two Banxa codes, and allow both on the Banxa buy path so the
options surface in the ramp flow.

PayPal reuses the existing logo and string; Klarna falls back to the
provider icon until a dedicated asset is added.

Author: j0ntz

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## Unreleased (develop)
 
+- added: Klarna and PayPal payment options on the Banxa buy path.
 - added: Remote enable/disable of gift card providers via the info server's giftCardInfo config, supporting whole-provider disabling for Phaze and Bitrefill and per-brand disabling for Phaze.
 
 ## 4.49.0 (staging)

src/__tests__/util/paymentTypeIcons.test.ts

@@ -12,6 +12,7 @@ describe('paymentTypeIcons', () => {
     paymentTypeLogoGooglePay: { uri: 'google-pay-icon.png' },
     paymentTypeLogoIdeal: { uri: 'ideal-icon.png' },
     paymentTypeLogoInterac: { uri: 'interac-icon.png' },
+    paymentTypeLogoKlarna: { uri: 'klarna-icon.png' },
     paymentTypeLogoPayid: { uri: 'payid-icon.png' },
     paymentTypeLogoPaypal: { uri: 'paypal-icon.png' },
     paymentTypeLogoPix: { uri: 'pix-icon.png' },
@@ -24,6 +25,7 @@ describe('paymentTypeIcons', () => {
       expect(getPaymentTypeThemeKey('applepay')).toBe('paymentTypeLogoApplePay')
       expect(getPaymentTypeThemeKey('credit')).toBe('paymentTypeLogoCreditCard')
       expect(getPaymentTypeThemeKey('paypal')).toBe('paymentTypeLogoPaypal')
+      expect(getPaymentTypeThemeKey('klarna')).toBe('paymentTypeLogoKlarna')
     })
 
     it('should return bank transfer key for fallback payment types', () => {
@@ -41,6 +43,9 @@ describe('paymentTypeIcons', () => {
       expect(getPaymentTypeIcon('credit', mockTheme)).toEqual({
         uri: 'credit-card-icon.png'
       })
+      expect(getPaymentTypeIcon('klarna', mockTheme)).toEqual({
+        uri: 'klarna-icon.png'
+      })
     })
 
     it('should return bank transfer icon for fallback payment types', () => {

src/__tests__/util/paymentTypeUtils.test.ts

@@ -10,6 +10,8 @@ describe('paymentTypeUtils', () => {
       expect(getPaymentTypeDisplayName('credit')).toBe('Credit and Debit Card')
       expect(getPaymentTypeDisplayName('venmo')).toBe('Venmo')
       expect(getPaymentTypeDisplayName('sepa')).toBe('SEPA Bank Transfer')
+      expect(getPaymentTypeDisplayName('klarna')).toBe('Klarna')
+      expect(getPaymentTypeDisplayName('paypal')).toBe('Paypal')
     })
 
     it('should return original value for unknown payment types', () => {

src/assets/images/paymentTypes/paymentTypeLogoKlarna.png

@@ -2162,6 +2162,7 @@ const strings = {
   instant_ach_bank_transfer: 'Instant ACH Bank Transfer',
   ideal: 'iDEAL',
   interac_e_transfer: 'Interac e-Transfer',
+  klarna: 'Klarna',
   mexico_bank_transfer: 'Mexico Bank Transfer',
   payid: 'PayID',
   paypal: 'Paypal',

src/locales/en_US.ts

@@ -1660,6 +1660,7 @@
   "instant_ach_bank_transfer": "Instant ACH Bank Transfer",
   "ideal": "iDEAL",
   "interac_e_transfer": "Interac e-Transfer",
+  "klarna": "Klarna",
   "mexico_bank_transfer": "Mexico Bank Transfer",
   "payid": "PayID",
   "paypal": "Paypal",

src/locales/strings/enUS.json

@@ -57,6 +57,7 @@ export const asFiatPaymentType = asValue(
   'ideal',
   'interac',
   'iobank',
+  'klarna',
   'mexicobank',
   'payid',
   'paypal',

src/plugins/gui/fiatPluginTypes.ts

@@ -91,7 +91,9 @@ const allowedPaymentTypes: AllowedPaymentTypes = {
     ideal: true,
     interac: true,
     iobank: true,
+    klarna: true,
     payid: true,
+    paypal: true,
     pix: true,
     sepa: false, // Leave this to Bity for now
     turkishbank: true
@@ -151,10 +153,12 @@ const asBanxaPaymentType = asValue(
   'DLOCALPIX',
   'DLOCALZAIO',
   'IDEAL',
+  'KLARNACKO',
   'MANUALPAYMENT',
   'MONOOVAPAYID',
   'PRIMERAP',
   'PRIMERCC',
+  'PRIMERPAYPAL',
   'WORLDPAYGOOGLE',
   'ZHACHSELL'
 )
@@ -331,10 +335,12 @@ const typeMap: Record<BanxaPaymentType, FiatPaymentType> = {
   DLOCALPIX: 'pix',
   DLOCALZAIO: 'iobank',
   IDEAL: 'ideal',
+  KLARNACKO: 'klarna',
   MANUALPAYMENT: 'turkishbank',
   MONOOVAPAYID: 'payid',
   PRIMERAP: 'applepay',
   PRIMERCC: 'credit',
+  PRIMERPAYPAL: 'paypal',
   WORLDPAYGOOGLE: 'googlepay',
   ZHACHSELL: 'ach'
 }

src/plugins/ramps/banxa/banxaRampPlugin.ts

@@ -61,6 +61,8 @@ export function getBuySettlementRange(
     case 'iobank':
       // Not listed in GUI plugin lists; assume typical window
       return RANGE(5, 'minutes', 24, 'hours')
+    case 'klarna':
+      return RANGE(5, 'minutes', 24, 'hours')
     case 'mexicobank':
       return RANGE(5, 'minutes', 24, 'hours')
     case 'payid':
@@ -116,6 +118,8 @@ export function getSellSettlementRange(
     case 'iobank':
       // Not listed in GUI plugin lists; assume typical window
       return RANGE(5, 'minutes', 24, 'hours')
+    case 'klarna':
+      return RANGE(5, 'minutes', 24, 'hours')
     case 'mexicobank':
       return RANGE(5, 'minutes', 24, 'hours')
     case 'payid':

src/plugins/ramps/utils/getSettlementRange.ts

@@ -15,6 +15,7 @@ import paymentTypeLogoGiftCard from '../../assets/images/paymentTypes/paymentTyp
 import paymentTypeLogoGooglePay from '../../assets/images/paymentTypes/paymentTypeLogoGooglePay.png'
 import paymentTypeLogoIdeal from '../../assets/images/paymentTypes/paymentTypeLogoIdeal.png'
 import paymentTypeLogoInterac from '../../assets/images/paymentTypes/paymentTypeLogoInterac.png'
+import paymentTypeLogoKlarna from '../../assets/images/paymentTypes/paymentTypeLogoKlarna.png'
 import paymentTypeLogoPayid from '../../assets/images/paymentTypes/paymentTypeLogoPayid.png'
 import paymentTypeLogoPaynow from '../../assets/images/paymentTypes/paymentTypeLogoPaynow.png'
 import paymentTypeLogoPaypal from '../../assets/images/paymentTypes/paymentTypeLogoPaypal.png'
@@ -477,6 +478,7 @@ export const edgeDark: Theme = {
   paymentTypeLogoGooglePay,
   paymentTypeLogoIdeal,
   paymentTypeLogoInterac,
+  paymentTypeLogoKlarna,
   paymentTypeLogoPayid,
   paymentTypeLogoPaynow,
   paymentTypeLogoPaypal,