From a99d67166b917dd2bdb40c04aa498c59ad446a2d Mon Sep 17 00:00:00 2001
From: Beth Swingler <beth.swingler@ledger.fr>
Date: Wed, 13 Nov 2024 11:30:46 +0000
Subject: [PATCH] fix: fall back to firebase display name if no translated
 title (#8343)

* fix: fall back to firebase display name if no translated title

* chore: update codeowners for evm stake modal
---
 .changeset/few-owls-cross.md                              | 6 ++++++
 CODEOWNERS                                                | 4 ++++
 .../evm/StakeFlowModal/component/ProviderItem.tsx         | 8 ++++++--
 .../evm/StakingDrawer/EvmStakingDrawerProvider.tsx        | 8 ++++++--
 4 files changed, 22 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/few-owls-cross.md

diff --git a/.changeset/few-owls-cross.md b/.changeset/few-owls-cross.md
new file mode 100644
index 000000000000..c82d39533542
--- /dev/null
+++ b/.changeset/few-owls-cross.md
@@ -0,0 +1,6 @@
+---
+"ledger-live-desktop": patch
+"live-mobile": patch
+---
+
+Add a fallback to the provider display name from the firebase JSON if there is no translated title for the given provider. Required to add new providers like Coinbase to EVM staking.
diff --git a/CODEOWNERS b/CODEOWNERS
index 68f7bb5adcd7..cb44471c0ed8 100644
--- a/CODEOWNERS
+++ b/CODEOWNERS
@@ -57,6 +57,10 @@ apps/ledger-live-desktop/src/renderer/screens/earn/                  @ledgerhq/p
 apps/ledger-live-desktop/src/renderer/screens/exchange/              @ledgerhq/ptx
 apps/ledger-live-desktop/src/renderer/screens/stake/                 @ledgerhq/ptx
 apps/ledger-live-desktop/src/renderer/screens/swapWeb/               @ledgerhq/ptx
+apps/ledger-live-desktop/src/renderer/families/evm/StakeFlowModal	@ledgerhq/ptx
+apps/ledger-live-desktop/src/renderer/families/evm/StakeFlowModal_deprecated	@ledgerhq/ptx
+apps/ledger-live-mobile/src/families/evm/StakingDrawer/              @ledgerhq/ptx
+apps/ledger-live-mobile/src/families/evm/StakingDrawer_deprecated/   @ledgerhq/ptx
 apps/ledger-live-mobile/src/actions/earn.ts                          @ledgerhq/ptx
 apps/ledger-live-mobile/src/actions/swap.ts                          @ledgerhq/ptx
 apps/ledger-live-mobile/src/components/ProviderIcon/                 @ledgerhq/ptx
diff --git a/apps/ledger-live-desktop/src/renderer/families/evm/StakeFlowModal/component/ProviderItem.tsx b/apps/ledger-live-desktop/src/renderer/families/evm/StakeFlowModal/component/ProviderItem.tsx
index 0009e312fee5..d0bd913ed588 100644
--- a/apps/ledger-live-desktop/src/renderer/families/evm/StakeFlowModal/component/ProviderItem.tsx
+++ b/apps/ledger-live-desktop/src/renderer/families/evm/StakeFlowModal/component/ProviderItem.tsx
@@ -66,7 +66,7 @@ interface Props {
 }
 
 export const ProviderItem = ({ provider, stakeOnClick }: Props) => {
-  const { t } = useTranslation();
+  const { t, i18n } = useTranslation();
 
   const localManifest = useLocalLiveAppManifest(provider.liveAppId);
   const remoteManifest = useRemoteLiveAppManifest(provider.liveAppId);
@@ -79,6 +79,10 @@ export const ProviderItem = ({ provider, stakeOnClick }: Props) => {
     }
   }, [provider, stakeOnClick, manifest]);
 
+  const displayName = i18n.exists(`stake.ethereum.provider.${provider.id}.title`)
+    ? t(`stake.ethereum.provider.${provider.id}.title`)
+    : provider.name;
+
   return (
     <Container
       alignItems="center"
@@ -91,7 +95,7 @@ export const ProviderItem = ({ provider, stakeOnClick }: Props) => {
       <StakingIcon icon={provider.icon} />
       <Flex alignItems="flex-start" flex={2} flexDirection="column">
         <Text variant="bodyLineHeight" fontSize={14} fontWeight="semiBold" mr={2}>
-          {t(`ethereum.stake.provider.${provider.id}.title`)}
+          {displayName}
         </Text>
         <Text variant="paragraph" fontSize={13} color="neutral.c70">
           {provider.lst
diff --git a/apps/ledger-live-mobile/src/families/evm/StakingDrawer/EvmStakingDrawerProvider.tsx b/apps/ledger-live-mobile/src/families/evm/StakingDrawer/EvmStakingDrawerProvider.tsx
index f4fd31f5f2d2..7dac9eb036cb 100644
--- a/apps/ledger-live-mobile/src/families/evm/StakingDrawer/EvmStakingDrawerProvider.tsx
+++ b/apps/ledger-live-mobile/src/families/evm/StakingDrawer/EvmStakingDrawerProvider.tsx
@@ -27,7 +27,7 @@ export function EvmStakingDrawerProvider({ provider, onProviderPress }: Props) {
 
   const theme = useTheme();
 
-  const { t } = useTranslation();
+  const { t, i18n } = useTranslation();
 
   const providerPress = useCallback(() => {
     if (manifest) {
@@ -35,6 +35,10 @@ export function EvmStakingDrawerProvider({ provider, onProviderPress }: Props) {
     }
   }, [manifest, provider, onProviderPress]);
 
+  const displayName = i18n.exists(`stake.ethereum.provider.${provider.id}.title`)
+    ? t(`stake.ethereum.provider.${provider.id}.title`)
+    : provider.name;
+
   return (
     <TouchableOpacity onPress={providerPress}>
       <Flex
@@ -52,7 +56,7 @@ export function EvmStakingDrawerProvider({ provider, onProviderPress }: Props) {
         <Flex rowGap={2} alignItems="flex-start" flex={3}>
           <Flex flexDirection="column" flex={1} alignItems="flex-start">
             <Text variant="bodyLineHeight" fontSize={14} fontWeight="semiBold" mr={2}>
-              {t(`stake.ethereum.provider.${provider.id}.title`)}
+              {displayName}
             </Text>
             <Text variant="paragraph" fontSize={13} color="neutral.c70">
               {provider.lst