Translate static texts

TODO.md

@@ -40,13 +40,13 @@
     - [ ] Get Geo-Location
     - [ ] View other answers
     - [ ] View other reviews and scores
-    - [ ] Process image uploads (resize, remove EXIF, etc.)
+    - [x] Process image uploads (resize, remove EXIF, etc.)
     - [ ] Review other answers (Fan-Favorite)
     - [ ] Track walking distance
     - [ ] Notifications
   - **General**
     - [x] Pretty slugified urls
-    - [ ] All static texts translated
+    - [x] All static texts translated
     - [ ] Pretty
     - [ ] SEO, Meta, Preview
     - [ ] Deployment `.on.hs-bremen.de`??

app/components/ClickableImage.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+const { t } = useI18n();
 const props = withDefaults(
   defineProps<{
     title?: string;
@@ -42,7 +43,7 @@ const isOpen = ref(false);
       </template>
     </VaImage>
     <template #footer>
-      <VaButton @click="isOpen = false">Close</VaButton>
+      <VaButton @click="isOpen = false">{{ t('vuestic.close') }}</VaButton>
     </template>
   </VaModal>
 </template>

app/components/TeamAddModal.vue

@@ -48,27 +48,26 @@ async function submit() {
   }
   pending.value = false;
 }
-// TODO: translate
 </script>
 
 <template>
-  <VaButton color="success" icon="group_add" @click="isOpen = true"
+  <VaButton color="success" icon="group_add" @click="isOpen = true">{{
-    >Create a new team</VaButton
+    t('comp.team_add.create_a_new_team')
-  >
+  }}</VaButton>
   <VaModal v-model="isOpen" close-button hide-default-actions>
-    <h3 class="text-3xl">Create a new team</h3>
+    <h3 class="mt-16 text-3xl">{{ t('comp.team_add.create_a_new_team') }}</h3>
     <div class="mt-4 flex flex-col gap-4">
       <VaInput
         v-model="data.name"
-        label="Name"
+        :label="t('comp.team_add.team_name')"
         placeholder="My cool team"
         min-length="3"
         max-length="256"
         counter
         :rules="[
-          validation.required('Name'),
+          validation.required(t('comp.team_add.team_name')),
-          validation.max('Name', 256),
+          validation.max(t('comp.team_add.team_name'), 256),
-          validation.min('Name', 3)
+          validation.min(t('comp.team_add.team_name'), 3)
         ]"
         required
       />
@@ -76,24 +75,26 @@ async function submit() {
         v-model="data.description"
         max-rows="4"
         min-rows="2"
-        label="Description"
+        :label="t('comp.team_add.description')"
         placeholder="The best team!"
         max-length="256"
         counter
-        :rules="[validation.maxOptional('Description', 256)]"
+        :rules="[validation.maxOptional(t('comp.team_add.description'), 256)]"
       />
-      <p>An invite code will be generated automatically.</p>
+      <p>{{ t('comp.team_add.invite_code_automatically') }}</p>
       <VaAlert v-if="error" color="danger">{{ t(error) }}</VaAlert>
     </div>
     <template #footer>
       <VaButtonGroup :loading="pending" :disabled="pending">
-        <VaButton color="secondary" @click="isOpen = false">Cancel</VaButton>
+        <VaButton color="secondary" @click="isOpen = false">{{
+          t('page.common.cancel')
+        }}</VaButton>
         <VaButton
           color="success"
           :disabled="data.name.length < 3 || pending"
           :loading="pending"
           @click="submit"
-          >Create</VaButton
+          >{{ t('comp.team_add.create') }}</VaButton
         >
       </VaButtonGroup>
     </template>

app/components/TeamJoinModal.vue

@@ -73,9 +73,11 @@ async function submit() {
 </script>
 
 <template>
-  <VaButton color="info" icon="search" @click="openModal">Join a team</VaButton>
+  <VaButton color="info" icon="search" @click="openModal">{{
+    t('comp.team_join.join_a_team')
+  }}</VaButton>
   <VaModal v-model="isOpen" close-button hide-default-actions>
-    <h3 class="text-3xl">Join a team</h3>
+    <h3 class="mt-16 text-3xl">{{ t('comp.team_join.join_a_team') }}</h3>
     <div class="mt-4 flex flex-col gap-4">
       <!-- @vue-ignore more specific than vuestic-->
       <VaSelect
@@ -85,11 +87,15 @@ async function submit() {
         track-by="id"
         searchable
         highlight-matched-text
-        placeholder="Select a team"
+        :placeholder="t('comp.team_join.select_a_team')"
-        label="Select a team"
+        :label="t('comp.team_join.select_a_team')"
         :text-by="
           (team: (typeof teams)[number]) =>
-            `'${team.name}' of '${team.owner.name}', ${team._count.members} members`
+            t('comp.team_join.team_preview', {
+              team: team.name,
+              owner: team.owner.name,
+              members: team._count.members
+            })
         "
       >
         <template #prependInner>
@@ -97,9 +103,13 @@ async function submit() {
         </template>
       </VaSelect>
       <p v-if="teams && teams.length <= 0">
-        No team has been created yet, be the first!
+        {{ t('comp.team_join.no_team_yet') }}
       </p>
-      <VaInput v-model="data.password" label="Password" placeholder="abc123">
+      <VaInput
+        v-model="data.password"
+        :label="t('auth.password')"
+        placeholder="abc123"
+      >
         <template #prependInner>
           <VaIcon name="password" />
         </template>
@@ -112,7 +122,9 @@ async function submit() {
         :loading="submitPending || pending"
         :disabled="submitPending"
       >
-        <VaButton color="secondary" @click="isOpen = false">Cancel</VaButton>
+        <VaButton color="secondary" @click="isOpen = false">{{
+          t('page.common.cancel')
+        }}</VaButton>
         <VaButton
           color="success"
           :disabled="
@@ -120,7 +132,7 @@ async function submit() {
           "
           :loading="submitPending || pending"
           @click="submit"
-          >Join</VaButton
+          >{{ t('page.common.join') }}</VaButton
         >
       </VaButtonGroup>
     </template>

app/lang/de.json

@@ -9,12 +9,27 @@
     "login_instead": "Stattdessen anmelden",
     "logout": "Abmelden",
     "name": "Name",
+    "old_invalid": "Altes Passwort inkorrekt!",
     "password": "Passwort",
     "register": "Registrieren",
     "register_instead": "Stattdessen registrieren",
     "reset": "Zurücksetzen",
-    "showPassword": "Passwort einblenden",
+    "showPassword": "Passwort einblenden"
-    "old_invalid": "Altes Passwort inkorrekt!"
+  },
+  "comp": {
+    "team_add": {
+      "create": "Erstellen",
+      "create_a_new_team": "Erstelle ein Team",
+      "description": "Beschreibung",
+      "invite_code_automatically": "Ein Einladungscode wird automatisch generiert.",
+      "team_name": "Teamname"
+    },
+    "team_join": {
+      "join_a_team": "Einem Team beitreten",
+      "no_team_yet": "Es wurde noch kein Team erstellt, gründe das erste!",
+      "select_a_team": "Wähle ein Team aus",
+      "team_preview": "'{team}' von '{owner}', {members} Mitglieder"
+    }
   },
   "enums": {
     "text_type": {
@@ -44,15 +59,25 @@
   },
   "page": {
     "common": {
-      "update_btn": "Updaten",
+      "admin": "Admin",
+      "back_home": "Zurück zur Startseite",
       "back_to_hunt": "Zurück zum Hunt",
+      "cancel": "Abbrechen",
+      "join": "Beitreten",
+      "login_first": "Erst anmelden",
       "no_pictures": "Es wurden noch keine Bilder abgeschickt :(",
       "not_revealed": "Antworten sind noch nicht aufgedeckt, bitte warte bis zum Ende des Hunt!",
-      "admin": "Admin",
-      "refresh": "Aktualisieren",
-      "login_first": "Erst anmelden",
       "open": "Öffnen",
-      "back_home": "Zurück zur Startseite"
+      "refresh": "Aktualisieren",
+      "update_btn": "Updaten"
+    },
+    "diashow": {
+      "head": "Diashow"
+    },
+    "help": {
+      "head": "PicHunt Hilfe",
+      "subtitle": "Hier sind einige Themen und Wörter erklärt. Wenn du weiterhin Fragen hast, wende dich bitte ans Admin Team!",
+      "title": "Hilfe"
     },
     "home": {
       "click_hunt_below_to_join": "Klick auf einen Hunt um ihm beizutreten!",
@@ -67,88 +92,80 @@
       "open_to_join": "Bereit zum Beitreten:",
       "start": "Start: {start}"
     },
-    "showcase": {
+    "hunt": {
-      "showcase_for": "Abschluss für",
+      "admin_unreviewed": "Admin ({count} unbewertet)",
-      "crew": "Crew",
+      "all_pictures": "Bilderwand",
-      "quests": "Quests",
+      "diashow": "Diashow",
-      "users": "Spieler",
+      "hide_answers": "Antworten verstecken",
+      "invite": "Einladen:",
+      "invite_toast_message": "Einladungscode wurde in deine Zwischenablage kopiert! Teile ihn mit deinen neuen Teammitgliedern.",
+      "invite_toast_text": "Trete dem Team {team} mit dem Code \"{code}\" im Hunt \"{hunt}\" bei!",
+      "invite_toast_title": "Einladungscode",
+      "join_this_hunt": "Trete diesem Hunt bei!",
+      "login_to_join": "Um diesem Hunt beizutreten suche oder erstelle ein Team:",
+      "no_picture_uploaded": "Kein Bild hochgeladen",
+      "open_answer": "Öffnen und beantworten",
+      "open_finalize": "Öffnen und finalisieren",
+      "quest_not_revealed": "Quests wurden noch nicht aufgedeckt!",
+      "quest_soon_reveal": "Bald werden alle {count} Quests aufgedeckt!",
+      "showcase": "Showcase",
+      "team_count": "Keine Team beigetreten, so wie du! | Ein Team ist beigetreten, du noch nicht! | {count} Teams sind beigetreten, du noch nicht!",
+      "team_count_joined": "Keine Team beigetreten, so wie du! | Ein Team ist beigetreten, du auch! | {count} Teams sind beigetreten, du auch!",
       "teams": "Teams",
-      "total_points": "Punkte erzielt",
+      "total_points": "Punktestand: {score}",
-      "pictures": "Bilder",
+      "your_team": "Dein Team:"
-      "leaderboard": "Rangliste",
-      "third_place": "Dritter Platz",
-      "second_place": "Zweiter Platz",
-      "first_place": "Erster Platz",
-      "points": "Punkte",
-      "answers": "Antworten",
-      "table": {
-        "answers": "Antworten",
-        "place": "Platz",
-        "name": "Name",
-        "description": "Beschreibung",
-        "score": "Punkte"
-      }
     },
-    "profile": {
+    "imprint": {
-      "old_password": "Altes Passwort",
+      "head": "PicHunt Impressum",
-      "new_password": "Neues Passwort",
+      "title": "Impressum"
-      "uploaded_pictures": "Hochgeladene Bilder",
-      "no_pictures": "Noch keine Bilder hochgeladen."
     },
     "pictures": {
       "head": "Bilderwand"
     },
-    "diashow": {
+    "profile": {
-      "head": "Diashow"
+      "new_password": "Neues Passwort",
+      "no_pictures": "Noch keine Bilder hochgeladen.",
+      "old_password": "Altes Passwort",
+      "uploaded_pictures": "Hochgeladene Bilder"
     },
     "quest": {
       "already_finalized": "Antwort ist bereits finalisiert, keine Änderung erlaubt!",
+      "already_submitted": "Deine Antwort wurde bereits übermittelt!",
       "conflict": "Konflikt: Bitte aktualisiere",
       "extra_points": "Extrapunkte:",
-      "review": "Bewertung",
-      "score": "Punkte:",
-      "reviewed_by": "von {name} am {date}",
-      "last_update": "Letztes Update: {date} von {name}",
-      "submission": "Einreichung",
-      "your_answer": "Deine Antwort",
-      "required_answer": "Erforderliche Antwort",
       "finalize": "Antwort finalisieren",
-      "already_submitted": "Deine Antwort wurde bereits übermittelt!",
       "finalize_explain": "Dies gibt den Admins die Möglichkeit deine Antwort zu bewerten und dir Punkte zu geben. Du kannst deine Antwort anschließend nicht mehr ändern!",
+      "last_update": "Letztes Update: {date} von {name}",
+      "required_answer": "Erforderliche Antwort",
+      "review": "Bewertung",
+      "reviewed_by": "von {name} am {date}",
+      "score": "Punkte:",
+      "submission": "Einreichung",
+      "upload_compress": "Bild wird komprimiert...",
       "upload_title": "Antwort wird hochgeladen...",
-      "upload_compress": "Bild wird komprimiert..."
+      "your_answer": "Deine Antwort"
     },
-    "hunt": {
+    "showcase": {
-      "total_points": "Punktestand: {score}",
+      "answers": "Antworten",
-      "showcase": "Showcase",
+      "crew": "Crew",
-      "diashow": "Diashow",
+      "first_place": "Erster Platz",
-      "all_pictures": "Bilderwand",
+      "leaderboard": "Rangliste",
+      "pictures": "Bilder",
+      "points": "Punkte",
+      "quests": "Quests",
+      "second_place": "Zweiter Platz",
+      "showcase_for": "Abschluss für",
+      "table": {
+        "answers": "Antworten",
+        "description": "Beschreibung",
+        "name": "Name",
+        "place": "Platz",
+        "score": "Punkte"
+      },
       "teams": "Teams",
-      "team_count": "Keine Team beigetreten, so wie du! | Ein Team ist beigetreten, du noch nicht! | {count} Teams sind beigetreten, du noch nicht!",
+      "third_place": "Dritter Platz",
-      "team_count_joined": "Keine Team beigetreten, so wie du! | Ein Team ist beigetreten, du auch! | {count} Teams sind beigetreten, du auch!",
+      "total_points": "Punkte erzielt",
-      "your_team": "Dein Team:",
+      "users": "Spieler"
-      "invite": "Einladen:",
-      "join_this_hunt": "Trete diesem Hunt bei!",
-      "login_to_join": "Um diesem Hunt beizutreten suche oder erstelle ein Team:",
-      "hide_answers": "Antworten verstecken",
-      "no_picture_uploaded": "Kein Bild hochgeladen",
-      "admin_unreviewed": "Admin ({count} unbewertet)",
-      "quest_not_revealed": "Quests wurden noch nicht aufgedeckt!",
-      "quest_soon_reveal": "Bald werden alle {count} Quests aufgedeckt!",
-      "invite_toast_title": "Einladungscode",
-      "invite_toast_message": "Einladungscode wurde in deine Zwischenablage kopiert! Teile ihn mit deinen neuen Teammitgliedern.",
-      "invite_toast_text": "Trete dem Team {team} mit dem Code \"{code}\" im Hunt \"{hunt}\" bei!",
-      "open_answer": "Öffnen und beantworten",
-      "open_finalize": "Öffnen und finalisieren"
-    },
-    "help": {
-      "title": "Hilfe",
-      "subtitle": "Hier sind einige Themen und Wörter erklärt. Wenn du weiterhin Fragen hast, wende dich bitte ans Admin Team!",
-      "head": "PicHunt Hilfe"
-    },
-    "imprint": {
-      "title": "Impressum",
-      "head": "PicHunt Impressum"
     }
   },
   "validation": {
@@ -169,7 +186,7 @@
     "breadcrumbs": "breadcrumbs",
     "cancel": "Abbrechen",
     "carousel": "karussell",
-    "close": "schließen",
+    "close": "Schließen",
     "closeAlert": "alert schließen",
     "closeToast": "toast schließen",
     "color": "farbe",

app/lang/en.json

@@ -9,12 +9,27 @@
     "login_instead": "Login instead",
     "logout": "Logout",
     "name": "Name",
+    "old_invalid": "Old password incorrect!",
     "password": "Password",
     "register": "Register",
     "register_instead": "Register instead",
     "reset": "Reset",
-    "showPassword": "Show password",
+    "showPassword": "Show password"
-    "old_invalid": "Old password incorrect!"
+  },
+  "comp": {
+    "team_add": {
+      "create": "Create",
+      "create_a_new_team": "Create a new team",
+      "description": "Description",
+      "invite_code_automatically": "An invite code will be generated automatically.",
+      "team_name": "Team name"
+    },
+    "team_join": {
+      "join_a_team": "Join a team",
+      "no_team_yet": " No team has been created yet, be the first!",
+      "select_a_team": "Select a team",
+      "team_preview": "'{team}' of '{owner}', {members} members"
+    }
   },
   "enums": {
     "text_type": {
@@ -44,15 +59,25 @@
   },
   "page": {
     "common": {
-      "update_btn": "Update",
+      "admin": "Admin",
+      "back_home": "Back home",
       "back_to_hunt": "Back to Hunt",
+      "cancel": "Cancel",
+      "join": "Join",
+      "login_first": "Login first",
       "no_pictures": "No pictures has been submitted yet :(",
       "not_revealed": "Answers are not revealed yet, please wait until the end!",
-      "admin": "Admin",
-      "refresh": "Refresh",
-      "login_first": "Login first",
       "open": "Open",
-      "back_home": "Back home"
+      "refresh": "Refresh",
+      "update_btn": "Update"
+    },
+    "diashow": {
+      "head": "Diashow"
+    },
+    "help": {
+      "head": "PicHunt Help",
+      "subtitle": "Here are some topics and words explained. If you still have questions, please contact the Admin Team!",
+      "title": "Help"
     },
     "home": {
       "click_hunt_below_to_join": "Click on a hunt below and join them!",
@@ -67,88 +92,80 @@
       "open_to_join": "Open to join hunts:",
       "start": "Start: {start}"
     },
-    "showcase": {
+    "hunt": {
-      "showcase_for": "Showcase for",
+      "admin_unreviewed": "Admin ({count} unreviewed)",
-      "crew": "Crew",
+      "all_pictures": "All pictures",
-      "quests": "Quests",
+      "diashow": "Diashow",
-      "users": "Users",
+      "hide_answers": "Hide answers",
+      "invite": "Invite:",
+      "invite_toast_message": "Invite code was copied to your clipboard! Share it with your next team mates.",
+      "invite_toast_text": "Join team {team} with code \"{code}\" on hunt \"{hunt}\"!",
+      "invite_toast_title": "Invite code",
+      "join_this_hunt": "Join this hunt!",
+      "login_to_join": "To join this hunt you need to join or create a team:",
+      "no_picture_uploaded": "No picture uploaded",
+      "open_answer": "Open and answer",
+      "open_finalize": "Open and finalize",
+      "quest_not_revealed": "Quests not revealed yet!",
+      "quest_soon_reveal": "Soon all {count} quests will be revealed!",
+      "showcase": "Showcase",
+      "team_count": "No teams joined, just like you! | One team joined, unlike you! | {count} teams joined, unlike you!",
+      "team_count_joined": "No teams joined, just like you! | One team joined, just like you! | {count} teams joined, just like you!",
       "teams": "Teams",
-      "total_points": "Total points earned",
+      "total_points": "Total points: {score}",
-      "pictures": "Pictures",
+      "your_team": "Your team:"
-      "leaderboard": "Leaderboard",
-      "third_place": "Third place",
-      "second_place": "Second place",
-      "first_place": "First place",
-      "points": "Points",
-      "answers": "Answers",
-      "table": {
-        "answers": "Answers",
-        "place": "Place",
-        "name": "Name",
-        "description": "Description",
-        "score": "Score"
-      }
     },
-    "profile": {
+    "imprint": {
-      "old_password": "Old password",
+      "head": "PicHunt Imprint",
-      "new_password": "New password",
+      "title": "Imprint"
-      "uploaded_pictures": "Uploaded pictures",
-      "no_pictures": "No pictures uploaded yet."
     },
     "pictures": {
       "head": "Picture wall"
     },
-    "diashow": {
+    "profile": {
-      "head": "Diashow"
+      "new_password": "New password",
+      "no_pictures": "No pictures uploaded yet.",
+      "old_password": "Old password",
+      "uploaded_pictures": "Uploaded pictures"
     },
     "quest": {
       "already_finalized": "Answer is already finalized, no update allowed!",
+      "already_submitted": "Your final answer has already been submitted!",
       "conflict": "Conflict: Please refresh",
       "extra_points": "Extra points:",
-      "review": "Review",
-      "score": "Score:",
-      "reviewed_by": "by {name} at {date}",
-      "last_update": "Last update: {date} by {name}",
-      "submission": "Submission",
-      "your_answer": "Your answer",
-      "required_answer": "Required Answer",
       "finalize": "Finalize answer",
-      "already_submitted": "Your final answer has already been submitted!",
       "finalize_explain": "This allows the admins to review your answer and give you points. You cannot change your answer afterwards!",
+      "last_update": "Last update: {date} by {name}",
+      "required_answer": "Required Answer",
+      "review": "Review",
+      "reviewed_by": "by {name} at {date}",
+      "score": "Score:",
+      "submission": "Submission",
+      "upload_compress": "Compressing image...",
       "upload_title": "Uploading answer...",
-      "upload_compress": "Compressing image..."
+      "your_answer": "Your answer"
     },
-    "hunt": {
+    "showcase": {
-      "total_points": "Total points: {score}",
+      "answers": "Answers",
-      "showcase": "Showcase",
+      "crew": "Crew",
-      "diashow": "Diashow",
+      "first_place": "First place",
-      "all_pictures": "All pictures",
+      "leaderboard": "Leaderboard",
+      "pictures": "Pictures",
+      "points": "Points",
+      "quests": "Quests",
+      "second_place": "Second place",
+      "showcase_for": "Showcase for",
+      "table": {
+        "answers": "Answers",
+        "description": "Description",
+        "name": "Name",
+        "place": "Place",
+        "score": "Score"
+      },
       "teams": "Teams",
-      "team_count": "No teams joined, just like you! | One team joined, unlike you! | {count} teams joined, unlike you!",
+      "third_place": "Third place",
-      "team_count_joined": "No teams joined, just like you! | One team joined, just like you! | {count} teams joined, just like you!",
+      "total_points": "Total points earned",
-      "your_team": "Your team:",
+      "users": "Users"
-      "invite": "Invite:",
-      "join_this_hunt": "Join this hunt!",
-      "login_to_join": "To join this hunt you need to join or create a team:",
-      "hide_answers": "Hide answers",
-      "no_picture_uploaded": "No picture uploaded",
-      "admin_unreviewed": "Admin ({count} unreviewed)",
-      "quest_not_revealed": "Quests not revealed yet!",
-      "quest_soon_reveal": "Soon all {count} quests will be revealed!",
-      "invite_toast_title": "Invite code",
-      "invite_toast_message": "Invite code was copied to your clipboard! Share it with your next team mates.",
-      "invite_toast_text": "Join team {team} with code \"{code}\" on hunt \"{hunt}\"!",
-      "open_answer": "Open and answer",
-      "open_finalize": "Open and finalize"
-    },
-    "help": {
-      "title": "Help",
-      "subtitle": "Here are some topics and words explained. If you still have questions, please contact the Admin Team!",
-      "head": "PicHunt Help"
-    },
-    "imprint": {
-      "title": "Imprint",
-      "head": "PicHunt Imprint"
     }
   },
   "validation": {

app/pages/hunt/[huntSlug]/showcase.vue

@@ -256,9 +256,9 @@ const columns = leaderboardColumns.map((c) =>
     v-else-if="error"
     class="flex h-dvh w-full flex-col items-center justify-center text-center text-2xl"
   >
-    <VaAlert color="danger" class="w-[90%]"
+    <VaAlert color="danger" class="w-[90%]">{{
-      >Answers are not revealed yet, please wait until the end!</VaAlert
+      t('page.common.not_revealed')
-    >
+    }}</VaAlert>
     <VaAlert v-if="error.statusCode !== 403" color="danger" class="w-[90%]">{{
       error
     }}</VaAlert