Added subtitle web variant

__snapshots__/features/remoteBanner/components/RemoteBanner.native.test.tsx.native-snap

@@ -163,7 +163,7 @@ exports[`RemoteBanner matches the snapshot 1`] = `
               ]
             }
           >
-            subtitle 1
+            subtitleMobile 1
           </Text>
         </View>
         <View>

src/features/home/components/modules/banners/HomeBanner.native.test.tsx

@@ -39,9 +39,10 @@ describe('<HomeBanner/>', () => {
     beforeEach(() => {
       setFeatureFlags([RemoteStoreFeatureFlags.SHOW_REMOTE_BANNER], {
         title: 'title 1',
-        subtitle: 'subtitle 1',
+        subtitleMobile: 'subtitleMobile 1',
+        subtitleWeb: 'subtitleWeb 1',
         redirectionUrl: 'https://www.test.fr',
-        redirectionType: 'external',
+        redirectionType: 'store',
       })
     })
 

src/features/remoteBanner/components/RemoteBanner.native.test.tsx

@@ -88,28 +88,32 @@ describe('RemoteBanner', () => {
 
 const bannerAppStore: RemoteBannerType = {
   title: 'title 1',
-  subtitle: 'subtitle 1',
+  subtitleMobile: 'subtitleMobile 1',
+  subtitleWeb: 'subtitleWeb 1',
   redirectionUrl: 'https://www.test.fr',
   redirectionType: RemoteBannerRedirectionType.STORE,
 }
 
 const bannerExternalUrl: RemoteBannerType = {
   title: 'title 1',
-  subtitle: 'subtitle 1',
+  subtitleMobile: 'subtitleMobile 1',
+  subtitleWeb: 'subtitleWeb 1',
   redirectionUrl: 'https://www.test.fr',
   redirectionType: RemoteBannerRedirectionType.EXTERNAL,
 }
 
 const bannerExternalUrlWithMissingUrl: Partial<RemoteBannerType> = {
   title: 'title 1',
-  subtitle: 'subtitle 1',
+  subtitleMobile: 'subtitleMobile 1',
+  subtitleWeb: 'subtitleWeb 1',
   redirectionUrl: '',
   redirectionType: RemoteBannerRedirectionType.EXTERNAL,
 }
 
 const bannerBadType: Partial<RemoteBannerType> = {
   title: 'title 1',
-  subtitle: 'subtitle 1',
+  subtitleMobile: 'subtitleMobile 1',
+  subtitleWeb: 'subtitleWeb 1',
   redirectionUrl: 'https://www.test.fr',
   redirectionType: 'other',
 }

src/features/remoteBanner/components/RemoteBanner.tsx

@@ -1,4 +1,5 @@
 import React from 'react'
+import { Platform } from 'react-native'
 import styled from 'styled-components/native'
 
 import { STORE_LINK } from 'features/forceUpdate/constants'
@@ -15,11 +16,13 @@ import { BannerWithBackground } from 'ui/components/ModuleBanner/BannerWithBackg
 import { ArrowAgain } from 'ui/svg/icons/ArrowAgain'
 import { TypoDS } from 'ui/theme'
 
+const isWeb = Platform.OS === 'web'
+
 export const RemoteBanner = () => {
   const { options } = useFeatureFlagOptions(RemoteStoreFeatureFlags.SHOW_REMOTE_BANNER)
   const validatedOptions = validateRemoteBanner(options)
   if (!validatedOptions) return null
-  const { title, subtitle, redirectionUrl, redirectionType } = validatedOptions
+  const { title, subtitleMobile, subtitleWeb, redirectionUrl, redirectionType } = validatedOptions
 
   const isStoreRedirection = redirectionType === RemoteBannerRedirectionType.STORE
   const isExternalRedirection = redirectionType === RemoteBannerRedirectionType.EXTERNAL
@@ -42,7 +45,7 @@ export const RemoteBanner = () => {
       onPress={onPress}
       {...accessibilityAndTestId(accessibilityLabel)}>
       <StyledButtonText>{title}</StyledButtonText>
-      <StyledBodyText>{subtitle}</StyledBodyText>
+      <StyledBodyText>{isWeb ? subtitleWeb : subtitleMobile}</StyledBodyText>
     </BannerWithBackground>
   )
 }

src/features/remoteBanner/components/remoteBannerSchema.ts

@@ -2,7 +2,8 @@ import { InferType, object, string } from 'yup'
 
 const remoteBannerSchema = object({
   title: string().required(),
-  subtitle: string().nullable(),
+  subtitleWeb: string().nullable(),
+  subtitleMobile: string().nullable(),
   redirectionUrl: string().url().nullable(),
   redirectionType: string().oneOf(['external', 'store']).required(),
 })