feat(projects): add translations

2026-02-27 00:54:22 +01:00
parent 779884414e
commit 2ac77bdb30
11 changed files with 163 additions and 77 deletions
--- a/app/components/Projects/TopScreen/Project.vue
+++ b/app/components/Projects/TopScreen/Project.vue
@@ -119,7 +119,7 @@ onRender((ctx) => {
    ctx,
    "black",
    project.summary,
-    Math.floor(185 - textWidth / 2),
+    Math.floor(181 - textWidth / 2),
    17,
  );

--- a/app/stores/projects.ts
+++ b/app/stores/projects.ts
@@ -4,12 +4,21 @@ import type {
 } from "@nuxt/content";
 import gsap from "gsap";

+type ProjectItem = Omit<
+  ProjectsCollectionItem,
+  keyof DataCollectionItemBase
+> & {
+  id: string;
+};
+export type Project = Omit<ProjectItem, "en" | "fr"> & {
+  description: string;
+  summary: string;
+  tasks: string[];
+};
+
 export const useProjectsStore = defineStore("projects", {
  state: () => ({
-    projects: [] as (Omit<
-      ProjectsCollectionItem,
-      keyof DataCollectionItemBase
-    > & { id: string })[],
+    projects: [] as Project[],
    currentProject: 0,
    loading: true,
    offsetX: 0,
@@ -29,30 +38,34 @@ export const useProjectsStore = defineStore("projects", {

  actions: {
    async loadProjects() {
+      const { locale } = useI18n();
      this.loading = true;

-      const projects = await queryCollection("projects")
+      const items = await queryCollection("projects")
        .order("order", "ASC")
-        .select(
-          "id",
-          "order",
-          "scope",
-          "title",
-          "link",
-          "description",
-          "summary",
-          "technologies",
-          "tasks",
-        )
        .all();

-      if (!projects) throw "Cannot load projects";
-      this.projects = projects.map((project) => ({
-        ...project,
-        id: project.id
-          .split("/")[2]!
-          .replace(/-([a-z])/g, (_, letter) => letter.toUpperCase()),
-      }));
+      if (!items) throw "Cannot load projects";
+
+      this.projects = items.map((item) => {
+        const slug = item.id.split("/")[2]!;
+        const localeData = item[locale.value as "en"] ?? item.en;
+        if (!localeData) {
+          console.warn(`Missing '${locale.value}' for ${slug}`);
+        }
+
+        const { en: _en, fr: _fr, ...meta } = item;
+
+        return {
+          ...meta,
+          id: slug.replace(/-([a-z])/g, (_: string, letter: string) =>
+            letter.toUpperCase(),
+          ),
+          description: localeData.description ?? "",
+          summary: localeData.summary ?? "",
+          tasks: localeData.tasks ?? [],
+        };
+      });

      this.loading = false;
    },
--- a/content.config.ts
+++ b/content.config.ts
@@ -1,6 +1,12 @@
 import { defineContentConfig, defineCollection } from "@nuxt/content";
 import { z } from "zod";

+const localeSchema = z.object({
+  description: z.string(),
+  summary: z.string(),
+  tasks: z.array(z.string()),
+});
+
 export default defineContentConfig({
  collections: {
    projects: defineCollection({
@@ -11,10 +17,9 @@ export default defineContentConfig({
        scope: z.enum(["hobby", "work"]),
        title: z.string(),
        link: z.url(),
-        description: z.string(),
-        summary: z.string(),
        technologies: z.array(z.string()),
-        tasks: z.array(z.string()),
+        en: localeSchema,
+        fr: localeSchema,
      }),
    }),
  },
--- a/content/projects/biobleud/index.yml
+++ b/content/projects/biobleud/index.yml
@@ -3,12 +3,21 @@ scope: work
 title: Biobleud
 link: https://biobleud.fr/

-description: Agri-food company
-summary: Temporary assignments
 technologies:
  - VBA

-tasks:
-  - Developing Excel macros\nin VBA for ERP system\nimplementation
-  - Understanding client\nneeds
-  - Documentation
+en:
+  description: Agri-food company
+  summary: Temporary assignments
+  tasks:
+    - "Developing Excel macros\\nin VBA for ERP system\\nimplementation"
+    - "Understanding client\\nneeds"
+    - "Documentation"
+
+fr:
+  description: Entreprise agroalimentaire
+  summary: Missions temporaires
+  tasks:
+    - "Développement de macros\\nExcel en VBA pour\\nun ERP"
+    - "Compréhension des\\nbesoins du client"
+    - "Documentation"
--- a/content/projects/lbf-bot/index.yml
+++ b/content/projects/lbf-bot/index.yml
@@ -3,13 +3,22 @@ scope: hobby
 title: LBF Bot
 link: https://git.pihkaal.me/lbf-bot

-description: For a gaming group
-summary: Custom Discord bot
 technologies:
  - Node
  - TypeScript

-tasks:
-  - Made for a gaming group
-  - Deployed on VPS
-  - Understanding client\nneeds
+en:
+  description: For a gaming group
+  summary: Custom Discord bot
+  tasks:
+    - "Made for a gaming group"
+    - "Deployed on VPS"
+    - "Understanding client\\nneeds"
+
+fr:
+  description: Pour un groupe de gaming
+  summary: Bot Discord personnalisé
+  tasks:
+    - "Créé pour un groupe\\nautour d'un jeu"
+    - "Déployé sur VPS"
+    - "Compréhension des\\nbesoins du client"
--- a/content/projects/lilou-cat/index.yml
+++ b/content/projects/lilou-cat/index.yml
@@ -3,13 +3,20 @@ scope: hobby
 title: lilou.cat
 link: https://lilou.cat

-description: Lilou <3
-summary: Lilou's website
-
 technologies:
  - HTML
  - Go

-tasks:
-  - Originally made for fun\nto celebrate my cat Lilou
-  - Now preserved in her\nmemory
+en:
+  description: Lilou <3
+  summary: Lilou's website
+  tasks:
+    - "Originally made for fun\\nto celebrate my cat Lilou"
+    - "Now preserved in her\\nmemory"
+
+fr:
+  description: Lilou <3
+  summary: Le site de Lilou
+  tasks:
+    - "Créé pour célébrer\\nmon chat Lilou"
+    - "Désormais préservé\\nen sa mémoire"
--- a/content/projects/pihkaal-me/index.yml
+++ b/content/projects/pihkaal-me/index.yml
@@ -3,13 +3,20 @@ scope: hobby
 title: pihkaal.me
 link: https://pihkaal.me

-description: Portfolio and contact
-summary: My personnal website
-
 technologies:
  - Nuxt
  - TypeScript

-tasks:
-  - The website you are\ncurrently on!
-  - Recreation of the Nintendo\nDS because it was my first\never console
+en:
+  description: Portfolio and contact
+  summary: My personal website
+  tasks:
+    - "The website you are\\ncurrently on!"
+    - "Recreation of the Nintendo\\nDS because it was my first\\never console"
+
+fr:
+  description: Portfolio et contact
+  summary: Mon site personnel
+  tasks:
+    - "Le site sur lequel\\nvous êtes !"
+    - "Recréation de la Nintendo\\nDS car c'était ma première\\nconsole"
--- a/content/projects/raylib-speedruns/index.yml
+++ b/content/projects/raylib-speedruns/index.yml
@@ -3,8 +3,6 @@ scope: hobby
 title: Raylib Spdrns
 link: https://git.pihkaal.me/raylib-speedruns

-description: Awesome video game library
-summary: Raylib Speedruns
 technologies:
  - C
  - C#
@@ -13,6 +11,16 @@ technologies:
  - Rust
  - Asm x86_64

-tasks:
-  - Simple Raylib setups in\nmultiple languages
-  - Inspired by Tsoding
+en:
+  description: Awesome video game library
+  summary: Raylib Speedruns
+  tasks:
+    - "Simple Raylib setups in\\nmultiple languages"
+    - "Inspired by Tsoding"
+
+fr:
+  description: Super bibliothèque
+  summary: Raylib Speedruns
+  tasks:
+    - "Exemples d'utilisation de\\nRaylib en plusieurs\\nlangages"
+    - "Inspiré par Tsoding"
--- a/content/projects/s3pweb/index.yml
+++ b/content/projects/s3pweb/index.yml
@@ -3,15 +3,25 @@ scope: work
 title: S3PWeb
 link: https://s3pweb.com

-description: The Transport Data Aggregator
-summary: Apprenticeship
 technologies:
  - Node
  - StencilJS
  - TypeScript

-tasks:
-  - Automatized incidents\naggregation to Jira
-  - Web based map editor
-  - Chrome extension to\nvisualize Eramba assets
-  - Documentation
+en:
+  description: The Transport Data Aggregator
+  summary: Apprenticeship
+  tasks:
+    - "Automatized incidents\\naggregation to Jira"
+    - "Web based map editor"
+    - "Chrome extension to\\nvisualize Eramba assets"
+    - "Documentation"
+
+fr:
+  description: L'agrégateur des dataa transport
+  summary: Alternance
+  tasks:
+    - "Agrégation automatisée\\nd'incidents vers Jira"
+    - "Éditeur de carte web"
+    - "Extension Chrome pour\\nles assets Eramba"
+    - "Documentation"
--- a/content/projects/simple-qr/index.yml
+++ b/content/projects/simple-qr/index.yml
@@ -3,13 +3,22 @@ scope: hobby
 title: Simple QR
 link: https://simple-qr.com

-description: Concise website and API
-summary: QR code generator
 technologies:
  - Nuxt
  - TypeScript

-tasks:
-  - Easy to use
-  - Large choice of logos
-  - Straightforward API
+en:
+  description: Concise website and API
+  summary: QR code generator
+  tasks:
+    - "Easy to use"
+    - "Large choice of logos"
+    - "Straightforward API"
+
+fr:
+  description: Site web et API concis
+  summary: Générateur de QR code
+  tasks:
+    - "Facile à utiliser"
+    - "Grand choix de logos"
+    - "API simple d'utilisation"
--- a/content/projects/tlock/index.yml
+++ b/content/projects/tlock/index.yml
@@ -3,14 +3,23 @@ scope: hobby
 title: tlock
 link: https://git.pihkaal.me/tlock

-description: For Hyprland ricing
-summary: Terminal based clock
 technologies:
  - Rust

-tasks:
-  - Fully customizable
-  - Animated
-  - Cross-platform
-  - |
-    Multiple modes: clock,\nchronometer and timer
+en:
+  description: For Hyprland ricing
+  summary: Terminal based clock
+  tasks:
+    - "Fully customizable"
+    - "Animated"
+    - "Cross-platform"
+    - "Multiple modes: clock,\\nchronometer and timer"
+
+fr:
+  description: Pour le ricing Hyprland
+  summary: Horloge pour le terminal
+  tasks:
+    - "Entièrement\\npersonnalisable"
+    - "Animée"
+    - "Multi-plateforme"
+    - "Plusieurs modes : horloge,\\nchronomètre et minuteur"