Added last translations for event forms / data

components/calendar/CalendarEventDetails.vue

@@ -29,7 +29,7 @@ const eventDetails = ref<HTMLElement>()
 
 const emit = defineEmits(["query:close-popover"])
 
-const dateDifference: string = getRelativeString(defaultDate, props.event.startDate)
+const dateDifference = computed<string>(() => getRelativeString(defaultDate, props.event.startDate))
 const dateDuration = computed<string | null>(() => props.event.endDate ? getRelativeString(props.event.startDate, props.event.endDate, "compact") : null)
 
 function handleJumpToDate(date: RPGDate) {

components/calendar/CalendarMenuSubnav.vue

@@ -87,7 +87,9 @@ function handleGotoPreviousEventPage(position: "next" | "prev" = "next") {
             </UiButton>
           </UiTooltipTrigger>
           <UiTooltipContent>
-            <p>Précédente page à évènements</p>
+            <p>
+              {{ $t('entity.calendar.event.prevPage') }}
+            </p>
           </UiTooltipContent>
         </UiTooltip>
       </UiTooltipProvider>
@@ -106,7 +108,9 @@ function handleGotoPreviousEventPage(position: "next" | "prev" = "next") {
             </UiButton>
           </UiTooltipTrigger>
           <UiTooltipContent>
-            <p>Prochaine page à évènements</p>
+            <p>
+              {{ $t('entity.calendar.event.nextPage') }}
+            </p>
           </UiTooltipContent>
         </UiTooltip>
       </UiTooltipProvider>

components/calendar/form/CreateEvent.vue

@@ -103,7 +103,7 @@ function handleCancel() {
               type="text"
               name="new-event-title"
               required
-              placeholder="Titre de l'évènement"
+              :placeholder="$t('entity.calendar.event.title')"
               class="w-full -my-1 py-1 -mx-1 px-1 text-lg border-b-[1px] bg-transparent focus-visible:outline-none focus-visible:border-blue-600"
             >
           </div>
@@ -113,8 +113,7 @@ function handleCancel() {
               id="new-event-description"
               v-model="eventSkeleton.description"
               name="new-event-description"
-              placeholder="Ajouter une description"
+              :placeholder="$t('entity.addDescription')"              class="w-full -my-1 py-1 -mx-1 px-1 min-h-24 max-h-36 text-sm border-b-[1px] bg-transparent focus-visible:outline-none focus-visible:border-blue-600"
-              class="w-full -my-1 py-1 -mx-1 px-1 min-h-24 max-h-36 text-sm border-b-[1px] bg-transparent focus-visible:outline-none focus-visible:border-blue-600"
             />
           </div>
 
@@ -124,7 +123,7 @@ function handleCancel() {
 
               <CalendarInputRPGDate
                 v-model:model-value="eventSkeleton.startDate"
-                placeholder="Date de début"
+                :placeholder="$t('entity.calendar.date.start')"
                 :initial-date="props.date"
                 :required="true"
               />
@@ -133,7 +132,7 @@ function handleCancel() {
 
               <CalendarInputRPGDate
                 v-model:model-value="eventSkeleton.endDate"
-                placeholder="Date de fin"
+                :placeholder="$t('entity.calendar.date.end')"
                 :initial-date="props.date"
               />
             </div>
@@ -143,7 +142,7 @@ function handleCancel() {
             <div class="flex items-center gap-4">
               <PhTag size="18" weight="fill" />
 
-              <CalendarInputEventCategory v-model="eventSkeleton.category" placeholder="Ajouter une catégorie principale" />
+              <CalendarInputEventCategory v-model="eventSkeleton.category" :placeholder="$t('entity.category.addPrimary')" />
             </div>
           </div>
 
@@ -151,7 +150,7 @@ function handleCancel() {
             <div class="flex items-center gap-4">
               <PhTag size="18" weight="fill" />
 
-              <CalendarInputEventCategories v-model="eventSkeleton.secondaryCategories" placeholder="Ajouter des catégories secondaires" />
+              <CalendarInputEventCategories v-model="eventSkeleton.secondaryCategories" :placeholder="$t('entity.category.addSecondaries')" />
             </div>
           </div> -->
 
@@ -164,7 +163,7 @@ function handleCancel() {
                 v-model="eventSkeleton.location"
                 type="text"
                 name="new-event-location"
-                placeholder="Ajouter un endroit"
+                :placeholder="$t('entity.calendar.event.addLocation')"
                 class="w-full -my-1 py-2 px-2 text-sm border-b-[1px] bg-transparent focus-visible:outline-none focus-visible:border-blue-600">
             </div>
           </div>
@@ -178,10 +177,10 @@ function handleCancel() {
                 <UiSwitch id="new-event-visibility" v-model:checked="eventSkeleton.hidden" />
                 <UiLabel for="new-event-visibility">
                   <template v-if="!eventSkeleton.hidden">
-                    Évènement visible
+                    {{ $t('entity.calendar.event.isPublic') }}
                   </template>
                   <template v-else>
-                    Évènement caché
+                    {{ $t('entity.calendar.event.isHidden') }}
                   </template>
                 </UiLabel>
               </div>
@@ -197,7 +196,7 @@ function handleCancel() {
           <div class="flex gap-2 justify-end">
             <Transition name="fade-delay">
               <UiButton v-if="isLoading" type="button" size="sm" variant="destructive" @click.prevent="handleCancel">
-                Annuler
+                {{ $t('ui.action.cancel') }}
               </UiButton>
             </Transition>
 
@@ -206,7 +205,7 @@ function handleCancel() {
                 <PhCircleNotch v-if="isLoading" size="20" class="opacity-50 animate-spin"/>
               </Transition>
 
-              Sauvegarder
+              {{ $t('ui.action.save') }}
             </UiButton>
           </div>
         </div>

components/calendar/form/DeleteEvent.vue

@@ -69,10 +69,10 @@ function handleCancel(): void {
       @interact-outside="handleClosing"
       @pointer-down-outside="handleClosing"
     >
-      <UiAlertDialogTitle> Supprimer l'évènement</UiAlertDialogTitle>
+      <UiAlertDialogTitle>{{ $t('entity.calendar.event.deleteDialog.title') }}</UiAlertDialogTitle>
 
       <UiAlertDialogDescription>
-        Les données associés à cet évènement seront supprimées et vous ne pourrez plus les récupérer !
+        {{ $t('entity.calendar.event.deleteDialog.subtitle') }}
       </UiAlertDialogDescription>
 
       <form @submit.prevent="handleAction">
@@ -86,13 +86,13 @@ function handleCancel(): void {
 
         <footer class="flex gap-2 justify-between">
           <UiButton type="button" size="sm" variant="outline" @click="() => isDeleteEventModalOpen = false">
-            Retour
+            {{ $t('ui.action.back') }}
           </UiButton>
 
           <div class="flex gap-2 justify-end">
             <Transition name="fade-delay">
               <UiButton v-if="isLoading" type="button" size="sm" variant="destructive" @click.prevent="handleCancel">
-                Annuler
+                {{ $t('ui.action.cancel') }}
               </UiButton>
             </Transition>
 
@@ -101,7 +101,7 @@ function handleCancel(): void {
                 <PhCircleNotch v-if="isLoading" size="20" class="animate-spin"/>
               </Transition>
 
-              Supprimer
+              {{ $t('ui.action.delete') }}
             </UiButton>
           </div>
         </footer>

components/calendar/form/UpdateEvent.vue

@@ -143,7 +143,7 @@ function handleCancel() {
               <PhTag size="18" weight="fill" />
 
               <div class="w-1/2">
-                <CalendarInputEventCategories v-model="eventSkeleton.secondaryCategories" placeholder="Ajouter des catégories secondaires" />
+                <CalendarInputEventCategories v-model="eventSkeleton.secondaryCategories" :placeholder="Ajouter des catégories secondaires" />
               </div>
             </div>
           </div> -->

components/calendar/input/EventCategories.vue

@@ -60,8 +60,8 @@ const filteredCategories = computed(() =>
       class="w-fit h-[33vh] p-0"
     >
       <UiCommand v-model="modelBuffer" v-model:searchTerm="searchTerm" :multiple="true">
-        <UiCommandInput :placeholder="$t('entity.searchCategories')" />
+        <UiCommandInput :placeholder="$t('entity.category.search')" />
-        <UiCommandEmpty>{{ $t('entity.noCategoriesFound') }}</UiCommandEmpty>
+        <UiCommandEmpty>{{ $t('entity.category.notFoundAny') }}</UiCommandEmpty>
         <UiCommandList>
           <UiCommandGroup>
             <UiCommandItem

components/calendar/input/EventCategory.vue

@@ -52,8 +52,8 @@ const filteredCategories = computed(() =>
       class="w-fit h-[33vh] p-0"
     >
       <UiCommand v-model="model" v-model:searchTerm="searchTerm">
-        <UiCommandInput :placeholder="$t('entity.searchCategories')" />
+        <UiCommandInput :placeholder="$t('entity.category.search')" />
-        <UiCommandEmpty>{{ $t('entity.noCategoriesFound') }}</UiCommandEmpty>
+        <UiCommandEmpty>{{ $t('entity.category.notFoundAny') }}</UiCommandEmpty>
         <UiCommandList>
           <UiCommandGroup>
             <UiCommandItem

components/calendar/search/CalendarSearch.vue

@@ -298,7 +298,7 @@ function handleCategorySelect(e: (Category)) {
                 class="w-full"
               >
                 <ComboboxAnchor as-child>
-                  <ComboboxInput :placeholder="$t('entity.categoriesNamePlural')" as-child>
+                  <ComboboxInput :placeholder="$t('entity.category.namePlural')" as-child>
                     <UiTagsInputInput
                       class="w-full px-3"
                       :class="selectedCategories.length > 0 ? 'mt-2' : ''"

i18n.config.ts

@@ -33,10 +33,14 @@ export default defineI18nConfig(() => ({
         title: "Title"
       },
       entity: {
-        categoriesNameSingular: "Category",
+        category: {
-        categoriesNamePlural: "Categories",
+          nameSingular: "Category",
-        searchCategories: "Search categories",
+          namePlural: "Categories",
-        noCategoriesFound: "No categories found.",
+          search: "Search categories",
+          notFoundAny: "No categories found.",
+          addPrimary: "Add a primary category",
+          addSecondaries: "Add secondary categories"
+        },
         addDescription: "Add a description",
         deleteOne: "Delete \"{entity}\"",
         advancedSearch: {
@@ -93,6 +97,8 @@ export default defineI18nConfig(() => ({
             isPublic: "Public event",
             hiddenTooltip: "This event is visible only to game masters.",
             addLocation: "Add a place",
+            prevPage: "Previous page with events",
+            nextPage: "Next page with events",
             editDialog: {
               title: "Edit event",
               subtitle: "Update event data",
@@ -193,10 +199,14 @@ export default defineI18nConfig(() => ({
         title: "Titre"
       },
       entity: {
-        categoriesNameSingular: "Catégorie",
+        category: {
-        categoriesNamePlural: "Catégories",
+          nameSingular: "Catégorie",
-        searchCategories: "Rechercher les catégories",
+          namePlural: "Catégories",
-        noCategoriesFound: "Aucune catégorie trouvée.",
+          search: "Rechercher les catégories",
+          notFoundAny: "Aucune catégorie trouvée.",
+          addPrimary: "Ajouter une catégorie principale",
+          addSecondaries: "Ajouter des catégories secondaires"
+        },
         addDescription: "Ajouter une description",
         deleteOne: "Supprimer \"{entity}\"",
         advancedSearch: {
@@ -253,6 +263,8 @@ export default defineI18nConfig(() => ({
             isPublic: "Évènement public",
             hiddenTooltip: "Cet évènement est uniquement visible pour les maîtres du jeu.",
             addLocation: "Ajouter un endroit",
+            prevPage: "Précédente page à évènements",
+            nextPage: "Prochaine page à évènements",
             editDialog: {
               title: "Modifier l'évènement",
               subtitle: "Mettre à jour les données de l'évènement",