From b97942b10f3b33def1e623a88eb763e9597086f2 Mon Sep 17 00:00:00 2001
From: Zoe Roux <zoe.roux@zoriya.dev>
Date: Wed, 10 Jan 2024 21:45:28 +0100
Subject: [PATCH] Add about tab on the settings page

---
 front/packages/ui/src/settings/index.tsx | 29 ++++++++++++++++--------
 front/translations/en.json               | 15 ++++++++++++
 front/translations/fr.json               |  4 ++++
 3 files changed, 38 insertions(+), 10 deletions(-)

diff --git a/front/packages/ui/src/settings/index.tsx b/front/packages/ui/src/settings/index.tsx
index 070cdb74..3f47c1e3 100644
--- a/front/packages/ui/src/settings/index.tsx
+++ b/front/packages/ui/src/settings/index.tsx
@@ -21,10 +21,7 @@
 import {
 	Account,
 	KyooErrors,
-	QueryIdentifier,
 	QueryPage,
-	User,
-	UserP,
 	deleteAccount,
 	logout,
 	queryFn,
@@ -40,6 +37,7 @@ import {
 	HR,
 	Icon,
 	Input,
+	Link,
 	P,
 	Popup,
 	Select,
@@ -62,6 +60,8 @@ import Mail from "@material-symbols/svg-400/outlined/mail.svg";
 import Password from "@material-symbols/svg-400/outlined/password.svg";
 import Logout from "@material-symbols/svg-400/rounded/logout.svg";
 import Delete from "@material-symbols/svg-400/rounded/delete.svg";
+import Android from "@material-symbols/svg-400/rounded/android.svg";
+import Public from "@material-symbols/svg-400/rounded/public.svg";
 
 const Preference = ({
 	icon,
@@ -385,11 +385,6 @@ const AccountSettings = ({ setPopup }: { setPopup: (e?: ReactElement) => void })
 	);
 };
 
-const query: QueryIdentifier<User> = {
-	parser: UserP,
-	path: ["auth", "me"],
-};
-
 export const SettingsPage: QueryPage = () => {
 	const { t } = useTranslation();
 	const [popup, setPopup] = useState<ReactElement | undefined>(undefined);
@@ -414,6 +409,22 @@ export const SettingsPage: QueryPage = () => {
 					</Preference>
 				</SettingsContainer>
 				<AccountSettings setPopup={setPopup} />
+				<SettingsContainer title={t("settings.about.label")}>
+					<Link href="https://github.com/zoriya/kyoo/releases/latest/download/kyoo.apk" target="_blank">
+						<Preference
+							icon={Android}
+							label={t("settings.about.android-app.label")}
+							description={t("settings.about.android-app.description")}
+						/>
+					</Link>
+					<Link href="https://github.com/zoriya/kyoo" target="_blank">
+						<Preference
+							icon={Public}
+							label={t("settings.about.git.label")}
+							description={t("settings.about.git.description")}
+						/>
+					</Link>
+				</SettingsContainer>
 			</ScrollView>
 			{popup}
 		</>
@@ -421,5 +432,3 @@ export const SettingsPage: QueryPage = () => {
 };
 
 SettingsPage.getLayout = DefaultLayout;
-
-SettingsPage.getFetchUrls = () => [query];
diff --git a/front/translations/en.json b/front/translations/en.json
index 64194706..986e4876 100644
--- a/front/translations/en.json
+++ b/front/translations/en.json
@@ -91,6 +91,10 @@
 			"username": {
 				"label": "Username"
 			},
+			"avatar": {
+				"label": "Avatar",
+				"description": "Change your profile icon"
+			},
 			"email": {
 				"label": "Email"
 			},
@@ -100,6 +104,17 @@
 				"oldPassword": "Old password",
 				"newPassword": "New password"
 			}
+		},
+		"about": {
+			"label": "About",
+			"android-app": {
+				"label": "Android app",
+				"description": "Download the android app"
+			},
+			"git": {
+				"label": "Github",
+				"description": "Open the github repository where you can browse the code of kyoo"
+			}
 		}
 	},
 	"player": {
diff --git a/front/translations/fr.json b/front/translations/fr.json
index 58616ce1..9aa41a77 100644
--- a/front/translations/fr.json
+++ b/front/translations/fr.json
@@ -91,6 +91,10 @@
 			"username": {
 				"label": "Nom d'utilisateur"
 			},
+			"avatar": {
+				"label": "Avatar",
+				"description": "Changez votre photo de profil"
+			},
 			"email": {
 				"label": "Email"
 			},