Ajout de commentaires supplémentaires aux motifs

src/Bundle/ChillMainBundle/Resources/public/vuejs/SavedExportButtons/App.vue

@@ -2,17 +2,15 @@
 import GenerateButton from "ChillMainAssets/vuejs/SavedExportButtons/Component/GenerateButton.vue";
 
 interface SavedExportButtonsConfig {
-    savedExportUuid: string;
-    savedExportAlias: string;
+  savedExportUuid: string;
+  savedExportAlias: string;
 }
 
 const props = defineProps<SavedExportButtonsConfig>();
 </script>
 
 <template>
-    <generate-button
-        :saved-export-uuid="props.savedExportUuid"
-    ></generate-button>
+  <generate-button :saved-export-uuid="props.savedExportUuid"></generate-button>
 </template>
 
 <style scoped lang="scss"></style>

src/Bundle/ChillMainBundle/Resources/public/vuejs/SavedExportButtons/Component/GenerateButton.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
 import {
-    trans,
-    SAVED_EXPORT_EXECUTE,
-    EXPORT_GENERATION_EXPORT_GENERATION_IS_PENDING_SHORT,
-    EXPORT_GENERATION_TOO_MANY_RETRIES,
-    EXPORT_GENERATION_ERROR_WHILE_GENERATING_EXPORT,
-    EXPORT_GENERATION_EXPORT_READY,
+  trans,
+  SAVED_EXPORT_EXECUTE,
+  EXPORT_GENERATION_EXPORT_GENERATION_IS_PENDING_SHORT,
+  EXPORT_GENERATION_TOO_MANY_RETRIES,
+  EXPORT_GENERATION_ERROR_WHILE_GENERATING_EXPORT,
+  EXPORT_GENERATION_EXPORT_READY,
 } from "translator";
 import {
-    fetchExportGenerationStatus,
-    generateFromSavedExport,
+  fetchExportGenerationStatus,
+  generateFromSavedExport,
 } from "ChillMainAssets/lib/api/export";
 import { computed, ref } from "vue";
 import { ExportGeneration } from "ChillMainAssets/types";
@@ -19,50 +19,50 @@ import { useToast } from "vue-toast-notification";
 import "vue-toast-notification/dist/theme-sugar.css";
 
 interface SavedExportButtonGenerateConfig {
-    savedExportUuid: string;
+  savedExportUuid: string;
 }
 
 const props = defineProps<SavedExportButtonGenerateConfig>();
 const emits = defineEmits<{
-    (e: "generate");
+  (e: "generate");
 }>();
 
 const toast = useToast();
 const exportGeneration = ref<ExportGeneration | null>(null);
 
 const status = computed<StoredObjectStatus | "inactive">(
-    () => exportGeneration.value?.status ?? "inactive",
+  () => exportGeneration.value?.status ?? "inactive",
 );
 const storedObject = computed<null | StoredObject>(() => {
-    if (exportGeneration.value === null) {
-        return null;
-    }
+  if (exportGeneration.value === null) {
+    return null;
+  }
 
-    return exportGeneration.value?.storedObject;
+  return exportGeneration.value?.storedObject;
 });
 
 const isInactive = computed<boolean>(() => status.value === "inactive");
 const isPending = computed<boolean>(() => status.value === "pending");
 const isFetching = computed<boolean>(
-    () => tryiesForReady.value < maxTryiesForReady,
+  () => tryiesForReady.value < maxTryiesForReady,
 );
 const isReady = computed<boolean>(() => status.value === "ready");
 const isFailure = computed<boolean>(() => status.value === "failure");
 const filename = computed<string>(() => {
-    if (null === exportGeneration.value) {
-        return "";
-    }
+  if (null === exportGeneration.value) {
+    return "";
+  }
 
-    return `${exportGeneration.value?.storedObject.title}-${exportGeneration.value?.createdAt?.datetime8601}`;
+  return `${exportGeneration.value?.storedObject.title}-${exportGeneration.value?.createdAt?.datetime8601}`;
 });
 const externalDownloadLink = computed<string>(
-    () => `/fr/main/export-generation/${exportGeneration.value?.id}/wait`,
+  () => `/fr/main/export-generation/${exportGeneration.value?.id}/wait`,
 );
 const classes = computed<Record<string, boolean>>(() => {
-    return {};
+  return {};
 });
 const buttonClasses = computed<Record<string, boolean>>(() => {
-    return { btn: true, "btn-outline-primary": true };
+  return { btn: true, "btn-outline-primary": true };
 });
 
 /**
@@ -76,111 +76,109 @@ let tryiesForReady = ref<number>(0);
 const maxTryiesForReady = 120;
 
 const checkForReady = function (): void {
-    if (
-        "ready" === status.value ||
-        "empty" === status.value ||
-        "failure" === status.value ||
-        // stop reloading if the page stays opened for a long time
-        tryiesForReady.value > maxTryiesForReady
-    ) {
-        return;
-    }
+  if (
+    "ready" === status.value ||
+    "empty" === status.value ||
+    "failure" === status.value ||
+    // stop reloading if the page stays opened for a long time
+    tryiesForReady.value > maxTryiesForReady
+  ) {
+    return;
+  }
 
-    tryiesForReady.value = tryiesForReady.value + 1;
-    setTimeout(
-        onObjectNewStatusCallback,
-        tryiesForReady.value < 10 ? 1500 : 5000,
-    );
+  tryiesForReady.value = tryiesForReady.value + 1;
+  setTimeout(
+    onObjectNewStatusCallback,
+    tryiesForReady.value < 10 ? 1500 : 5000,
+  );
 };
 
 const onExportGenerationSuccess = function (): void {
-    toast.success(trans(EXPORT_GENERATION_EXPORT_READY));
+  toast.success(trans(EXPORT_GENERATION_EXPORT_READY));
 };
 
 const onObjectNewStatusCallback = async function (): Promise<void> {
-    if (null === exportGeneration.value) {
-        checkForReady();
-        return Promise.resolve();
-    }
-
-    const newExportGeneration = await fetchExportGenerationStatus(
-        exportGeneration.value?.id,
-    );
-
-    if (newExportGeneration.status !== exportGeneration.value.status) {
-        if (newExportGeneration.status === "ready") {
-            onExportGenerationSuccess();
-        }
-    }
-
-    exportGeneration.value = newExportGeneration;
-
-    if (isPending.value) {
-        checkForReady();
-        return Promise.resolve();
-    }
-
+  if (null === exportGeneration.value) {
+    checkForReady();
     return Promise.resolve();
+  }
+
+  const newExportGeneration = await fetchExportGenerationStatus(
+    exportGeneration.value?.id,
+  );
+
+  if (newExportGeneration.status !== exportGeneration.value.status) {
+    if (newExportGeneration.status === "ready") {
+      onExportGenerationSuccess();
+    }
+  }
+
+  exportGeneration.value = newExportGeneration;
+
+  if (isPending.value) {
+    checkForReady();
+    return Promise.resolve();
+  }
+
+  return Promise.resolve();
 };
 
 const onClickGenerate = async (): Promise<void> => {
-    emits("generate");
-    exportGeneration.value = await generateFromSavedExport(
-        props.savedExportUuid,
-    );
+  emits("generate");
+  exportGeneration.value = await generateFromSavedExport(props.savedExportUuid);
 
-    onObjectNewStatusCallback();
+  onObjectNewStatusCallback();
 
-    return Promise.resolve();
+  return Promise.resolve();
 };
 </script>
 
 <template>
-    <button
-        v-if="isInactive"
-        :class="buttonClasses"
-        type="button"
-        @click="onClickGenerate"
-    >
-        <i class="fa fa-cog"></i> {{ trans(SAVED_EXPORT_EXECUTE) }}
-    </button>
-    <template v-if="isPending && isFetching">
-        <span class="btn">
-            <i class="fa fa-cog fa-spin fa-fw"></i>
-            <span class="pending-message">{{
-                trans(EXPORT_GENERATION_EXPORT_GENERATION_IS_PENDING_SHORT)
-            }}</span>
-            <a :href="externalDownloadLink" class="externalDownloadLink">
-                <i class="bi bi-box-arrow-up-right"></i>
-            </a>
-        </span>
-    </template>
-    <div v-if="isPending && !isFetching" :class="buttonClasses">
-        <span>{{ trans(EXPORT_GENERATION_TOO_MANY_RETRIES) }}</span>
-    </div>
-    <download-button
-        v-else-if="isReady && storedObject?.currentVersion !== null"
-        :classes="buttonClasses"
-        :stored-object="storedObject"
-        :at-version="storedObject?.currentVersion"
-        :filename="filename"
-    ></download-button>
-    <div v-else-if="isFailure" :class="classes">
-        <span class="btn">
-            <i class="bi bi-exclamation-triangle"></i>
-            <span class="pending-message">{{
-                trans(EXPORT_GENERATION_ERROR_WHILE_GENERATING_EXPORT)
-            }}</span>
-        </span>
-    </div>
+  <button
+    v-if="isInactive"
+    :class="buttonClasses"
+    type="button"
+    @click="onClickGenerate"
+  >
+    <i class="fa fa-cog"></i> {{ trans(SAVED_EXPORT_EXECUTE) }}
+  </button>
+  <template v-if="isPending && isFetching">
+    <span class="btn">
+      <i class="fa fa-cog fa-spin fa-fw"></i>
+      <span class="pending-message">{{
+        trans(EXPORT_GENERATION_EXPORT_GENERATION_IS_PENDING_SHORT)
+      }}</span>
+      <a :href="externalDownloadLink" class="externalDownloadLink">
+        <i class="bi bi-box-arrow-up-right"></i>
+      </a>
+    </span>
+  </template>
+  <div v-if="isPending && !isFetching" :class="buttonClasses">
+    <span>{{ trans(EXPORT_GENERATION_TOO_MANY_RETRIES) }}</span>
+  </div>
+  <download-button
+    v-else-if="isReady && storedObject?.currentVersion !== null"
+    :classes="buttonClasses"
+    :stored-object="storedObject"
+    :at-version="storedObject?.currentVersion"
+    :filename="filename"
+  ></download-button>
+  <div v-else-if="isFailure" :class="classes">
+    <span class="btn">
+      <i class="bi bi-exclamation-triangle"></i>
+      <span class="pending-message">{{
+        trans(EXPORT_GENERATION_ERROR_WHILE_GENERATING_EXPORT)
+      }}</span>
+    </span>
+  </div>
 </template>
 
 <style scoped lang="scss">
 .pending-message {
-    font-style: italic;
+  font-style: italic;
 }
 
 .externalDownloadLink {
-    margin-left: 1rem;
+  margin-left: 1rem;
 }
 </style>

src/Bundle/ChillMainBundle/Resources/public/vuejs/SavedExportButtons/index.ts

@@ -3,11 +3,11 @@ import { createApp } from "vue";
 import App from "./App.vue";
 
 const buttons = document.querySelectorAll<HTMLDivElement>(
-    "[data-generate-export-button]",
+  "[data-generate-export-button]",
 );
 
 buttons.forEach((button) => {
-    const savedExportUuid = button.dataset.savedExportUuid as string;
+  const savedExportUuid = button.dataset.savedExportUuid as string;
 
-    createApp(App, { savedExportUuid, savedExportAlias: "" }).mount(button);
+  createApp(App, { savedExportUuid, savedExportAlias: "" }).mount(button);
 });