From 5af3ad0fd0486d5837893e1a31efdcc9a2372e23 Mon Sep 17 00:00:00 2001
From: Emanuele Dall'Ara <71103219+LeleDallas@users.noreply.github.com>
Date: Tue, 22 Oct 2024 15:38:35 +0200
Subject: [PATCH] fix: [IOBP-901] Missing header in payment methods (#6318)

## Short description
This pull request includes a change to the `PaymentsMethodDetailsScreen`
component to enhance the `getCardHeaderTitle` function. The update adds
specific handling for BPAY and PayPal payment methods.

## List of changes proposed in this pull request
- Update `getCardHeaderTitle` function to handle missing edge cases

## How to test

### io-dev-server
To test all card cases, update the `generateWalletData` function by
adding this line: `generateUserWallet(3)`

### io-app

- Tap in _Portafoglio_
- BPAY or PayPal card
- Verify the correct card header title is displayed

---------

Co-authored-by: Alessandro <alessandro.izzo998@gmail.com>
---
 .../screens/PaymentsMethodDetailsScreen.tsx   | 20 ++++++++++++-------
 1 file changed, 13 insertions(+), 7 deletions(-)

diff --git a/ts/features/payments/details/screens/PaymentsMethodDetailsScreen.tsx b/ts/features/payments/details/screens/PaymentsMethodDetailsScreen.tsx
index 225b04bf453..04983ed903e 100644
--- a/ts/features/payments/details/screens/PaymentsMethodDetailsScreen.tsx
+++ b/ts/features/payments/details/screens/PaymentsMethodDetailsScreen.tsx
@@ -90,14 +90,20 @@ const PaymentsMethodDetailsScreen = () => {
 };
 
 const getCardHeaderTitle = (details?: UIWalletInfoDetails) => {
-  if (details?.lastFourDigits !== undefined) {
-    const capitalizedCardCircuit = capitalize(
-      details.brand?.toLowerCase() ?? ""
-    );
-    return `${capitalizedCardCircuit} ••${details.lastFourDigits}`;
+  switch (details?.type) {
+    case "BPAY":
+      return "BANCOMAT Pay";
+    case "PAYPAL":
+      return "PayPal";
+    default:
+      if (details?.lastFourDigits !== undefined) {
+        const capitalizedCardCircuit = capitalize(
+          details.brand?.toLowerCase() ?? ""
+        );
+        return `${capitalizedCardCircuit} ••${details.lastFourDigits}`;
+      }
+      return "";
   }
-
-  return "";
 };
 
 export default PaymentsMethodDetailsScreen;