From 9cc3ab46ec30f8a58dd81714703d669fb94e6b51 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 29 Oct 2024 15:53:19 +0100
Subject: [PATCH 1/2] Fix company cards display

---
 src/pages/settings/Wallet/PaymentMethodList.tsx  | 16 +++++++++-------
 .../members/WorkspaceMemberDetailsPage.tsx       |  4 ++--
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/pages/settings/Wallet/PaymentMethodList.tsx b/src/pages/settings/Wallet/PaymentMethodList.tsx
index 23d0b5ab6550..652beb921d31 100644
--- a/src/pages/settings/Wallet/PaymentMethodList.tsx
+++ b/src/pages/settings/Wallet/PaymentMethodList.tsx
@@ -9,8 +9,6 @@ import type {ValueOf} from 'type-fest';
 import type {RenderSuggestionMenuItemProps} from '@components/AutoCompleteSuggestions/types';
 import Button from '@components/Button';
 import FormAlertWrapper from '@components/FormAlertWrapper';
-import getBankIcon from '@components/Icon/BankIcons';
-import type {BankName} from '@components/Icon/BankIconsUtils';
 import * as Expensicons from '@components/Icon/Expensicons';
 import MenuItem from '@components/MenuItem';
 import OfflineWithFeedback from '@components/OfflineWithFeedback';
@@ -30,7 +28,7 @@ import * as PaymentMethods from '@userActions/PaymentMethods';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
-import type {AccountData} from '@src/types/onyx';
+import type {AccountData, CompanyCardFeed} from '@src/types/onyx';
 import type {BankIcon} from '@src/types/onyx/Bank';
 import type {Errors} from '@src/types/onyx/OnyxCommon';
 import type PaymentMethod from '@src/types/onyx/PaymentMethod';
@@ -223,12 +221,12 @@ function PaymentMethodList({
 
             const assignedCardsGrouped: PaymentMethodItem[] = [];
             assignedCardsSorted.forEach((card) => {
-                const icon = getBankIcon({bankName: card.bank as BankName, isCard: true, styles});
+                const icon = CardUtils.getCardFeedIcon(card.bank as CompanyCardFeed);
 
                 if (!CardUtils.isExpensifyCard(card.cardID)) {
                     assignedCardsGrouped.push({
                         key: card.cardID.toString(),
-                        title: card.bank,
+                        title: card.cardName,
                         description: getDescriptionForPolicyDomainCard(card.domainName),
                         shouldShowRightIcon: false,
                         interactive: false,
@@ -238,7 +236,9 @@ function PaymentMethodList({
                             card.fraud === CONST.EXPENSIFY_CARD.FRAUD_TYPES.DOMAIN || card.fraud === CONST.EXPENSIFY_CARD.FRAUD_TYPES.INDIVIDUAL
                                 ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR
                                 : undefined,
-                        ...icon,
+                        icon,
+                        iconStyles: [styles.assignedCardsIconContainer],
+                        iconSize: variables.iconSizeExtraLarge,
                     });
                     return;
                 }
@@ -275,7 +275,9 @@ function PaymentMethodList({
                         card.fraud === CONST.EXPENSIFY_CARD.FRAUD_TYPES.DOMAIN || card.fraud === CONST.EXPENSIFY_CARD.FRAUD_TYPES.INDIVIDUAL
                             ? CONST.BRICK_ROAD_INDICATOR_STATUS.ERROR
                             : undefined,
-                    ...icon,
+                    icon,
+                    iconStyles: [styles.assignedCardsIconContainer],
+                    iconSize: variables.iconSizeExtraLarge,
                 });
             });
             return assignedCardsGrouped;
diff --git a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
index 8f5c9b2994cd..2a6b9a16827c 100644
--- a/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
+++ b/src/pages/workspace/members/WorkspaceMemberDetailsPage.tsx
@@ -316,8 +316,8 @@ function WorkspaceMemberDetailsPage({personalDetails, policy, route}: WorkspaceM
                                                     displayInDefaultIconColor
                                                     iconStyles={styles.cardIcon}
                                                     contentFit="contain"
-                                                    iconWidth={variables.cardIconWidth}
-                                                    iconHeight={variables.cardIconHeight}
+                                                    iconWidth={variables.iconSizeExtraLarge}
+                                                    iconHeight={variables.iconSizeExtraLarge}
                                                     onPress={() => navigateToDetails(memberCard)}
                                                     shouldShowRightIcon
                                                 />

From 37dbfa8899ed1346bd4fb59f9499e1a5063e2a72 Mon Sep 17 00:00:00 2001
From: VickyStash <vikstash@gmail.com>
Date: Tue, 29 Oct 2024 16:26:31 +0100
Subject: [PATCH 2/2] Android fix

---
 src/pages/settings/Wallet/PaymentMethodList.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/pages/settings/Wallet/PaymentMethodList.tsx b/src/pages/settings/Wallet/PaymentMethodList.tsx
index 652beb921d31..676083f31004 100644
--- a/src/pages/settings/Wallet/PaymentMethodList.tsx
+++ b/src/pages/settings/Wallet/PaymentMethodList.tsx
@@ -277,7 +277,8 @@ function PaymentMethodList({
                             : undefined,
                     icon,
                     iconStyles: [styles.assignedCardsIconContainer],
-                    iconSize: variables.iconSizeExtraLarge,
+                    iconWidth: variables.bankCardWidth,
+                    iconHeight: variables.bankCardHeight,
                 });
             });
             return assignedCardsGrouped;