Front: add Button to Download APK From Web

front/components/APKDownloadButton.tsx

@@ -0,0 +1,20 @@
+import { ArrowCircleDown2 } from 'iconsax-react-native';
+import ButtonBase from './UI/ButtonBase';
+import { translate } from '../i18n/i18n';
+import { Linking } from 'react-native';
+
+const APKDownloadButton = () => {
+	return (
+		<ButtonBase
+			style={{}}
+			icon={ArrowCircleDown2}
+			type={'filled'}
+			title={translate('downloadAPK')}
+			onPress={() =>
+				Linking.openURL('https://github.com/Chroma-Case/Chromacase/releases/download/v0.8.4/android-build.apk')
+			}
+		/>
+	);
+};
+
+export default APKDownloadButton;

front/components/UI/ScaffoldAuth.tsx

@@ -1,7 +1,7 @@
 import { LinearGradient } from 'expo-linear-gradient';
 import { Stack, View, Text, Wrap, Image, Row, Column, ScrollView, useToast } from 'native-base';
 import { FunctionComponent } from 'react';
-import { Linking, useWindowDimensions } from 'react-native';
+import { Linking, Platform, useWindowDimensions } from 'react-native';
 import ButtonBase from './ButtonBase';
 import { translate } from '../../i18n/i18n';
 import API, { APIError } from '../../API';
@@ -11,6 +11,7 @@ import { useDispatch } from '../../state/Store';
 import { setAccessToken } from '../../state/UserSlice';
 import useColorScheme from '../../hooks/colorScheme';
 import { useAssets } from 'expo-asset';
+import APKDownloadButton from '../APKDownloadButton';
 
 const handleGuestLogin = async (apiSetter: (accessToken: string) => void): Promise<string> => {
 	const apiAccess = await API.createAndGetGuestAccount();
@@ -81,7 +82,7 @@ const ScaffoldAuth: FunctionComponent<ScaffoldAuthProps> = ({
 						)}
 					</Row>
 					<ButtonBase
-						title="guest mode"
+						title={translate('guestMode')}
 						onPress={async () => {
 							try {
 								handleGuestLogin((accessToken: string) => {
@@ -164,6 +165,7 @@ const ScaffoldAuth: FunctionComponent<ScaffoldAuthProps> = ({
 								<Text>{link.label}</Text>
 								<LinkBase text={link.text} onPress={link.onPress} />
 							</Wrap>
+							{ Platform.OS === "web" && <APKDownloadButton/> }
 						</Stack>
 					</View>
 				</ScrollView>

front/i18n/Translations.ts

@@ -1,5 +1,7 @@
 export const en = {
 	error: 'Error',
+	guestMode: "Guest Mode",
+	downloadAPK: "Download Android App",
 	goBackHome: 'Go Back Home',
 	anErrorOccured: 'An Error Occured',
 	welcome: 'Welcome',
@@ -319,6 +321,8 @@ export const en = {
 
 export const fr: typeof en = {
 	error: 'Erreur',
+	downloadAPK: "Télécharger l'App Android",
+	guestMode: "Mode Invité",
 	goBackHome: "Retourner à l'accueil",
 	anErrorOccured: 'Une erreur est survenue',
 	welcome: 'Bienvenue',
@@ -638,6 +642,8 @@ export const fr: typeof en = {
 
 export const sp: typeof en = {
 	error: 'Error',
+	downloadAPK: "Descarga la Aplicación de Android",
+	guestMode: "Modo Invitado",
 	anErrorOccured: 'ocurrió un error',
 	goBackHome: 'regresar a casa',
 	welcomeMessage: 'Benvenido',

front/views/settings/SettingsProfile.tsx

@@ -10,7 +10,8 @@ import { Google, PasswordCheck, SmsEdit, UserSquare, Verify } from 'iconsax-reac
 import ChangeEmailForm from '../../components/forms/changeEmailForm';
 import ChangePasswordForm from '../../components/forms/changePasswordForm';
 import LogoutButtonCC from '../../components/UI/LogoutButtonCC';
-import { ScrollView } from 'react-native';
+import { Platform, ScrollView } from 'react-native';
+import APKDownloadButton from '../../components/APKDownloadButton';
 
 const handleChangeEmail = async (newEmail: string): Promise<string> => {
 	await API.updateUserEmail(newEmail);
@@ -162,6 +163,7 @@ const ProfileSettings = () => {
 						},
 					]}
 				/>
+				{ Platform.OS === "web" && <APKDownloadButton/> }
 				<LogoutButtonCC isGuest={user.isGuest} buttonType={'filled'} />
 			</Column>
 		</ScrollView>