Fixed missing transflations in ScaffoldAuth and fontSize issues in Leaderboard view

front/components/UI/ScaffoldAuth.tsx

@@ -4,6 +4,7 @@ import { FunctionComponent } from 'react';
 import { Linking, Platform, useWindowDimensions } from 'react-native';
 import ButtonBase from './ButtonBase';
 import { translate } from '../../i18n/i18n';
+import { useTranslation } from 'react-i18next';
 import API, { APIError } from '../../API';
 import SeparatorBase from './SeparatorBase';
 import LinkBase from './LinkBase';
@@ -38,6 +39,7 @@ const ScaffoldAuth: FunctionComponent<ScaffoldAuthProps> = ({
 	const dispatch = useDispatch();
 	const toast = useToast();
 	const colorScheme = useColorScheme();
+	const { t } = useTranslation();
 	const [logo] = useAssets(
 		colorScheme == 'light'
 			? require('../../assets/icon_light.png')
@@ -84,7 +86,7 @@ const ScaffoldAuth: FunctionComponent<ScaffoldAuthProps> = ({
 						)}
 					</Row>
 					<ButtonBase
-						title={translate('guestMode')}
+						title={t('guestMode')}
 						onPress={async () => {
 							try {
 								handleGuestLogin((accessToken: string) => {
@@ -152,7 +154,7 @@ const ScaffoldAuth: FunctionComponent<ScaffoldAuthProps> = ({
 								title={translate('continuewithgoogle')}
 								onPress={() => Linking.openURL(`${API.baseUrl}/auth/login/google`)}
 							/>
-							<SeparatorBase>or</SeparatorBase>
+							<SeparatorBase>{t('authOrSection')}</SeparatorBase>
 							<Stack
 								space={3}
 								justifyContent="center"

front/components/leaderboard/BoardRow.tsx

@@ -52,12 +52,10 @@ export const BoardRow = ({ userAvatarUrl, userPseudo, userLvl, index }: BoardRow
 			</View>
 
 			<Text
+				fontSize={16}
 				style={{
-					fontSize: 16,
-					fontStyle: 'normal',
 					flex: 1,
 					marginHorizontal: 10,
-					fontWeight: '500',
 					maxWidth: '100%',
 				}}
 				isTruncated
@@ -86,14 +84,7 @@ export const BoardRow = ({ userAvatarUrl, userPseudo, userLvl, index }: BoardRow
 					justifyContent: 'center',
 				}}
 			>
-				<Text
+				<Text fontSize={16} textAlign={'center'}>
-					style={{
-						fontSize: 16,
-						fontStyle: 'normal',
-						fontWeight: '500',
-						textAlign: 'center',
-					}}
-				>
 					{index}
 				</Text>
 			</View>

front/components/leaderboard/PodiumCard.tsx

@@ -62,15 +62,7 @@ export const PodiumCard = ({
 				</Avatar>
 			</View>
 			<View>
-				<Text
+				<Text fontSize={20} numberOfLines={2} isTruncated>
-					style={{
-						fontSize: 20,
-						fontWeight: '500',
-						maxWidth: '100%',
-					}}
-					numberOfLines={2}
-					isTruncated
-				>
 					{userPseudo ?? '---'}
 				</Text>
 				<View
@@ -82,12 +74,7 @@ export const PodiumCard = ({
 						gap: 5,
 					}}
 				>
-					<Text
+					<Text fontSize={24} fontWeight={'bold'}>
-						style={{
-							fontSize: 24,
-							fontWeight: '500',
-						}}
-					>
 						{userLvl ?? '-'}
 					</Text>
 					<MedalStar size="24" variant="Bold" color={medalColor} />

front/i18n/Translations.ts

@@ -322,6 +322,7 @@ export const en = {
 	downloadAPKInstructions:
 		"Go to the latest release, unfold the 'Assets' section, and click 'android-build.apk'.",
 	discoverySuggestionSectionTitle: 'Suggested for you',
+	authOrSection: 'or',
 };
 
 export const fr: typeof en = {
@@ -649,6 +650,7 @@ export const fr: typeof en = {
 	downloadAPKInstructions:
 		"Télécharger 'android-build.apk' dans la section 'Assets' de la dernière release",
 	discoverySuggestionSectionTitle: 'Suggéré pour vous',
+	authOrSection: 'ou',
 };
 
 export const sp: typeof en = {
@@ -983,4 +985,5 @@ export const sp: typeof en = {
 	downloadAPKInstructions:
 		"Descargue 'android-build.apk' en la sección 'Assets' de la última versión",
 	discoverySuggestionSectionTitle: 'Sugerido para ti',
+	authOrSection: 'o',
 };

front/views/LeaderboardView.tsx

@@ -29,24 +29,21 @@ const Leaderboardiew = () => {
 	] as const;
 
 	return (
-		<ScrollView style={{
+		<ScrollView
-			padding: 8,
+			style={{
-		}}>
+				padding: 8,
+			}}
+		>
 			<Text
+				fontSize={20}
+				fontWeight={'500'}
 				style={{
-					fontSize: 20,
-					fontWeight: '500',
 					marginBottom: 16,
 				}}
 			>
 				{translate('leaderBoardHeading')}
 			</Text>
-			<Text
+			<Text fontSize={14} fontWeight={'500'}>
-				style={{
-					fontSize: 14,
-					fontWeight: '500',
-				}}
-			>
 				{translate('leaderBoardHeadingFull')}
 			</Text>
 			<View