add translations

This commit is contained in:
MathieuG-P
2022-10-05 23:24:59 +02:00
parent 840ff225f8
commit 5e12baa35f
5 changed files with 66 additions and 8 deletions
+18
View File
@@ -14,6 +14,24 @@
"desktop": "Desktop Mod",
"debug": "Debug Mod"
},
"mods":{
"loading-mods": "Loading mods...",
"buttons":{
"more-infos": "More info",
"install-or-update": "Install or update"
},
"mods-grid":{
"header-bar":{
"name": "Name",
"installed": "Installed",
"latest": "Latest",
"description":"Description",
"dropdown":{
"uninstall-all":"Uninstall all"
}
}
}
},
"dropdown":{
"open-folder": "Open folder",
"verify-files": "Verify files",
+18
View File
@@ -14,6 +14,24 @@
"desktop": "Desktop Mod",
"debug": "Debug Mod"
},
"mods":{
"loading-mods": "Cargando mods...",
"buttons":{
"more-infos": "Más información",
"install-or-update": "Instalar o actualizar"
},
"mods-grid":{
"header-bar":{
"name": "Nombre",
"installed": "Instalado",
"latest": "Último",
"description":"Descripción",
"dropdown":{
"uninstall-all":"Desinstalar todos"
}
}
}
},
"dropdown":{
"open-folder": "Abrir la carpeta",
"verify-files": "Verificar los archivos",
+18
View File
@@ -14,6 +14,24 @@
"desktop": "Mode Bureau",
"debug": "Mode Debug"
},
"mods":{
"loading-mods": "Chargement des mods...",
"buttons":{
"more-infos": "Plus d'infos",
"install-or-update": "Installer ou mettre à jour"
},
"mods-grid":{
"header-bar":{
"name": "Nom",
"installed": "Installé",
"latest": "Récent",
"description":"Description",
"dropdown":{
"uninstall-all":"Tout désinstaller"
}
}
}
},
"dropdown":{
"open-folder": "Ouvrir le dossier",
"verify-files": "Vérifier les fichiers",
@@ -2,6 +2,7 @@ import { motion } from "framer-motion";
import { useState } from "react";
import { BsmButton } from "renderer/components/shared/bsm-button.component";
import { BsmDropdownButton } from "renderer/components/shared/bsm-dropdown-button.component";
import { useTranslation } from "renderer/hooks/use-translation.hook";
import { BsModsManagerService } from "renderer/services/bs-mods-manager.service";
import { PageStateService } from "renderer/services/page-state.service";
import { Mod } from "shared/models/mods/mod.interface"
@@ -16,6 +17,7 @@ export function ModsGrid({modsMap, installed, modsSelected, onModChange, moreInf
const [filter, setFilter] = useState("");
const [filterEnabled, setFilterEnabled] = useState(false);
const t = useTranslation();
const installedModVersion = (key: string, mod: Mod): string => {
if(!installed || !installed.get(key)){ return undefined; }
@@ -55,16 +57,16 @@ export function ModsGrid({modsMap, installed, modsSelected, onModChange, moreInf
{(filterEnabled ? (
<motion.input autoFocus className="bg-main-color-1 rounded-md h-6 px-2" initial={{width: 0}} animate={{width: "250px"}} transition={{ease:"easeInOut", duration:.15}} onChange={e => handleInput(e.target.value)}/>
):(
<span className="w-full text-center">Nom</span>
<span className="w-full text-center">{t("pages.version-viewer.mods.mods-grid.header-bar.name")}</span>
))}
</span>
<span className="z-10 sticky flex items-center justify-center top-0 bg-inherit border-b-2 border-main-color-1 h-8 px-2">Installé</span>
<span className="z-10 sticky flex items-center justify-center top-0 bg-inherit border-b-2 border-main-color-1 h-8 px-2">Récent</span>
<span className="z-10 sticky flex items-center justify-center top-0 bg-inherit border-b-2 border-main-color-1 h-8">Description</span>
<span className="z-10 sticky flex items-center justify-center top-0 bg-inherit border-b-2 border-main-color-1 h-8 px-2">{t("pages.version-viewer.mods.mods-grid.header-bar.installed")}</span>
<span className="z-10 sticky flex items-center justify-center top-0 bg-inherit border-b-2 border-main-color-1 h-8 px-2">{t("pages.version-viewer.mods.mods-grid.header-bar.latest")}</span>
<span className="z-10 sticky flex items-center justify-center top-0 bg-inherit border-b-2 border-main-color-1 h-8">{t("pages.version-viewer.mods.mods-grid.header-bar.description")}</span>
<span className="z-10 sticky top-0 bg-inherit border-b-2 border-main-color-1 h-8 flex justify-start items-center py-1 pl-[3px] min-w-[50px]">
<BsmDropdownButton className="h-full aspect-square relative rounded-full bg-light-main-color-1 dark:bg-main-color-3" withBar={false} icon="three-dots" buttonClassName="!rounded-full !p-[2px] !bg-light-main-color-2 dark:!bg-main-color-2 hover:!bg-light-main-color-1 dark:hover:!bg-main-color-3" menuTranslationY="5px" items={[
({text: "Tout désintaller", icon: "trash", onClick: handleUninstallAll}),
({text: "pages.version-viewer.mods.mods-grid.header-bar.dropdown.uninstall-all", icon: "trash", onClick: handleUninstallAll}),
]}/>
</span>
@@ -14,6 +14,7 @@ import YuruYuriDance from "../../../../../../assets/images/gifs/yuruyuri-dance.g
import { useObservable } from "renderer/hooks/use-observable.hook";
import { skip, filter } from "rxjs/operators";
import { Subscription } from "rxjs";
import { useTranslation } from "renderer/hooks/use-translation.hook";
export function ModsSlide({version}: {version: BSVersion}) {
@@ -27,6 +28,7 @@ export function ModsSlide({version}: {version: BSVersion}) {
const [modsSelected, setModsSelected] = useState([] as Mod[]);
const [moreInfoMod, setMoreInfoMod] = useState(null as Mod);
const installing = useObservable(modsManager.isInstalling$);
const t = useTranslation();
const downloadRef = useRef(null);
const [downloadWith, setDownloadWidth] = useState(0);
@@ -112,16 +114,16 @@ export function ModsSlide({version}: {version: BSVersion}) {
<ModsGrid modsMap={modsAvailable} installed={modsInstalled} modsSelected={modsSelected} onModChange={handleModChange} moreInfoMod={moreInfoMod} onWantInfos={handleMoreInfo}/>
</div>
<div className="h-10 shrink-0 flex items-center justify-between px-3">
<BsmButton className="text-center rounded-md px-2 py-[2px]" text="Plus d'infos" typeColor="cancel" withBar={false} disabled={!moreInfoMod} onClick={handleOpenMoreInfo} style={{width: downloadWith}}/>
<BsmButton className="text-center rounded-md px-2 py-[2px]" text="pages.version-viewer.mods.buttons.more-infos" typeColor="cancel" withBar={false} disabled={!moreInfoMod} onClick={handleOpenMoreInfo} style={{width: downloadWith}}/>
<div ref={downloadRef}>
<BsmButton className="text-center rounded-md px-2 py-[2px]" text="Installer ou mettre à jour" withBar={false} disabled={installing} typeColor="primary" onClick={installMods}/>
<BsmButton className="text-center rounded-md px-2 py-[2px]" text="pages.version-viewer.mods.buttons.install-or-update" withBar={false} disabled={installing} typeColor="primary" onClick={installMods}/>
</div>
</div>
</>
) : (
<div className="w-full h-full flex flex-col items-center justify-center relative">
<img className="w-32 h-32 spin-loading" src={BeatWaitingImg}></img>
<span className="text-xl mt-3 h-0 italic">Chargement des mods...</span>
<span className="text-xl mt-3 h-0 italic">{t("pages.version-viewer.mods.loading-mods")}</span>
<SpoilerClick className="absolute right-5 w-20 h-[120px] bottom-5 cursor-pointer">
<img className="relative w-full" src={YuruYuriDance}/>
</SpoilerClick>