From 54cc566fabe041af9b713bca39871b1f41750a8e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?F=C3=A9lix=20MARQUET?= Date: Thu, 28 Aug 2025 17:09:47 +0200 Subject: [PATCH] feat: Rename i18n.js to i18n.ts and update language handling in translations --- public/locales/en/translation.json | 40 +++++++++++++++++++++------ public/locales/fr/translation.json | 44 +++++++++++++++++++++++------- src/App.tsx | 2 +- src/components/ProjectCard.tsx | 2 +- src/{i18n.js => i18n.ts} | 5 +++- 5 files changed, 72 insertions(+), 21 deletions(-) rename src/{i18n.js => i18n.ts} (70%) diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index d3321d3..47476e9 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -8,14 +8,38 @@ }, "projects": { "title": "My projects", - "Front end starter.description": "My personal starter for front end projects", - "Project C - ISEN CIR 1.description": "End of 1st year project at ISEN Nantes", - "Projet robot.description": "Robot project with the Modelec ISEN club for the French robotics cup (Development and deployment on Raspberry Pi)", - "MercuryCloud.description": "Game server and VPS hosting project. Technical support position, administrator of VPS, Game and web services.", - "Projet C++ - ISEN CIR 2.description": "End of 4th semester project at ISEN Nantes. Creation of a Tower Defense type game in C++ with the QT6 library.", - "Github NTFY.description": "Notification project for github and dockerhub releases that sends notifications on ntfy, gotify and discord.", - "Projet C++ - ISEN CIPA 3.description": "Fish school behavior simulation game project in C++ with the SLD2 library, with multiplayer support.", - "Alternance Horoquartz.description": "Development of an update system for Horoquartz products." + "Front end starter": { + "title": "Front end starter", + "description": "My personal starter for front end projects" + }, + "Project C - ISEN CIR 1": { + "title": "C Project - ISEN CIR 1", + "description": "End of 1st year project at ISEN Nantes" + }, + "Projet robot": { + "title": "Robot Project", + "description": "Robot project with the Modelec ISEN club for the French robotics cup (Development and deployment on Raspberry Pi)" + }, + "MercuryCloud": { + "title": "MercuryCloud", + "description": "Game server and VPS hosting project. Technical support position, administrator of VPS, Game and web services." + }, + "Projet C++ - ISEN CIR 2": { + "title": "C++ Project - ISEN CIR 2", + "description": "End of 4th semester project at ISEN Nantes. Development of a Tower Defense type game in C++ with the QT6 library." + }, + "Github NTFY": { + "title": "Github NTFY", + "description": "Notification project for github and dockerhub releases that sends notifications on ntfy, gotify and discord." + }, + "Projet C++ - ISEN CIPA 3": { + "title": "C++ Project - ISEN CIPA 3", + "description": "Fish school behavior simulation game project in C++ with the SLD2 library, with multiplayer support." + }, + "Alternance Horoquartz": { + "title": "Horoquartz Work-study", + "description": "Development of an update system for Horoquartz products." + } }, "cv": { "title": "My resume", diff --git a/public/locales/fr/translation.json b/public/locales/fr/translation.json index 069a8db..7cdb405 100644 --- a/public/locales/fr/translation.json +++ b/public/locales/fr/translation.json @@ -1,21 +1,45 @@ { "about": { "title": "A propos de moi", - "description": "Je suis étudiant en 4e année à l'ISEN Nantes en alternance chez Horoquartz. Je suis passionné par l'informatique. J'ai appris à coder en autodidacte et je suis actuellement en train d'apprendre le Rust et le Go. Je suis également passionné par l'électronique et le hardware. Je possède un homelab composé de 3 serveur, un DELL T320, un DELL T330 et un Dell Precision T3610 les 3 sous proxmox." + "description": "Je suis étudiant en 4e année à l'ISEN Nantes en alternance chez Horoquartz. Je suis passionné par l'informatique. J'ai appris à coder en autodidacte et je suis actuellement en train d'apprendre le Rust et le Go. Je suis également passionné par l'électronique et le hardware. J'ai construit un homelab composé de 3 serveur, un DELL T320, un DELL T330 et un Dell Precision T3610 les 3 sous proxmox." }, "card": { "title": "Etudiant en 4e année a l'ISEN Nantes en alternance chez Horoquartz" }, "projects": { "title": "Mes projets", - "Front end starter.description": "Mon starter personnel pour projet front end", - "Project C - ISEN CIR 1.description": "Projet de fin de 1ere année à l'ISEN Nantes", - "Projet robot.description": "Projet de robot avec le club Modelec ISEN pour la coupe de france de robotique (Developpement et déploiment sur Raspberry Pi)", - "MercuryCloud.description": "Projet d'herbergeur de serveur de jeu et VPS. Poste de support technique, administrateur des service VPS, Game et web.", - "Projet C++ - ISEN CIR 2.description": "Projet de fin de 4e semestre à l'ISEN Nantes. Création d'un jeu de type Tower Defense en C++ avec la librairie QT6.", - "Github NTFY.description": "Projet de notification pour les releases github et dockerhub qui envoie des notifications sur ntfy, gotify et discord.", - "Projet C++ - ISEN CIPA 3.description": "Projet de jeu de simulation de comportement de banc de poisson en C++ avec la librairie SLD2, avec support du multijoueur.", - "Alternance Horoquartz.description": "Développement d'un système de mise à jour pour les produits Horoquartz." + "Front end starter": { + "title": "Front end starter", + "description": "Mon starter personnel pour projet front end" + }, + "Project C - ISEN CIR 1": { + "title": "Projet C - ISEN CIR 1", + "description": "Projet de fin de 1ere année à l'ISEN Nantes" + }, + "Projet robot": { + "title": "Projet robot", + "description": "Projet de robot avec le club Modelec ISEN pour la coupe de france de robotique (Developpement et déploiment sur Raspberry Pi)" + }, + "MercuryCloud": { + "title": "MercuryCloud", + "description": "Projet d'herbergeur de serveur de jeu et VPS. Poste de support technique, administrateur des service VPS, Game et web." + }, + "Projet C++ - ISEN CIR 2": { + "title": "Projet C++ - ISEN CIR 2", + "description": "Projet de fin de 4e semestre à l'ISEN Nantes. Création d'un jeu de type Tower Defense en C++ avec la librairie QT6." + }, + "Github NTFY": { + "title": "Github NTFY", + "description": "Projet de notification pour les releases github et dockerhub qui envoient des notifications sur ntfy, gotify et discord." + }, + "Projet C++ - ISEN CIPA 3": { + "title": "Projet C++ - ISEN CIPA 3", + "description": "Projet de jeu de simulation de comportement de banc de poisson en C++ avec la librairie SLD2, avec support du multijoueur." + }, + "Alternance Horoquartz": { + "title": "Alternance Horoquartz", + "description": "Développement d'un système de mise à jour pour les produits Horoquartz." + } }, "cv": { "title": "Mon CV", @@ -136,7 +160,7 @@ "current": true, "description": [ "Développement d'un système de mise à jour pour les produits Horoquartz", - "Conception et implémentation d'APIs REST avec Node.js et Go", + "Mise en oeuvre d'APIs REST avec Node.js et Go", "Gestion des bases de données PostgreSQL", "Déploiement avec Docker et Kubernetes sur Azure" ], diff --git a/src/App.tsx b/src/App.tsx index a895702..d2d36fe 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -16,7 +16,7 @@ import ContactSection from "./components/ContactSection"; import TimelineSection from "./components/TimelineSection"; import data from "./assets/DATA"; import { useTranslation } from "react-i18next"; -import i18n from './i18n.js'; +import i18n from './i18n'; import {createRoot} from "react-dom/client"; import GitHubStatsSection from 'components/GitHubStatsSection'; diff --git a/src/components/ProjectCard.tsx b/src/components/ProjectCard.tsx index 15e223d..e50fc5c 100644 --- a/src/components/ProjectCard.tsx +++ b/src/components/ProjectCard.tsx @@ -22,7 +22,7 @@ const ProjectCard = ({ project }: ProjectCardProps) => {

- {title}{" "} + {t(`projects.${project.title}.title`)}{" "}

diff --git a/src/i18n.js b/src/i18n.ts similarity index 70% rename from src/i18n.js rename to src/i18n.ts index 2f0a704..7b7a538 100644 --- a/src/i18n.js +++ b/src/i18n.ts @@ -2,11 +2,14 @@ import i18n from "i18next"; import { initReactI18next } from "react-i18next"; import HttpBackend from "i18next-http-backend"; +const savedLang = localStorage.getItem('lang'); +const browserLang = navigator.language.startsWith('fr') ? 'fr' : 'en'; + i18n .use(HttpBackend) .use(initReactI18next) .init({ - lng: navigator.language.startsWith('fr') ? 'fr' : 'en', + lng: savedLang || browserLang, fallbackLng: "en", interpolation: { escapeValue: false