From 599c36e8d7304bc92245f44ed381c774a753a2d2 Mon Sep 17 00:00:00 2001 From: MathieuG-P Date: Fri, 15 Jul 2022 15:12:05 +0200 Subject: [PATCH] modals fully translated --- assets/jsons/translations/en-EN.json | 50 +++++++++++++++++- assets/jsons/translations/en-US.json | 50 +++++++++++++++++- assets/jsons/translations/es-ES.json | 52 ++++++++++++++++++- assets/jsons/translations/fr-FR.json | 50 +++++++++++++++++- .../modal-types/guard-modal.component.tsx | 12 +++-- .../installation-folder-modal.component.tsx | 11 ++-- .../modal-types/login-modal.component.tsx | 18 ++++--- .../modal-types/uninstall-modal.component.tsx | 10 ++-- src/renderer/hooks/use-translation.hook.ts | 7 ++- src/renderer/services/i18n.service.ts | 14 ++--- 10 files changed, 237 insertions(+), 37 deletions(-) diff --git a/assets/jsons/translations/en-EN.json b/assets/jsons/translations/en-EN.json index c9aa9b1c..0dfbadc6 100644 --- a/assets/jsons/translations/en-EN.json +++ b/assets/jsons/translations/en-EN.json @@ -4,7 +4,8 @@ "verify": "Verify", "launch": "Launch", "mods": "Mods", - "maps": "Maps" + "maps": "Maps", + "cancel": "Cancel" }, "pages":{ "version-viewer":{ @@ -152,5 +153,52 @@ } } } + }, + "modals":{ + "guard":{ + "title": "Steam Guard", + "inputs":{ + "guard-code":{ + "label": "Guard Code", + "placeholder": "Enter your Guard code" + } + }, + "buttons":{ + "submit": "Login" + } + }, + "steam-login":{ + "title": "Steam Login", + "inputs":{ + "username":{ + "label": "Username", + "placeholder": "Enter your username" + }, + "password":{ + "label": "Password", + "placeholder": "Enter your password" + }, + "stay":{ + "label": "Stay connected" + } + }, + "buttons":{ + "submit": "Login" + } + }, + "bs-uninstall":{ + "title": "Uninstall", + "description": "Are you sure you want to uninstall BeatSaber {version} ? You will have to download it again to play it.", + "buttons":{ + "submit": "Uninstall" + } + }, + "install-folder":{ + "title": "Installation folder", + "description": "Changing the default installation folder will result in moving all installed data to the new folder.", + "buttons":{ + "submit": "Choose folder" + } + } } } \ No newline at end of file diff --git a/assets/jsons/translations/en-US.json b/assets/jsons/translations/en-US.json index c9aa9b1c..0dfbadc6 100644 --- a/assets/jsons/translations/en-US.json +++ b/assets/jsons/translations/en-US.json @@ -4,7 +4,8 @@ "verify": "Verify", "launch": "Launch", "mods": "Mods", - "maps": "Maps" + "maps": "Maps", + "cancel": "Cancel" }, "pages":{ "version-viewer":{ @@ -152,5 +153,52 @@ } } } + }, + "modals":{ + "guard":{ + "title": "Steam Guard", + "inputs":{ + "guard-code":{ + "label": "Guard Code", + "placeholder": "Enter your Guard code" + } + }, + "buttons":{ + "submit": "Login" + } + }, + "steam-login":{ + "title": "Steam Login", + "inputs":{ + "username":{ + "label": "Username", + "placeholder": "Enter your username" + }, + "password":{ + "label": "Password", + "placeholder": "Enter your password" + }, + "stay":{ + "label": "Stay connected" + } + }, + "buttons":{ + "submit": "Login" + } + }, + "bs-uninstall":{ + "title": "Uninstall", + "description": "Are you sure you want to uninstall BeatSaber {version} ? You will have to download it again to play it.", + "buttons":{ + "submit": "Uninstall" + } + }, + "install-folder":{ + "title": "Installation folder", + "description": "Changing the default installation folder will result in moving all installed data to the new folder.", + "buttons":{ + "submit": "Choose folder" + } + } } } \ No newline at end of file diff --git a/assets/jsons/translations/es-ES.json b/assets/jsons/translations/es-ES.json index e7778b80..fc66ba07 100644 --- a/assets/jsons/translations/es-ES.json +++ b/assets/jsons/translations/es-ES.json @@ -4,7 +4,8 @@ "verify": "Verificar", "launch": "Lanzar", "mods": "Mods", - "maps": "Maps" + "maps": "Maps", + "cancel": "Cancelar" }, "pages":{ "version-viewer":{ @@ -63,7 +64,7 @@ } } }, - + "notifications":{ "types":{ "error": "🚨 Error", @@ -153,5 +154,52 @@ } } } + }, + "modals":{ + "guard":{ + "title": "Steam Guard", + "inputs":{ + "guard-code":{ + "label": "Guard Código", + "placeholder": "Introduzca su código Guard" + } + }, + "buttons":{ + "submit": "Conéctate" + } + }, + "steam-login":{ + "title": "Steam Conectar", + "inputs":{ + "username":{ + "label": "Nombre de usuario", + "placeholder": "Introduzca su nombre de usuario" + }, + "password":{ + "label": "Contraseña", + "placeholder": "Introduzca su contraseña" + }, + "stay":{ + "label": "Manténgase conectado" + } + }, + "buttons":{ + "submit": "Inicio de sesión" + } + }, + "bs-uninstall":{ + "title": "Desinstalar", + "description": "¿Estás seguro de que quieres desinstalar BeatSaber {version}? Tendrás que descargarlo de nuevo para poder jugar.", + "buttons":{ + "submit": "Desinstalar" + } + }, + "install-folder":{ + "title": "Instalación Carpeta", + "description": "Al cambiar la carpeta de instalación por defecto, se moverán todos los datos instalados a la nueva carpeta.", + "buttons":{ + "submit": "Elija la carpeta" + } + } } } diff --git a/assets/jsons/translations/fr-FR.json b/assets/jsons/translations/fr-FR.json index 0f1877c1..f55d05af 100644 --- a/assets/jsons/translations/fr-FR.json +++ b/assets/jsons/translations/fr-FR.json @@ -4,7 +4,8 @@ "verify": "Vérifier", "launch": "Lancer", "mods": "Modes", - "maps": "Maps" + "maps": "Maps", + "cancel": "Annuler" }, "pages":{ "version-viewer":{ @@ -152,5 +153,52 @@ } } } + }, + "modals":{ + "guard":{ + "title": "Steam Guard", + "inputs":{ + "guard-code":{ + "label": "Code Guard", + "placeholder": "Entre ton code Guard" + } + }, + "buttons":{ + "submit": "Se connecter" + } + }, + "steam-login":{ + "title": "Connexion Steam", + "inputs":{ + "username":{ + "label": "Nom d'utilisateur", + "placeholder": "Entre ton nom d'utilisateur" + }, + "password":{ + "label": "Mot de passe", + "placeholder": "Entre ton mot de passe" + }, + "stay":{ + "label": "Rester connecté" + } + }, + "buttons":{ + "submit": "Se connecter" + } + }, + "bs-uninstall":{ + "title": "Désinstaller", + "description": "Est tu sûr de vouloir désinstaller BeatSaber {version} ? Tu vas devoir la retélécharger pour y jouer.", + "buttons":{ + "submit": "Désinstaller" + } + }, + "install-folder":{ + "title": "Dossier d'installation", + "description": "Changer le dossier d'installation par défaut, va engendrer le déplacement de toutes les données installer vers le nouveau dossier.", + "buttons":{ + "submit": "Choisir un dossier" + } + } } } diff --git a/src/renderer/components/modal/modal-types/guard-modal.component.tsx b/src/renderer/components/modal/modal-types/guard-modal.component.tsx index acd23189..11071f2f 100644 --- a/src/renderer/components/modal/modal-types/guard-modal.component.tsx +++ b/src/renderer/components/modal/modal-types/guard-modal.component.tsx @@ -3,10 +3,12 @@ import { useState } from "react"; import BeatConflict from "../../../../../assets/images/apngs/beat-conflict.png" import { BsmImage } from "renderer/components/shared/bsm-image.component"; import { BsmButton } from "renderer/components/shared/bsm-button.component"; +import { useTranslation } from "renderer/hooks/use-translation.hook"; export function GuardModal({resolver}: {resolver: (x: ModalResponse) => void}) { const [guardCode, setGuardCode] = useState(''); + const t = useTranslation(); const login = () => { if(!guardCode){ return; } @@ -15,15 +17,15 @@ export function GuardModal({resolver}: {resolver: (x: ModalResponse) => void}) { return (
{e.preventDefault(); login();}}> -

Steam Guard

+

{t("modals.guard.title")}

- - setGuardCode(e.target.value.toUpperCase())} value={guardCode} type="guard" name="guard" id="guard" placeholder="Enter your Guard code"/> + + setGuardCode(e.target.value.toUpperCase())} value={guardCode} type="guard" name="guard" id="guard" placeholder={t("modals.guard.inputs.guard-code.placeholder")}/>
- {resolver({exitCode: ModalExitCode.CANCELED})}} withBar={false} text="Cancel"/> - + {resolver({exitCode: ModalExitCode.CANCELED})}} withBar={false} text={t("misc.cancel")}/> +
) diff --git a/src/renderer/components/modal/modal-types/installation-folder-modal.component.tsx b/src/renderer/components/modal/modal-types/installation-folder-modal.component.tsx index 5d38d328..2c06515a 100644 --- a/src/renderer/components/modal/modal-types/installation-folder-modal.component.tsx +++ b/src/renderer/components/modal/modal-types/installation-folder-modal.component.tsx @@ -1,21 +1,22 @@ import { BsmButton } from "renderer/components/shared/bsm-button.component"; import { BsmImage } from "renderer/components/shared/bsm-image.component"; +import { useTranslation } from "renderer/hooks/use-translation.hook"; import { ModalExitCode, ModalResponse } from "renderer/services/modale.service"; import BeatConflict from "../../../../../assets/images/apngs/beat-conflict.png" export function InstallationFolderModal({resolver}: {resolver: (x: ModalResponse) => void}) { - + const t = useTranslation(); return ( <> -

installation folder

+

{t("modals.install-folder.title")}

-

Changing the default installation folder for Beat Saber instances will cause all installed data to be moved to the new folder.

+

{t("modals.install-folder.description")}

- resolver({exitCode: ModalExitCode.CANCELED})} withBar={false} text="Cancel"/> - resolver({exitCode: ModalExitCode.COMPLETED})} withBar={false} text="Choose Folder"/> + resolver({exitCode: ModalExitCode.CANCELED})} withBar={false} text="misc.cancel"/> + resolver({exitCode: ModalExitCode.COMPLETED})} withBar={false} text="modals.install-folder.buttons.submit"/>
) diff --git a/src/renderer/components/modal/modal-types/login-modal.component.tsx b/src/renderer/components/modal/modal-types/login-modal.component.tsx index cbe6989e..9592f8ca 100644 --- a/src/renderer/components/modal/modal-types/login-modal.component.tsx +++ b/src/renderer/components/modal/modal-types/login-modal.component.tsx @@ -1,6 +1,7 @@ import { useState } from "react"; import { BsmButton } from "renderer/components/shared/bsm-button.component"; import { BsmImage } from "renderer/components/shared/bsm-image.component"; +import { useTranslation } from "renderer/hooks/use-translation.hook"; import { ModalExitCode, ModalResponse } from "renderer/services/modale.service"; import BeatImpatient from '../../../../../assets/images/apngs/beat-impatient.png' @@ -9,6 +10,7 @@ export function LoginModal({resolver}: {resolver: (x: ModalResponse) => void}) { const [username, setUsername] = useState(''); const [password, setPassword] = useState(''); const [stay, setStay] = useState(true); + const t = useTranslation(); const loggin = () => { if(!username || !password){ return; } @@ -17,23 +19,23 @@ export function LoginModal({resolver}: {resolver: (x: ModalResponse) => void}) { return (
{e.preventDefault(); loggin();}}> -

Steam Login

+

{t("modals.steam-login.title")}

- - setUsername(e.target.value)} value={username} type="text" name="username" id="username" placeholder="Enter your username"/> + + setUsername(e.target.value)} value={username} type="text" name="username" id="username" placeholder={t("modals.steam-login.inputs.username.placeholder")}/>
- - setPassword(e.target.value)} value={password} type="password" name="password" id="password" placeholder="Enter your password"/> + + setPassword(e.target.value)} value={password} type="password" name="password" id="password" placeholder={t("modals.steam-login.inputs.password.placeholder")}/>
setStay(e.target.checked)} checked={stay} className="mr-1" type="checkbox" name="stay" id="stay" /> - +
- {resolver({exitCode: ModalExitCode.CANCELED})}} withBar={false} text="Cancel"/> - + {resolver({exitCode: ModalExitCode.CANCELED})}} withBar={false} text="misc.cancel"/> +
) diff --git a/src/renderer/components/modal/modal-types/uninstall-modal.component.tsx b/src/renderer/components/modal/modal-types/uninstall-modal.component.tsx index 8b0aa4e2..a760a83d 100644 --- a/src/renderer/components/modal/modal-types/uninstall-modal.component.tsx +++ b/src/renderer/components/modal/modal-types/uninstall-modal.component.tsx @@ -3,19 +3,21 @@ import BeatConflict from "../../../../../assets/images/apngs/beat-conflict.png" import { BSVersion } from "main/services/bs-version-manager.service"; import { BsmButton } from "renderer/components/shared/bsm-button.component"; import { BsmImage } from "renderer/components/shared/bsm-image.component"; +import { useTranslation } from "renderer/hooks/use-translation.hook"; export function UninstallModal({resolver}: {resolver: (x: ModalResponse) => void}) { const version = ModalService.getInsance().getModalData(); + const t = useTranslation(); return (
{e.preventDefault(); resolver({exitCode: ModalExitCode.COMPLETED})}}> -

Uninstall

+

{t("modals.bs-uninstall.title")}

-

Are you sure you want to uninstall BeatSaber {version.BSVersion} ? You will have to re-download it to play it.

+

{t("modals.bs-uninstall.description", {version: version.BSVersion})}

- {resolver({exitCode: ModalExitCode.CANCELED})}} withBar={false} text="Cancel"/> - + {resolver({exitCode: ModalExitCode.CANCELED})}} withBar={false} text="misc.cancel"/> +
) diff --git a/src/renderer/hooks/use-translation.hook.ts b/src/renderer/hooks/use-translation.hook.ts index 1474feb2..5c13efbe 100644 --- a/src/renderer/hooks/use-translation.hook.ts +++ b/src/renderer/hooks/use-translation.hook.ts @@ -1,12 +1,11 @@ import { I18nService } from "renderer/services/i18n.service" -export function useTranslation(): (translationKey: string) => string{ +export function useTranslation(): (translationKey: string, args?: Record) => string{ const i18nService = I18nService.getInstance(); - return (key: string) => { - if(!key){ return ""; } + return (key: string, args?: Record) => { const tranlatables = key.split(" "); - return tranlatables.map((key) => i18nService.translate(key)).join(" "); + return tranlatables.map((key) => i18nService.translate(key, args)).join(" "); } } \ No newline at end of file diff --git a/src/renderer/services/i18n.service.ts b/src/renderer/services/i18n.service.ts index 35c12609..90a0965e 100644 --- a/src/renderer/services/i18n.service.ts +++ b/src/renderer/services/i18n.service.ts @@ -44,12 +44,14 @@ export class I18nService { this.configService.set("language" as DefaultConfigKey, this.getSupportedLanguages().includes(lang) ? lang : this.LANG_FALLBACK); } - public translate(translationKey: string): string{ - const cachedTranlation = this.cache.get(translationKey); - if(!!cachedTranlation){ return cachedTranlation; } - const tranlated = getProperty(this.dictionary, translationKey); - tranlated && this.cache.set(translationKey, tranlated); - return tranlated || translationKey; + public translate(translationKey: string, args?: Record): string{ + let translated = this.cache.get(translationKey); + if(!translated){ + translated = getProperty(this.dictionary, translationKey); + translated ? this.cache.set(translated, translationKey) : translated = translationKey; + } + args && Object.keys(args).forEach(key => translated = translated.replaceAll(`{${key}}`, args[key])); + return translated; }