Start i18n on static texts

app/pages/hunt/[huntSlug]/[questSlug]/admin.vue

@@ -45,7 +45,7 @@ titleStore.title = data.value ? tKey(data.value, 'title').value : undefined;
             `/hunt/${data ? tSluggy(data.hunt).value : sluggy(huntSlug!)}`
           )
         "
-        >Back to Hunt</VaButton
+        >{{ t('pages.common.back_to_hunt') }}</VaButton
       >
       <VaButton icon="replay" color="success" @click="refresh"
         >Refresh</VaButton

app/pages/hunt/[huntSlug]/[questSlug]/index.vue

@@ -85,14 +85,14 @@ async function submit() {
     newImage.value = undefined;
   } catch (e) {
     if (e instanceof Error && 'statusCode' in e && e.statusCode === 418) {
-      submitError.value = 'Answer is already finalized, no update allowed!';
+      submitError.value = t('page.quest.already_finalized');
       await refresh();
     } else if (
       e instanceof Error &&
       'statusCode' in e &&
       e.statusCode === 409
     ) {
-      submitError.value = 'Conflict: Please refresh';
+      submitError.value = t('page.quest.conflict');
     } else {
       submitError.value = parseError(e);
     }
@@ -114,7 +114,7 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
             `/hunt/${data ? tSluggy(data.hunt).value : sluggy(huntSlug!)}`
           )
         "
-        >Back to Hunt</VaButton
+        >{{ t('pages.common.back_to_hunt') }}</VaButton
       >
       <VaButton
         icon="refresh"
@@ -134,7 +134,7 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
             `/hunt/${data?.hunt ? tSluggy(data.hunt).value : sluggy(huntSlug!)}/${data ? tSluggy(data).value : sluggy(questSlug!)}}/admin`
           )
         "
-        >Admin</VaButton
+        >{{ t('pages.common.admin') }}</VaButton
       ></VaButtonGroup
     >
     <div v-if="data">
@@ -164,21 +164,27 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
                 🖋: {{ t(`enums.text_type.${data.textType}`) }}
               </p>
               <p v-if="hasKey(data, 'extraText')">
-                <span class="uppercase">Extra points:</span>
+                <span class="uppercase">{{
+                  t('page.quest.extra_points')
+                }}</span>
                 {{ tKey(data, 'extraText') }}
               </p>
             </div>
           </VaCardContent>
         </VaCard>
         <VaCard v-if="data.answer?.review" color="info">
-          <VaCardTitle>Review</VaCardTitle>
+          <VaCardTitle>{{ t('page.quest.review') }}</VaCardTitle>
           <VaCardContent>
             <p v-if="data.answer.review?.score" class="mb-2">
-              Score:
+              {{ t('page.quest.score') }}
               <VaChip color="success">{{ data.answer.review.score }}</VaChip>
               <span v-if="data.answer.review.reviewer" class="text-sm">
-                by {{ data.answer.review.reviewer.name }} at
-                {{ d(data.answer.review.updatedAt, fullDate) }}</span
+                {{
+                  t('page.quest.reviewed_by', {
+                    name: data.answer.review.reviewer.name,
+                    date: d(data.answer.review.updatedAt, fullDate)
+                  })
+                }}</span
               >
             </p>
             <div
@@ -200,7 +206,7 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
           stripe
           :stripe-color="data.answer?.final ? 'success' : 'primary'"
         >
-          <VaCardTitle>Submission</VaCardTitle>
+          <VaCardTitle>{{ t('page.quest.submission') }}</VaCardTitle>
           <VaCardContent>
             <div class="flex flex-col gap-4">
               <VaInput
@@ -208,7 +214,7 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
                 v-model="answer"
                 :label="tKey(data, 'question').value"
                 :disabled="uploading || data.answer?.final"
-                placeholder="Your answer"
+                :placeholder="t('page.quest.your_answer')"
                 :required-mark="data.textRequired"
                 :clearable="!!data.answer?.text"
                 :clear-value="data.answer?.text || ''"
@@ -216,7 +222,7 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
                 :type="textType[data.textType]"
                 :messages="[
                   t(`enums.text_type.${data.textType}`),
-                  data.textRequired ? 'Required Answer' : ''
+                  data.textRequired ? t('page.quest.required_answer') : ''
                 ]"
               >
                 <template v-if="data.textUnit" #appendInner>
@@ -247,15 +253,18 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
                 file-types="jpg,png,jpeg"
               />
               <p v-if="data.answer?.updatedAt">
-                Last update:
-                {{ d(data.answer.updatedAt, fullDate) }}
-                by {{ data.answer.member.name }}
+                {{
+                  t('page.quest.last_update', {
+                    date: d(data.answer.updatedAt, fullDate),
+                    name: data.answer.member.name
+                  })
+                }}
               </p>
               <VaCheckbox
                 v-model="final"
                 :disabled="data.answer?.final"
-                label="Finalize answer"
-                messages="This allows the admins to review your answer and give you points. You cannot change your answer afterwards!"
+                :label="t('page.quest.finalize')"
+                :messages="t('page.quest.already_finalized')"
               />
 
               <VaAlert
@@ -275,10 +284,10 @@ const createImageURL = (file: File) => URL.createObjectURL(file);
                 "
                 :loading="uploading"
                 @click="submit"
-                >Update</VaButton
+                >{{ t('page.common.update_btn') }}</VaButton
               >
               <p v-else class="font-bold">
-                Your final answer has already been submitted!
+                {{ t('page.quest.already_submitted') }}
               </p>
             </div>
           </VaCardContent>