Merge branch 'ticket-app-master' into 2101-fix-vue-tsc-errors

- Modifie les types des propriétés dans DownloadButton.vue pour gérer les versions d'objet.
- Corrige les types de davLink et davLinkExpiration dans DocumentActionButtonsGroup.vue.
- Réorganise l'interface DesktopEditButtonConfig pour une meilleure clarté.
- Ajuste l'extension de fichier dans DownloadButton.vue pour éviter les erreurs de type.

src/Bundle/ChillCalendarBundle/Resources/public/types.ts

@@ -71,4 +71,11 @@ export function isEventInputCalendarRange(
   return typeof toBeDetermined.is === "string" && toBeDetermined.is === "range";
 }
 
+export enum AnswerStatus {
+  ACCEPTED = "accepted",
+  DECLINED = "declined",
+  PENDING = "pending",
+  TENTATIVE = "tentative",
+}
+
 export {};

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/Calendar/Components/CalendarActive.vue

@@ -7,7 +7,7 @@
         <i v-else-if="invite.status === 'declined'" class="fa fa-times" />
         <i v-else-if="invite.status === 'pending'" class="fa fa-question-o" />
         <i v-else-if="invite.status === 'tentative'" class="fa fa-question" />
-        <span v-else="">{{ invite.status }}</span>
+        <span v-else>{{ invite.status }}</span>
       </template>
     </span>
     <span class="form-check-inline form-switch">
@@ -42,8 +42,6 @@
 </template>
 
 <script>
-import { mapGetters } from "vuex";
-
 export default {
   name: "CalendarActive",
   props: {

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/Calendar/i18n.js

@@ -24,6 +24,14 @@ const appMessages = {
     list_three_days: "Liste 3 jours",
     current_selected: "Rendez-vous fixé",
     main_user: "Utilisateur principal",
+    Give_an_answer: "Répondre",
+    Accepted: "Accepté",
+    Declined: "Refusé",
+    Tentative: "Accepté provisoirement",
+    Accept: "Accepter",
+    Decline: "Refuser",
+    Tentatively_accept: "Accepter provisoirement",
+    Set_pending: "Ne pas répondre",
   },
 };
 

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/Invite/Answer.vue

@@ -47,77 +47,38 @@
   </div>
 </template>
 
-<script lang="ts">
-import { defineComponent, PropType } from "vue";
+<script lang="ts" setup>
+import { AnswerStatus } from "../../types";
 
-const ACCEPTED = "accepted";
-const DECLINED = "declined";
-const PENDING = "pending";
-const TENTATIVELY_ACCEPTED = "tentative";
+const props = defineProps<{
+  calendarId: number;
+  status: AnswerStatus;
+}>();
 
-const i18n = {
-  messages: {
-    fr: {
-      Give_an_answer: "Répondre",
-      Accepted: "Accepté",
-      Declined: "Refusé",
-      Tentative: "Accepté provisoirement",
-      Accept: "Accepter",
-      Decline: "Refuser",
-      Tentatively_accept: "Accepter provisoirement",
-      Set_pending: "Ne pas répondre",
-    },
-  },
+const emit =
+  defineEmits<(e: "statusChanged", newStatus: AnswerStatus) => void>();
+
+const Statuses = {
+  ACCEPTED: AnswerStatus.ACCEPTED,
+  DECLINED: AnswerStatus.DECLINED,
+  PENDING: AnswerStatus.PENDING,
+  TENTATIVELY_ACCEPTED: AnswerStatus.TENTATIVE,
 };
 
-export default defineComponent({
-  name: "Answer",
-  i18n,
-  props: {
-    calendarId: { type: Number, required: true },
-    status: {
-      type: String as PropType<
-        "accepted" | "declined" | "pending" | "tentative"
-      >,
-      required: true,
-    },
-  },
-  emits: {
-    statusChanged(payload: "accepted" | "declined" | "pending" | "tentative") {
-      return true;
-    },
-  },
-  data() {
-    return {
-      Statuses: {
-        ACCEPTED,
-        DECLINED,
-        PENDING,
-        TENTATIVELY_ACCEPTED,
-      },
-    };
-  },
-  methods: {
-    changeStatus: function (
-      newStatus: "accepted" | "declined" | "pending" | "tentative",
-    ) {
-      console.log("changeStatus", newStatus);
-      const url = `/api/1.0/calendar/calendar/${this.$props.calendarId}/answer/${newStatus}.json`;
-      window
-        .fetch(url, {
-          method: "POST",
-        })
-        .then((r: Response) => {
-          if (!r.ok) {
-            console.error("could not confirm answer", newStatus);
-            return;
-          }
-          console.log("answer sent", newStatus);
-          this.$emit("statusChanged", newStatus);
-        });
-    },
-  },
-});
+function changeStatus(newStatus: AnswerStatus) {
+  const url = `/api/1.0/calendar/calendar/${props.calendarId}/answer/${newStatus}.json`;
+  window
+    .fetch(url, {
+      method: "POST",
+    })
+    .then((r: Response) => {
+      if (!r.ok) {
+        console.error("could not confirm answer", newStatus);
+        return;
+      }
+      emit("statusChanged", newStatus);
+    });
+}
 </script>
 
 <style scoped></style>

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/App2.vue

@@ -146,7 +146,11 @@
               id="copyFromWeek"
               class="form-select"
             >
-              <option v-for="w in lastWeeks" :value="w.value" :key="w.value">
+              <option
+                v-for="w in lastWeeks"
+                :value="w.value"
+                :key="w.value || ''"
+              >
                 {{ w.text }}
               </option>
             </select>
@@ -156,7 +160,11 @@
           </div>
           <div class="col-xs-12 col-sm-3 col-md-3">
             <select v-model="copyToWeek" id="copyToWeek" class="form-select">
-              <option v-for="w in nextWeeks" :value="w.value" :key="w.value">
+              <option
+                v-for="w in nextWeeks"
+                :value="w.value"
+                :key="w.value || ''"
+              >
                 {{ w.text }}
               </option>
             </select>

src/Bundle/ChillCalendarBundle/Resources/public/vuejs/MyCalendarRange/Components/EditLocation.vue

@@ -74,12 +74,12 @@ const saveAndClose = function (e: Event): void {
       location: location.value,
       calendarRangeId: calendarRangeId.value,
     })
-    .then((_) => {
+    .then(() => {
       showModal.value = false;
     });
 };
 
-const closeModal = function (_: any): void {
+const closeModal = function (): void {
   showModal.value = false;
 };
 

src/Bundle/ChillDocStoreBundle/Resources/public/module/document_action_buttons_group/index.ts

@@ -2,12 +2,11 @@ import { _createI18n } from "ChillMainAssets/vuejs/_js/i18n";
 import DocumentActionButtonsGroup from "../../vuejs/DocumentActionButtonsGroup.vue";
 import { createApp } from "vue";
 import { StoredObject, StoredObjectStatusChange } from "../../types";
-import { is_object_ready } from "../../vuejs/StoredObjectButton/helpers";
 import ToastPlugin from "vue-toast-notification";
 
 const i18n = _createI18n({});
 
-window.addEventListener("DOMContentLoaded", function (e) {
+window.addEventListener("DOMContentLoaded", function () {
   document
     .querySelectorAll<HTMLDivElement>("div[data-download-buttons]")
     .forEach((el) => {

src/Bundle/ChillDocStoreBundle/Resources/public/types/index.ts

@@ -9,6 +9,7 @@ export interface StoredObject {
   uuid: string;
   prefix: string;
   status: StoredObjectStatus;
+  type: string;
   currentVersion:
     | null
     | StoredObjectVersionCreated
@@ -46,7 +47,8 @@ export interface StoredObjectVersionCreated extends StoredObjectVersion {
   persisted: false;
 }
 
-export interface StoredObjectVersionPersisted extends StoredObjectVersionCreated {
+export interface StoredObjectVersionPersisted
+  extends StoredObjectVersionCreated {
   version: number;
   id: number;
   createdAt: DateTime | null;
@@ -60,7 +62,8 @@ export interface StoredObjectStatusChange {
   type: string;
 }
 
-export interface StoredObjectVersionWithPointInTime extends StoredObjectVersionPersisted {
+export interface StoredObjectVersionWithPointInTime
+  extends StoredObjectVersionPersisted {
   "point-in-times": StoredObjectPointInTime[];
   "from-restored": StoredObjectVersionPersisted | null;
 }

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DocumentActionButtonsGroup.vue

@@ -75,7 +75,6 @@ import {
 import {
   StoredObject,
   StoredObjectStatusChange,
-  StoredObjectVersion,
   WopiEditButtonExecutableBeforeLeaveFunction,
 } from "../types";
 import DesktopEditButton from "ChillDocStoreAssets/vuejs/StoredObjectButton/DesktopEditButton.vue";
@@ -105,12 +104,12 @@ interface DocumentActionButtonsGroupConfig {
   /**
    * a link to download and edit file using webdav
    */
-  davLink?: string;
+  davLink: string;
 
   /**
    * the expiration date of the download, as a unix timestamp
    */
-  davLinkExpiration?: number;
+  davLinkExpiration: number;
 }
 
 const emit =
@@ -206,10 +205,6 @@ const checkForReady = function (): void {
 };
 
 const onObjectNewStatusCallback = async function (): Promise<void> {
-  if (props.storedObject.status === "stored_object_created") {
-    return Promise.resolve();
-  }
-
   const new_status = await is_object_ready(props.storedObject);
   if (props.storedObject.status !== new_status.status) {
     emit("onStoredObjectStatusChange", new_status);

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DropFileWidget/DropFile.vue

@@ -1,3 +1,35 @@
+<template>
+  <div class="drop-file">
+    <div
+      v-if="!uploading"
+      :class="{ area: true, dragging: is_dragging }"
+      @click="onZoneClick"
+      @dragover="onDragOver"
+      @dragleave="onDragLeave"
+      @drop="onDrop"
+    >
+      <p v-if="has_existing_doc" class="file-icon">
+        <file-icon :type="props.existingDoc?.type ?? ''"></file-icon>
+      </p>
+
+      <p v-if="display_filename !== null" class="display-filename">
+        {{ display_filename }}
+      </p>
+      <!-- todo i18n -->
+      <p v-if="has_existing_doc">
+        Déposez un document ou cliquez ici pour remplacer le document existant
+      </p>
+      <p v-else>
+        Déposez un document ou cliquez ici pour ouvrir le navigateur de fichier
+      </p>
+    </div>
+    <div v-else class="waiting">
+      <i class="fa fa-cog fa-spin fa-3x fa-fw"></i>
+      <span class="sr-only">Loading...</span>
+    </div>
+  </div>
+</template>
+
 <script setup lang="ts">
 import { StoredObject, StoredObjectVersionCreated } from "../../types";
 import {
@@ -9,24 +41,23 @@ import { computed, ref, Ref } from "vue";
 import FileIcon from "ChillDocStoreAssets/vuejs/FileIcon.vue";
 
 interface DropFileConfig {
-  existingDoc?: StoredObject;
+  existingDoc: StoredObject | null;
 }
 
 const props = withDefaults(defineProps<DropFileConfig>(), {
   existingDoc: null,
 });
 
-const emit =
-  defineEmits<
-    (
-      e: "addDocument",
-      {
-        stored_object_version: StoredObjectVersionCreated,
-        stored_object: StoredObject,
-        file_name: string,
-      },
-    ) => void
-  >();
+const emit = defineEmits<
+  (
+    e: "addDocument",
+    payload: {
+      stored_object_version: StoredObjectVersionCreated;
+      stored_object: StoredObject;
+      file_name: string;
+    },
+  ) => void
+>();
 
 const is_dragging: Ref<boolean> = ref(false);
 const uploading: Ref<boolean> = ref(false);
@@ -134,38 +165,6 @@ const handleFile = async (file: File): Promise<void> => {
 };
 </script>
 
-<template>
-  <div class="drop-file">
-    <div
-      v-if="!uploading"
-      :class="{ area: true, dragging: is_dragging }"
-      @click="onZoneClick"
-      @dragover="onDragOver"
-      @dragleave="onDragLeave"
-      @drop="onDrop"
-    >
-      <p v-if="has_existing_doc" class="file-icon">
-        <file-icon :type="props.existingDoc?.type"></file-icon>
-      </p>
-
-      <p v-if="display_filename !== null" class="display-filename">
-        {{ display_filename }}
-      </p>
-      <!-- todo i18n -->
-      <p v-if="has_existing_doc">
-        Déposez un document ou cliquez ici pour remplacer le document existant
-      </p>
-      <p v-else>
-        Déposez un document ou cliquez ici pour ouvrir le navigateur de fichier
-      </p>
-    </div>
-    <div v-else class="waiting">
-      <i class="fa fa-cog fa-spin fa-3x fa-fw"></i>
-      <span class="sr-only">Loading...</span>
-    </div>
-  </div>
-</template>
-
 <style scoped lang="scss">
 .drop-file {
   width: 100%;

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DropFileWidget/DropFileModal.vue

@@ -18,10 +18,10 @@ const props = withDefaults(defineProps<DropFileConfig>(), {
 const emit = defineEmits<{
   (
     e: "addDocument",
-    {
-      stored_object: StoredObject,
-      stored_object_version: StoredObjectVersion,
-      file_name: string,
+    payload: {
+      stored_object: StoredObject;
+      stored_object_version: StoredObjectVersion;
+      file_name: string;
     },
   ): void;
   (e: "removeDocument"): void;

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DropFileWidget/DropFileWidget.vue

@@ -1,6 +1,34 @@
+<template>
+  <div>
+    <drop-file
+      :existingDoc="props.existingDoc ?? null"
+      @addDocument="onAddDocument"
+    ></drop-file>
+
+    <ul class="record_actions">
+      <li v-if="props?.existingDoc">
+        <document-action-buttons-group
+          :stored-object="props.existingDoc"
+          :can-edit="props.existingDoc?.status === 'ready'"
+          :can-download="true"
+          :dav-link="dav_link_href ?? ''"
+          :dav-link-expiration="dav_link_expiration ?? 0"
+        />
+      </li>
+      <li>
+        <button
+          v-if="allowRemove"
+          class="btn btn-delete"
+          @click="onRemoveDocument($event)"
+        ></button>
+      </li>
+    </ul>
+  </div>
+</template>
+
 <script setup lang="ts">
 import { StoredObject, StoredObjectVersion } from "../../types";
-import { computed, ref, Ref } from "vue";
+import { computed } from "vue";
 import DropFile from "ChillDocStoreAssets/vuejs/DropFileWidget/DropFile.vue";
 import DocumentActionButtonsGroup from "ChillDocStoreAssets/vuejs/DocumentActionButtonsGroup.vue";
 
@@ -16,19 +44,15 @@ const props = withDefaults(defineProps<DropFileConfig>(), {
 const emit = defineEmits<{
   (
     e: "addDocument",
-    {
-      stored_object: StoredObject,
-      stored_object_version: StoredObjectVersion,
-      file_name: string,
+    payload: {
+      stored_object: StoredObject;
+      stored_object_version: StoredObjectVersion;
+      file_name: string;
     },
   ): void;
   (e: "removeDocument"): void;
 }>();
 
-const has_existing_doc = computed<boolean>(() => {
-  return props.existingDoc !== undefined && props.existingDoc !== null;
-});
-
 const dav_link_expiration = computed<number | undefined>(() => {
   if (props.existingDoc === undefined || props.existingDoc === null) {
     return undefined;
@@ -69,33 +93,4 @@ const onRemoveDocument = (e: Event): void => {
   emit("removeDocument");
 };
 </script>
-
-<template>
-  <div>
-    <drop-file
-      :existingDoc="props.existingDoc"
-      @addDocument="onAddDocument"
-    ></drop-file>
-
-    <ul class="record_actions">
-      <li v-if="has_existing_doc">
-        <document-action-buttons-group
-          :stored-object="props.existingDoc"
-          :can-edit="props.existingDoc?.status === 'ready'"
-          :can-download="true"
-          :dav-link="dav_link_href"
-          :dav-link-expiration="dav_link_expiration"
-        />
-      </li>
-      <li>
-        <button
-          v-if="allowRemove"
-          class="btn btn-delete"
-          @click="onRemoveDocument($event)"
-        ></button>
-      </li>
-    </ul>
-  </div>
-</template>
-
 <style scoped lang="scss"></style>

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/FileIcon.vue

@@ -1,11 +1,3 @@
-<script setup lang="ts">
-interface FileIconConfig {
-  type: string;
-}
-
-const props = defineProps<FileIconConfig>();
-</script>
-
 <template>
   <i class="fa fa-file-pdf-o" v-if="props.type === 'application/pdf'"></i>
   <i
@@ -43,4 +35,12 @@ const props = defineProps<FileIconConfig>();
   <i class="fa fa-file-code-o" v-else></i>
 </template>
 
+<script setup lang="ts">
+interface FileIconConfig {
+  type: string;
+}
+
+const props = defineProps<FileIconConfig>();
+</script>
+
 <style scoped lang="scss"></style>

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/StoredObjectButton/DesktopEditButton.vue

@@ -1,42 +1,3 @@
-<script setup lang="ts">
-import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
-import { computed, reactive } from "vue";
-
-export interface DesktopEditButtonConfig {
-  editLink: null;
-  classes: Record<string, boolean>;
-  expirationLink: number | Date;
-}
-
-interface DesktopEditButtonState {
-  modalOpened: boolean;
-}
-
-const state: DesktopEditButtonState = reactive({ modalOpened: false });
-
-const props = defineProps<DesktopEditButtonConfig>();
-
-const buildCommand = computed<string>(
-  () => "vnd.libreoffice.command:ofe|u|" + props.editLink,
-);
-
-const editionUntilFormatted = computed<string>(() => {
-  let d;
-
-  if (props.expirationLink instanceof Date) {
-    d = props.expirationLink;
-  } else {
-    d = new Date(props.expirationLink * 1000);
-  }
-  console.log(props.expirationLink);
-
-  return new Intl.DateTimeFormat(undefined, {
-    dateStyle: "long",
-    timeStyle: "medium",
-  }).format(d);
-});
-</script>
-
 <template>
   <teleport to="body">
     <modal v-if="state.modalOpened" @close="state.modalOpened = false">
@@ -90,3 +51,41 @@ i.fa::before {
   color: var(--bs-dropdown-link-hover-color);
 }
 </style>
+
+<script setup lang="ts">
+import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
+import { computed, reactive } from "vue";
+
+export interface DesktopEditButtonConfig {
+  editLink: string;
+  classes: Record<string, boolean>;
+  expirationLink: number | Date;
+}
+
+interface DesktopEditButtonState {
+  modalOpened: boolean;
+}
+
+const state: DesktopEditButtonState = reactive({ modalOpened: false });
+
+const props = defineProps<DesktopEditButtonConfig>();
+
+const buildCommand = computed<string>(
+  () => "vnd.libreoffice.command:ofe|u|" + props.editLink,
+);
+
+const editionUntilFormatted = computed<string>(() => {
+  let d;
+
+  if (props.expirationLink instanceof Date) {
+    d = props.expirationLink;
+  } else {
+    d = new Date(props.expirationLink * 1000);
+  }
+
+  return new Intl.DateTimeFormat(undefined, {
+    dateStyle: "long",
+    timeStyle: "medium",
+  }).format(d);
+});
+</script>

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/StoredObjectButton/DownloadButton.vue

@@ -12,7 +12,7 @@
     v-else
     :class="props.classes"
     target="_blank"
-    :type="props.atVersion.type"
+    :type="props.atVersion?.type"
     :download="buildDocumentName()"
     :href="state.href_url"
     ref="open_button"
@@ -27,11 +27,15 @@
 import { reactive, ref, nextTick, onMounted } from "vue";
 import { download_and_decrypt_doc } from "./helpers";
 import mime from "mime";
-import { StoredObject, StoredObjectVersion } from "../../types";
+import {
+  StoredObject,
+  StoredObjectVersionCreated,
+  StoredObjectVersionPersisted,
+} from "../../types";
 
 interface DownloadButtonConfig {
   storedObject: StoredObject;
-  atVersion: StoredObjectVersion;
+  atVersion: null | StoredObjectVersionCreated | StoredObjectVersionPersisted;
   classes: Record<string, boolean>;
   filename?: string;
   /**
@@ -70,7 +74,7 @@ function buildDocumentName(): string {
     document_name = "document";
   }
 
-  const ext = mime.getExtension(props.atVersion.type);
+  const ext = mime.getExtension(props.atVersion?.type ?? "");
 
   if (null !== ext) {
     return document_name + "." + ext;

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/StoredObjectButton/HistoryButton.vue

@@ -1,10 +1,24 @@
+<template>
+  <a @click="download_version_and_open_modal" class="dropdown-item">
+    <history-button-modal
+      ref="modal"
+      :versions="state.versions"
+      :stored-object="storedObject"
+      :can-edit="canEdit"
+      @restore-version="onRestoreVersion"
+    ></history-button-modal>
+    <i class="fa fa-history"></i>
+    Historique
+  </a>
+</template>
+
 <script setup lang="ts">
 import HistoryButtonModal from "ChillDocStoreAssets/vuejs/StoredObjectButton/HistoryButton/HistoryButtonModal.vue";
 import {
   StoredObject,
   StoredObjectVersionWithPointInTime,
 } from "./../../types";
-import { computed, reactive, ref, useTemplateRef } from "vue";
+import { reactive, useTemplateRef } from "vue";
 import { get_versions } from "./HistoryButton/api";
 
 interface HistoryButtonConfig {
@@ -38,29 +52,11 @@ const download_version_and_open_modal = async function (): Promise<void> {
   }
 };
 
-const onRestoreVersion = ({
-  newVersion,
-}: {
-  newVersion: StoredObjectVersionWithPointInTime;
-}) => {
+const onRestoreVersion = (newVersion: StoredObjectVersionWithPointInTime) => {
   state.versions.unshift(newVersion);
 };
 </script>
 
-<template>
-  <a @click="download_version_and_open_modal" class="dropdown-item">
-    <history-button-modal
-      ref="modal"
-      :versions="state.versions"
-      :stored-object="storedObject"
-      :can-edit="canEdit"
-      @restore-version="onRestoreVersion"
-    ></history-button-modal>
-    <i class="fa fa-history"></i>
-    Historique
-  </a>
-</template>
-
 <style scoped lang="scss">
 i.fa::before {
   color: var(--bs-dropdown-link-hover-color);

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/StoredObjectButton/HistoryButton/HistoryButtonList.vue

@@ -1,3 +1,22 @@
+<template>
+  <template v-if="props.versions.length > 0">
+    <div class="container">
+      <template v-for="v in props.versions" :key="v.id">
+        <history-button-list-item
+          :version="v"
+          :can-edit="canEdit"
+          :is-current="higher_version === v.version"
+          :stored-object="storedObject"
+          @restore-version="onRestored"
+        ></history-button-list-item>
+      </template>
+    </div>
+  </template>
+  <template v-else>
+    <p>Chargement des versions</p>
+  </template>
+</template>
+
 <script setup lang="ts">
 import {
   StoredObject,
@@ -40,33 +59,10 @@ const higher_version = computed<number>(() =>
  *
  * internally, keep track of the newly restored version
  */
-const onRestored = ({
-  newVersion,
-}: {
-  newVersion: StoredObjectVersionWithPointInTime;
-}) => {
+const onRestored = (newVersion: StoredObjectVersionWithPointInTime) => {
   state.restored = newVersion.version;
-  emit("restoreVersion", { newVersion });
+  emit("restoreVersion", newVersion);
 };
 </script>
 
-<template>
-  <template v-if="props.versions.length > 0">
-    <div class="container">
-      <template v-for="v in props.versions" :key="v.id">
-        <history-button-list-item
-          :version="v"
-          :can-edit="canEdit"
-          :is-current="higher_version === v.version"
-          :stored-object="storedObject"
-          @restore-version="onRestored"
-        ></history-button-list-item>
-      </template>
-    </div>
-  </template>
-  <template v-else>
-    <p>Chargement des versions</p>
-  </template>
-</template>
-
 <style scoped lang="scss"></style>

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/StoredObjectButton/HistoryButton/HistoryButtonListItem.vue

@@ -1,3 +1,70 @@
+<template>
+  <div :class="classes">
+    <div
+      class="col-12 tags"
+      v-if="isCurrent || isKeptBeforeConversion || isRestored || isDuplicated"
+    >
+      <span class="badge bg-success" v-if="isCurrent">Version actuelle</span>
+      <span class="badge bg-info" v-if="isKeptBeforeConversion"
+        >Conservée avant conversion dans un autre format</span
+      >
+      <span class="badge bg-info" v-if="isRestored"
+        >Restaurée depuis la version
+        {{
+          version["from-restored"]?.version
+            ? version["from-restored"]?.version + 1
+            : ""
+        }}</span
+      >
+      <span class="badge bg-info" v-if="isDuplicated"
+        >Dupliqué depuis un autre document</span
+      >
+    </div>
+    <div class="col-12">
+      <file-icon :type="version.type"></file-icon>
+      <span
+        ><strong>&nbsp;#{{ version.version + 1 }}&nbsp;</strong></span
+      >
+      <template v-if="version.createdBy !== null && version.createdAt !== null">
+        <strong v-if="version.version == 0">créé par</strong>
+        <strong v-else>modifié par</strong>
+        <span class="badge-user">
+          <UserRenderBoxBadge :user="version.createdBy" />
+        </span>
+        <strong>à</strong>
+        {{ $d(ISOToDatetime(version.createdAt.datetime8601) ?? 0, "long") }}
+      </template>
+      <template v-if="version.createdBy === null && version.createdAt !== null">
+        <strong v-if="version.version == 0">Créé le</strong>
+        <strong v-else>modifié le</strong>
+        {{ $d(ISOToDatetime(version.createdAt.datetime8601) ?? 0, "long") }}
+      </template>
+    </div>
+    <div class="col-12">
+      <ul class="record_actions small slim on-version-actions">
+        <li v-if="canEdit && !isCurrent">
+          <restore-version-button
+            :stored-object-version="props.version"
+            @restore-version="onRestore"
+          ></restore-version-button>
+        </li>
+        <li>
+          <download-button
+            :stored-object="storedObject"
+            :at-version="version"
+            :classes="{
+              btn: true,
+              'btn-outline-primary': true,
+              'btn-sm': true,
+            }"
+            :display-action-string-in-button="false"
+          ></download-button>
+        </li>
+      </ul>
+    </div>
+  </div>
+</template>
+
 <script setup lang="ts">
 import {
   StoredObject,
@@ -24,12 +91,8 @@ const emit = defineEmits<{
 
 const props = defineProps<HistoryButtonListItemConfig>();
 
-const onRestore = ({
-  newVersion,
-}: {
-  newVersion: StoredObjectVersionWithPointInTime;
-}) => {
-  emit("restoreVersion", { newVersion });
+const onRestore = (newVersion: StoredObjectVersionWithPointInTime) => {
+  emit("restoreVersion", newVersion);
 };
 
 const isKeptBeforeConversion = computed<boolean>(() => {
@@ -60,77 +123,11 @@ const classes = computed<{
 }>(() => ({
   row: true,
   "row-hover": true,
-  "blinking-1": props.isRestored && 0 === props.version.version % 2,
-  "blinking-2": props.isRestored && 1 === props.version.version % 2,
+  "blinking-1": isRestored.value && 0 === props.version.version % 2,
+  "blinking-2": isRestored.value && 1 === props.version.version % 2,
 }));
 </script>
 
-<template>
-  <div :class="classes">
-    <div
-      class="col-12 tags"
-      v-if="isCurrent || isKeptBeforeConversion || isRestored || isDuplicated"
-    >
-      <span class="badge bg-success" v-if="isCurrent">Version actuelle</span>
-      <span class="badge bg-info" v-if="isKeptBeforeConversion"
-        >Conservée avant conversion dans un autre format</span
-      >
-      <span class="badge bg-info" v-if="isRestored"
-        >Restaurée depuis la version
-        {{ version["from-restored"]?.version + 1 }}</span
-      >
-      <span class="badge bg-info" v-if="isDuplicated"
-        >Dupliqué depuis un autre document</span
-      >
-    </div>
-    <div class="col-12">
-      <file-icon :type="version.type"></file-icon>
-      <span
-        ><strong>&nbsp;#{{ version.version + 1 }}&nbsp;</strong></span
-      >
-      <template v-if="version.createdBy !== null && version.createdAt !== null"
-        ><strong v-if="version.version == 0">créé par</strong
-        ><strong v-else>modifié par</strong>
-        <span class="badge-user"
-          ><UserRenderBoxBadge :user="version.createdBy"></UserRenderBoxBadge
-        ></span>
-        <strong>à</strong>
-        {{
-          $d(ISOToDatetime(version.createdAt.datetime8601), "long")
-        }}</template
-      ><template v-if="version.createdBy === null && version.createdAt !== null"
-        ><strong v-if="version.version == 0">Créé le</strong
-        ><strong v-else>modifié le</strong>
-        {{
-          $d(ISOToDatetime(version.createdAt.datetime8601), "long")
-        }}</template
-      >
-    </div>
-    <div class="col-12">
-      <ul class="record_actions small slim on-version-actions">
-        <li v-if="canEdit && !isCurrent">
-          <restore-version-button
-            :stored-object-version="props.version"
-            @restore-version="onRestore"
-          ></restore-version-button>
-        </li>
-        <li>
-          <download-button
-            :stored-object="storedObject"
-            :at-version="version"
-            :classes="{
-              btn: true,
-              'btn-outline-primary': true,
-              'btn-sm': true,
-            }"
-            :display-action-string-in-button="false"
-          ></download-button>
-        </li>
-      </ul>
-    </div>
-  </div>
-</template>
-
 <style scoped lang="scss">
 div.tags {
   span.badge:not(:last-child) {

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/StoredObjectButton/HistoryButton/HistoryButtonModal.vue

@@ -1,3 +1,22 @@
+<template>
+  <Teleport to="body">
+    <modal v-if="state.opened" @close="state.opened = false">
+      <template v-slot:header>
+        <h3>Historique des versions du document</h3>
+      </template>
+      <template v-slot:body>
+        <p>Les versions sont conservées pendant 90 jours.</p>
+        <history-button-list
+          :versions="props.versions"
+          :can-edit="canEdit"
+          :stored-object="storedObject"
+          @restore-version="onRestoreVersion"
+        ></history-button-list>
+      </template>
+    </modal>
+  </Teleport>
+</template>
+
 <script setup lang="ts">
 import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
 import { reactive } from "vue";
@@ -28,29 +47,10 @@ const open = () => {
   state.opened = true;
 };
 
-const onRestoreVersion = (payload: {
-  newVersion: StoredObjectVersionWithPointInTime;
-}) => emit("restoreVersion", payload);
+const onRestoreVersion = (newVersion: StoredObjectVersionWithPointInTime) =>
+  emit("restoreVersion", newVersion);
 
 defineExpose({ open });
 </script>
-<template>
-  <Teleport to="body">
-    <modal v-if="state.opened" @close="state.opened = false">
-      <template v-slot:header>
-        <h3>Historique des versions du document</h3>
-      </template>
-      <template v-slot:body>
-        <p>Les versions sont conservées pendant 90 jours.</p>
-        <history-button-list
-          :versions="props.versions"
-          :can-edit="canEdit"
-          :stored-object="storedObject"
-          @restore-version="onRestoreVersion"
-        ></history-button-list>
-      </template>
-    </modal>
-  </Teleport>
-</template>
 
 <style scoped lang="scss"></style>

src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/StoredObjectButton/HistoryButton/RestoreVersionButton.vue

@@ -1,3 +1,13 @@
+<template>
+  <button
+    class="btn btn-outline-action"
+    @click="restore_version_fn"
+    title="Restaurer"
+  >
+    <i class="fa fa-rotate-left"></i> Restaurer
+  </button>
+</template>
+
 <script setup lang="ts">
 import {
   StoredObjectVersionPersisted,
@@ -22,18 +32,8 @@ const restore_version_fn = async () => {
   const newVersion = await restore_version(props.storedObjectVersion);
 
   $toast.success("Version restaurée");
-  emit("restoreVersion", { newVersion });
+  emit("restoreVersion", newVersion);
 };
 </script>
 
-<template>
-  <button
-    class="btn btn-outline-action"
-    @click="restore_version_fn"
-    title="Restaurer"
-  >
-    <i class="fa fa-rotate-left"></i> Restaurer
-  </button>
-</template>
-
 <style scoped lang="scss"></style>

src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/components/OnTheFly.vue

@@ -115,7 +115,7 @@
   </teleport>
 </template>
 <script setup lang="ts">
-import { ref, computed, defineEmits, defineProps, useTemplateRef } from "vue";
+import { ref, computed, useTemplateRef } from "vue";
 import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
 import OnTheFlyCreate from "./Create.vue";
 import OnTheFlyPerson from "ChillPersonAssets/vuejs/_components/OnTheFly/Person.vue";
@@ -144,6 +144,7 @@ import {
 } from "translator";
 import PersonEdit from "ChillPersonAssets/vuejs/_components/OnTheFly/PersonEdit.vue";
 import ThirdPartyEdit from "ChillThirdPartyAssets/vuejs/_components/OnTheFly/ThirdPartyEdit.vue";
+import { Person } from "ChillPersonAssets/types";
 
 // Types
 type EntityType = "person" | "thirdparty";
@@ -181,7 +182,7 @@ const emit =
   defineEmits<
     (
       e: "saveFormOnTheFly",
-      payload: { type: string | undefined; data: any },
+      payload: { type: string | undefined; data: Person },
     ) => void
   >();
 
@@ -331,12 +332,12 @@ function buildLocation(
 async function saveAction() {
   if (props.type === "person") {
     const person = await castEditPerson.value?.postPerson();
-    if (null !== person) {
+    if (person) {
       emit("saveFormOnTheFly", { type: props.type, data: person });
     }
   } else if (props.type === "thirdparty") {
     const thirdParty = await castEditThirdParty.value?.postThirdParty();
-    if (null !== thirdParty) {
+    if (thirdParty) {
       emit("saveFormOnTheFly", { type: props.type, data: thirdParty });
     }
   }

src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/PersonEdit.vue

@@ -53,6 +53,7 @@
       <div
         v-for="err in violations.violationTitles('firstName')"
         class="invalid-feedback was-validated-force"
+        :key="err"
       >
         {{ err }}
       </div>
@@ -123,6 +124,7 @@
               'definition_id',
               worker.definition_id.toString(),
             )"
+            :key="err"
             class="invalid-feedback was-validated-force"
           >
             {{ err }}
@@ -154,6 +156,7 @@
         <div
           v-for="err in violations.violationTitles('gender')"
           class="invalid-feedback was-validated-force"
+          :key="err"
         >
           {{ err }}
         </div>
@@ -183,6 +186,7 @@
         <div
           v-for="err in violations.violationTitles('center')"
           class="invalid-feedback was-validated-force"
+          :key="err"
         >
           {{ err }}
         </div>
@@ -212,6 +216,7 @@
         <div
           v-for="err in violations.violationTitles('civility')"
           class="invalid-feedback was-validated-force"
+          :key="err"
         >
           {{ err }}
         </div>
@@ -238,6 +243,7 @@
         <div
           v-for="err in violations.violationTitles('birthdate')"
           class="invalid-feedback was-validated-force"
+          :key="err"
         >
           {{ err }}
         </div>
@@ -265,6 +271,7 @@
         <div
           v-for="err in violations.violationTitles('phonenumber')"
           class="invalid-feedback was-validated-force"
+          :key="err"
         >
           {{ err }}
         </div>
@@ -292,6 +299,7 @@
         <div
           v-for="err in violations.violationTitles('mobilenumber')"
           class="invalid-feedback was-validated-force"
+          :key="err"
         >
           {{ err }}
         </div>
@@ -317,6 +325,7 @@
         <div
           v-for="err in violations.violationTitles('email')"
           class="invalid-feedback was-validated-force"
+          :key="err"
         >
           {{ err }}
         </div>
@@ -353,6 +362,7 @@
 
 <script setup lang="ts">
 import { ref, reactive, computed, onMounted } from "vue";
+
 import { localizeString } from "ChillMainAssets/lib/localizationHelper/localizationHelper";
 import AddAddress from "ChillMainAssets/vuejs/Address/components/AddAddress.vue";
 import {