Apply prettier to files

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

@@ -1,92 +1,137 @@
 <template>
-  <div v-if="isButtonGroupDisplayable" class="btn-group">
-    <button :class="Object.assign({'btn': true, 'btn-outline-primary': true, 'dropdown-toggle': true, 'btn-sm': props.small})" type="button" data-bs-toggle="dropdown" aria-expanded="false">
-      Actions
-    </button>
-    <ul class="dropdown-menu">
-      <li v-if="isEditableOnline">
-        <wopi-edit-button :stored-object="props.storedObject" :classes="{'dropdown-item': true}" :execute-before-leave="props.executeBeforeLeave"></wopi-edit-button>
-      </li>
-      <li v-if="isEditableOnDesktop">
-        <desktop-edit-button :classes="{'dropdown-item': true}" :edit-link="props.davLink" :expiration-link="props.davLinkExpiration"></desktop-edit-button>
-      </li>
-      <li v-if="isConvertibleToPdf">
-        <convert-button :stored-object="props.storedObject" :filename="filename" :classes="{'dropdown-item': true}"></convert-button>
-      </li>
-      <li v-if="isDownloadable">
-        <download-button :stored-object="props.storedObject" :at-version="props.storedObject.currentVersion" :filename="filename" :classes="{'dropdown-item': true}" :display-action-string-in-button="true"></download-button>
-      </li>
-      <li v-if="isHistoryViewable">
-        <history-button :stored-object="props.storedObject" :can-edit="canEdit && props.storedObject._permissions.canEdit"></history-button>
-      </li>
-    </ul>
-  </div>
-  <div v-else-if="'pending' === props.storedObject.status">
-    <div class="btn btn-outline-info">Génération en cours</div>
-  </div>
-  <div v-else-if="'failure' === props.storedObject.status">
-    <div class="btn btn-outline-danger">La génération a échoué</div>
-  </div>
-
+    <div v-if="isButtonGroupDisplayable" class="btn-group">
+        <button
+            :class="
+                Object.assign({
+                    btn: true,
+                    'btn-outline-primary': true,
+                    'dropdown-toggle': true,
+                    'btn-sm': props.small,
+                })
+            "
+            type="button"
+            data-bs-toggle="dropdown"
+            aria-expanded="false"
+        >
+            Actions
+        </button>
+        <ul class="dropdown-menu">
+            <li v-if="isEditableOnline">
+                <wopi-edit-button
+                    :stored-object="props.storedObject"
+                    :classes="{ 'dropdown-item': true }"
+                    :execute-before-leave="props.executeBeforeLeave"
+                ></wopi-edit-button>
+            </li>
+            <li v-if="isEditableOnDesktop">
+                <desktop-edit-button
+                    :classes="{ 'dropdown-item': true }"
+                    :edit-link="props.davLink"
+                    :expiration-link="props.davLinkExpiration"
+                ></desktop-edit-button>
+            </li>
+            <li v-if="isConvertibleToPdf">
+                <convert-button
+                    :stored-object="props.storedObject"
+                    :filename="filename"
+                    :classes="{ 'dropdown-item': true }"
+                ></convert-button>
+            </li>
+            <li v-if="isDownloadable">
+                <download-button
+                    :stored-object="props.storedObject"
+                    :at-version="props.storedObject.currentVersion"
+                    :filename="filename"
+                    :classes="{ 'dropdown-item': true }"
+                    :display-action-string-in-button="true"
+                ></download-button>
+            </li>
+            <li v-if="isHistoryViewable">
+                <history-button
+                    :stored-object="props.storedObject"
+                    :can-edit="
+                        canEdit && props.storedObject._permissions.canEdit
+                    "
+                ></history-button>
+            </li>
+        </ul>
+    </div>
+    <div v-else-if="'pending' === props.storedObject.status">
+        <div class="btn btn-outline-info">Génération en cours</div>
+    </div>
+    <div v-else-if="'failure' === props.storedObject.status">
+        <div class="btn btn-outline-danger">La génération a échoué</div>
+    </div>
 </template>
 
 <script lang="ts" setup>
-
-import {computed, onMounted} from "vue";
+import { computed, onMounted } from "vue";
 import ConvertButton from "./StoredObjectButton/ConvertButton.vue";
 import DownloadButton from "./StoredObjectButton/DownloadButton.vue";
 import WopiEditButton from "./StoredObjectButton/WopiEditButton.vue";
-import {is_extension_editable, is_extension_viewable, is_object_ready} from "./StoredObjectButton/helpers";
+import {
+    is_extension_editable,
+    is_extension_viewable,
+    is_object_ready,
+} from "./StoredObjectButton/helpers";
 import {
     StoredObject,
-    StoredObjectStatusChange, StoredObjectVersion,
-    WopiEditButtonExecutableBeforeLeaveFunction
+    StoredObjectStatusChange,
+    StoredObjectVersion,
+    WopiEditButtonExecutableBeforeLeaveFunction,
 } from "../types";
 import DesktopEditButton from "ChillDocStoreAssets/vuejs/StoredObjectButton/DesktopEditButton.vue";
 import HistoryButton from "ChillDocStoreAssets/vuejs/StoredObjectButton/HistoryButton.vue";
 
 interface DocumentActionButtonsGroupConfig {
-  storedObject: StoredObject,
-  small?: boolean,
-  canEdit?: boolean,
-  canDownload?: boolean,
-  canConvertPdf?: boolean,
-  returnPath?: string,
+    storedObject: StoredObject;
+    small?: boolean;
+    canEdit?: boolean;
+    canDownload?: boolean;
+    canConvertPdf?: boolean;
+    returnPath?: string;
 
-  /**
-   * Will be the filename displayed to the user when he·she download the document
-   * (the document will be saved on his disk with this name)
-   *
-   * If not set, 'document' will be used.
-   */
-  filename?: string,
+    /**
+     * Will be the filename displayed to the user when he·she download the document
+     * (the document will be saved on his disk with this name)
+     *
+     * If not set, 'document' will be used.
+     */
+    filename?: string;
 
-  /**
-   * If set, will execute this function before leaving to the editor
-   */
-  executeBeforeLeave?: WopiEditButtonExecutableBeforeLeaveFunction,
+    /**
+     * If set, will execute this function before leaving to the editor
+     */
+    executeBeforeLeave?: WopiEditButtonExecutableBeforeLeaveFunction;
 
-  /**
-   * a link to download and edit file using webdav
-   */
-  davLink?: string,
+    /**
+     * a link to download and edit file using webdav
+     */
+    davLink?: string;
 
-  /**
-   * the expiration date of the download, as a unix timestamp
-   */
-  davLinkExpiration?: number,
+    /**
+     * the expiration date of the download, as a unix timestamp
+     */
+    davLinkExpiration?: number;
 }
 
-const emit = defineEmits<{
-  (e: 'onStoredObjectStatusChange', newStatus: StoredObjectStatusChange): void
-}>();
+const emit =
+    defineEmits<
+        (
+            e: "onStoredObjectStatusChange",
+            newStatus: StoredObjectStatusChange,
+        ) => void
+    >();
 
 const props = withDefaults(defineProps<DocumentActionButtonsGroupConfig>(), {
-  small: false,
-  canEdit: true,
-  canDownload: true,
-  canConvertPdf: true,
-  returnPath: window.location.pathname + window.location.search + window.location.hash
+    small: false,
+    canEdit: true,
+    canDownload: true,
+    canConvertPdf: true,
+    returnPath:
+        window.location.pathname +
+        window.location.search +
+        window.location.hash,
 });
 
 /**
@@ -100,22 +145,32 @@ let tryiesForReady = 0;
 const maxTryiesForReady = 120;
 
 const isButtonGroupDisplayable = computed<boolean>(() => {
-    return isDownloadable.value || isEditableOnline.value || isEditableOnDesktop.value || isConvertibleToPdf.value;
+    return (
+        isDownloadable.value ||
+        isEditableOnline.value ||
+        isEditableOnDesktop.value ||
+        isConvertibleToPdf.value
+    );
 });
 
 const isDownloadable = computed<boolean>(() => {
-    return props.storedObject.status === 'ready'
+    return (
+        props.storedObject.status === "ready" ||
         // happens when the stored object version is just added, but not persisted
-        || (props.storedObject.currentVersion !== null && props.storedObject.status === 'empty')
+        (props.storedObject.currentVersion !== null &&
+            props.storedObject.status === "empty")
+    );
 });
 
 const isEditableOnline = computed<boolean>(() => {
-    return props.storedObject.status === 'ready'
-        && props.storedObject._permissions.canEdit
-        && props.canEdit
-        && props.storedObject.currentVersion !== null
-        && is_extension_editable(props.storedObject.currentVersion.type)
-        && props.storedObject.currentVersion.persisted !== false;
+    return (
+        props.storedObject.status === "ready" &&
+        props.storedObject._permissions.canEdit &&
+        props.canEdit &&
+        props.storedObject.currentVersion !== null &&
+        is_extension_editable(props.storedObject.currentVersion.type) &&
+        props.storedObject.currentVersion.persisted !== false
+    );
 });
 
 const isEditableOnDesktop = computed<boolean>(() => {
@@ -123,62 +178,61 @@ const isEditableOnDesktop = computed<boolean>(() => {
 });
 
 const isConvertibleToPdf = computed<boolean>(() => {
-    return props.storedObject.status === 'ready'
-        && props.storedObject._permissions.canSee
-        && props.canConvertPdf
-        && props.storedObject.currentVersion !== null
-        && is_extension_viewable(props.storedObject.currentVersion.type)
-        && props.storedObject.currentVersion.type !== 'application/pdf'
-        && props.storedObject.currentVersion.persisted !== false;
+    return (
+        props.storedObject.status === "ready" &&
+        props.storedObject._permissions.canSee &&
+        props.canConvertPdf &&
+        props.storedObject.currentVersion !== null &&
+        is_extension_viewable(props.storedObject.currentVersion.type) &&
+        props.storedObject.currentVersion.type !== "application/pdf" &&
+        props.storedObject.currentVersion.persisted !== false
+    );
 });
 
 const isHistoryViewable = computed<boolean>(() => {
-    return props.storedObject.status === 'ready';
+    return props.storedObject.status === "ready";
 });
 
-const checkForReady = function(): void {
-  if (
-    'ready' === props.storedObject.status
-    || 'empty' === props.storedObject.status
-    || 'failure' === props.storedObject.status
-    // stop reloading if the page stays opened for a long time
-    || tryiesForReady > maxTryiesForReady
-  ) {
-    return;
-  }
+const checkForReady = function (): void {
+    if (
+        "ready" === props.storedObject.status ||
+        "empty" === props.storedObject.status ||
+        "failure" === props.storedObject.status ||
+        // stop reloading if the page stays opened for a long time
+        tryiesForReady > maxTryiesForReady
+    ) {
+        return;
+    }
 
-  tryiesForReady = tryiesForReady + 1;
+    tryiesForReady = tryiesForReady + 1;
 
-  setTimeout(onObjectNewStatusCallback, 5000);
+    setTimeout(onObjectNewStatusCallback, 5000);
 };
 
-const onObjectNewStatusCallback = async function(): Promise<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);
+        return Promise.resolve();
+    } else if ("failure" === new_status.status) {
+        return Promise.resolve();
+    }
+
+    if ("ready" !== new_status.status) {
+        // we check for new status, unless it is ready
+        checkForReady();
+    }
 
-  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);
-    return Promise.resolve();
-  } else if ('failure' === new_status.status) {
-    return Promise.resolve();
-  }
-
-  if ('ready' !== new_status.status) {
-    // we check for new status, unless it is ready
-    checkForReady();
-  }
-
-  return Promise.resolve();
 };
 
 onMounted(() => {
-  checkForReady();
-})
+    checkForReady();
+});
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

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

@@ -1,23 +1,35 @@
 <script setup lang="ts">
-
-import {StoredObject, StoredObjectVersionCreated} from "../../types";
-import {encryptFile, fetchNewStoredObject, uploadVersion} from "../../js/async-upload/uploader";
-import {computed, ref, Ref} from "vue";
+import { StoredObject, StoredObjectVersionCreated } from "../../types";
+import {
+    encryptFile,
+    fetchNewStoredObject,
+    uploadVersion,
+} from "../../js/async-upload/uploader";
+import { computed, ref, Ref } from "vue";
 import FileIcon from "ChillDocStoreAssets/vuejs/FileIcon.vue";
 
 interface DropFileConfig {
-    existingDoc?: StoredObject,
+    existingDoc?: StoredObject;
 }
 
-const props = withDefaults(defineProps<DropFileConfig>(), {existingDoc: null});
+const props = withDefaults(defineProps<DropFileConfig>(), {
+    existingDoc: null,
+});
 
-const emit = defineEmits<{
-    (e: 'addDocument', {stored_object_version: StoredObjectVersionCreated, stored_object: StoredObject}): void,
-}>();
+const emit =
+    defineEmits<
+        (
+            e: "addDocument",
+            {
+                stored_object_version: StoredObjectVersionCreated,
+                stored_object: StoredObject,
+            },
+        ) => void
+    >();
 
 const is_dragging: Ref<boolean> = ref(false);
 const uploading: Ref<boolean> = ref(false);
-const display_filename: Ref<string|null> = ref(null);
+const display_filename: Ref<string | null> = ref(null);
 
 const has_existing_doc = computed<boolean>(() => {
     return props.existingDoc !== undefined && props.existingDoc !== null;
@@ -27,13 +39,13 @@ const onDragOver = (e: Event) => {
     e.preventDefault();
 
     is_dragging.value = true;
-}
+};
 
 const onDragLeave = (e: Event) => {
     e.preventDefault();
 
     is_dragging.value = false;
-}
+};
 
 const onDrop = (e: DragEvent) => {
     e.preventDefault();
@@ -49,8 +61,8 @@ const onDrop = (e: DragEvent) => {
         return;
     }
 
-    handleFile(files[0])
-}
+    handleFile(files[0]);
+};
 
 const onZoneClick = (e: Event) => {
     e.stopPropagation();
@@ -61,21 +73,21 @@ const onZoneClick = (e: Event) => {
     input.addEventListener("change", onFileChange);
 
     input.click();
-}
+};
 
 const onFileChange = async (event: Event): Promise<void> => {
     const input = event.target as HTMLInputElement;
 
     if (input.files && input.files[0]) {
-        console.log('file added', input.files[0]);
+        console.log("file added", input.files[0]);
         const file = input.files[0];
         await handleFile(file);
 
         return Promise.resolve();
     }
 
-    throw 'No file given';
-}
+    throw "No file given";
+};
 
 const handleFile = async (file: File): Promise<void> => {
     uploading.value = true;
@@ -100,25 +112,39 @@ const handleFile = async (file: File): Promise<void> => {
         keyInfos: jsonWebKey,
         type: type,
         persisted: false,
-    }
+    };
 
-    emit('addDocument', {stored_object, stored_object_version});
+    emit("addDocument", { stored_object, stored_object_version });
     uploading.value = false;
-}
-
+};
 </script>
 
 <template>
     <div class="drop-file">
-        <div v-if="!uploading" :class="{ area: true, dragging: is_dragging}" @click="onZoneClick" @dragover="onDragOver" @dragleave="onDragLeave" @drop="onDrop">
+        <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>
+            <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>
+            <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>
@@ -140,7 +166,8 @@ const handleFile = async (file: File): Promise<void> => {
         font-weight: 200;
     }
 
-    & > .area, & > .waiting {
+    & > .area,
+    & > .waiting {
         width: 100%;
         height: 10rem;
 
@@ -163,5 +190,4 @@ const handleFile = async (file: File): Promise<void> => {
         }
     }
 }
-
 </style>

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

@@ -1,14 +1,13 @@
 <script setup lang="ts">
-
 import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
-import {StoredObject, StoredObjectVersion} from "../../types";
+import { StoredObject, StoredObjectVersion } from "../../types";
 import DropFileWidget from "ChillDocStoreAssets/vuejs/DropFileWidget/DropFileWidget.vue";
-import {computed, reactive} from "vue";
-import {useToast} from 'vue-toast-notification';
+import { computed, reactive } from "vue";
+import { useToast } from "vue-toast-notification";
 
 interface DropFileConfig {
-    allowRemove: boolean,
-    existingDoc?: StoredObject,
+    allowRemove: boolean;
+    existingDoc?: StoredObject;
 }
 
 const props = withDefaults(defineProps<DropFileConfig>(), {
@@ -16,33 +15,46 @@ const props = withDefaults(defineProps<DropFileConfig>(), {
 });
 
 const emit = defineEmits<{
-    (e: 'addDocument', {stored_object: StoredObject, stored_object_version: StoredObjectVersion}): void,
-    (e: 'removeDocument'): void
+    (
+        e: "addDocument",
+        {
+            stored_object: StoredObject,
+            stored_object_version: StoredObjectVersion,
+        },
+    ): void;
+    (e: "removeDocument"): void;
 }>();
 
 const $toast = useToast();
 
-const state = reactive({showModal: false});
+const state = reactive({ showModal: false });
 
-const modalClasses = {"modal-dialog-centered": true, "modal-md": true};
+const modalClasses = { "modal-dialog-centered": true, "modal-md": true };
 
-const buttonState = computed<'add'|'replace'>(() => {
+const buttonState = computed<"add" | "replace">(() => {
     if (props.existingDoc === undefined || props.existingDoc === null) {
-        return 'add';
+        return "add";
     }
 
-    return 'replace';
-})
+    return "replace";
+});
 
-function onAddDocument({stored_object, stored_object_version}: {stored_object: StoredObject, stored_object_version: StoredObjectVersion}): void {
-    const message = buttonState.value === 'add' ? "Document ajouté" : "Document remplacé";
+function onAddDocument({
+    stored_object,
+    stored_object_version,
+}: {
+    stored_object: StoredObject;
+    stored_object_version: StoredObjectVersion;
+}): void {
+    const message =
+        buttonState.value === "add" ? "Document ajouté" : "Document remplacé";
     $toast.success(message);
-    emit('addDocument', {stored_object_version, stored_object});
+    emit("addDocument", { stored_object_version, stored_object });
     state.showModal = false;
 }
 
 function onRemoveDocument(): void {
-   emit('removeDocument');
+    emit("removeDocument");
 }
 
 function openModal(): void {
@@ -55,15 +67,30 @@ function closeModal(): void {
 </script>
 
 <template>
-    <button v-if="buttonState === 'add'" @click="openModal" class="btn btn-create">Ajouter un document</button>
-    <button v-else @click="openModal" class="btn btn-edit">Remplacer le document</button>
-    <modal v-if="state.showModal" :modal-dialog-class="modalClasses" @close="closeModal">
+    <button
+        v-if="buttonState === 'add'"
+        @click="openModal"
+        class="btn btn-create"
+    >
+        Ajouter un document
+    </button>
+    <button v-else @click="openModal" class="btn btn-edit">
+        Remplacer le document
+    </button>
+    <modal
+        v-if="state.showModal"
+        :modal-dialog-class="modalClasses"
+        @close="closeModal"
+    >
         <template v-slot:body>
-            <drop-file-widget :existing-doc="existingDoc" :allow-remove="allowRemove" @add-document="onAddDocument" @remove-document="onRemoveDocument" ></drop-file-widget>
+            <drop-file-widget
+                :existing-doc="existingDoc"
+                :allow-remove="allowRemove"
+                @add-document="onAddDocument"
+                @remove-document="onRemoveDocument"
+            ></drop-file-widget>
         </template>
     </modal>
 </template>
 
-<style scoped lang="scss">
-
-</style>
+<style scoped lang="scss"></style>

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

@@ -1,13 +1,12 @@
 <script setup lang="ts">
-
-import {StoredObject, StoredObjectVersion} from "../../types";
-import {computed, ref, Ref} from "vue";
+import { StoredObject, StoredObjectVersion } from "../../types";
+import { computed, ref, Ref } from "vue";
 import DropFile from "ChillDocStoreAssets/vuejs/DropFileWidget/DropFile.vue";
 import DocumentActionButtonsGroup from "ChillDocStoreAssets/vuejs/DocumentActionButtonsGroup.vue";
 
 interface DropFileConfig {
-    allowRemove: boolean,
-    existingDoc?: StoredObject,
+    allowRemove: boolean;
+    existingDoc?: StoredObject;
 }
 
 const props = withDefaults(defineProps<DropFileConfig>(), {
@@ -15,51 +14,65 @@ const props = withDefaults(defineProps<DropFileConfig>(), {
 });
 
 const emit = defineEmits<{
-    (e: 'addDocument', {stored_object: StoredObject, stored_object_version: StoredObjectVersion}): void,
-    (e: 'removeDocument'): void
+    (
+        e: "addDocument",
+        {
+            stored_object: StoredObject,
+            stored_object_version: StoredObjectVersion,
+        },
+    ): void;
+    (e: "removeDocument"): void;
 }>();
 
 const has_existing_doc = computed<boolean>(() => {
     return props.existingDoc !== undefined && props.existingDoc !== null;
 });
 
-const dav_link_expiration = computed<number|undefined>(() => {
+const dav_link_expiration = computed<number | undefined>(() => {
     if (props.existingDoc === undefined || props.existingDoc === null) {
         return undefined;
     }
-    if (props.existingDoc.status !== 'ready') {
+    if (props.existingDoc.status !== "ready") {
         return undefined;
     }
 
     return props.existingDoc._links?.dav_link?.expiration;
 });
 
-const dav_link_href = computed<string|undefined>(() => {
+const dav_link_href = computed<string | undefined>(() => {
     if (props.existingDoc === undefined || props.existingDoc === null) {
         return undefined;
     }
-    if (props.existingDoc.status !== 'ready') {
+    if (props.existingDoc.status !== "ready") {
         return undefined;
     }
 
     return props.existingDoc._links?.dav_link?.href;
-})
+});
 
-const onAddDocument = ({stored_object, stored_object_version}: {stored_object: StoredObject, stored_object_version: StoredObjectVersion}): void => {
-    emit('addDocument', {stored_object, stored_object_version});
-}
+const onAddDocument = ({
+    stored_object,
+    stored_object_version,
+}: {
+    stored_object: StoredObject;
+    stored_object_version: StoredObjectVersion;
+}): void => {
+    emit("addDocument", { stored_object, stored_object_version });
+};
 
 const onRemoveDocument = (e: Event): void => {
     e.stopPropagation();
     e.preventDefault();
-    emit('removeDocument');
-}
-
+    emit("removeDocument");
+};
 </script>
 
 <template>
     <div>
-        <drop-file :existingDoc="props.existingDoc" @addDocument="onAddDocument"></drop-file>
+        <drop-file
+            :existingDoc="props.existingDoc"
+            @addDocument="onAddDocument"
+        ></drop-file>
 
         <ul class="record_actions">
             <li v-if="has_existing_doc">
@@ -72,12 +85,14 @@ const onRemoveDocument = (e: Event): void => {
                 />
             </li>
             <li>
-                <button v-if="allowRemove" class="btn btn-delete" @click="onRemoveDocument($event)" ></button>
+                <button
+                    v-if="allowRemove"
+                    class="btn btn-delete"
+                    @click="onRemoveDocument($event)"
+                ></button>
             </li>
         </ul>
     </div>
 </template>
 
-<style scoped lang="scss">
-
-</style>
+<style scoped lang="scss"></style>

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

@@ -4,22 +4,43 @@ interface FileIconConfig {
 }
 
 const props = defineProps<FileIconConfig>();
-
 </script>
 
 <template>
     <i class="fa fa-file-pdf-o" v-if="props.type === 'application/pdf'"></i>
-    <i class="fa fa-file-word-o" v-else-if="props.type === 'application/vnd.oasis.opendocument.text'"></i>
-    <i class="fa fa-file-word-o" v-else-if="props.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'"></i>
-    <i class="fa fa-file-word-o" v-else-if="props.type === 'application/msword'"></i>
-    <i class="fa fa-file-excel-o" v-else-if="props.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'"></i>
-    <i class="fa fa-file-excel-o" v-else-if="props.type === 'application/vnd.ms-excel'"></i>
+    <i
+        class="fa fa-file-word-o"
+        v-else-if="props.type === 'application/vnd.oasis.opendocument.text'"
+    ></i>
+    <i
+        class="fa fa-file-word-o"
+        v-else-if="
+            props.type ===
+            'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
+        "
+    ></i>
+    <i
+        class="fa fa-file-word-o"
+        v-else-if="props.type === 'application/msword'"
+    ></i>
+    <i
+        class="fa fa-file-excel-o"
+        v-else-if="
+            props.type ===
+            'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+        "
+    ></i>
+    <i
+        class="fa fa-file-excel-o"
+        v-else-if="props.type === 'application/vnd.ms-excel'"
+    ></i>
     <i class="fa fa-file-image-o" v-else-if="props.type === 'image/jpeg'"></i>
     <i class="fa fa-file-image-o" v-else-if="props.type === 'image/png'"></i>
-    <i class="fa fa-file-archive-o" v-else-if="props.type === 'application/x-zip-compressed'"></i>
-    <i class="fa fa-file-code-o" v-else ></i>
+    <i
+        class="fa fa-file-archive-o"
+        v-else-if="props.type === 'application/x-zip-compressed'"
+    ></i>
+    <i class="fa fa-file-code-o" v-else></i>
 </template>
 
-<style scoped lang="scss">
-
-</style>
+<style scoped lang="scss"></style>

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

@@ -1,61 +1,65 @@
 <template>
-  <a :class="props.classes" @click="download_and_open($event)" ref="btn">
-    <i class="fa fa-file-pdf-o"></i>
-    Télécharger en pdf
-  </a>
+    <a :class="props.classes" @click="download_and_open($event)" ref="btn">
+        <i class="fa fa-file-pdf-o"></i>
+        Télécharger en pdf
+    </a>
 </template>
 
 <script lang="ts" setup>
-
-import {build_convert_link, download_and_decrypt_doc, download_doc} from "./helpers";
+import {
+    build_convert_link,
+    download_and_decrypt_doc,
+    download_doc,
+} from "./helpers";
 import mime from "mime";
-import {reactive, ref} from "vue";
-import {StoredObject} from "../../types";
+import { reactive, ref } from "vue";
+import { StoredObject } from "../../types";
 
 interface ConvertButtonConfig {
-  storedObject: StoredObject,
-  classes: { [key: string]: boolean},
-  filename?: string,
-};
+    storedObject: StoredObject;
+    classes: Record<string, boolean>;
+    filename?: string;
+}
 
 interface DownloadButtonState {
-  content: null|string
+    content: null | string;
 }
 
 const props = defineProps<ConvertButtonConfig>();
-const state: DownloadButtonState = reactive({content: null});
+const state: DownloadButtonState = reactive({ content: null });
 const btn = ref<HTMLAnchorElement | null>(null);
 
 async function download_and_open(event: Event): Promise<void> {
-  const button = event.target as HTMLAnchorElement;
+    const button = event.target as HTMLAnchorElement;
 
-  if (null === state.content) {
-    event.preventDefault();
+    if (null === state.content) {
+        event.preventDefault();
 
-    const raw = await download_doc(build_convert_link(props.storedObject.uuid));
-    state.content = window.URL.createObjectURL(raw);
+        const raw = await download_doc(
+            build_convert_link(props.storedObject.uuid),
+        );
+        state.content = window.URL.createObjectURL(raw);
 
-    button.href = window.URL.createObjectURL(raw);
-    button.type = 'application/pdf';
+        button.href = window.URL.createObjectURL(raw);
+        button.type = "application/pdf";
 
-    button.download = (props.filename + '.pdf') || 'document.pdf';
-  }
+        button.download = props.filename + ".pdf" || "document.pdf";
+    }
 
-  button.click();
-  const reset_pending = setTimeout(reset_state, 45000);
+    button.click();
+    const reset_pending = setTimeout(reset_state, 45000);
 }
 
 function reset_state(): void {
     state.content = null;
-    btn.value?.removeAttribute('download');
-    btn.value?.removeAttribute('href');
-    btn.value?.removeAttribute('type');
+    btn.value?.removeAttribute("download");
+    btn.value?.removeAttribute("href");
+    btn.value?.removeAttribute("type");
 }
-
 </script>
 
 <style scoped lang="scss">
 i.fa::before {
-   color: var(--bs-dropdown-link-hover-color);
+    color: var(--bs-dropdown-link-hover-color);
 }
 </style>

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

@@ -1,58 +1,79 @@
 <template>
-    <a v-if="!state.is_ready" :class="props.classes" @click="download_and_open()" title="T&#233;l&#233;charger">
+    <a
+        v-if="!state.is_ready"
+        :class="props.classes"
+        @click="download_and_open()"
+        title="T&#233;l&#233;charger"
+    >
         <i class="fa fa-download"></i>
         <template v-if="displayActionStringInButton">Télécharger</template>
     </a>
-    <a v-else :class="props.classes" target="_blank" :type="props.atVersion.type" :download="buildDocumentName()" :href="state.href_url" ref="open_button" title="Ouvrir">
+    <a
+        v-else
+        :class="props.classes"
+        target="_blank"
+        :type="props.atVersion.type"
+        :download="buildDocumentName()"
+        :href="state.href_url"
+        ref="open_button"
+        title="Ouvrir"
+    >
         <i class="fa fa-external-link"></i>
         <template v-if="displayActionStringInButton">Ouvrir</template>
     </a>
 </template>
 
 <script lang="ts" setup>
-import {reactive, ref, nextTick, onMounted} from "vue";
-import {download_and_decrypt_doc} from "./helpers";
+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, StoredObjectVersion } from "../../types";
 
 interface DownloadButtonConfig {
-    storedObject: StoredObject,
-    atVersion: StoredObjectVersion,
-    classes: { [k: string]: boolean },
-    filename?: string,
+    storedObject: StoredObject;
+    atVersion: StoredObjectVersion;
+    classes: Record<string, boolean>;
+    filename?: string;
     /**
      * if true, display the action string into the button. If false, displays only
      * the icon
      */
-    displayActionStringInButton?: boolean,
+    displayActionStringInButton?: boolean;
     /**
      * if true, will download directly the file on load
      */
-    directDownload?: boolean,
+    directDownload?: boolean;
 }
 
 interface DownloadButtonState {
-    is_ready: boolean,
-    is_running: boolean,
-    href_url: string,
+    is_ready: boolean;
+    is_running: boolean;
+    href_url: string;
 }
 
-const props = withDefaults(defineProps<DownloadButtonConfig>(), {displayActionStringInButton: true, directDownload: false});
-const state: DownloadButtonState = reactive({is_ready: false, is_running: false, href_url: "#"});
+const props = withDefaults(defineProps<DownloadButtonConfig>(), {
+    displayActionStringInButton: true,
+    directDownload: false,
+});
+const state: DownloadButtonState = reactive({
+    is_ready: false,
+    is_running: false,
+    href_url: "#",
+});
 
 const open_button = ref<HTMLAnchorElement | null>(null);
 
 function buildDocumentName(): string {
     let document_name = props.filename ?? props.storedObject.title;
 
-    if ('' === document_name) {
-        document_name = 'document';
+    if ("" === document_name) {
+        document_name = "document";
     }
 
     const ext = mime.getExtension(props.atVersion.type);
 
     if (null !== ext) {
-        return document_name + '.' + ext;
+        return document_name + "." + ext;
     }
 
     return document_name;
@@ -60,21 +81,24 @@ function buildDocumentName(): string {
 
 async function download_and_open(): Promise<void> {
     if (state.is_running) {
-        console.log('state is running, aborting');
+        console.log("state is running, aborting");
         return;
     }
 
     state.is_running = true;
 
     if (state.is_ready) {
-        console.log('state is ready. This should not happens');
+        console.log("state is ready. This should not happens");
         return;
     }
 
     let raw;
 
     try {
-        raw = await download_and_decrypt_doc(props.storedObject, props.atVersion);
+        raw = await download_and_decrypt_doc(
+            props.storedObject,
+            props.atVersion,
+        );
     } catch (e) {
         console.error("error while downloading and decrypting document");
         console.error(e);
@@ -89,13 +113,13 @@ async function download_and_open(): Promise<void> {
         await nextTick();
         open_button.value?.click();
 
-        console.log('open button should have been clicked');
+        console.log("open button should have been clicked");
         setTimeout(reset_state, 45000);
     }
 }
 
 function reset_state(): void {
-    state.href_url = '#';
+    state.href_url = "#";
     state.is_ready = false;
     state.is_running = false;
 }
@@ -109,7 +133,7 @@ onMounted(() => {
 
 <style scoped lang="scss">
 i.fa::before {
-   color: var(--bs-dropdown-link-hover-color);
+    color: var(--bs-dropdown-link-hover-color);
 }
 i.fa {
     margin-right: 0.5rem;

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

@@ -1,9 +1,11 @@
 <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 {get_versions} from "./HistoryButton/api";
+import {
+    StoredObject,
+    StoredObjectVersionWithPointInTime,
+} from "./../../types";
+import { computed, reactive, ref, useTemplateRef } from "vue";
+import { get_versions } from "./HistoryButton/api";
 
 interface HistoryButtonConfig {
     storedObject: StoredObject;
@@ -16,8 +18,8 @@ interface HistoryButtonState {
 }
 
 const props = defineProps<HistoryButtonConfig>();
-const state = reactive<HistoryButtonState>({versions: [], loaded: false});
-const modal = useTemplateRef<typeof HistoryButtonModal>('modal');
+const state = reactive<HistoryButtonState>({ versions: [], loaded: false });
+const modal = useTemplateRef<typeof HistoryButtonModal>("modal");
 
 const download_version_and_open_modal = async function (): Promise<void> {
     if (null !== modal.value) {
@@ -34,20 +36,29 @@ const download_version_and_open_modal = async function (): Promise<void> {
         }
         state.loaded = true;
     }
-}
+};
 
-const onRestoreVersion = ({newVersion}: {newVersion: StoredObjectVersionWithPointInTime}) => {
+const onRestoreVersion = ({
+    newVersion,
+}: {
+    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>
+    <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">

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

@@ -1,7 +1,10 @@
 <script setup lang="ts">
-import {StoredObject, StoredObjectVersionWithPointInTime} from "./../../../types";
+import {
+    StoredObject,
+    StoredObjectVersionWithPointInTime,
+} from "./../../../types";
 import HistoryButtonListItem from "ChillDocStoreAssets/vuejs/StoredObjectButton/HistoryButton/HistoryButtonListItem.vue";
-import {computed, reactive} from "vue";
+import { computed, reactive } from "vue";
 
 interface HistoryButtonListConfig {
     versions: StoredObjectVersionWithPointInTime[];
@@ -10,8 +13,8 @@ interface HistoryButtonListConfig {
 }
 
 const emit = defineEmits<{
-    restoreVersion: [newVersion: StoredObjectVersionWithPointInTime]
-}>()
+    restoreVersion: [newVersion: StoredObjectVersionWithPointInTime];
+}>();
 
 interface HistoryButtonListState {
     /**
@@ -22,12 +25,14 @@ interface HistoryButtonListState {
 
 const props = defineProps<HistoryButtonListConfig>();
 
-const state = reactive<HistoryButtonListState>({restored: -1})
+const state = reactive<HistoryButtonListState>({ restored: -1 });
 
-const higher_version = computed<number>(() => props.versions.reduce(
-    (accumulator: number, version: StoredObjectVersionWithPointInTime) => Math.max(accumulator, version.version),
-    -1
-    )
+const higher_version = computed<number>(() =>
+    props.versions.reduce(
+        (accumulator: number, version: StoredObjectVersionWithPointInTime) =>
+            Math.max(accumulator, version.version),
+        -1,
+    ),
 );
 
 /**
@@ -35,11 +40,14 @@ const higher_version = computed<number>(() => props.versions.reduce(
  *
  * internally, keep track of the newly restored version
  */
-const onRestored = ({newVersion}: {newVersion: StoredObjectVersionWithPointInTime}) => {
+const onRestored = ({
+    newVersion,
+}: {
+    newVersion: StoredObjectVersionWithPointInTime;
+}) => {
     state.restored = newVersion.version;
-    emit('restoreVersion', {newVersion});
-}
-
+    emit("restoreVersion", { newVersion });
+};
 </script>
 
 <template>
@@ -59,9 +67,6 @@ const onRestored = ({newVersion}: {newVersion: StoredObjectVersionWithPointInTim
     <template v-else>
         <p>Chargement des versions</p>
     </template>
-
 </template>
 
-<style scoped lang="scss">
-
-</style>
+<style scoped lang="scss"></style>

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

@@ -1,11 +1,15 @@
 <script setup lang="ts">
-import {StoredObject, StoredObjectPointInTime, StoredObjectVersionWithPointInTime} from "./../../../types";
+import {
+    StoredObject,
+    StoredObjectPointInTime,
+    StoredObjectVersionWithPointInTime,
+} from "./../../../types";
 import UserRenderBoxBadge from "ChillMainAssets/vuejs/_components/Entity/UserRenderBoxBadge.vue";
-import {ISOToDatetime} from "./../../../../../../ChillMainBundle/Resources/public/chill/js/date";
+import { ISOToDatetime } from "./../../../../../../ChillMainBundle/Resources/public/chill/js/date";
 import FileIcon from "ChillDocStoreAssets/vuejs/FileIcon.vue";
 import RestoreVersionButton from "ChillDocStoreAssets/vuejs/StoredObjectButton/HistoryButton/RestoreVersionButton.vue";
 import DownloadButton from "ChillDocStoreAssets/vuejs/StoredObjectButton/DownloadButton.vue";
-import {computed} from "vue";
+import { computed } from "vue";
 
 interface HistoryButtonListItemConfig {
     version: StoredObjectVersionWithPointInTime;
@@ -15,51 +19,124 @@ interface HistoryButtonListItemConfig {
 }
 
 const emit = defineEmits<{
-    restoreVersion: [newVersion: StoredObjectVersionWithPointInTime]
-}>()
+    restoreVersion: [newVersion: StoredObjectVersionWithPointInTime];
+}>();
 
 const props = defineProps<HistoryButtonListItemConfig>();
 
-const onRestore = ({newVersion}: {newVersion: StoredObjectVersionWithPointInTime}) => {
-    emit('restoreVersion', {newVersion});
-}
+const onRestore = ({
+    newVersion,
+}: {
+    newVersion: StoredObjectVersionWithPointInTime;
+}) => {
+    emit("restoreVersion", { newVersion });
+};
 
-const isKeptBeforeConversion = computed<boolean>(() => props.version["point-in-times"].reduce(
-    (accumulator: boolean, pit: StoredObjectPointInTime) => accumulator || "keep-before-conversion" === pit.reason,
-    false
+const isKeptBeforeConversion = computed<boolean>(() =>
+    props.version["point-in-times"].reduce(
+        (accumulator: boolean, pit: StoredObjectPointInTime) =>
+            accumulator || "keep-before-conversion" === pit.reason,
+        false,
     ),
 );
 
-const isRestored = computed<boolean>(() => props.version.version > 0 && null !== props.version["from-restored"]);
+const isRestored = computed<boolean>(
+    () => props.version.version > 0 && null !== props.version["from-restored"],
+);
 
-const isDuplicated = computed<boolean>(() => props.version.version === 0 && null !== props.version["from-restored"]);
-
-const classes = computed<{row: true, 'row-hover': true, 'blinking-1': boolean, 'blinking-2': boolean}>(() => ({row: true, 'row-hover': true, 'blinking-1': props.isRestored && 0 === props.version.version % 2, 'blinking-2': props.isRestored && 1 === props.version.version % 2}));
+const isDuplicated = computed<boolean>(
+    () =>
+        props.version.version === 0 && null !== props.version["from-restored"],
+);
 
+const classes = computed<{
+    row: true;
+    "row-hover": true;
+    "blinking-1": boolean;
+    "blinking-2": boolean;
+}>(() => ({
+    row: true,
+    "row-hover": true,
+    "blinking-1": props.isRestored && 0 === props.version.version % 2,
+    "blinking-2": props.isRestored && 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 :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>#{{ version.version + 1 }}</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>
-    <div class="col-12">
-        <file-icon :type="version.type"></file-icon> <span><strong>#{{ version.version + 1 }}</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">

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

@@ -1,8 +1,11 @@
 <script setup lang="ts">
 import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
-import {reactive} from "vue";
+import { reactive } from "vue";
 import HistoryButtonList from "ChillDocStoreAssets/vuejs/StoredObjectButton/HistoryButton/HistoryButtonList.vue";
-import {StoredObject, StoredObjectVersionWithPointInTime} from "./../../../types";
+import {
+    StoredObject,
+    StoredObjectVersionWithPointInTime,
+} from "./../../../types";
 
 interface HistoryButtonListConfig {
     versions: StoredObjectVersionWithPointInTime[];
@@ -11,22 +14,21 @@ interface HistoryButtonListConfig {
 }
 
 const emit = defineEmits<{
-    restoreVersion: [newVersion: StoredObjectVersionWithPointInTime]
-}>()
+    restoreVersion: [newVersion: StoredObjectVersionWithPointInTime];
+}>();
 
 interface HistoryButtonModalState {
     opened: boolean;
 }
 
 const props = defineProps<HistoryButtonListConfig>();
-const state = reactive<HistoryButtonModalState>({opened: false});
+const state = reactive<HistoryButtonModalState>({ opened: false });
 
 const open = () => {
     state.opened = true;
-}
-
-defineExpose({open});
+};
 
+defineExpose({ open });
 </script>
 <template>
     <Teleport to="body">
@@ -36,12 +38,17 @@ defineExpose({open});
             </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="(payload) => emit('restoreVersion', payload)"></history-button-list>
+                <history-button-list
+                    :versions="props.versions"
+                    :can-edit="canEdit"
+                    :stored-object="storedObject"
+                    @restore-version="
+                        (payload) => emit('restoreVersion', payload)
+                    "
+                ></history-button-list>
             </template>
         </modal>
     </Teleport>
 </template>
 
-<style scoped lang="scss">
-
-</style>
+<style scoped lang="scss"></style>

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

@@ -1,17 +1,20 @@
 <script setup lang="ts">
-import {StoredObjectVersionPersisted, StoredObjectVersionWithPointInTime} from "../../../types";
-import {useToast} from "vue-toast-notification";
-import {restore_version} from "./api";
+import {
+    StoredObjectVersionPersisted,
+    StoredObjectVersionWithPointInTime,
+} from "../../../types";
+import { useToast } from "vue-toast-notification";
+import { restore_version } from "./api";
 
 interface RestoreVersionButtonProps {
-    storedObjectVersion: StoredObjectVersionPersisted,
+    storedObjectVersion: StoredObjectVersionPersisted;
 }
 
 const emit = defineEmits<{
-    restoreVersion: [newVersion: StoredObjectVersionWithPointInTime]
-}>()
+    restoreVersion: [newVersion: StoredObjectVersionWithPointInTime];
+}>();
 
-const props = defineProps<RestoreVersionButtonProps>()
+const props = defineProps<RestoreVersionButtonProps>();
 
 const $toast = useToast();
 
@@ -19,14 +22,18 @@ 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>
+    <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>
+<style scoped lang="scss"></style>

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

@@ -1,20 +1,29 @@
 <template>
-  <a :class="Object.assign(props.classes, {'btn': true})" @click="beforeLeave($event)" :href="build_wopi_editor_link(props.storedObject.uuid, props.returnPath)">
-    <i class="fa fa-paragraph"></i>
-    Editer en ligne
-  </a>
+    <a
+        :class="Object.assign(props.classes, { btn: true })"
+        @click="beforeLeave($event)"
+        :href="
+            build_wopi_editor_link(props.storedObject.uuid, props.returnPath)
+        "
+    >
+        <i class="fa fa-paragraph"></i>
+        Editer en ligne
+    </a>
 </template>
 
 <script lang="ts" setup>
 import WopiEditButton from "./WopiEditButton.vue";
-import {build_wopi_editor_link} from "./helpers";
-import {StoredObject, WopiEditButtonExecutableBeforeLeaveFunction} from "../../types";
+import { build_wopi_editor_link } from "./helpers";
+import {
+    StoredObject,
+    WopiEditButtonExecutableBeforeLeaveFunction,
+} from "../../types";
 
 interface WopiEditButtonConfig {
-  storedObject: StoredObject,
-  returnPath?: string,
-  classes: {[k: string] : boolean},
-  executeBeforeLeave?: WopiEditButtonExecutableBeforeLeaveFunction,
+    storedObject: StoredObject;
+    returnPath?: string;
+    classes: Record<string, boolean>;
+    executeBeforeLeave?: WopiEditButtonExecutableBeforeLeaveFunction;
 }
 
 const props = defineProps<WopiEditButtonConfig>();
@@ -22,25 +31,24 @@ const props = defineProps<WopiEditButtonConfig>();
 let executed = false;
 
 async function beforeLeave(event: Event): Promise<true> {
-  if (props.executeBeforeLeave === undefined || executed === true) {
+    if (props.executeBeforeLeave === undefined || executed === true) {
+        return Promise.resolve(true);
+    }
+
+    event.preventDefault();
+
+    await props.executeBeforeLeave();
+    executed = true;
+
+    const link = event.target as HTMLAnchorElement;
+    link.click();
+
     return Promise.resolve(true);
-  }
-
-  event.preventDefault();
-
-  await props.executeBeforeLeave();
-  executed = true;
-
-  const link = event.target as HTMLAnchorElement;
-  link.click();
-
-  return Promise.resolve(true);
 }
 </script>
 
 <style scoped lang="scss">
 i.fa::before {
-   color: var(--bs-dropdown-link-hover-color);
+    color: var(--bs-dropdown-link-hover-color);
 }
 </style>
-