From ea19b0851fadff1ff09c7199b6dbd03d3fcc1989 Mon Sep 17 00:00:00 2001
From: Thierry Goettelmann <thierry@byscripts.info>
Date: Mon, 15 Jan 2024 11:12:53 +0100
Subject: [PATCH] feat(lite): upgrade deps + root eslint config (#7292)

---
 .eslintrc.js                                  |   35 +-
 .gitignore                                    |    1 +
 @xen-orchestra/lite/.eslintrc.cjs             |   29 -
 @xen-orchestra/lite/.prettierrc.cjs           |    4 -
 @xen-orchestra/lite/README.md                 |   38 +-
 @xen-orchestra/lite/docs/component-stories.md |   82 +-
 @xen-orchestra/lite/docs/modals.md            |   22 +-
 .../lite/docs/xen-api-collections.md          |   60 +-
 @xen-orchestra/lite/env.d.ts                  |    4 +-
 @xen-orchestra/lite/package.json              |   45 +-
 @xen-orchestra/lite/postcss.config.js         |    6 -
 @xen-orchestra/lite/postcss.config.mjs        |    6 +
 @xen-orchestra/lite/scripts/release.mjs       |  275 ++--
 @xen-orchestra/lite/src/App.vue               |   82 +-
 @xen-orchestra/lite/src/assets/base.css       |   19 +-
 @xen-orchestra/lite/src/assets/theme.css      |   20 +-
 .../lite/src/components/AccountButton.vue     |   48 +-
 .../lite/src/components/AppHeader.vue         |   41 +-
 .../lite/src/components/AppLogin.vue          |   99 +-
 .../lite/src/components/AppMarkdown.vue       |   31 +-
 .../lite/src/components/AppNavigation.vue     |   39 +-
 .../lite/src/components/AppTooltip.vue        |   60 +-
 .../lite/src/components/AppTooltips.vue       |   17 +-
 .../lite/src/components/CodeHighlight.vue     |   30 +-
 .../lite/src/components/CollectionFilter.vue  |   43 +-
 .../src/components/CollectionFilterRow.vue    |  198 ++-
 .../lite/src/components/CollectionSorter.vue  |   49 +-
 .../lite/src/components/CollectionTable.vue   |   71 +-
 .../lite/src/components/ColumnHeader.vue      |    8 +-
 .../lite/src/components/FormWidget.vue        |   23 +-
 .../lite/src/components/HostPatchesTable.vue  |   36 +-
 .../lite/src/components/LoginError.vue        |   16 +-
 .../lite/src/components/NoDataError.vue       |    2 +-
 .../lite/src/components/NoResult.vue          |    2 +-
 .../lite/src/components/ObjectLink.vue        |   75 +-
 .../src/components/ObjectNotFoundWrapper.vue  |   32 +-
 .../src/components/PageUnderConstruction.vue  |    8 +-
 .../src/components/PoolOverrideWarning.vue    |   24 +-
 .../lite/src/components/PowerStateIcon.vue    |   24 +-
 .../lite/src/components/ProgressCircle.vue    |   24 +-
 .../lite/src/components/RelativeTime.vue      |   18 +-
 .../lite/src/components/RemoteConsole.vue     |  117 +-
 .../lite/src/components/RouterTab.vue         |   16 +-
 .../lite/src/components/TextLogo.vue          |    8 +-
 .../lite/src/components/TitleBar.vue          |    8 +-
 .../lite/src/components/UsageBar.vue          |   39 +-
 .../lite/src/components/charts/LinearChart.md |   14 +-
 .../src/components/charts/LinearChart.vue     |   73 +-
 .../component-story/ComponentStory.vue        |  274 ++--
 .../component-story/StoryEventParams.vue      |   10 +-
 .../component-story/StoryExampleComponent.vue |   46 +-
 .../components/component-story/StoryMenu.vue  |   67 +-
 .../component-story/StoryMenuTree.vue         |   40 +-
 .../component-story/StoryPropParams.vue       |   69 +-
 .../component-story/StorySettingParams.vue    |   22 +-
 .../component-story/StorySlotParams.vue       |   10 +-
 .../component-story/StoryWidget.vue           |   62 +-
 .../lite/src/components/form/FormByteSize.vue |   69 +-
 .../lite/src/components/form/FormCheckbox.vue |   59 +-
 .../lite/src/components/form/FormInput.vue    |   91 +-
 .../src/components/form/FormInputWrapper.vue  |   78 +-
 .../lite/src/components/form/FormJson.vue     |   40 +-
 .../lite/src/components/form/FormNumber.vue   |   65 +-
 .../lite/src/components/form/FormRadio.vue    |    8 +-
 .../lite/src/components/form/FormSection.vue  |   34 +-
 .../lite/src/components/form/FormSelect.vue   |    8 +-
 .../lite/src/components/form/FormTextarea.vue |    8 +-
 .../lite/src/components/form/FormToggle.vue   |    8 +-
 .../lite/src/components/infra/InfraAction.vue |    8 +-
 .../src/components/infra/InfraHostItem.vue    |   75 +-
 .../src/components/infra/InfraHostList.vue    |   16 +-
 .../src/components/infra/InfraItemLabel.vue   |   30 +-
 .../src/components/infra/InfraLoadingItem.vue |    8 +-
 .../src/components/infra/InfraPoolList.vue    |   29 +-
 .../lite/src/components/infra/InfraVmItem.vue |   42 +-
 .../lite/src/components/infra/InfraVmList.vue |   26 +-
 .../lite/src/components/menu/AppMenu.vue      |   84 +-
 .../lite/src/components/menu/MenuItem.vue     |   68 +-
 .../src/components/menu/MenuSeparator.vue     |    6 +-
 .../lite/src/components/menu/MenuTrigger.vue  |   14 +-
 .../components/modals/CodeHighlightModal.vue  |   10 +-
 .../modals/CollectionFilterModal.vue          |   96 +-
 .../modals/CollectionSorterModal.vue          |   42 +-
 .../components/modals/InvalidFieldModal.vue   |   22 +-
 .../src/components/modals/JsonEditorModal.vue |   57 +-
 .../modals/UnreachableHostsModal.vue          |   28 +-
 .../src/components/modals/VmDeleteModal.vue   |   44 +-
 .../modals/VmExportBlockedUrlsModal.vue       |   34 +-
 .../src/components/modals/VmExportModal.vue   |   48 +-
 .../src/components/modals/VmMigrateModal.vue  |   48 +-
 .../lite/src/components/pool/PoolHeader.vue   |   12 +-
 .../lite/src/components/pool/PoolTabBar.vue   |   26 +-
 .../pool/dashboard/PoolDashboardAlarms.vue    |   36 +-
 .../PoolDashboardCpuProvisioning.vue          |   93 +-
 .../pool/dashboard/PoolDashboardCpuUsage.vue  |   46 +-
 .../dashboard/PoolDashboardHostsPatches.vue   |   18 +-
 .../dashboard/PoolDashboardNetworkChart.vue   |  132 +-
 .../pool/dashboard/PoolDashboardRamUsage.vue  |   48 +-
 .../pool/dashboard/PoolDashboardStatus.vue    |   76 +-
 .../dashboard/PoolDashboardStatusItem.vue     |   16 +-
 .../dashboard/PoolDashboardStorageUsage.vue   |   87 +-
 .../pool/dashboard/PoolDashboardTasks.vue     |   12 +-
 .../pool/dashboard/alarm/AlarmRow.vue         |   37 +-
 .../pool/dashboard/cpuUsage/HostsCpuUsage.vue |   52 +-
 .../dashboard/cpuUsage/PoolCpuUsageChart.vue  |  118 +-
 .../pool/dashboard/cpuUsage/VmsCpuUsage.vue   |   58 +-
 .../pool/dashboard/ramUsage/HostsRamUsage.vue |   48 +-
 .../pool/dashboard/ramUsage/PoolRamUsage.vue  |  138 +-
 .../pool/dashboard/ramUsage/VmsRamUsage.vue   |   54 +-
 .../lite/src/components/tasks/TaskRow.vue     |   43 +-
 .../lite/src/components/tasks/TasksTable.vue  |   47 +-
 .../src/components/ui/SizeStatsSummary.vue    |   26 +-
 .../lite/src/components/ui/UiActionButton.vue |   20 +-
 .../lite/src/components/ui/UiBadge.vue        |    8 +-
 .../lite/src/components/ui/UiButton.vue       |   58 +-
 .../lite/src/components/ui/UiButtonGroup.vue  |   35 +-
 .../lite/src/components/ui/UiCard.vue         |   25 +-
 .../src/components/ui/UiCardComingSoon.vue    |   10 +-
 .../lite/src/components/ui/UiCardGroup.vue    |    8 +-
 .../lite/src/components/ui/UiCardSpinner.vue  |    2 +-
 .../lite/src/components/ui/UiCardTitle.vue    |   26 +-
 .../lite/src/components/ui/UiCounter.vue      |    8 +-
 .../lite/src/components/ui/UiFilter.vue       |   10 +-
 .../lite/src/components/ui/UiKeyValueRow.vue  |    2 +-
 .../lite/src/components/ui/UiSpinner.vue      |   29 +-
 .../lite/src/components/ui/UiStatusPanel.vue  |    8 +-
 .../lite/src/components/ui/UiTab.vue          |   22 +-
 .../lite/src/components/ui/UiTabBar.vue       |   10 +-
 .../lite/src/components/ui/UiTable.vue        |   11 +-
 .../lite/src/components/ui/UiTitle.vue        |   14 +-
 .../lite/src/components/ui/icon/UiIcon.vue    |   21 +-
 .../src/components/ui/icon/UiStatusIcon.vue   |   30 +-
 .../ui/modals/ModalApproveButton.vue          |    8 +-
 .../components/ui/modals/ModalCloseIcon.vue   |   23 +-
 .../components/ui/modals/ModalContainer.vue   |   28 +-
 .../ui/modals/ModalDeclineButton.vue          |   10 +-
 .../src/components/ui/modals/ModalList.vue    |   12 +-
 .../components/ui/modals/ModalListItem.vue    |   12 +-
 .../lite/src/components/ui/modals/UiModal.vue |   30 +-
 .../ui/modals/layouts/BasicModalLayout.vue    |    8 +-
 .../ui/modals/layouts/ConfirmModalLayout.vue  |   32 +-
 .../ui/modals/layouts/FormModalLayout.vue     |   28 +-
 .../components/ui/progress/UiProgressBar.vue  |   25 +-
 .../ui/progress/UiProgressLegend.vue          |   20 +-
 .../ui/progress/UiProgressScale.vue           |   12 +-
 .../components/ui/resources/UiResource.vue    |   12 +-
 .../vm/VmActionItems/VmActionCopyItem.vue     |   61 +-
 .../vm/VmActionItems/VmActionDeleteItem.vue   |   40 +-
 .../vm/VmActionItems/VmActionExportItem.vue   |   52 +-
 .../vm/VmActionItems/VmActionExportItems.vue  |   48 +-
 .../vm/VmActionItems/VmActionMigrateItem.vue  |   61 +-
 .../VmActionItems/VmActionPowerStateItems.vue |  160 +--
 .../vm/VmActionItems/VmActionSnapshotItem.vue |   54 +-
 .../lite/src/components/vm/VmHeader.vue       |   57 +-
 .../lite/src/components/vm/VmTabBar.vue       |   24 +-
 .../lite/src/components/vm/VmsActionsBar.vue  |   44 +-
 .../array-removed-items-history.composable.md |   34 +-
 .../array-removed-items-history.composable.ts |   36 +-
 .../lite/src/composables/busy.composable.md   |    6 +-
 .../lite/src/composables/busy.composable.ts   |   22 +-
 .../src/composables/chart-theme.composable.ts |  188 ++-
 .../collection-filter.composable.md           |   47 +-
 .../collection-filter.composable.ts           |   56 +-
 .../collection-sorter.composable.md           |   17 +-
 .../collection-sorter.composable.ts           |   80 +-
 .../src/composables/context.composable.md     |   56 +-
 .../src/composables/context.composable.ts     |   45 +-
 .../src/composables/fetch-stats.composable.md |   17 +-
 .../src/composables/fetch-stats.composable.ts |   97 +-
 .../filtered-collection.composable.md         |   15 +-
 .../filtered-collection.composable.ts         |    8 +-
 .../composables/host-patches.composable.ts    |   94 +-
 .../lite/src/composables/modal.composable.ts  |    7 +-
 .../composables/multi-select.composable.md    |    4 +-
 .../composables/multi-select.composable.ts    |   30 +-
 .../composables/relative-time.composable.md   |    8 +-
 .../composables/relative-time.composable.ts   |   69 +-
 .../sorted-collection.composable.ts           |    8 +-
 .../src/composables/stat-status.composable.ts |   31 +-
 .../src/composables/subscriber.composable.ts  |   48 +-
 .../unreachable-hosts.composable.ts           |   47 +-
 .../composables/vm-migration.composable.ts    |   77 +-
 .../xen-api-store-base-context.composable.ts  |   77 +-
 ...i-store-subscribable-context.composable.ts |   24 +-
 .../xen-api-store-subscriber.composable.ts    |   96 +-
 @xen-orchestra/lite/src/context.ts            |   12 +-
 .../lite/src/directives/tooltip.directive.md  |   18 +-
 .../lite/src/directives/tooltip.directive.ts  |   54 +-
 @xen-orchestra/lite/src/i18n.ts               |  130 +-
 @xen-orchestra/lite/src/libs/alarm.ts         |   65 +-
 .../lite/src/libs/complex-matcher.utils.ts    |  164 +--
 @xen-orchestra/lite/src/libs/highlight.ts     |   37 +-
 @xen-orchestra/lite/src/libs/markdown.ts      |   78 +-
 @xen-orchestra/lite/src/libs/mixin.ts         |   31 +-
 .../lite/src/libs/story/story-param.ts        |  352 +++--
 .../lite/src/libs/story/story-widget.ts       |   85 +-
 @xen-orchestra/lite/src/libs/utils.ts         |  122 +-
 @xen-orchestra/lite/src/libs/vm.ts            |   37 +-
 @xen-orchestra/lite/src/libs/xapi-stats.ts    |  376 +++---
 .../lite/src/libs/xen-api/xen-api.enums.ts    |  616 ++++-----
 .../lite/src/libs/xen-api/xen-api.ts          |  381 +++---
 .../lite/src/libs/xen-api/xen-api.types.ts    | 1147 ++++++++---------
 .../lite/src/libs/xen-api/xen-api.utils.ts    |  131 +-
 @xen-orchestra/lite/src/main.ts               |   20 +-
 @xen-orchestra/lite/src/router/index.ts       |   46 +-
 @xen-orchestra/lite/src/router/pool.ts        |   62 +-
 @xen-orchestra/lite/src/router/story.ts       |   60 +-
 @xen-orchestra/lite/src/router/vm.ts          |   56 +-
 .../src/stores/closing-confirmation.store.ts  |   67 +-
 @xen-orchestra/lite/src/stores/modal.store.ts |   69 +-
 .../lite/src/stores/navigation.store.ts       |   34 +-
 .../lite/src/stores/page-title.store.ts       |   83 +-
 .../lite/src/stores/tooltip.store.ts          |   82 +-
 @xen-orchestra/lite/src/stores/ui.store.ts    |   32 +-
 .../lite/src/stores/xen-api.store.ts          |  119 +-
 .../lite/src/stores/xen-api/alarm.store.ts    |   86 +-
 .../lite/src/stores/xen-api/console.store.ts  |   14 +-
 .../stores/xen-api/create-use-collection.ts   |   93 +-
 .../src/stores/xen-api/host-metrics.store.ts  |   31 +-
 .../lite/src/stores/xen-api/host.store.ts     |   79 +-
 .../lite/src/stores/xen-api/message.store.ts  |   16 +-
 .../lite/src/stores/xen-api/network.store.ts  |   14 +-
 .../lite/src/stores/xen-api/pool.store.ts     |   22 +-
 .../lite/src/stores/xen-api/sr.store.ts       |   14 +-
 .../lite/src/stores/xen-api/task.store.ts     |   74 +-
 .../src/stores/xen-api/vm-metrics.store.ts    |   14 +-
 .../lite/src/stores/xen-api/vm.store.ts       |  124 +-
 .../stories/button/ui-button-group.story.vue  |   10 +-
 .../src/stories/button/ui-button.story.vue    |    8 +-
 .../src/stories/form/form-byte-size.story.vue |   10 +-
 .../stories/form/form-input-group.story.vue   |   14 +-
 .../stories/form/form-input-wrapper.story.vue |   12 +-
 .../src/stories/form/form-input.story.vue     |   19 +-
 .../src/stories/form/form-section.story.vue   |   10 +-
 .../lite/src/stories/linear-chart.story.md    |   10 +-
 .../lite/src/stories/linear-chart.story.vue   |   46 +-
 .../layouts/basic-modal-layout.story.vue      |   15 +-
 .../layouts/confirm-modal-layout.story.vue    |   10 +-
 .../layouts/form-modal-layout.story.vue       |   31 +-
 .../stories/modals/modal-container.story.vue  |   32 +-
 .../src/stories/power-state-icon.story.vue    |   10 +-
 .../src/stories/progress-circle.story.vue     |   23 +-
 .../lite/src/stories/story-example.story.vue  |   80 +-
 .../src/stories/tab-bar/router-tab.story.vue  |   10 +-
 .../src/stories/tab-bar/ui-tab-bar.story.vue  |   13 +-
 .../lite/src/stories/tab-bar/ui-tab.story.vue |   10 +-
 .../lite/src/stories/ui-badge.story.vue       |    8 +-
 .../lite/src/stories/ui-filter.story.vue      |   15 +-
 .../ui-resources/ui-resource.story.vue        |   28 +-
 .../ui-resources/ui-resources.story.vue       |   21 +-
 @xen-orchestra/lite/src/types/chart.ts        |   12 +-
 .../lite/src/types/complex-matcher.d.ts       |   98 +-
 .../src/types/decorator-synchronized.d.ts     |    4 +-
 @xen-orchestra/lite/src/types/filter.ts       |   76 +-
 @xen-orchestra/lite/src/types/index.ts        |   16 +-
 .../lite/src/types/injection-keys.ts          |   62 +-
 .../lite/src/types/iterable-backoff.d.ts      |    2 +-
 .../types/limit-concurrency-decorator.d.ts    |    4 +-
 @xen-orchestra/lite/src/types/novnc.d.ts      |  168 ++-
 @xen-orchestra/lite/src/types/router.d.ts     |   12 +-
 @xen-orchestra/lite/src/types/sort.ts         |   22 +-
 @xen-orchestra/lite/src/types/stat.ts         |   10 +-
 @xen-orchestra/lite/src/types/stories.d.ts    |    8 +-
 @xen-orchestra/lite/src/types/xen-api.ts      |   60 +-
 @xen-orchestra/lite/src/views/HomeView.vue    |   16 +-
 .../lite/src/views/ObjectNotFoundView.vue     |   22 +-
 .../lite/src/views/PageNotFoundView.vue       |   18 +-
 @xen-orchestra/lite/src/views/StoryView.vue   |   20 +-
 .../lite/src/views/host/HostDashboardView.vue |    8 +-
 .../lite/src/views/host/HostRootView.vue      |   30 +-
 .../lite/src/views/pool/PoolAlarmsView.vue    |    8 +-
 .../lite/src/views/pool/PoolDashboardView.vue |  115 +-
 .../lite/src/views/pool/PoolHostsView.vue     |    8 +-
 .../lite/src/views/pool/PoolNetworkView.vue   |    8 +-
 .../lite/src/views/pool/PoolRootView.vue      |   12 +-
 .../lite/src/views/pool/PoolStatsView.vue     |    8 +-
 .../lite/src/views/pool/PoolStorageView.vue   |    8 +-
 .../lite/src/views/pool/PoolSystemView.vue    |    8 +-
 .../lite/src/views/pool/PoolTasksView.vue     |   28 +-
 .../lite/src/views/pool/PoolVmsView.vue       |   72 +-
 .../lite/src/views/settings/SettingsView.vue  |  171 +--
 .../lite/src/views/story/HomeView.vue         |  191 ++-
 .../lite/src/views/vm/VmAlarmsView.vue        |    8 +-
 .../lite/src/views/vm/VmConsoleView.vue       |  121 +-
 .../lite/src/views/vm/VmDashboardView.vue     |    8 +-
 .../lite/src/views/vm/VmNetworkView.vue       |    8 +-
 .../lite/src/views/vm/VmRootView.vue          |   32 +-
 .../lite/src/views/vm/VmStatsView.vue         |    8 +-
 .../lite/src/views/vm/VmStorageView.vue       |    8 +-
 .../lite/src/views/vm/VmSystemView.vue        |    8 +-
 .../lite/src/views/vm/VmTasksView.vue         |    8 +-
 .../src/views/xoa-deploy/XoaDeployView.vue    |  479 +++----
 @xen-orchestra/lite/tsconfig.app.json         |   13 +
 @xen-orchestra/lite/tsconfig.config.json      |    8 -
 @xen-orchestra/lite/tsconfig.json             |   17 +-
 @xen-orchestra/lite/tsconfig.node.json        |   11 +
 @xen-orchestra/lite/tsconfig.type-check.json  |    4 +
 @xen-orchestra/lite/vite.config.ts            |   54 +-
 package.json                                  |   11 +-
 scripts/.eslintrc.js                          |   10 -
 yarn.lock                                     |  727 +++++++----
 301 files changed, 7351 insertions(+), 8798 deletions(-)
 delete mode 100644 @xen-orchestra/lite/.eslintrc.cjs
 delete mode 100644 @xen-orchestra/lite/.prettierrc.cjs
 delete mode 100644 @xen-orchestra/lite/postcss.config.js
 create mode 100644 @xen-orchestra/lite/postcss.config.mjs
 mode change 100644 => 100755 @xen-orchestra/lite/scripts/release.mjs
 create mode 100644 @xen-orchestra/lite/tsconfig.app.json
 delete mode 100644 @xen-orchestra/lite/tsconfig.config.json
 create mode 100644 @xen-orchestra/lite/tsconfig.node.json
 create mode 100644 @xen-orchestra/lite/tsconfig.type-check.json
 delete mode 100644 scripts/.eslintrc.js

diff --git a/.eslintrc.js b/.eslintrc.js
index 0e4b2703522..76e4110bd62 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -15,9 +15,10 @@ module.exports = {
 
   overrides: [
     {
-      files: ['cli.{,c,m}js', '*-cli.{,c,m}js', '**/*cli*/**/*.{,c,m}js'],
+      files: ['cli.{,c,m}js', '*-cli.{,c,m}js', '**/*cli*/**/*.{,c,m}js', '**/scripts/**.{,c,m}js'],
       rules: {
         'n/no-process-exit': 'off',
+        'n/shebang': 'off',
         'no-console': 'off',
       },
     },
@@ -46,6 +47,38 @@ module.exports = {
         ],
       },
     },
+    {
+      files: ['@xen-orchestra/lite/**/*.{vue,ts}'],
+      parserOptions: {
+        sourceType: 'module',
+      },
+      plugins: ['import'],
+      extends: [
+        'plugin:import/recommended',
+        'plugin:import/typescript',
+        'plugin:vue/vue3-recommended',
+        '@vue/eslint-config-typescript/recommended',
+        '@vue/eslint-config-prettier',
+      ],
+      settings: {
+        'import/resolver': {
+          typescript: true,
+          'eslint-import-resolver-custom-alias': {
+            alias: {
+              '@': './src',
+            },
+            extensions: ['.ts'],
+            packages: ['@xen-orchestra/lite'],
+          },
+        },
+      },
+      rules: {
+        'no-void': 'off',
+        'n/no-missing-import': 'off', // using 'import' plugin instead to support TS aliases
+        '@typescript-eslint/no-explicit-any': 'off',
+        'vue/require-default-prop': 'off', // https://github.com/vuejs/eslint-plugin-vue/issues/2051
+      },
+    },
   ],
 
   parserOptions: {
diff --git a/.gitignore b/.gitignore
index ffb53b2dff7..158ea337fcc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -30,6 +30,7 @@ pnpm-debug.log.*
 yarn-error.log
 yarn-error.log.*
 .env
+*.tsbuildinfo
 
 # code coverage
 .nyc_output/
diff --git a/@xen-orchestra/lite/.eslintrc.cjs b/@xen-orchestra/lite/.eslintrc.cjs
deleted file mode 100644
index 7f782d90827..00000000000
--- a/@xen-orchestra/lite/.eslintrc.cjs
+++ /dev/null
@@ -1,29 +0,0 @@
-/* eslint-env node */
-require("@rushstack/eslint-patch/modern-module-resolution");
-
-module.exports = {
-  globals: {
-    XO_LITE_GIT_HEAD: true,
-    XO_LITE_VERSION: true,
-  },
-  root: true,
-  env: {
-    node: true,
-  },
-  extends: [
-    "plugin:vue/vue3-essential",
-    "eslint:recommended",
-    "@vue/eslint-config-typescript/recommended",
-    "@vue/eslint-config-prettier",
-  ],
-  plugins: ["@limegrass/import-alias"],
-  ignorePatterns: ["scripts/*.mjs"],
-  rules: {
-    "@typescript-eslint/no-non-null-assertion": "off",
-    "@typescript-eslint/no-explicit-any": "off",
-    "@limegrass/import-alias/import-alias": [
-      "error",
-      { aliasConfigPath: require("path").join(__dirname, "tsconfig.json") },
-    ],
-  },
-};
diff --git a/@xen-orchestra/lite/.prettierrc.cjs b/@xen-orchestra/lite/.prettierrc.cjs
deleted file mode 100644
index 471dd0c365e..00000000000
--- a/@xen-orchestra/lite/.prettierrc.cjs
+++ /dev/null
@@ -1,4 +0,0 @@
-// Keeping this file to prevent applying the global monorepo config for now
-module.exports = {
-  trailingComma: "es5",
-};
diff --git a/@xen-orchestra/lite/README.md b/@xen-orchestra/lite/README.md
index 4afe3129600..b6915250079 100644
--- a/@xen-orchestra/lite/README.md
+++ b/@xen-orchestra/lite/README.md
@@ -48,18 +48,16 @@ Note: When reading Vue official doc, don't forget to set "API Preference" toggle
 
 ```vue
 <script lang="ts" setup>
-import { computed, ref } from "vue";
+import { computed, ref } from 'vue'
 
 const props = defineProps<{
-  greetings: string;
-}>();
+  greetings: string
+}>()
 
-const firstName = ref("");
-const lastName = ref("");
+const firstName = ref('')
+const lastName = ref('')
 
-const fullName = computed(
-  () => `${props.greetings} ${firstName.value} ${lastName.value}`
-);
+const fullName = computed(() => `${props.greetings} ${firstName.value} ${lastName.value}`)
 </script>
 ```
 
@@ -73,9 +71,9 @@ Vue variables can be interpolated with `v-bind`.
 
 ```vue
 <script lang="ts" setup>
-import { ref } from "vue";
+import { ref } from 'vue'
 
-const fontSize = ref("2rem");
+const fontSize = ref('2rem')
 </script>
 
 <style scoped>
@@ -105,8 +103,8 @@ Use the `busy` prop to display a loader icon.
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { faDisplay } from "@fortawesome/free-solid-svg-icons";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { faDisplay } from '@fortawesome/free-solid-svg-icons'
 </script>
 ```
 
@@ -140,21 +138,21 @@ For a `foobar` store, create a `store/foobar.store.ts` then use `defineStore('fo
 #### Example
 
 ```typescript
-import { computed, ref } from "vue";
+import { computed, ref } from 'vue'
 
-export const useFoobarStore = defineStore("foobar", () => {
-  const aStateVar = ref(0);
-  const otherStateVar = ref(0);
-  const aGetter = computed(() => aStateVar.value * 2);
-  const anAction = () => (otherStateVar.value += 10);
+export const useFoobarStore = defineStore('foobar', () => {
+  const aStateVar = ref(0)
+  const otherStateVar = ref(0)
+  const aGetter = computed(() => aStateVar.value * 2)
+  const anAction = () => (otherStateVar.value += 10)
 
   return {
     aStateVar,
     otherStateVar,
     aGetter,
     anAction,
-  };
-});
+  }
+})
 ```
 
 ### I18n
diff --git a/@xen-orchestra/lite/docs/component-stories.md b/@xen-orchestra/lite/docs/component-stories.md
index 13454194a62..2dd6d3ff0a1 100644
--- a/@xen-orchestra/lite/docs/component-stories.md
+++ b/@xen-orchestra/lite/docs/component-stories.md
@@ -85,9 +85,9 @@ In your `.story.vue` file, import and use the `ComponentStory` component.
 </template>
 
 <script lang="ts" setup>
-import MyComponent from "@/components/MyComponent.vue";
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import { prop, event, model, slot, setting } from "@/libs/story/story-param";
+import MyComponent from '@/components/MyComponent.vue'
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import { prop, event, model, slot, setting } from '@/libs/story/story-param'
 </script>
 ```
 
@@ -119,27 +119,27 @@ Let's take this Vue component:
 <script lang="ts" setup>
 withDefaults(
   defineProps<{
-    imString: string;
-    imNumber: number;
-    imOptional?: string;
-    imOptionalWithDefault?: string;
-    modelValue?: string;
-    customModel?: number;
+    imString: string
+    imNumber: number
+    imOptional?: string
+    imOptionalWithDefault?: string
+    modelValue?: string
+    customModel?: number
   }>(),
-  { imOptionalWithDefault: "Hi World" }
-);
+  { imOptionalWithDefault: 'Hi World' }
+)
 
 const emit = defineEmits<{
-  (event: "click"): void;
-  (event: "clickWithArg", id: string): void;
-  (event: "update:modelValue", value: string): void;
-  (event: "update:customModel", value: number): void;
-}>();
+  (event: 'click'): void
+  (event: 'clickWithArg', id: string): void
+  (event: 'update:modelValue', value: string): void
+  (event: 'update:customModel', value: number): void
+}>()
 
-const moonDistance = 384400;
+const moonDistance = 384400
 
-const handleClick = () => emit("click");
-const handleClickWithArg = (id: string) => emit("clickWithArg", id);
+const handleClick = () => emit('click')
+const handleClickWithArg = (id: string) => emit('clickWithArg', id)
 </script>
 ```
 
@@ -150,53 +150,33 @@ Here is how to document it with a Component Story:
   <ComponentStory
     v-slot="{ properties, settings }"
     :params="[
-      prop('imString')
-        .str()
-        .required()
-        .preset('Example')
-        .widget()
-        .help('This is a required string prop'),
-      prop('imNumber')
-        .num()
-        .required()
-        .preset(42)
-        .widget()
-        .help('This is a required number prop'),
+      prop('imString').str().required().preset('Example').widget().help('This is a required string prop'),
+      prop('imNumber').num().required().preset(42).widget().help('This is a required number prop'),
       prop('imOptional').str().widget().help('This is an optional string prop'),
-      prop('imOptionalWithDefault')
-        .str()
-        .default('Hi World')
-        .widget()
-        .default('My default value'),
-      model().prop((p) => p.str()),
-      model('customModel').prop((p) => p.num()),
+      prop('imOptionalWithDefault').str().default('Hi World').widget().default('My default value'),
+      model().prop(p => p.str()),
+      model('customModel').prop(p => p.num()),
       event('click').help('Emitted when the user clicks the first button'),
-      event('clickWithArg')
-        .args({ id: 'string' })
-        .help('Emitted when the user clicks the second button'),
+      event('clickWithArg').args({ id: 'string' }).help('Emitted when the user clicks the second button'),
       slot().help('This is the default slot'),
       slot('namedSlot').help('This is a named slot'),
-      slot('namedScopedSlot')
-        .prop('moon-distance', 'number')
-        .help('This is a named slot'),
+      slot('namedScopedSlot').prop('moon-distance', 'number').help('This is a named slot'),
       setting('contentExample').widget(text()).preset('Some content'),
     ]"
   >
     <MyComponent v-bind="properties">
       {{ settings.contentExample }}
       <template #named-slot>Named slot content</template>
-      <template #named-scoped-slot="{ moonDistance }">
-        Moon distance is {{ moonDistance }} meters.
-      </template>
+      <template #named-scoped-slot="{ moonDistance }"> Moon distance is {{ moonDistance }} meters. </template>
     </MyComponent>
   </ComponentStory>
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import MyComponent from "@/components/MyComponent.vue";
-import { event, model, prop, setting, slot } from "@/libs/story/story-param";
-import { text } from "@/libs/story/story-widget";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import MyComponent from '@/components/MyComponent.vue'
+import { event, model, prop, setting, slot } from '@/libs/story/story-param'
+import { text } from '@/libs/story/story-widget'
 </script>
 ```
 
diff --git a/@xen-orchestra/lite/docs/modals.md b/@xen-orchestra/lite/docs/modals.md
index 6e9b25c7c9a..8ee9fd4fdc2 100644
--- a/@xen-orchestra/lite/docs/modals.md
+++ b/@xen-orchestra/lite/docs/modals.md
@@ -20,45 +20,45 @@ This will return an object with the following methods:
 ### Static modal
 
 ```ts
-useModal(MyModal);
+useModal(MyModal)
 ```
 
 ### Modal with props
 
 ```ts
-useModal(MyModal, { message: "Hello world!" });
+useModal(MyModal, { message: 'Hello world!' })
 ```
 
 ### Handle modal approval
 
 ```ts
-const { onApprove } = useModal(MyModal, { message: "Hello world!" });
+const { onApprove } = useModal(MyModal, { message: 'Hello world!' })
 
-onApprove(() => console.log("Modal approved"));
+onApprove(() => console.log('Modal approved'))
 ```
 
 ### Handle modal approval with payload
 
 ```ts
-const { onApprove } = useModal(MyModal, { message: "Hello world!" });
+const { onApprove } = useModal(MyModal, { message: 'Hello world!' })
 
-onApprove((payload) => console.log("Modal approved with payload", payload));
+onApprove(payload => console.log('Modal approved with payload', payload))
 ```
 
 ### Handle modal decline
 
 ```ts
-const { onDecline } = useModal(MyModal, { message: "Hello world!" });
+const { onDecline } = useModal(MyModal, { message: 'Hello world!' })
 
-onDecline(() => console.log("Modal declined"));
+onDecline(() => console.log('Modal declined'))
 ```
 
 ### Handle modal close
 
 ```ts
-const { onClose } = useModal(MyModal, { message: "Hello world!" });
+const { onClose } = useModal(MyModal, { message: 'Hello world!' })
 
-onClose(() => console.log("Modal closed"));
+onClose(() => console.log('Modal closed'))
 ```
 
 ## Modal controller
@@ -66,7 +66,7 @@ onClose(() => console.log("Modal closed"));
 Inside the modal component, you can inject the modal controller with `inject(IK_MODAL)!`.
 
 ```ts
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 ```
 
 You can then use the following properties and methods on the `modal` object:
diff --git a/@xen-orchestra/lite/docs/xen-api-collections.md b/@xen-orchestra/lite/docs/xen-api-collections.md
index c32fbd654b4..3a32a3a47b8 100644
--- a/@xen-orchestra/lite/docs/xen-api-collections.md
+++ b/@xen-orchestra/lite/docs/xen-api-collections.md
@@ -36,7 +36,7 @@ They are stored in `src/composables/xen-api-collection/*-collection.composable.t
 ```typescript
 // src/composables/xen-api-collection/console-collection.composable.ts
 
-export const useConsoleCollection = () => useXenApiCollection("console");
+export const useConsoleCollection = () => useXenApiCollection('console')
 ```
 
 If you want to allow the user to defer the subscription, you can propagate the options to `useXenApiCollection`.
@@ -44,19 +44,16 @@ If you want to allow the user to defer the subscription, you can propagate the o
 ```typescript
 // console-collection.composable.ts
 
-export const useConsoleCollection = <
-  Immediate extends boolean = true,
->(options?: {
-  immediate?: Immediate;
-}) => useXenApiCollection("console", options);
+export const useConsoleCollection = <Immediate extends boolean = true>(options?: { immediate?: Immediate }) =>
+  useXenApiCollection('console', options)
 ```
 
 ```typescript
 // MyComponent.vue
 
-const collection = useConsoleCollection({ immediate: false });
+const collection = useConsoleCollection({ immediate: false })
 
-setTimeout(() => collection.start(), 10000);
+setTimeout(() => collection.start(), 10000)
 ```
 
 ## Alter the collection
@@ -68,10 +65,10 @@ You can alter the collection by overriding parts of it.
 ```typescript
 // xen-api.ts
 
-export interface XenApiConsole extends XenApiRecord<"console"> {
+export interface XenApiConsole extends XenApiRecord<'console'> {
   // ... existing props
-  someProp: string;
-  someOtherProp: number;
+  someProp: string
+  someOtherProp: number
 }
 ```
 
@@ -79,27 +76,27 @@ export interface XenApiConsole extends XenApiRecord<"console"> {
 // console-collection.composable.ts
 
 export const useConsoleCollection = () => {
-  const collection = useXenApiCollection("console");
+  const collection = useXenApiCollection('console')
 
   const records = computed(() => {
-    return collection.records.value.map((console) => ({
+    return collection.records.value.map(console => ({
       ...console,
-      someProp: "Some value",
+      someProp: 'Some value',
       someOtherProp: 42,
-    }));
-  });
+    }))
+  })
 
   return {
     ...collection,
     records,
-  };
-};
+  }
+}
 ```
 
 ```typescript
-const consoleCollection = useConsoleCollection();
+const consoleCollection = useConsoleCollection()
 
-consoleCollection.getByUuid("...").someProp; // "Some value"
+consoleCollection.getByUuid('...').someProp // "Some value"
 ```
 
 ### Example 2: Adding props to the collection
@@ -108,17 +105,13 @@ consoleCollection.getByUuid("...").someProp; // "Some value"
 // vm-collection.composable.ts
 
 export const useVmCollection = () => {
-  const collection = useXenApiCollection("VM");
+  const collection = useXenApiCollection('VM')
 
   return {
     ...collection,
-    runningVms: computed(() =>
-      collection.records.value.filter(
-        (vm) => vm.power_state === POWER_STATE.RUNNING
-      )
-    ),
-  };
-};
+    runningVms: computed(() => collection.records.value.filter(vm => vm.power_state === POWER_STATE.RUNNING)),
+  }
+}
 ```
 
 ### Example 3, filtering and sorting the collection
@@ -127,18 +120,15 @@ export const useVmCollection = () => {
 // vm-collection.composable.ts
 
 export const useVmCollection = () => {
-  const collection = useXenApiCollection("VM");
+  const collection = useXenApiCollection('VM')
 
   return {
     ...collection,
     records: computed(() =>
       collection.records.value
-        .filter(
-          (vm) =>
-            !vm.is_a_snapshot && !vm.is_a_template && !vm.is_control_domain
-        )
+        .filter(vm => !vm.is_a_snapshot && !vm.is_a_template && !vm.is_control_domain)
         .sort((vm1, vm2) => vm1.name_label.localeCompare(vm2.name_label))
     ),
-  };
-};
+  }
+}
 ```
diff --git a/@xen-orchestra/lite/env.d.ts b/@xen-orchestra/lite/env.d.ts
index bfa49c5a95e..d0ce229c8d4 100644
--- a/@xen-orchestra/lite/env.d.ts
+++ b/@xen-orchestra/lite/env.d.ts
@@ -2,5 +2,5 @@
 /// <reference types="json-rpc-2.0/dist" />
 /// <reference types="vite-plugin-pages/client" />
 
-declare const XO_LITE_VERSION: string;
-declare const XO_LITE_GIT_HEAD: string;
+declare const XO_LITE_VERSION: string
+declare const XO_LITE_GIT_HEAD: string
diff --git a/@xen-orchestra/lite/package.json b/@xen-orchestra/lite/package.json
index dd833718a2f..05f273b67ff 100644
--- a/@xen-orchestra/lite/package.json
+++ b/@xen-orchestra/lite/package.json
@@ -1,43 +1,41 @@
 {
   "name": "@xen-orchestra/lite",
   "version": "0.1.7",
+  "type": "module",
   "scripts": {
     "dev": "GIT_HEAD=$(git rev-parse HEAD) vite",
     "build": "run-p type-check build-only",
     "preview": "vite preview --port 4173",
-    "release": "zx ./scripts/release.mjs",
+    "release": "./scripts/release.mjs",
     "build-only": "yarn release --build",
     "deploy": "yarn release --build --deploy",
     "gh-release": "yarn release --build --tarball --gh-release",
     "test": "yarn run type-check",
-    "type-check": "vue-tsc --noEmit"
+    "type-check": "vue-tsc --build --force tsconfig.type-check.json"
   },
   "devDependencies": {
     "@fontsource/poppins": "^5.0.8",
-    "@fortawesome/fontawesome-svg-core": "^6.4.2",
-    "@fortawesome/free-regular-svg-icons": "^6.4.2",
-    "@fortawesome/free-solid-svg-icons": "^6.4.2",
+    "@fortawesome/fontawesome-svg-core": "^6.5.1",
+    "@fortawesome/free-regular-svg-icons": "^6.5.1",
+    "@fortawesome/free-solid-svg-icons": "^6.5.1",
     "@fortawesome/vue-fontawesome": "^3.0.5",
-    "@intlify/unplugin-vue-i18n": "^1.5.0",
-    "@limegrass/eslint-plugin-import-alias": "^1.1.0",
+    "@intlify/unplugin-vue-i18n": "^2.0.0",
     "@novnc/novnc": "^1.4.0",
-    "@rushstack/eslint-patch": "^1.5.1",
     "@tsconfig/node18": "^18.2.2",
+    "strip-json-comments": "^5.0.1",
     "@types/d3-time-format": "^4.0.3",
     "@types/file-saver": "^2.0.7",
-    "@types/lodash-es": "^4.17.11",
-    "@types/node": "^18.18.9",
-    "@vitejs/plugin-vue": "^4.4.0",
-    "@vue/eslint-config-prettier": "^8.0.0",
-    "@vue/eslint-config-typescript": "^12.0.0",
-    "@vue/tsconfig": "^0.4.0",
-    "@vueuse/core": "^10.5.0",
-    "@vueuse/math": "^10.5.0",
+    "@types/lodash-es": "^4.17.12",
+    "@types/node": "^18.19.5",
+    "@vitejs/plugin-vue": "^5.0.2",
+    "@vue/tsconfig": "^0.5.1",
+    "@vueuse/core": "^10.7.1",
+    "@vueuse/math": "^10.7.1",
+    "@vueuse/shared": "^10.7.1",
     "complex-matcher": "^0.7.1",
     "d3-time-format": "^4.1.0",
     "decorator-synchronized": "^0.6.0",
     "echarts": "^5.4.3",
-    "eslint-plugin-vue": "^9.18.1",
     "file-saver": "^2.0.5",
     "highlight.js": "^11.9.0",
     "human-format": "^1.2.0",
@@ -48,17 +46,18 @@
     "lodash-es": "^4.17.21",
     "make-error": "^1.3.6",
     "marked": "^9.1.5",
+    "minimist": "^1.2.8",
     "npm-run-all": "^4.1.5",
     "pinia": "^2.1.7",
     "placement.js": "^1.0.0-beta.5",
-    "postcss": "^8.4.31",
+    "postcss": "^8.4.33",
     "postcss-custom-media": "^10.0.2",
     "postcss-nested": "^6.0.1",
-    "typescript": "^5.2.2",
-    "vite": "^4.5.0",
-    "vue": "^3.3.8",
-    "vue-echarts": "^6.6.1",
-    "vue-i18n": "^9.6.5",
+    "typescript": "^5.3.3",
+    "vite": "^5.0.11",
+    "vue": "^3.4.7",
+    "vue-echarts": "^6.6.8",
+    "vue-i18n": "^9.9.0",
     "vue-router": "^4.2.5",
     "vue-tsc": "^1.8.22",
     "zx": "^7.2.3"
diff --git a/@xen-orchestra/lite/postcss.config.js b/@xen-orchestra/lite/postcss.config.js
deleted file mode 100644
index 3c3deb086d3..00000000000
--- a/@xen-orchestra/lite/postcss.config.js
+++ /dev/null
@@ -1,6 +0,0 @@
-module.exports = {
-  plugins: {
-    "postcss-nested": {},
-    "postcss-custom-media": {},
-  },
-};
diff --git a/@xen-orchestra/lite/postcss.config.mjs b/@xen-orchestra/lite/postcss.config.mjs
new file mode 100644
index 00000000000..33c01d4e6aa
--- /dev/null
+++ b/@xen-orchestra/lite/postcss.config.mjs
@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    'postcss-nested': {},
+    'postcss-custom-media': {},
+  },
+}
diff --git a/@xen-orchestra/lite/scripts/release.mjs b/@xen-orchestra/lite/scripts/release.mjs
old mode 100644
new mode 100755
index 24334fdd615..4776f4a6b58
--- a/@xen-orchestra/lite/scripts/release.mjs
+++ b/@xen-orchestra/lite/scripts/release.mjs
@@ -1,53 +1,34 @@
-#!/usr/bin/env zx
+#!/usr/bin/env node
 
-import argv from "minimist";
-import { tmpdir } from "os";
+import argv from 'minimist'
+import { tmpdir } from 'os'
+import { fileURLToPath, URL } from 'url'
+import { $, cd, chalk, fs, path, question, within } from 'zx'
 
-$.verbose = false;
+$.verbose = false
 
-const DEPLOY_SERVER = "www-xo.gpn.vates.fr";
+const DEPLOY_SERVER = 'www-xo.gpn.vates.fr'
 
-const { version: pkgVersion } = await fs.readJson("./package.json");
+const { version: pkgVersion } = await fs.readJson('./package.json')
 
 const opts = argv(process.argv, {
-  boolean: ["help", "build", "deploy", "ghRelease", "tarball"],
-  string: [
-    "base",
-    "dist",
-    "ghToken",
-    "tarballDest",
-    "tarballName",
-    "username",
-    "version",
-  ],
+  boolean: ['help', 'build', 'deploy', 'ghRelease', 'tarball'],
+  string: ['base', 'dist', 'ghToken', 'tarballDest', 'tarballName', 'username', 'version'],
   alias: {
-    u: "username",
-    h: "help",
-    "gh-release": "ghRelease",
-    "gh-token": "ghToken",
-    "tarball-dest": "tarballDest",
-    "tarball-name": "tarballName",
+    u: 'username',
+    h: 'help',
+    'gh-release': 'ghRelease',
+    'gh-token': 'ghToken',
+    'tarball-dest': 'tarballDest',
+    'tarball-name': 'tarballName',
   },
   default: {
-    dist: "dist",
+    dist: 'dist',
     version: pkgVersion,
   },
-});
-
-let {
-  base,
-  build,
-  deploy,
-  dist,
-  ghRelease,
-  ghToken,
-  help,
-  tarball,
-  tarballDest,
-  tarballName,
-  username,
-  version,
-} = opts;
+})
+
+let { base, build, deploy, dist, ghRelease, ghToken, help, tarball, tarballDest, tarballName, username, version } = opts
 
 const usage = () => {
   console.log(
@@ -78,172 +59,164 @@ const usage = () => {
       --username|-u <LDAP username>
     ]
 `
-  );
-};
+  )
+}
 
 if (help) {
-  usage();
-  process.exit(0);
+  usage()
+  process.exit(0)
 }
 
-const yes = async (q) =>
-  ["y", "yes"].includes((await question(q + " [y/N] ")).toLowerCase());
+const yes = async q => ['y', 'yes'].includes((await question(q + ' [y/N] ')).toLowerCase())
 
-const no = async (q) => !(await yes(q));
+const no = async q => !(await yes(q))
 
-const step = (s) => console.log(chalk.green.bold(`\n${s}\n`));
+const step = s => console.log(chalk.green.bold(`\n${s}\n`))
 
 const stop = () => {
-  console.log(chalk.yellow("Stopping"));
-  process.exit(0);
-};
+  console.log(chalk.yellow('Stopping'))
+  process.exit(0)
+}
 
-const ghApiCall = async (path, method = "GET", data) => {
+const ghApiCall = async (path, method = 'GET', data) => {
   const opts = {
     method,
     headers: {
-      Accept: "application/vnd.github+json",
+      Accept: 'application/vnd.github+json',
       Authorization: `Bearer ${ghToken}`,
-      "X-GitHub-Api-Version": "2022-11-28",
+      'X-GitHub-Api-Version': '2022-11-28',
     },
-  };
+  }
 
   if (data !== undefined) {
-    opts.body = typeof data === "object" ? JSON.stringify(data) : data;
+    opts.body = typeof data === 'object' ? JSON.stringify(data) : data
   }
 
-  const res = await fetch(
-    "https://api.github.com/repos/vatesfr/xen-orchestra" + path,
-    opts
-  );
+  const res = await fetch('https://api.github.com/repos/vatesfr/xen-orchestra' + path, opts)
 
   if (res.status === 404 || res.status === 422) {
-    return;
+    return
   }
 
   if (!res.ok) {
-    console.log(chalk.red(await res.text()));
-    throw new Error(`GitHub API error: ${res.statusText}`);
+    console.log(chalk.red(await res.text()))
+    throw new Error(`GitHub API error: ${res.statusText}`)
   }
 
   try {
     // Return undefined if response is not JSON
-    return JSON.parse(await res.text());
+    return JSON.parse(await res.text())
   } catch {}
-};
+}
 
 const ghApiUploadReleaseAsset = async (releaseId, assetName, file) => {
   const opts = {
-    method: "POST",
+    method: 'POST',
     body: fs.createReadStream(file),
     headers: {
-      Accept: "application/vnd.github+json",
+      Accept: 'application/vnd.github+json',
       Authorization: `Bearer ${ghToken}`,
-      "Content-Length": (await fs.stat(file)).size,
-      "Content-Type": "application/vnd.cncf.helm.chart.content.v1.tar+gzip",
-      "X-GitHub-Api-Version": "2022-11-28",
+      'Content-Length': (await fs.stat(file)).size,
+      'Content-Type': 'application/vnd.cncf.helm.chart.content.v1.tar+gzip',
+      'X-GitHub-Api-Version': '2022-11-28',
     },
-  };
+  }
 
   const res = await fetch(
     `https://uploads.github.com/repos/vatesfr/xen-orchestra/releases/${releaseId}/assets?name=${encodeURIComponent(
       assetName
     )}`,
     opts
-  );
+  )
 
   if (!res.ok) {
-    console.log(chalk.red(await res.text()));
-    throw new Error(`GitHub API error: ${res.statusText}`);
+    console.log(chalk.red(await res.text()))
+    throw new Error(`GitHub API error: ${res.statusText}`)
   }
 
-  return JSON.parse(await res.text());
-};
+  return JSON.parse(await res.text())
+}
 
 // Validate args and assign defaults -------------------------------------------
 
-const headSha = (await $`git rev-parse HEAD`).stdout.trim();
+const headSha = (await $`git rev-parse HEAD`).stdout.trim()
 
 if (!build && !deploy && !tarball && !ghRelease) {
-  console.log(
-    chalk.yellow(
-      "Nothing to do! Use --build, --deploy, --tarball and/or --gh-release"
-    )
-  );
-  process.exit(0);
+  console.log(chalk.yellow('Nothing to do! Use --build, --deploy, --tarball and/or --gh-release'))
+  process.exit(0)
 }
 
 if (deploy && ghRelease) {
-  throw new Error("--deploy and --gh-release cannot be used together");
+  throw new Error('--deploy and --gh-release cannot be used together')
 }
 
 if (deploy && username === undefined) {
-  throw new Error("--username is required when --deploy is used");
+  throw new Error('--username is required when --deploy is used')
 }
 
 if (ghRelease && ghToken === undefined) {
-  throw new Error("--gh-token is required to upload a release to GitHub");
+  throw new Error('--gh-token is required to upload a release to GitHub')
 }
 
 if (base === undefined) {
-  base = deploy ? "https://lite.xen-orchestra.com/dist/" : "/";
+  base = deploy ? 'https://lite.xen-orchestra.com/dist/' : '/'
 }
 
 if (tarball) {
   if (tarballDest === undefined) {
-    tarballDest = path.join(tmpdir(), `xo-lite-${new Date().toISOString()}`);
+    tarballDest = path.join(tmpdir(), `xo-lite-${new Date().toISOString()}`)
   }
 
   if (tarballName === undefined) {
-    tarballName = `xo-lite-${version}.tar.gz`;
+    tarballName = `xo-lite-${version}.tar.gz`
   }
 }
 
 if (tarballDest !== undefined) {
-  tarballDest = path.resolve(tarballDest);
+  tarballDest = path.resolve(tarballDest)
 }
 
 if (ghRelease && (tarballDest === undefined || tarballName === undefined)) {
   throw new Error(
-    "In order to release to GitHub, either use --tarball to generate the tarball or provide the tarball with --tarball-dest and --tarball-name"
-  );
+    'In order to release to GitHub, either use --tarball to generate the tarball or provide the tarball with --tarball-dest and --tarball-name'
+  )
 }
 
-let tarballPath;
-let tarballExists = false;
+let tarballPath
+let tarballExists = false
 if (tarballDest !== undefined && tarballName !== undefined) {
-  tarballPath = path.join(tarballDest, tarballName);
+  tarballPath = path.join(tarballDest, tarballName)
 
   try {
     if ((await fs.stat(tarballPath)).isFile()) {
-      tarballExists = true;
+      tarballExists = true
     }
   } catch (err) {
-    if (err.code !== "ENOENT") {
-      throw err;
+    if (err.code !== 'ENOENT') {
+      throw err
     }
   }
 }
 
 if (ghRelease && !tarball && !tarballExists) {
-  throw new Error(`No such file ${tarballPath}`);
+  throw new Error(`No such file ${tarballPath}`)
 }
 
 if (tarball && tarballExists) {
   if (await no(`Tarball ${tarballPath} already exists. Overwrite?`)) {
-    stop();
+    stop()
   }
 }
 
-const tag = `xo-lite-v${version}`;
+const tag = `xo-lite-v${version}`
 if (ghRelease) {
-  const remoteTag = await ghApiCall(`/git/ref/tags/${encodeURIComponent(tag)}`);
+  const remoteTag = await ghApiCall(`/git/ref/tags/${encodeURIComponent(tag)}`)
 
   if (remoteTag === undefined) {
     if ((await ghApiCall(`/commits/${headSha}`)) === undefined) {
       throw new Error(
         `Tag ${tag} and commit ${headSha} not found on GitHub. At least one needs to exist to use it as a release target.`
-      );
+      )
     }
 
     if (
@@ -251,7 +224,7 @@ if (ghRelease) {
         `Tag ${tag} not found on GitHub. The GitHub release will be attached to the current commit and the tag will be created automatically when the release is published. Continue?`
       )
     ) {
-      stop();
+      stop()
     }
   } else {
     if (
@@ -260,17 +233,14 @@ if (ghRelease) {
         `Commit SHA of tag ${tag} on GitHub (${remoteTag.object.sha}) is different from current commit SHA (${headSha}). Continue?`
       ))
     ) {
-      stop();
+      stop()
     }
 
     if (
-      !(await $`git tag --points-at HEAD`).stdout
-        .trim()
-        .split("\n")
-        .includes(tag) &&
+      !(await $`git tag --points-at HEAD`).stdout.trim().split('\n').includes(tag) &&
       (await no(`Tag ${tag} not found on current commit. Continue?`))
     ) {
-      stop();
+      stop()
     }
   }
 }
@@ -278,67 +248,62 @@ if (ghRelease) {
 // Build -----------------------------------------------------------------------
 
 if (build) {
-  step("Build");
+  step('Build')
 
-  console.log(`Building XO Lite ${version} into ${dist}`);
+  console.log(`Building XO Lite ${version} into ${dist}`)
 
-  $.verbose = true;
+  $.verbose = true
   await within(async () => {
-    cd("../..");
-    await $`yarn`;
-  });
-  await $`GIT_HEAD=${headSha} vite build --base=${base}`;
-  $.verbose = false;
+    cd('../..')
+    await $`yarn`
+  })
+  await $`GIT_HEAD=${headSha} vite build --base=${base}`
+  $.verbose = false
 }
 
 // License and index.js --------------------------------------------------------
 
 if (ghRelease || deploy) {
-  step("Prepare dist");
+  step('Prepare dist')
 
   if (ghRelease) {
-    console.log(`Adding LICENSE file to ${dist}`);
-
-    await fs.copy(
-      path.join(__dirname, "agpl-3.0.txt"),
-      path.join(dist, "LICENSE")
-    );
+    console.log(`Adding LICENSE file to ${dist}`)
+    await fs.copy(fileURLToPath(new URL('agpl-3.0.txt', import.meta.url)), path.join(dist, 'LICENSE'))
   }
 
   if (deploy) {
-    console.log(`Adding index.js file to ${dist}`);
+    console.log(`Adding index.js file to ${dist}`)
 
     // Concatenate a URL (absolute or relative) and paths
     // e.g.: joinUrl('http://example.com/', 'foo/bar') => 'http://example.com/foo/bar
     // `path.join` isn't made for URLs and deduplicates the slashes in URL
     // schemes (http:// becomes http:/). `.replace()` reverts this.
-    const joinUrl = (...parts) =>
-      path.join(...parts).replace(/^(https?:\/)/, "$1/");
+    const joinUrl = (...parts) => path.join(...parts).replace(/^(https?:\/)/, '$1/')
 
     // Use of document.write is discouraged but seems to work consistently.
     // https://html.spec.whatwg.org/multipage/dynamic-markup-insertion.html#document.write()
     await fs.writeFile(
-      path.join(dist, "index.js"),
+      path.join(dist, 'index.js'),
       `(async () => {
   document.open();
   document.write(
-    await (await fetch("${joinUrl(base, "index.html")}")).text()
+    await (await fetch("${joinUrl(base, 'index.html')}")).text()
   );
   document.close();
 })();
 `
-    );
+    )
   }
 }
 
 // Tarball ---------------------------------------------------------------------
 
 if (tarball) {
-  step("Tarball");
+  step('Tarball')
 
-  console.log(`Generating tarball ${tarballPath}`);
+  console.log(`Generating tarball ${tarballPath}`)
 
-  await fs.mkdirp(tarballDest);
+  await fs.mkdirp(tarballDest)
 
   // The file is called xo-lite-X.Y.Z.tar.gz by default
   // The archive contains the following tree:
@@ -348,17 +313,15 @@ if (tarball) {
   // ├ index.html
   // ├ assets/
   // └ ...
-  await $`tar -c -z -f ${tarballPath} --transform='s|^${dist}|xo-lite-${version}|' ${dist}`;
+  await $`tar -c -z -f ${tarballPath} --transform='s|^${dist}|xo-lite-${version}|' ${dist}`
 }
 
 // Create GitHub release -------------------------------------------------------
 
 if (ghRelease) {
-  step("GitHub release");
+  step('GitHub release')
 
-  let release = (await ghApiCall("/releases")).find(
-    (release) => release.tag_name === tag
-  );
+  let release = (await ghApiCall('/releases')).find(release => release.tag_name === tag)
 
   if (release !== undefined) {
     if (
@@ -368,37 +331,33 @@ if (ghRelease) {
         )}). Skip and proceed with upload?`
       )
     ) {
-      stop();
+      stop()
     }
   } else {
-    release = await ghApiCall("/releases", "POST", {
+    release = await ghApiCall('/releases', 'POST', {
       tag_name: tag,
       target_commitish: headSha,
       name: tag,
       draft: true,
-    });
+    })
 
-    console.log(
-      `Created GitHub release ${tag}: ${chalk.blue(release.html_url)}`
-    );
+    console.log(`Created GitHub release ${tag}: ${chalk.blue(release.html_url)}`)
   }
 
-  console.log(`Uploading tarball ${tarballPath} to GitHub`);
+  console.log(`Uploading tarball ${tarballPath} to GitHub`)
 
-  let asset = release.assets.find((asset) => asset.name === tarballName);
+  let asset = release.assets.find(asset => asset.name === tarballName)
   if (
     asset !== undefined &&
-    (await yes(
-      `An asset called ${tarballName} already exists on that release. Replace it?`
-    ))
+    (await yes(`An asset called ${tarballName} already exists on that release. Replace it?`))
   ) {
-    await ghApiCall(`/releases/assets/${asset.id}`, "DELETE");
-    asset = undefined;
+    await ghApiCall(`/releases/assets/${asset.id}`, 'DELETE')
+    asset = undefined
   }
 
   if (asset === undefined) {
-    console.log("Uploading…");
-    asset = await ghApiUploadReleaseAsset(release.id, tarballName, tarballPath);
+    console.log('Uploading…')
+    asset = await ghApiUploadReleaseAsset(release.id, tarballName, tarballPath)
   }
 
   if (release.draft) {
@@ -406,18 +365,18 @@ if (ghRelease) {
       chalk.yellow(
         'The release is in DRAFT. To make it public, visit the release URL above, edit the release and click on "Publish release".'
       )
-    );
+    )
   }
 }
 
 // Deploy ----------------------------------------------------------------------
 
 if (deploy) {
-  step("Deploy");
+  step('Deploy')
 
-  console.log(`Deploying XO Lite from ${dist} to ${DEPLOY_SERVER}`);
+  console.log(`Deploying XO Lite from ${dist} to ${DEPLOY_SERVER}`)
 
-  await $`rsync -r --delete ${dist}/ ${username}@${DEPLOY_SERVER}:xo-lite`;
+  await $`rsync -r --delete ${dist}/ ${username}@${DEPLOY_SERVER}:xo-lite`
 
   console.log(`
   XO Lite files sent to server
@@ -430,5 +389,5 @@ if (deploy) {
 
   → Then run the following command to move the files to the \`latest\` folder:
   \trsync -r --delete /home/${username}/xo-lite/ /home/xo-lite/public/latest
-  `);
+  `)
 }
diff --git a/@xen-orchestra/lite/src/App.vue b/@xen-orchestra/lite/src/App.vue
index 140f1aecbc6..c81f1f60339 100644
--- a/@xen-orchestra/lite/src/App.vue
+++ b/@xen-orchestra/lite/src/App.vue
@@ -16,75 +16,67 @@
 </template>
 
 <script lang="ts" setup>
-import favicon from "@/assets/favicon.svg";
-import AppHeader from "@/components/AppHeader.vue";
-import AppLogin from "@/components/AppLogin.vue";
-import AppNavigation from "@/components/AppNavigation.vue";
-import AppTooltips from "@/components/AppTooltips.vue";
-import ModalList from "@/components/ui/modals/ModalList.vue";
-import { useChartTheme } from "@/composables/chart-theme.composable";
-import { useUnreachableHosts } from "@/composables/unreachable-hosts.composable";
-import { useUiStore } from "@/stores/ui.store";
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { useActiveElement, useMagicKeys, whenever } from "@vueuse/core";
-import { logicAnd } from "@vueuse/math";
-import { computed } from "vue";
-import { useI18n } from "vue-i18n";
+import favicon from '@/assets/favicon.svg'
+import AppHeader from '@/components/AppHeader.vue'
+import AppLogin from '@/components/AppLogin.vue'
+import AppNavigation from '@/components/AppNavigation.vue'
+import AppTooltips from '@/components/AppTooltips.vue'
+import ModalList from '@/components/ui/modals/ModalList.vue'
+import { useChartTheme } from '@/composables/chart-theme.composable'
+import { useUnreachableHosts } from '@/composables/unreachable-hosts.composable'
+import { useUiStore } from '@/stores/ui.store'
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { useActiveElement, useMagicKeys, whenever } from '@vueuse/core'
+import { logicAnd } from '@vueuse/math'
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
 
-let link = document.querySelector(
-  "link[rel~='icon']"
-) as HTMLLinkElement | null;
+let link = document.querySelector("link[rel~='icon']") as HTMLLinkElement | null
 if (link == null) {
-  link = document.createElement("link");
-  link.rel = "icon";
-  document.getElementsByTagName("head")[0].appendChild(link);
+  link = document.createElement('link')
+  link.rel = 'icon'
+  document.getElementsByTagName('head')[0].appendChild(link)
 }
-link.href = favicon;
+link.href = favicon
 
-const xenApiStore = useXenApiStore();
+const xenApiStore = useXenApiStore()
 
-const { pool } = usePoolCollection();
+const { pool } = usePoolCollection()
 
-useChartTheme();
-const uiStore = useUiStore();
+useChartTheme()
+const uiStore = useUiStore()
 
 if (import.meta.env.DEV) {
-  const { locale } = useI18n();
-  const activeElement = useActiveElement();
-  const { D, L } = useMagicKeys();
+  const { locale } = useI18n()
+  const activeElement = useActiveElement()
+  const { D, L } = useMagicKeys()
 
   const canToggle = computed(() => {
     if (activeElement.value == null) {
-      return true;
+      return true
     }
 
-    return !["INPUT", "TEXTAREA"].includes(activeElement.value.tagName);
-  });
+    return !['INPUT', 'TEXTAREA'].includes(activeElement.value.tagName)
+  })
 
-  whenever(
-    logicAnd(D, canToggle),
-    () => (uiStore.colorMode = uiStore.colorMode === "dark" ? "light" : "dark")
-  );
+  whenever(logicAnd(D, canToggle), () => (uiStore.colorMode = uiStore.colorMode === 'dark' ? 'light' : 'dark'))
 
-  whenever(
-    logicAnd(L, canToggle),
-    () => (locale.value = locale.value === "en" ? "fr" : "en")
-  );
+  whenever(logicAnd(L, canToggle), () => (locale.value = locale.value === 'en' ? 'fr' : 'en'))
 }
 
 whenever(
   () => pool.value?.$ref,
-  (poolRef) => {
-    xenApiStore.getXapi().startWatching(poolRef);
+  poolRef => {
+    xenApiStore.getXapi().startWatching(poolRef)
   }
-);
+)
 
-useUnreachableHosts();
+useUnreachableHosts()
 </script>
 
 <style lang="postcss">
-@import "@/assets/base.css";
+@import '@/assets/base.css';
 </style>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/assets/base.css b/@xen-orchestra/lite/src/assets/base.css
index e4cde218f41..e79d7b3b85c 100644
--- a/@xen-orchestra/lite/src/assets/base.css
+++ b/@xen-orchestra/lite/src/assets/base.css
@@ -1,11 +1,11 @@
-@import "reset.css";
-@import "theme.css";
-@import "@fontsource/poppins/400.css";
-@import "@fontsource/poppins/500.css";
-@import "@fontsource/poppins/600.css";
-@import "@fontsource/poppins/700.css";
-@import "@fontsource/poppins/900.css";
-@import "@fontsource/poppins/400-italic.css";
+@import 'reset.css';
+@import 'theme.css';
+@import '@fontsource/poppins/400.css';
+@import '@fontsource/poppins/500.css';
+@import '@fontsource/poppins/600.css';
+@import '@fontsource/poppins/700.css';
+@import '@fontsource/poppins/900.css';
+@import '@fontsource/poppins/400-italic.css';
 
 body {
   min-height: 100vh;
@@ -23,8 +23,7 @@ a {
 code,
 code *,
 pre {
-  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
-    "Courier New", monospace;
+  font-family: SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
 }
 
 .card-view {
diff --git a/@xen-orchestra/lite/src/assets/theme.css b/@xen-orchestra/lite/src/assets/theme.css
index cd876b38f38..e128a2c5582 100644
--- a/@xen-orchestra/lite/src/assets/theme.css
+++ b/@xen-orchestra/lite/src/assets/theme.css
@@ -50,13 +50,11 @@
   --background-color-red-vates: #f5e8e9;
 
   --shadow-100: 0 0.1rem 0.1rem rgba(20, 20, 30, 0.06);
-  --shadow-200: 0 0.1rem 0.3rem rgba(20, 20, 30, 0.1),
-    0 0.2rem 0.1rem rgba(20, 20, 30, 0.06),
+  --shadow-200: 0 0.1rem 0.3rem rgba(20, 20, 30, 0.1), 0 0.2rem 0.1rem rgba(20, 20, 30, 0.06),
     0 0.1rem 0.1rem rgba(20, 20, 30, 0.08);
-  --shadow-300: 0 0.3rem 0.5rem rgba(20, 20, 30, 0.1),
-    0 0.1rem 1.8rem rgba(20, 20, 30, 0.06), 0 0.6rem 1rem rgba(20, 20, 30, 0.08);
-  --shadow-400: 0 1.1rem 1.5rem rgba(20, 20, 30, 0.1),
-    0 0.9rem 4.6rem rgba(20, 20, 30, 0.06),
+  --shadow-300: 0 0.3rem 0.5rem rgba(20, 20, 30, 0.1), 0 0.1rem 1.8rem rgba(20, 20, 30, 0.06),
+    0 0.6rem 1rem rgba(20, 20, 30, 0.08);
+  --shadow-400: 0 1.1rem 1.5rem rgba(20, 20, 30, 0.1), 0 0.9rem 4.6rem rgba(20, 20, 30, 0.06),
     0 2.4rem 3.8rem rgba(20, 20, 30, 0.04);
 }
 
@@ -80,12 +78,10 @@
   --background-color-red-vates: #3c1a28;
 
   --shadow-100: 0 0.1rem 0.1rem rgba(20, 20, 30, 0.12);
-  --shadow-200: 0 0.1rem 0.3rem rgba(20, 20, 30, 0.2),
-    0 0.2rem 0.1rem rgba(20, 20, 30, 0.12),
+  --shadow-200: 0 0.1rem 0.3rem rgba(20, 20, 30, 0.2), 0 0.2rem 0.1rem rgba(20, 20, 30, 0.12),
     0 0.1rem 0.1rem rgba(20, 20, 30, 0.16);
-  --shadow-300: 0 0.3rem 0.5rem rgba(20, 20, 30, 0.2),
-    0 0.1rem 1.8rem rgba(20, 20, 30, 0.12), 0 0.6rem 1rem rgba(20, 20, 30, 0.16);
-  --shadow-400: 0 1.1rem 1.5rem rgba(20, 20, 30, 0.2),
-    0 0.9rem 4.6rem rgba(20, 20, 30, 0.12),
+  --shadow-300: 0 0.3rem 0.5rem rgba(20, 20, 30, 0.2), 0 0.1rem 1.8rem rgba(20, 20, 30, 0.12),
+    0 0.6rem 1rem rgba(20, 20, 30, 0.16);
+  --shadow-400: 0 1.1rem 1.5rem rgba(20, 20, 30, 0.2), 0 0.9rem 4.6rem rgba(20, 20, 30, 0.12),
     0 2.4rem 3.8rem rgba(20, 20, 30, 0.08);
 }
diff --git a/@xen-orchestra/lite/src/components/AccountButton.vue b/@xen-orchestra/lite/src/components/AccountButton.vue
index fd0d589f7eb..4b7587d0cb9 100644
--- a/@xen-orchestra/lite/src/components/AccountButton.vue
+++ b/@xen-orchestra/lite/src/components/AccountButton.vue
@@ -6,54 +6,44 @@
         <UiIcon :icon="faAngleDown" class="dropdown-icon" />
       </button>
     </template>
-    <MenuItem :icon="faGear" @click="openSettings">{{
-      $t("settings")
-    }}</MenuItem>
+    <MenuItem :icon="faGear" @click="openSettings">{{ $t('settings') }}</MenuItem>
     <MenuItem :icon="faMessage" @click="openFeedbackUrl">
-      {{ $t("send-us-feedback") }}
+      {{ $t('send-us-feedback') }}
     </MenuItem>
-    <MenuItem
-      :icon="faArrowRightFromBracket"
-      class="menu-item-logout"
-      @click="logout"
-    >
-      {{ $t("log-out") }}
+    <MenuItem :icon="faArrowRightFromBracket" class="menu-item-logout" @click="logout">
+      {{ $t('log-out') }}
     </MenuItem>
   </AppMenu>
 </template>
 
 <script lang="ts" setup>
-import { nextTick } from "vue";
-import { useRouter } from "vue-router";
+import { nextTick } from 'vue'
+import { useRouter } from 'vue-router'
 import {
   faAngleDown,
   faArrowRightFromBracket,
   faCircleUser,
   faGear,
   faMessage,
-} from "@fortawesome/free-solid-svg-icons";
-import AppMenu from "@/components/menu/AppMenu.vue";
-import MenuItem from "@/components/menu/MenuItem.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useXenApiStore } from "@/stores/xen-api.store";
+} from '@fortawesome/free-solid-svg-icons'
+import AppMenu from '@/components/menu/AppMenu.vue'
+import MenuItem from '@/components/menu/MenuItem.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useXenApiStore } from '@/stores/xen-api.store'
 
-const router = useRouter();
+const router = useRouter()
 
 const logout = () => {
-  const xenApiStore = useXenApiStore();
-  xenApiStore.disconnect();
-  nextTick(() => router.push({ name: "home" }));
-};
+  const xenApiStore = useXenApiStore()
+  xenApiStore.disconnect()
+  nextTick(() => router.push({ name: 'home' }))
+}
 
 const openFeedbackUrl = () => {
-  window.open(
-    "https://xcp-ng.org/forum/topic/4731/xen-orchestra-lite",
-    "_blank",
-    "noopener"
-  );
-};
+  window.open('https://xcp-ng.org/forum/topic/4731/xen-orchestra-lite', '_blank', 'noopener')
+}
 
-const openSettings = () => router.push({ name: "settings" });
+const openSettings = () => router.push({ name: 'settings' })
 </script>
 
 <style scoped>
diff --git a/@xen-orchestra/lite/src/components/AppHeader.vue b/@xen-orchestra/lite/src/components/AppHeader.vue
index 6b28a804ec3..f053ce16399 100644
--- a/@xen-orchestra/lite/src/components/AppHeader.vue
+++ b/@xen-orchestra/lite/src/components/AppHeader.vue
@@ -1,11 +1,6 @@
 <template>
   <header class="app-header">
-    <UiIcon
-      v-if="isMobile"
-      ref="navigationTrigger"
-      :icon="faBars"
-      class="toggle-navigation"
-    />
+    <UiIcon v-if="isMobile" ref="navigationTrigger" :icon="faBars" class="toggle-navigation" />
     <RouterLink :to="{ name: 'home' }">
       <img v-if="isMobile" alt="XO Lite" src="../assets/logo.svg" />
       <TextLogo v-else />
@@ -14,7 +9,7 @@
     <div class="right">
       <PoolOverrideWarning as-tooltip />
       <UiButton v-if="isDesktop" :icon="faDownload" @click="openXoaDeploy">
-        {{ $t("deploy-xoa") }}
+        {{ $t('deploy-xoa') }}
       </UiButton>
       <AccountButton />
     </div>
@@ -22,26 +17,26 @@
 </template>
 
 <script lang="ts" setup>
-import AccountButton from "@/components/AccountButton.vue";
-import PoolOverrideWarning from "@/components/PoolOverrideWarning.vue";
-import TextLogo from "@/components/TextLogo.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useNavigationStore } from "@/stores/navigation.store";
-import { useRouter } from "vue-router";
-import { useUiStore } from "@/stores/ui.store";
-import { faBars, faDownload } from "@fortawesome/free-solid-svg-icons";
-import { storeToRefs } from "pinia";
+import AccountButton from '@/components/AccountButton.vue'
+import PoolOverrideWarning from '@/components/PoolOverrideWarning.vue'
+import TextLogo from '@/components/TextLogo.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useNavigationStore } from '@/stores/navigation.store'
+import { useRouter } from 'vue-router'
+import { useUiStore } from '@/stores/ui.store'
+import { faBars, faDownload } from '@fortawesome/free-solid-svg-icons'
+import { storeToRefs } from 'pinia'
 
-const router = useRouter();
+const router = useRouter()
 
-const openXoaDeploy = () => router.push({ name: "xoa.deploy" });
+const openXoaDeploy = () => router.push({ name: 'xoa.deploy' })
 
-const uiStore = useUiStore();
-const { isMobile, isDesktop } = storeToRefs(uiStore);
+const uiStore = useUiStore()
+const { isMobile, isDesktop } = storeToRefs(uiStore)
 
-const navigationStore = useNavigationStore();
-const { trigger: navigationTrigger } = storeToRefs(navigationStore);
+const navigationStore = useNavigationStore()
+const { trigger: navigationTrigger } = storeToRefs(navigationStore)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/AppLogin.vue b/@xen-orchestra/lite/src/components/AppLogin.vue
index ff76d6abd28..d30a41b32a1 100644
--- a/@xen-orchestra/lite/src/components/AppLogin.vue
+++ b/@xen-orchestra/lite/src/components/AppLogin.vue
@@ -5,7 +5,7 @@
       <PoolOverrideWarning />
       <p v-if="isHostIsSlaveErr(error)" class="error">
         <UiIcon :icon="faExclamationCircle" />
-        {{ $t("login-only-on-master") }}
+        {{ $t('login-only-on-master') }}
         <a :href="masterUrl.href">{{ masterUrl.hostname }}</a>
       </p>
       <template v-else>
@@ -13,10 +13,10 @@
           <FormInput v-model="login" name="login" readonly type="text" />
         </FormInputWrapper>
         <FormInput
-          name="password"
           ref="passwordRef"
-          type="password"
           v-model="password"
+          name="password"
+          type="password"
           :class="{ error: isInvalidPassword }"
           :placeholder="$t('password')"
           :readonly="isConnecting"
@@ -25,10 +25,10 @@
         <LoginError :error="error" />
         <label class="remember-me-label">
           <FormCheckbox v-model="rememberMe" />
-          {{ $t("keep-me-logged") }}
+          {{ $t('keep-me-logged') }}
         </label>
         <UiButton type="submit" :busy="isConnecting">
-          {{ $t("login") }}
+          {{ $t('login') }}
         </UiButton>
       </template>
     </form>
@@ -36,69 +36,68 @@
 </template>
 
 <script lang="ts" setup>
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { storeToRefs } from "pinia";
-import { onMounted, ref, watch } from "vue";
-import { useI18n } from "vue-i18n";
-import { useLocalStorage, whenever } from "@vueuse/core";
-
-import FormCheckbox from "@/components/form/FormCheckbox.vue";
-import FormInput from "@/components/form/FormInput.vue";
-import FormInputWrapper from "@/components/form/FormInputWrapper.vue";
-import LoginError from "@/components/LoginError.vue";
-import PoolOverrideWarning from "@/components/PoolOverrideWarning.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { XenApiError } from "@/libs/xen-api/xen-api.types";
-import { faExclamationCircle } from "@fortawesome/free-solid-svg-icons";
-import { useXenApiStore } from "@/stores/xen-api.store";
-
-const { t } = useI18n();
-usePageTitleStore().setTitle(t("login"));
-const xenApiStore = useXenApiStore();
-const { isConnecting } = storeToRefs(xenApiStore);
-const login = ref("root");
-const password = ref("");
-const error = ref<XenApiError>();
-const passwordRef = ref<InstanceType<typeof FormInput>>();
-const isInvalidPassword = ref(false);
-const masterUrl = ref(new URL(window.origin));
-const rememberMe = useLocalStorage("rememberMe", false);
-
-const focusPasswordInput = () => passwordRef.value?.focus();
-const isHostIsSlaveErr = (err: XenApiError | undefined) =>
-  err?.message === "HOST_IS_SLAVE";
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { storeToRefs } from 'pinia'
+import { onMounted, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useLocalStorage, whenever } from '@vueuse/core'
+
+import FormCheckbox from '@/components/form/FormCheckbox.vue'
+import FormInput from '@/components/form/FormInput.vue'
+import FormInputWrapper from '@/components/form/FormInputWrapper.vue'
+import LoginError from '@/components/LoginError.vue'
+import PoolOverrideWarning from '@/components/PoolOverrideWarning.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { XenApiError } from '@/libs/xen-api/xen-api.types'
+import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons'
+import { useXenApiStore } from '@/stores/xen-api.store'
+
+const { t } = useI18n()
+usePageTitleStore().setTitle(t('login'))
+const xenApiStore = useXenApiStore()
+const { isConnecting } = storeToRefs(xenApiStore)
+const login = ref('root')
+const password = ref('')
+const error = ref<XenApiError>()
+const passwordRef = ref<InstanceType<typeof FormInput>>()
+const isInvalidPassword = ref(false)
+const masterUrl = ref(new URL(window.origin))
+const rememberMe = useLocalStorage('rememberMe', false)
+
+const focusPasswordInput = () => passwordRef.value?.focus()
+const isHostIsSlaveErr = (err: XenApiError | undefined) => err?.message === 'HOST_IS_SLAVE'
 
 onMounted(() => {
   if (rememberMe.value) {
-    xenApiStore.reconnect();
+    xenApiStore.reconnect()
   } else {
-    focusPasswordInput();
+    focusPasswordInput()
   }
-});
+})
 
 watch(password, () => {
-  isInvalidPassword.value = false;
-  error.value = undefined;
-});
+  isInvalidPassword.value = false
+  error.value = undefined
+})
 
 whenever(
   () => isHostIsSlaveErr(error.value),
   () => (masterUrl.value.hostname = error.value!.data)
-);
+)
 
 async function handleSubmit() {
   try {
-    await xenApiStore.connect(login.value, password.value);
+    await xenApiStore.connect(login.value, password.value)
   } catch (err: any) {
-    if (err.message === "SESSION_AUTHENTICATION_FAILED") {
-      focusPasswordInput();
-      isInvalidPassword.value = true;
+    if (err.message === 'SESSION_AUTHENTICATION_FAILED') {
+      focusPasswordInput()
+      isInvalidPassword.value = true
     } else {
-      console.error(error);
+      console.error(error)
     }
 
-    error.value = err;
+    error.value = err
   }
 }
 </script>
diff --git a/@xen-orchestra/lite/src/components/AppMarkdown.vue b/@xen-orchestra/lite/src/components/AppMarkdown.vue
index eecc8208c7a..3dd4a7e2105 100644
--- a/@xen-orchestra/lite/src/components/AppMarkdown.vue
+++ b/@xen-orchestra/lite/src/components/AppMarkdown.vue
@@ -1,39 +1,40 @@
 <template>
+  <!-- eslint-disable vue/no-v-html -->
   <div ref="rootElement" class="app-markdown" v-html="html" />
+  <!-- eslint-enable vue/no-v-html -->
 </template>
 
 <script lang="ts" setup>
-import markdown from "@/libs/markdown";
-import { useEventListener } from "@vueuse/core";
-import { computed, type Ref, ref } from "vue";
+import markdown from '@/libs/markdown'
+import { useEventListener } from '@vueuse/core'
+import { computed, type Ref, ref } from 'vue'
 
-const rootElement = ref() as Ref<HTMLElement>;
+const rootElement = ref() as Ref<HTMLElement>
 
 const props = defineProps<{
-  content: string;
-}>();
+  content: string
+}>()
 
-const html = computed(() => markdown.parse(props.content ?? ""));
+const html = computed(() => markdown.parse(props.content ?? ''))
 
 useEventListener(
   rootElement,
-  "click",
+  'click',
   (event: MouseEvent) => {
-    const target = event.target as HTMLElement;
+    const target = event.target as HTMLElement
 
-    if (!target.classList.contains("copy-button")) {
-      return;
+    if (!target.classList.contains('copy-button')) {
+      return
     }
 
-    const copyable =
-      target.parentElement!.querySelector<HTMLElement>(".copyable");
+    const copyable = target.parentElement!.querySelector<HTMLElement>('.copyable')
 
     if (copyable !== null) {
-      navigator.clipboard.writeText(copyable.innerText);
+      navigator.clipboard.writeText(copyable.innerText)
     }
   },
   { capture: true }
-);
+)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/AppNavigation.vue b/@xen-orchestra/lite/src/components/AppNavigation.vue
index a22b8bec639..f1e355b81e5 100644
--- a/@xen-orchestra/lite/src/components/AppNavigation.vue
+++ b/@xen-orchestra/lite/src/components/AppNavigation.vue
@@ -1,11 +1,6 @@
 <template>
   <transition name="slide">
-    <nav
-      v-if="isDesktop || isOpen"
-      ref="navElement"
-      :class="{ collapsible: isMobile }"
-      class="app-navigation"
-    >
+    <nav v-if="isDesktop || isOpen" ref="navElement" :class="{ collapsible: isMobile }" class="app-navigation">
       <StoryMenu v-if="$route.meta.hasStoryNav" />
       <InfraPoolList v-else />
     </nav>
@@ -13,34 +8,34 @@
 </template>
 
 <script lang="ts" setup>
-import StoryMenu from "@/components/component-story/StoryMenu.vue";
-import InfraPoolList from "@/components/infra/InfraPoolList.vue";
-import { useNavigationStore } from "@/stores/navigation.store";
-import { useUiStore } from "@/stores/ui.store";
-import { onClickOutside, whenever } from "@vueuse/core";
-import { storeToRefs } from "pinia";
-import { ref } from "vue";
+import StoryMenu from '@/components/component-story/StoryMenu.vue'
+import InfraPoolList from '@/components/infra/InfraPoolList.vue'
+import { useNavigationStore } from '@/stores/navigation.store'
+import { useUiStore } from '@/stores/ui.store'
+import { onClickOutside, whenever } from '@vueuse/core'
+import { storeToRefs } from 'pinia'
+import { ref } from 'vue'
 
-const uiStore = useUiStore();
-const { isMobile, isDesktop } = storeToRefs(uiStore);
+const uiStore = useUiStore()
+const { isMobile, isDesktop } = storeToRefs(uiStore)
 
-const navigationStore = useNavigationStore();
-const { isOpen, trigger } = storeToRefs(navigationStore);
+const navigationStore = useNavigationStore()
+const { isOpen, trigger } = storeToRefs(navigationStore)
 
-const navElement = ref();
+const navElement = ref()
 
 whenever(isOpen, () => {
   const unregisterEvent = onClickOutside(
     navElement,
     () => {
-      isOpen.value = false;
-      unregisterEvent?.();
+      isOpen.value = false
+      unregisterEvent?.()
     },
     {
       ignore: [trigger],
     }
-  );
-});
+  )
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/AppTooltip.vue b/@xen-orchestra/lite/src/components/AppTooltip.vue
index 052fbab9d6a..f4bb5560579 100644
--- a/@xen-orchestra/lite/src/components/AppTooltip.vue
+++ b/@xen-orchestra/lite/src/components/AppTooltip.vue
@@ -6,33 +6,31 @@
 </template>
 
 <script lang="ts" setup>
-import type { TooltipOptions } from "@/stores/tooltip.store";
-import { isString } from "lodash-es";
-import place from "placement.js";
-import { computed, ref, watchEffect } from "vue";
+import type { TooltipOptions } from '@/stores/tooltip.store'
+import { isString } from 'lodash-es'
+import place from 'placement.js'
+import { computed, ref, watchEffect } from 'vue'
 
 const props = defineProps<{
-  target: HTMLElement;
-  options: TooltipOptions;
-}>();
+  target: HTMLElement
+  options: TooltipOptions
+}>()
 
-const tooltipElement = ref<HTMLElement>();
+const tooltipElement = ref<HTMLElement>()
 
 const isDisabled = computed(() =>
-  isString(props.options.content)
-    ? props.options.content.trim() === ""
-    : props.options.content === false
-);
+  isString(props.options.content) ? props.options.content.trim() === '' : props.options.content === false
+)
 
-const placement = computed(() => props.options.placement ?? "top");
+const placement = computed(() => props.options.placement ?? 'top')
 
 watchEffect(() => {
   if (tooltipElement.value) {
     place(props.target, tooltipElement.value, {
       placement: placement.value,
-    });
+    })
   }
-});
+})
 </script>
 
 <style lang="postcss" scoped>
@@ -56,7 +54,7 @@ watchEffect(() => {
   height: 1.875em;
 }
 
-[data-placement^="top"] {
+[data-placement^='top'] {
   margin-bottom: 0.625em;
 
   .triangle {
@@ -65,7 +63,7 @@ watchEffect(() => {
   }
 }
 
-[data-placement^="right"] {
+[data-placement^='right'] {
   margin-left: 0.625em;
 
   .triangle {
@@ -74,7 +72,7 @@ watchEffect(() => {
   }
 }
 
-[data-placement^="bottom"] {
+[data-placement^='bottom'] {
   margin-top: 0.625em;
 
   .triangle {
@@ -82,7 +80,7 @@ watchEffect(() => {
   }
 }
 
-[data-placement^="left"] {
+[data-placement^='left'] {
   margin-right: 0.625em;
 
   .triangle {
@@ -91,51 +89,51 @@ watchEffect(() => {
   }
 }
 
-[data-placement="top-start"] .triangle {
+[data-placement='top-start'] .triangle {
   left: 0;
 }
 
-[data-placement="top-center"] .triangle {
+[data-placement='top-center'] .triangle {
   left: 50%;
   margin-left: -0.9375em;
 }
 
-[data-placement="top-end"] .triangle {
+[data-placement='top-end'] .triangle {
   right: 0;
 }
 
-[data-placement="left-start"] .triangle {
+[data-placement='left-start'] .triangle {
   top: -0.25em;
 }
 
-[data-placement="left-center"] .triangle {
+[data-placement='left-center'] .triangle {
   top: 50%;
   margin-top: -0.9375em;
 }
 
-[data-placement="left-end"] .triangle {
+[data-placement='left-end'] .triangle {
   bottom: -0.25em;
 }
 
-[data-placement="right-start"] .triangle {
+[data-placement='right-start'] .triangle {
   top: -0.25em;
 }
 
-[data-placement="right-center"] .triangle {
+[data-placement='right-center'] .triangle {
   top: 50%;
   margin-top: -0.9375em;
 }
 
-[data-placement="right-end"] .triangle {
+[data-placement='right-end'] .triangle {
   bottom: -0.25em;
 }
 
-[data-placement="bottom-center"] .triangle {
+[data-placement='bottom-center'] .triangle {
   left: 50%;
   margin-left: -0.9375em;
 }
 
-[data-placement="bottom-end"] .triangle {
+[data-placement='bottom-end'] .triangle {
   right: 0;
 }
 
@@ -144,7 +142,7 @@ watchEffect(() => {
   width: 100%;
   height: 100%;
   margin-top: 1.875em;
-  content: "";
+  content: '';
   transform: rotate(45deg) skew(20deg, 20deg);
   border-radius: 0.3125em;
   background-color: var(--color-blue-scale-100);
diff --git a/@xen-orchestra/lite/src/components/AppTooltips.vue b/@xen-orchestra/lite/src/components/AppTooltips.vue
index f19761de333..39cf344e223 100644
--- a/@xen-orchestra/lite/src/components/AppTooltips.vue
+++ b/@xen-orchestra/lite/src/components/AppTooltips.vue
@@ -1,19 +1,14 @@
 <template>
-  <AppTooltip
-    v-for="tooltip in tooltips"
-    :key="tooltip.key"
-    :options="tooltip.options"
-    :target="tooltip.target"
-  />
+  <AppTooltip v-for="tooltip in tooltips" :key="tooltip.key" :options="tooltip.options" :target="tooltip.target" />
 </template>
 
 <script lang="ts" setup>
-import { storeToRefs } from "pinia";
-import AppTooltip from "@/components/AppTooltip.vue";
-import { useTooltipStore } from "@/stores/tooltip.store";
+import { storeToRefs } from 'pinia'
+import AppTooltip from '@/components/AppTooltip.vue'
+import { useTooltipStore } from '@/stores/tooltip.store'
 
-const tooltipStore = useTooltipStore();
-const { tooltips } = storeToRefs(tooltipStore);
+const tooltipStore = useTooltipStore()
+const { tooltips } = storeToRefs(tooltipStore)
 </script>
 
 <style scoped></style>
diff --git a/@xen-orchestra/lite/src/components/CodeHighlight.vue b/@xen-orchestra/lite/src/components/CodeHighlight.vue
index fb7525b141e..ea1de103dd3 100644
--- a/@xen-orchestra/lite/src/components/CodeHighlight.vue
+++ b/@xen-orchestra/lite/src/components/CodeHighlight.vue
@@ -1,33 +1,33 @@
 <template>
+  <!-- eslint-disable vue/no-v-html -->
   <pre class="code-highlight hljs"><code v-html="codeAsHtml"></code></pre>
+  <!-- eslint-enable vue/no-v-html -->
 </template>
 
 <script lang="ts" setup>
-import { type AcceptedLanguage, highlight } from "@/libs/highlight";
-import { computed } from "vue";
+import { type AcceptedLanguage, highlight } from '@/libs/highlight'
+import { computed } from 'vue'
 
 const props = withDefaults(
   defineProps<{
-    code?: any;
-    lang?: AcceptedLanguage;
+    code?: any
+    lang?: AcceptedLanguage
   }>(),
-  { lang: "typescript" }
-);
+  { lang: 'typescript' }
+)
 
 const codeAsText = computed(() => {
   switch (typeof props.code) {
-    case "string":
-      return props.code;
-    case "function":
-      return String(props.code);
+    case 'string':
+      return props.code
+    case 'function':
+      return String(props.code)
     default:
-      return JSON.stringify(props.code, undefined, 2);
+      return JSON.stringify(props.code, undefined, 2)
   }
-});
+})
 
-const codeAsHtml = computed(
-  () => highlight(codeAsText.value, { language: props.lang }).value
-);
+const codeAsHtml = computed(() => highlight(codeAsText.value, { language: props.lang }).value)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/CollectionFilter.vue b/@xen-orchestra/lite/src/components/CollectionFilter.vue
index ec5f52c20cb..04bde8f1c80 100644
--- a/@xen-orchestra/lite/src/components/CollectionFilter.vue
+++ b/@xen-orchestra/lite/src/components/CollectionFilter.vue
@@ -10,42 +10,39 @@
     </UiFilter>
 
     <UiActionButton :icon="faPlus" class="add-filter" @click="openModal()">
-      {{ $t("add-filter") }}
+      {{ $t('add-filter') }}
     </UiActionButton>
   </UiFilterGroup>
 </template>
 
 <script lang="ts" setup>
-import UiActionButton from "@/components/ui/UiActionButton.vue";
-import UiFilter from "@/components/ui/UiFilter.vue";
-import UiFilterGroup from "@/components/ui/UiFilterGroup.vue";
-import { useModal } from "@/composables/modal.composable";
-import type { Filters } from "@/types/filter";
-import { faPlus } from "@fortawesome/free-solid-svg-icons";
+import UiActionButton from '@/components/ui/UiActionButton.vue'
+import UiFilter from '@/components/ui/UiFilter.vue'
+import UiFilterGroup from '@/components/ui/UiFilterGroup.vue'
+import { useModal } from '@/composables/modal.composable'
+import type { Filters } from '@/types/filter'
+import { faPlus } from '@fortawesome/free-solid-svg-icons'
 
 const props = defineProps<{
-  activeFilters: string[];
-  availableFilters: Filters;
-}>();
+  activeFilters: string[]
+  availableFilters: Filters
+}>()
 
 const emit = defineEmits<{
-  (event: "addFilter", filter: string): void;
-  (event: "removeFilter", filter: string): void;
-}>();
+  (event: 'addFilter', filter: string): void
+  (event: 'removeFilter', filter: string): void
+}>()
 
 const openModal = (editedFilter?: string) => {
-  const { onApprove } = useModal<string>(
-    () => import("@/components/modals/CollectionFilterModal.vue"),
-    {
-      availableFilters: props.availableFilters,
-      editedFilter,
-    }
-  );
+  const { onApprove } = useModal<string>(() => import('@/components/modals/CollectionFilterModal.vue'), {
+    availableFilters: props.availableFilters,
+    editedFilter,
+  })
 
   if (editedFilter !== undefined) {
-    onApprove(() => emit("removeFilter", editedFilter));
+    onApprove(() => emit('removeFilter', editedFilter))
   }
 
-  onApprove((newFilter) => emit("addFilter", newFilter));
-};
+  onApprove(newFilter => emit('addFilter', newFilter))
+}
 </script>
diff --git a/@xen-orchestra/lite/src/components/CollectionFilterRow.vue b/@xen-orchestra/lite/src/components/CollectionFilterRow.vue
index dd050c728eb..65cde5171f1 100644
--- a/@xen-orchestra/lite/src/components/CollectionFilterRow.vue
+++ b/@xen-orchestra/lite/src/components/CollectionFilterRow.vue
@@ -1,31 +1,21 @@
 <template>
   <div class="collection-filter-row">
-    <span class="or">{{ $t("or") }}</span>
+    <span class="or">{{ $t('or') }}</span>
     <FormWidget v-if="newFilter.isAdvanced" class="form-widget-advanced">
       <input v-model="newFilter.content" />
     </FormWidget>
     <template v-else>
       <FormWidget :before="currentFilterIcon">
         <select v-model="newFilter.builder.property">
-          <option v-if="!newFilter.builder.property" value="">
-            - {{ $t("property") }} -
-          </option>
-          <option
-            v-for="(filter, property) in availableFilters"
-            :key="property"
-            :value="property"
-          >
+          <option v-if="!newFilter.builder.property" value="">- {{ $t('property') }} -</option>
+          <option v-for="(filter, property) in availableFilters" :key="property" :value="property">
             {{ filter.label ?? property }}
           </option>
         </select>
       </FormWidget>
       <FormWidget v-if="hasComparisonSelect">
         <select v-model="newFilter.builder.comparison">
-          <option
-            v-for="(label, type) in comparisons"
-            :key="type"
-            :value="type"
-          >
+          <option v-for="(label, type) in comparisons" :key="type" :value="type">
             {{ label }}
           </option>
         </select>
@@ -38,112 +28,88 @@
           </option>
         </select>
       </FormWidget>
-      <FormWidget
-        v-else-if="hasValueInput"
-        :after="valueInputAfter"
-        :before="valueInputBefore"
-      >
+      <FormWidget v-else-if="hasValueInput" :after="valueInputAfter" :before="valueInputBefore">
         <input v-model="newFilter.builder.value" />
       </FormWidget>
     </template>
-    <UiActionButton
-      v-if="!newFilter.isAdvanced"
-      :icon="faPencil"
-      @click="enableAdvancedMode"
-    />
+    <UiActionButton v-if="!newFilter.isAdvanced" :icon="faPencil" @click="enableAdvancedMode" />
     <UiActionButton :icon="faRemove" @click="emit('remove', newFilter.id)" />
   </div>
 </template>
 
 <script lang="ts" setup>
-import FormWidget from "@/components/FormWidget.vue";
-import UiActionButton from "@/components/ui/UiActionButton.vue";
-import { buildComplexMatcherNode } from "@/libs/complex-matcher.utils";
-import { getFilterIcon } from "@/libs/utils";
-import type {
-  Filter,
-  FilterComparisons,
-  FilterComparisonType,
-  Filters,
-  FilterType,
-  NewFilter,
-} from "@/types/filter";
-import { faPencil, faRemove } from "@fortawesome/free-solid-svg-icons";
-import { useVModel } from "@vueuse/core";
-import { computed, type Ref, watch } from "vue";
-import { useI18n } from "vue-i18n";
+import FormWidget from '@/components/FormWidget.vue'
+import UiActionButton from '@/components/ui/UiActionButton.vue'
+import { buildComplexMatcherNode } from '@/libs/complex-matcher.utils'
+import { getFilterIcon } from '@/libs/utils'
+import type { Filter, FilterComparisons, FilterComparisonType, Filters, FilterType, NewFilter } from '@/types/filter'
+import { faPencil, faRemove } from '@fortawesome/free-solid-svg-icons'
+import { useVModel } from '@vueuse/core'
+import { computed, type Ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
 
 const props = defineProps<{
-  availableFilters: Filters;
-  modelValue: NewFilter;
-}>();
+  availableFilters: Filters
+  modelValue: NewFilter
+}>()
 
 const emit = defineEmits<{
-  (event: "update:modelValue", value: NewFilter): void;
-  (event: "remove", filterId: number): void;
-}>();
+  (event: 'update:modelValue', value: NewFilter): void
+  (event: 'remove', filterId: number): void
+}>()
 
-const { t } = useI18n();
+const { t } = useI18n()
 
-const newFilter: Ref<NewFilter> = useVModel(props, "modelValue", emit);
+const newFilter: Ref<NewFilter> = useVModel(props, 'modelValue', emit)
 
 const getDefaultComparisonType = () => {
   const defaultTypes: { [key in FilterType]: FilterComparisonType } = {
-    string: "stringContains",
-    boolean: "booleanTrue",
-    number: "numberEquals",
-    enum: "enumIs",
-  };
+    string: 'stringContains',
+    boolean: 'booleanTrue',
+    number: 'numberEquals',
+    enum: 'enumIs',
+  }
 
-  return defaultTypes[
-    props.availableFilters[newFilter.value.builder.property].type
-  ];
-};
+  return defaultTypes[props.availableFilters[newFilter.value.builder.property].type]
+}
 
 watch(
   () => newFilter.value.builder.property,
   () => {
-    newFilter.value.builder.comparison = getDefaultComparisonType();
-    newFilter.value.builder.value = "";
+    newFilter.value.builder.comparison = getDefaultComparisonType()
+    newFilter.value.builder.value = ''
   }
-);
+)
 
-const currentFilter = computed<Filter>(
-  () => props.availableFilters[newFilter.value.builder.property]
-);
+const currentFilter = computed<Filter>(() => props.availableFilters[newFilter.value.builder.property])
 
-const currentFilterIcon = computed(() => getFilterIcon(currentFilter.value));
+const currentFilterIcon = computed(() => getFilterIcon(currentFilter.value))
 
-const hasValueInput = computed(() =>
-  ["string", "number"].includes(currentFilter.value?.type)
-);
+const hasValueInput = computed(() => ['string', 'number'].includes(currentFilter.value?.type))
 
-const hasComparisonSelect = computed(
-  () => newFilter.value.builder.property !== ""
-);
+const hasComparisonSelect = computed(() => newFilter.value.builder.property !== '')
 
 const enumChoices = computed(() => {
   if (!newFilter.value.builder.property) {
-    return [];
+    return []
   }
 
-  const availableFilter =
-    props.availableFilters[newFilter.value.builder.property];
+  const availableFilter = props.availableFilters[newFilter.value.builder.property]
 
-  if (availableFilter.type !== "enum") {
-    return [];
+  if (availableFilter.type !== 'enum') {
+    return []
   }
 
-  return availableFilter.choices;
-});
+  return availableFilter.choices
+})
 
 const generatedFilter = computed(() => {
   if (newFilter.value.isAdvanced) {
-    return newFilter.value.content;
+    return newFilter.value.content
   }
 
   if (!newFilter.value.builder.comparison) {
-    return "";
+    return ''
   }
 
   try {
@@ -151,68 +117,64 @@ const generatedFilter = computed(() => {
       newFilter.value.builder.comparison,
       newFilter.value.builder.property,
       newFilter.value.builder.value
-    );
+    )
 
     if (node) {
-      return node.toString();
+      return node.toString()
     }
 
-    return "";
+    return ''
   } catch (e) {
-    return "";
+    return ''
   }
-});
+})
 
 const enableAdvancedMode = () => {
-  newFilter.value.content = generatedFilter.value;
-  newFilter.value.isAdvanced = true;
-};
+  newFilter.value.content = generatedFilter.value
+  newFilter.value.isAdvanced = true
+}
 
-watch(generatedFilter, (value) => {
-  newFilter.value.content = value;
-});
+watch(generatedFilter, value => {
+  newFilter.value.content = value
+})
 
 const comparisons = computed<FilterComparisons>(() => {
   const comparisonsByType = {
     string: {
-      stringContains: t("filter.comparison.contains"),
-      stringEquals: t("filter.comparison.equals"),
-      stringStartsWith: t("filter.comparison.starts-with"),
-      stringEndsWith: t("filter.comparison.ends-with"),
-      stringMatchesRegex: t("filter.comparison.matches-regex"),
-      stringDoesNotContain: t("filter.comparison.not-contain"),
-      stringDoesNotEqual: t("filter.comparison.not-equal"),
-      stringDoesNotStartWith: t("filter.comparison.not-start-with"),
-      stringDoesNotEndWith: t("filter.comparison.not-end-with"),
-      stringDoesNotMatchRegex: t("filter.comparison.not-match-regex"),
+      stringContains: t('filter.comparison.contains'),
+      stringEquals: t('filter.comparison.equals'),
+      stringStartsWith: t('filter.comparison.starts-with'),
+      stringEndsWith: t('filter.comparison.ends-with'),
+      stringMatchesRegex: t('filter.comparison.matches-regex'),
+      stringDoesNotContain: t('filter.comparison.not-contain'),
+      stringDoesNotEqual: t('filter.comparison.not-equal'),
+      stringDoesNotStartWith: t('filter.comparison.not-start-with'),
+      stringDoesNotEndWith: t('filter.comparison.not-end-with'),
+      stringDoesNotMatchRegex: t('filter.comparison.not-match-regex'),
     },
     boolean: {
-      booleanTrue: t("filter.comparison.is-true"),
-      booleanFalse: t("filter.comparison.is-false"),
+      booleanTrue: t('filter.comparison.is-true'),
+      booleanFalse: t('filter.comparison.is-false'),
     },
     number: {
-      numberLessThan: "<",
-      numberLessThanOrEquals: "<=",
-      numberEquals: "=",
-      numberGreaterThanOrEquals: ">=",
-      numberGreaterThan: ">",
+      numberLessThan: '<',
+      numberLessThanOrEquals: '<=',
+      numberEquals: '=',
+      numberGreaterThanOrEquals: '>=',
+      numberGreaterThan: '>',
     },
     enum: {
-      enumIs: t("filter.comparison.is"),
-      enumIsNot: t("filter.comparison.is-not"),
+      enumIs: t('filter.comparison.is'),
+      enumIsNot: t('filter.comparison.is-not'),
     },
-  };
+  }
 
-  return comparisonsByType[currentFilter.value.type];
-});
+  return comparisonsByType[currentFilter.value.type]
+})
 
-const valueInputBefore = computed(() =>
-  newFilter.value.builder.comparison === "stringMatchesRegex" ? "/" : undefined
-);
+const valueInputBefore = computed(() => (newFilter.value.builder.comparison === 'stringMatchesRegex' ? '/' : undefined))
 
-const valueInputAfter = computed(() =>
-  newFilter.value.builder.comparison === "stringMatchesRegex" ? "/i" : undefined
-);
+const valueInputAfter = computed(() => (newFilter.value.builder.comparison === 'stringMatchesRegex' ? '/i' : undefined))
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/CollectionSorter.vue b/@xen-orchestra/lite/src/components/CollectionSorter.vue
index 9c9ee43899c..77058af8189 100644
--- a/@xen-orchestra/lite/src/components/CollectionSorter.vue
+++ b/@xen-orchestra/lite/src/components/CollectionSorter.vue
@@ -13,46 +13,39 @@
     </UiFilter>
 
     <UiActionButton :icon="faPlus" class="add-sort" @click="openModal()">
-      {{ $t("add-sort") }}
+      {{ $t('add-sort') }}
     </UiActionButton>
   </UiFilterGroup>
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import UiActionButton from "@/components/ui/UiActionButton.vue";
-import UiFilter from "@/components/ui/UiFilter.vue";
-import UiFilterGroup from "@/components/ui/UiFilterGroup.vue";
-import { useModal } from "@/composables/modal.composable";
-import type { ActiveSorts, NewSort, Sorts } from "@/types/sort";
-import {
-  faCaretDown,
-  faCaretUp,
-  faPlus,
-} from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import UiActionButton from '@/components/ui/UiActionButton.vue'
+import UiFilter from '@/components/ui/UiFilter.vue'
+import UiFilterGroup from '@/components/ui/UiFilterGroup.vue'
+import { useModal } from '@/composables/modal.composable'
+import type { ActiveSorts, NewSort, Sorts } from '@/types/sort'
+import { faCaretDown, faCaretUp, faPlus } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  availableSorts: Sorts;
-  activeSorts: ActiveSorts<Record<string, any>>;
-}>();
+  availableSorts: Sorts
+  activeSorts: ActiveSorts<Record<string, any>>
+}>()
 
 const emit = defineEmits<{
-  (event: "toggleSortDirection", property: string): void;
-  (event: "addSort", property: string, isAscending: boolean): void;
-  (event: "removeSort", property: string): void;
-}>();
+  (event: 'toggleSortDirection', property: string): void
+  (event: 'addSort', property: string, isAscending: boolean): void
+  (event: 'removeSort', property: string): void
+}>()
 
 const openModal = () => {
-  const { onApprove } = useModal<NewSort>(
-    () => import("@/components/modals/CollectionSorterModal.vue"),
-    { availableSorts: computed(() => props.availableSorts) }
-  );
+  const { onApprove } = useModal<NewSort>(() => import('@/components/modals/CollectionSorterModal.vue'), {
+    availableSorts: computed(() => props.availableSorts),
+  })
 
-  onApprove(({ property, isAscending }) =>
-    emit("addSort", property, isAscending)
-  );
-};
+  onApprove(({ property, isAscending }) => emit('addSort', property, isAscending))
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/CollectionTable.vue b/@xen-orchestra/lite/src/components/CollectionTable.vue
index ec8205b91ea..fb943b2ac16 100644
--- a/@xen-orchestra/lite/src/components/CollectionTable.vue
+++ b/@xen-orchestra/lite/src/components/CollectionTable.vue
@@ -39,59 +39,52 @@
 </template>
 
 <script generic="T extends XenApiRecord<any>" lang="ts" setup>
-import CollectionFilter from "@/components/CollectionFilter.vue";
-import CollectionSorter from "@/components/CollectionSorter.vue";
-import UiTable from "@/components/ui/UiTable.vue";
-import useCollectionFilter from "@/composables/collection-filter.composable";
-import useCollectionSorter from "@/composables/collection-sorter.composable";
-import useFilteredCollection from "@/composables/filtered-collection.composable";
-import useMultiSelect from "@/composables/multi-select.composable";
-import useSortedCollection from "@/composables/sorted-collection.composable";
-import type { XenApiRecord } from "@/libs/xen-api/xen-api.types";
-import type { Filters } from "@/types/filter";
-import type { Sorts } from "@/types/sort";
-import { computed, toRef, watch } from "vue";
+import CollectionFilter from '@/components/CollectionFilter.vue'
+import CollectionSorter from '@/components/CollectionSorter.vue'
+import UiTable from '@/components/ui/UiTable.vue'
+import useCollectionFilter from '@/composables/collection-filter.composable'
+import useCollectionSorter from '@/composables/collection-sorter.composable'
+import useFilteredCollection from '@/composables/filtered-collection.composable'
+import useMultiSelect from '@/composables/multi-select.composable'
+import useSortedCollection from '@/composables/sorted-collection.composable'
+import type { XenApiRecord } from '@/libs/xen-api/xen-api.types'
+import type { Filters } from '@/types/filter'
+import type { Sorts } from '@/types/sort'
+import { computed, toRef, watch } from 'vue'
 
 const props = defineProps<{
-  modelValue?: T["$ref"][];
-  availableFilters?: Filters;
-  availableSorts?: Sorts;
-  collection: T[];
-}>();
+  modelValue?: T['$ref'][]
+  availableFilters?: Filters
+  availableSorts?: Sorts
+  collection: T[]
+}>()
 
 const emit = defineEmits<{
-  (event: "update:modelValue", selectedRefs: T["$ref"][]): void;
-}>();
+  (event: 'update:modelValue', selectedRefs: T['$ref'][]): void
+}>()
 
-const isSelectable = computed(() => props.modelValue !== undefined);
+const isSelectable = computed(() => props.modelValue !== undefined)
 
 const { filters, addFilter, removeFilter, predicate } = useCollectionFilter({
-  queryStringParam: "filter",
-});
-const { sorts, addSort, removeSort, toggleSortDirection, compareFn } =
-  useCollectionSorter<Record<string, any>>({ queryStringParam: "sort" });
+  queryStringParam: 'filter',
+})
+const { sorts, addSort, removeSort, toggleSortDirection, compareFn } = useCollectionSorter<Record<string, any>>({
+  queryStringParam: 'sort',
+})
 
-const filteredCollection = useFilteredCollection(
-  toRef(props, "collection"),
-  predicate
-);
+const filteredCollection = useFilteredCollection(toRef(props, 'collection'), predicate)
 
-const filteredAndSortedCollection = useSortedCollection(
-  filteredCollection,
-  compareFn
-);
+const filteredAndSortedCollection = useSortedCollection(filteredCollection, compareFn)
 
-const usableRefs = computed(() => props.collection.map((item) => item["$ref"]));
+const usableRefs = computed(() => props.collection.map(item => item.$ref))
 
-const selectableRefs = computed(() =>
-  filteredAndSortedCollection.value.map((item) => item["$ref"])
-);
+const selectableRefs = computed(() => filteredAndSortedCollection.value.map(item => item.$ref))
 
-const { selected, areAllSelected } = useMultiSelect(usableRefs, selectableRefs);
+const { selected, areAllSelected } = useMultiSelect(usableRefs, selectableRefs)
 
-watch(selected, (selected) => emit("update:modelValue", selected), {
+watch(selected, selected => emit('update:modelValue', selected), {
   immediate: true,
-});
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ColumnHeader.vue b/@xen-orchestra/lite/src/components/ColumnHeader.vue
index b9601086932..f1b321aa6c5 100644
--- a/@xen-orchestra/lite/src/components/ColumnHeader.vue
+++ b/@xen-orchestra/lite/src/components/ColumnHeader.vue
@@ -10,12 +10,12 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 defineProps<{
-  icon?: IconDefinition;
-}>();
+  icon?: IconDefinition
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/FormWidget.vue b/@xen-orchestra/lite/src/components/FormWidget.vue
index 395cdbd49e2..ee79a3324f0 100644
--- a/@xen-orchestra/lite/src/components/FormWidget.vue
+++ b/@xen-orchestra/lite/src/components/FormWidget.vue
@@ -26,18 +26,17 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 defineProps<{
-  before?: IconDefinition | string | object; // "object" added as workaround
-  after?: IconDefinition | string | object; // See https://github.com/vuejs/core/issues/4294
-  label?: string;
-  inline?: boolean;
-}>();
-
-const isIcon = (maybeIcon: any): maybeIcon is IconDefinition =>
-  typeof maybeIcon === "object";
+  before?: IconDefinition | string | object // "object" added as workaround
+  after?: IconDefinition | string | object // See https://github.com/vuejs/core/issues/4294
+  label?: string
+  inline?: boolean
+}>()
+
+const isIcon = (maybeIcon: any): maybeIcon is IconDefinition => typeof maybeIcon === 'object'
 </script>
 
 <style lang="postcss" scoped>
@@ -103,7 +102,7 @@ const isIcon = (maybeIcon: any): maybeIcon is IconDefinition =>
   }
 }
 
-:slotted(input[type="checkbox"]) {
+:slotted(input[type='checkbox']) {
   font: inherit;
   display: grid;
   flex: 1.5rem 0 0;
@@ -121,7 +120,7 @@ const isIcon = (maybeIcon: any): maybeIcon is IconDefinition =>
   &::before {
     width: 0.65em;
     height: 0.65em;
-    content: "";
+    content: '';
     transition: 120ms transform ease-in-out;
     transform: scale(0);
     transform-origin: center;
diff --git a/@xen-orchestra/lite/src/components/HostPatchesTable.vue b/@xen-orchestra/lite/src/components/HostPatchesTable.vue
index 30fffbe5a5e..114b7c7db10 100644
--- a/@xen-orchestra/lite/src/components/HostPatchesTable.vue
+++ b/@xen-orchestra/lite/src/components/HostPatchesTable.vue
@@ -27,35 +27,35 @@
 </template>
 
 <script lang="ts" setup>
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCounter from "@/components/ui/UiCounter.vue";
-import UiSpinner from "@/components/ui/UiSpinner.vue";
-import UiTable from "@/components/ui/UiTable.vue";
-import type { XenApiPatchWithHostRefs } from "@/composables/host-patches.composable";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { useUiStore } from "@/stores/ui.store";
-import { computed } from "vue";
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCounter from '@/components/ui/UiCounter.vue'
+import UiSpinner from '@/components/ui/UiSpinner.vue'
+import UiTable from '@/components/ui/UiTable.vue'
+import type { XenApiPatchWithHostRefs } from '@/composables/host-patches.composable'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { useUiStore } from '@/stores/ui.store'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  patches: XenApiPatchWithHostRefs[];
-  hasMultipleHosts: boolean;
-  areAllLoaded: boolean;
-  areSomeLoaded: boolean;
-}>();
+  patches: XenApiPatchWithHostRefs[]
+  hasMultipleHosts: boolean
+  areAllLoaded: boolean
+  areSomeLoaded: boolean
+}>()
 
 const sortedPatches = computed(() =>
   [...props.patches].sort((patch1, patch2) => {
     if (patch1.changelog == null) {
-      return 1;
+      return 1
     } else if (patch2.changelog == null) {
-      return -1;
+      return -1
     }
 
-    return patch1.changelog.date - patch2.changelog.date;
+    return patch1.changelog.date - patch2.changelog.date
   })
-);
+)
 
-const { isDesktop } = useUiStore();
+const { isDesktop } = useUiStore()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/LoginError.vue b/@xen-orchestra/lite/src/components/LoginError.vue
index fa446538384..a12c617b99f 100644
--- a/@xen-orchestra/lite/src/components/LoginError.vue
+++ b/@xen-orchestra/lite/src/components/LoginError.vue
@@ -1,23 +1,23 @@
 <template>
-  <div class="error" v-if="error !== undefined">
+  <div v-if="error !== undefined" class="error">
     <UiIcon :icon="faExclamationCircle" />
     <span v-if="error.message === 'SESSION_AUTHENTICATION_FAILED'">
-      {{ $t("password-invalid") }}
+      {{ $t('password-invalid') }}
     </span>
     <span v-else>
-      {{ $t("error-occurred") }}
+      {{ $t('error-occurred') }}
     </span>
   </div>
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { XenApiError } from "@/libs/xen-api/xen-api.types";
-import { faExclamationCircle } from "@fortawesome/free-solid-svg-icons";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { XenApiError } from '@/libs/xen-api/xen-api.types'
+import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons'
 
 defineProps<{
-  error: XenApiError | undefined;
-}>();
+  error: XenApiError | undefined
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/NoDataError.vue b/@xen-orchestra/lite/src/components/NoDataError.vue
index 3f04c375d0d..5a00cf8a073 100644
--- a/@xen-orchestra/lite/src/components/NoDataError.vue
+++ b/@xen-orchestra/lite/src/components/NoDataError.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="no-data">
     <img alt="No data" class="img" src="@/assets/undraw-bug-fixing.svg" />
-    <p class="text-error">{{ $t("error-no-data") }}</p>
+    <p class="text-error">{{ $t('error-no-data') }}</p>
   </div>
 </template>
 
diff --git a/@xen-orchestra/lite/src/components/NoResult.vue b/@xen-orchestra/lite/src/components/NoResult.vue
index ae82b42998c..6b1741b7c49 100644
--- a/@xen-orchestra/lite/src/components/NoResult.vue
+++ b/@xen-orchestra/lite/src/components/NoResult.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="no-result">
     <img alt="" class="img" src="@/assets/no-result.svg" />
-    <p class="text-info">{{ $t("no-result") }}</p>
+    <p class="text-info">{{ $t('no-result') }}</p>
   </div>
 </template>
 
diff --git a/@xen-orchestra/lite/src/components/ObjectLink.vue b/@xen-orchestra/lite/src/components/ObjectLink.vue
index e2fb7ea0344..c52bf4d2909 100644
--- a/@xen-orchestra/lite/src/components/ObjectLink.vue
+++ b/@xen-orchestra/lite/src/components/ObjectLink.vue
@@ -12,80 +12,75 @@
 </template>
 
 <script generic="T extends ObjectType" lang="ts" setup>
-import UiSpinner from "@/components/ui/UiSpinner.vue";
-import type {
-  ObjectType,
-  ObjectTypeToRecord,
-} from "@/libs/xen-api/xen-api.types";
-import { useHostStore } from "@/stores/xen-api/host.store";
-import { usePoolStore } from "@/stores/xen-api/pool.store";
-import { useSrStore } from "@/stores/xen-api/sr.store";
-import { useVmStore } from "@/stores/xen-api/vm.store";
-import type { StoreDefinition } from "pinia";
-import { computed, onUnmounted, watch } from "vue";
-import type { RouteRecordName } from "vue-router";
+import UiSpinner from '@/components/ui/UiSpinner.vue'
+import type { ObjectType, ObjectTypeToRecord } from '@/libs/xen-api/xen-api.types'
+import { useHostStore } from '@/stores/xen-api/host.store'
+import { usePoolStore } from '@/stores/xen-api/pool.store'
+import { useSrStore } from '@/stores/xen-api/sr.store'
+import { useVmStore } from '@/stores/xen-api/vm.store'
+import type { StoreDefinition } from 'pinia'
+import { computed, onUnmounted, watch } from 'vue'
+import type { RouteRecordName } from 'vue-router'
 
-type HandledTypes = "host" | "vm" | "sr" | "pool";
-type XRecord = ObjectTypeToRecord<T>;
+type HandledTypes = 'host' | 'vm' | 'sr' | 'pool'
+type XRecord = ObjectTypeToRecord<T>
 type Config = Partial<
   Record<
     ObjectType,
     {
-      useStore: StoreDefinition<any, any, any, any>;
-      routeName: RouteRecordName | undefined;
+      useStore: StoreDefinition<any, any, any, any>
+      routeName: RouteRecordName | undefined
     }
   >
->;
+>
 
 const props = defineProps<{
-  type: T;
-  uuid: XRecord["uuid"];
-}>();
+  type: T
+  uuid: XRecord['uuid']
+}>()
 
 const config: Config = {
-  host: { useStore: useHostStore, routeName: "host.dashboard" },
-  vm: { useStore: useVmStore, routeName: "vm.console" },
+  host: { useStore: useHostStore, routeName: 'host.dashboard' },
+  vm: { useStore: useVmStore, routeName: 'vm.console' },
   sr: { useStore: useSrStore, routeName: undefined },
-  pool: { useStore: usePoolStore, routeName: "pool.dashboard" },
-} satisfies Record<HandledTypes, any>;
+  pool: { useStore: usePoolStore, routeName: 'pool.dashboard' },
+} satisfies Record<HandledTypes, any>
 
-const store = computed(() => config[props.type]?.useStore());
+const store = computed(() => config[props.type]?.useStore())
 
-const subscriptionId = Symbol();
+const subscriptionId = Symbol('OBJECT_LINK_SUBSCRIPTION_ID')
 
 watch(
   store,
   (nextStore, previousStore) => {
-    previousStore?.unsubscribe(subscriptionId);
-    nextStore?.subscribe(subscriptionId);
+    previousStore?.unsubscribe(subscriptionId)
+    nextStore?.subscribe(subscriptionId)
   },
   { immediate: true }
-);
+)
 
 onUnmounted(() => {
-  store.value?.unsubscribe(subscriptionId);
-});
+  store.value?.unsubscribe(subscriptionId)
+})
 
-const record = computed<ObjectTypeToRecord<HandledTypes> | undefined>(
-  () => store.value?.getByUuid(props.uuid as any)
-);
+const record = computed<ObjectTypeToRecord<HandledTypes> | undefined>(() => store.value?.getByUuid(props.uuid as any))
 
 const isReady = computed(() => {
-  return store.value?.isReady ?? true;
-});
+  return store.value?.isReady ?? true
+})
 
 const objectRoute = computed(() => {
-  const { routeName } = config[props.type] ?? {};
+  const { routeName } = config[props.type] ?? {}
 
   if (routeName === undefined) {
-    return;
+    return
   }
 
   return {
     name: routeName,
     params: { uuid: props.uuid },
-  };
-});
+  }
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ObjectNotFoundWrapper.vue b/@xen-orchestra/lite/src/components/ObjectNotFoundWrapper.vue
index ad546edfd7d..944947f1b73 100644
--- a/@xen-orchestra/lite/src/components/ObjectNotFoundWrapper.vue
+++ b/@xen-orchestra/lite/src/components/ObjectNotFoundWrapper.vue
@@ -6,30 +6,24 @@
   <slot v-else />
 </template>
 
-<script
-  generic="T extends XenApiRecord<ObjectType>, I extends T['uuid']"
-  lang="ts"
-  setup
->
-import UiSpinner from "@/components/ui/UiSpinner.vue";
-import type { ObjectType, XenApiRecord } from "@/libs/xen-api/xen-api.types";
-import ObjectNotFoundView from "@/views/ObjectNotFoundView.vue";
-import { computed } from "vue";
-import { useRouter } from "vue-router";
+<script generic="T extends XenApiRecord<ObjectType>, I extends T['uuid']" lang="ts" setup>
+import UiSpinner from '@/components/ui/UiSpinner.vue'
+import type { ObjectType, XenApiRecord } from '@/libs/xen-api/xen-api.types'
+import ObjectNotFoundView from '@/views/ObjectNotFoundView.vue'
+import { computed } from 'vue'
+import { useRouter } from 'vue-router'
 
 const props = defineProps<{
-  isReady: boolean;
-  uuidChecker: (uuid: I) => boolean;
-  id?: I;
-}>();
+  isReady: boolean
+  uuidChecker: (uuid: I) => boolean
+  id?: I
+}>()
 
-const { currentRoute } = useRouter();
+const { currentRoute } = useRouter()
 
-const id = computed(() => props.id ?? (currentRoute.value.params.uuid as I));
+const id = computed(() => props.id ?? (currentRoute.value.params.uuid as I))
 
-const isRecordNotFound = computed(
-  () => props.isReady && !props.uuidChecker(id.value)
-);
+const isRecordNotFound = computed(() => props.isReady && !props.uuidChecker(id.value))
 </script>
 
 <style scoped>
diff --git a/@xen-orchestra/lite/src/components/PageUnderConstruction.vue b/@xen-orchestra/lite/src/components/PageUnderConstruction.vue
index c0a628e009b..e26a5298b83 100644
--- a/@xen-orchestra/lite/src/components/PageUnderConstruction.vue
+++ b/@xen-orchestra/lite/src/components/PageUnderConstruction.vue
@@ -5,21 +5,21 @@
     :title="$t('xo-lite-under-construction')"
   >
     <p class="contact">
-      {{ $t("do-you-have-needs") }}
+      {{ $t('do-you-have-needs') }}
       <a
         href="https://xcp-ng.org/forum/topic/5018/xo-lite-building-an-embedded-ui-in-xcp-ng"
         rel="noopener noreferrer"
         target="_blank"
       >
-        {{ $t("here") }} →
+        {{ $t('here') }} →
       </a>
     </p>
   </UiStatusPanel>
 </template>
 
 <script lang="ts" setup>
-import underConstruction from "@/assets/under-construction.svg";
-import UiStatusPanel from "@/components/ui/UiStatusPanel.vue";
+import underConstruction from '@/assets/under-construction.svg'
+import UiStatusPanel from '@/components/ui/UiStatusPanel.vue'
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/PoolOverrideWarning.vue b/@xen-orchestra/lite/src/components/PoolOverrideWarning.vue
index cc46f37896f..989eb895dc5 100644
--- a/@xen-orchestra/lite/src/components/PoolOverrideWarning.vue
+++ b/@xen-orchestra/lite/src/components/PoolOverrideWarning.vue
@@ -1,8 +1,6 @@
 <template>
   <div
     v-if="xenApi.isPoolOverridden"
-    class="warning-not-current-pool"
-    @click="xenApi.resetPoolMasterIp"
     v-tooltip="
       asTooltip && {
         placement: 'right',
@@ -12,6 +10,8 @@
       `,
       }
     "
+    class="warning-not-current-pool"
+    @click="xenApi.resetPoolMasterIp"
   >
     <div class="wrapper">
       <UiIcon :icon="faWarning" />
@@ -20,26 +20,26 @@
           <strong>{{ masterSessionStorage }}</strong>
         </i18n-t>
         <br />
-        {{ $t("click-to-return-default-pool") }}
+        {{ $t('click-to-return-default-pool') }}
       </p>
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { faWarning } from "@fortawesome/free-solid-svg-icons";
-import { useSessionStorage } from "@vueuse/core";
+import { faWarning } from '@fortawesome/free-solid-svg-icons'
+import { useSessionStorage } from '@vueuse/core'
 
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { vTooltip } from "@/directives/tooltip.directive";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { vTooltip } from '@/directives/tooltip.directive'
 
 defineProps<{
-  asTooltip?: boolean;
-}>();
+  asTooltip?: boolean
+}>()
 
-const xenApi = useXenApiStore();
-const masterSessionStorage = useSessionStorage("master", null);
+const xenApi = useXenApiStore()
+const masterSessionStorage = useSessionStorage('master', null)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/PowerStateIcon.vue b/@xen-orchestra/lite/src/components/PowerStateIcon.vue
index 7950207c1f7..3ed03f450b2 100644
--- a/@xen-orchestra/lite/src/components/PowerStateIcon.vue
+++ b/@xen-orchestra/lite/src/components/PowerStateIcon.vue
@@ -3,31 +3,25 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { VM_POWER_STATE } from "@/libs/xen-api/xen-api.enums";
-import {
-  faMoon,
-  faPause,
-  faPlay,
-  faQuestion,
-  faStop,
-} from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { VM_POWER_STATE } from '@/libs/xen-api/xen-api.enums'
+import { faMoon, faPause, faPlay, faQuestion, faStop } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  state: VM_POWER_STATE;
-}>();
+  state: VM_POWER_STATE
+}>()
 
 const icons = {
   [VM_POWER_STATE.RUNNING]: faPlay,
   [VM_POWER_STATE.PAUSED]: faPause,
   [VM_POWER_STATE.SUSPENDED]: faMoon,
   [VM_POWER_STATE.HALTED]: faStop,
-};
+}
 
-const icon = computed(() => icons[props.state] ?? faQuestion);
+const icon = computed(() => icons[props.state] ?? faQuestion)
 
-const className = computed(() => `state-${props.state.toLocaleLowerCase()}`);
+const className = computed(() => `state-${props.state.toLocaleLowerCase()}`)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ProgressCircle.vue b/@xen-orchestra/lite/src/components/ProgressCircle.vue
index 412b0bb438e..496172c57e6 100644
--- a/@xen-orchestra/lite/src/components/ProgressCircle.vue
+++ b/@xen-orchestra/lite/src/components/ProgressCircle.vue
@@ -1,9 +1,5 @@
 <template>
-  <svg
-    class="progress-circle"
-    viewBox="0 0 36 36"
-    xmlns="http://www.w3.org/2000/svg"
-  >
+  <svg class="progress-circle" viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
     <path
       class="progress-circle-background"
       d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"
@@ -12,31 +8,29 @@
       class="progress-circle-fill"
       d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831"
     />
-    <text class="progress-circle-text" text-anchor="middle" x="50%" y="50%">
-      {{ progress }}%
-    </text>
+    <text class="progress-circle-text" text-anchor="middle" x="50%" y="50%">{{ progress }}%</text>
   </svg>
 </template>
 
 <script lang="ts" setup>
-import { computed } from "vue";
+import { computed } from 'vue'
 
 interface Props {
-  value: number;
-  maxValue?: number;
+  value: number
+  maxValue?: number
 }
 
 const props = withDefaults(defineProps<Props>(), {
   maxValue: 100,
-});
+})
 
 const progress = computed(() => {
   if (props.maxValue === 0) {
-    return 0;
+    return 0
   }
 
-  return Math.round((props.value / props.maxValue) * 100);
-});
+  return Math.round((props.value / props.maxValue) * 100)
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/RelativeTime.vue b/@xen-orchestra/lite/src/components/RelativeTime.vue
index 44029777ac2..647a08c9532 100644
--- a/@xen-orchestra/lite/src/components/RelativeTime.vue
+++ b/@xen-orchestra/lite/src/components/RelativeTime.vue
@@ -3,18 +3,18 @@
 </template>
 
 <script lang="ts" setup>
-import useRelativeTime from "@/composables/relative-time.composable";
-import { parseDateTime } from "@/libs/utils";
-import { useNow } from "@vueuse/core";
-import { computed } from "vue";
+import useRelativeTime from '@/composables/relative-time.composable'
+import { parseDateTime } from '@/libs/utils'
+import { useNow } from '@vueuse/core'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  date: Date | number | string;
-}>();
+  date: Date | number | string
+}>()
 
-const date = computed(() => new Date(parseDateTime(props.date)));
-const now = useNow({ interval: 1000 });
-const relativeTime = useRelativeTime(date, now);
+const date = computed(() => new Date(parseDateTime(props.date)))
+const now = useNow({ interval: 1000 })
+const relativeTime = useRelativeTime(date, now)
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/RemoteConsole.vue b/@xen-orchestra/lite/src/components/RemoteConsole.vue
index 6b060f638af..fcca6f186c5 100644
--- a/@xen-orchestra/lite/src/components/RemoteConsole.vue
+++ b/@xen-orchestra/lite/src/components/RemoteConsole.vue
@@ -3,112 +3,103 @@
 </template>
 
 <script lang="ts" setup>
-import { useXenApiStore } from "@/stores/xen-api.store";
-import VncClient from "@novnc/novnc/core/rfb";
-import { promiseTimeout } from "@vueuse/shared";
-import { fibonacci } from "iterable-backoff";
-import { computed, onBeforeUnmount, ref, watchEffect } from "vue";
+import { useXenApiStore } from '@/stores/xen-api.store'
+import VncClient from '@novnc/novnc/core/rfb'
+import { promiseTimeout } from '@vueuse/shared'
+import { fibonacci } from 'iterable-backoff'
+import { computed, onBeforeUnmount, ref, watchEffect } from 'vue'
 
-const N_TOTAL_TRIES = 8;
-const FIBONACCI_MS_ARRAY: number[] = Array.from(
-  fibonacci().toMs().take(N_TOTAL_TRIES)
-);
+const N_TOTAL_TRIES = 8
+const FIBONACCI_MS_ARRAY: number[] = Array.from(fibonacci().toMs().take(N_TOTAL_TRIES))
 
 const props = defineProps<{
-  location: string;
-  isConsoleAvailable: boolean;
-}>();
+  location: string
+  isConsoleAvailable: boolean
+}>()
 
-const vmConsoleContainer = ref<HTMLDivElement>();
-const xenApiStore = useXenApiStore();
+const vmConsoleContainer = ref<HTMLDivElement>()
+const xenApiStore = useXenApiStore()
 const url = computed(() => {
   if (xenApiStore.currentSessionId == null) {
-    return;
+    return
   }
-  const _url = new URL(props.location);
-  _url.protocol = window.location.protocol === "https:" ? "wss:" : "ws:";
-  _url.searchParams.set("session_id", xenApiStore.currentSessionId);
-  return _url;
-});
+  const _url = new URL(props.location)
+  _url.protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:'
+  _url.searchParams.set('session_id', xenApiStore.currentSessionId)
+  return _url
+})
 
-let vncClient: VncClient | undefined;
-let nConnectionAttempts = 0;
+let vncClient: VncClient | undefined
+let nConnectionAttempts = 0
 
 const handleDisconnectionEvent = () => {
-  clearVncClient();
+  clearVncClient()
 
   if (props.isConsoleAvailable) {
-    nConnectionAttempts++;
+    nConnectionAttempts++
 
     if (nConnectionAttempts > N_TOTAL_TRIES) {
-      console.error(
-        "The number of reconnection attempts has been exceeded for:",
-        props.location
-      );
-      return;
+      console.error('The number of reconnection attempts has been exceeded for:', props.location)
+      return
     }
 
     console.error(
-      `Connection lost for the remote console: ${
-        props.location
-      }. New attempt in ${FIBONACCI_MS_ARRAY[nConnectionAttempts - 1]}ms`
-    );
-    createVncConnection();
+      `Connection lost for the remote console: ${props.location}. New attempt in ${
+        FIBONACCI_MS_ARRAY[nConnectionAttempts - 1]
+      }ms`
+    )
+    createVncConnection()
   }
-};
-const handleConnectionEvent = () => (nConnectionAttempts = 0);
+}
+const handleConnectionEvent = () => (nConnectionAttempts = 0)
 
 const clearVncClient = () => {
   if (vncClient === undefined) {
-    return;
+    return
   }
 
-  vncClient.removeEventListener("disconnect", handleDisconnectionEvent);
-  vncClient.removeEventListener("connect", handleConnectionEvent);
+  vncClient.removeEventListener('disconnect', handleDisconnectionEvent)
+  vncClient.removeEventListener('connect', handleConnectionEvent)
 
-  if (vncClient._rfbConnectionState !== "disconnected") {
-    vncClient.disconnect();
+  if (vncClient._rfbConnectionState !== 'disconnected') {
+    vncClient.disconnect()
   }
 
-  vncClient = undefined;
-};
+  vncClient = undefined
+}
 
 const createVncConnection = async () => {
   if (nConnectionAttempts !== 0) {
-    await promiseTimeout(FIBONACCI_MS_ARRAY[nConnectionAttempts - 1]);
+    await promiseTimeout(FIBONACCI_MS_ARRAY[nConnectionAttempts - 1])
   }
 
   vncClient = new VncClient(vmConsoleContainer.value!, url.value!.toString(), {
-    wsProtocols: ["binary"],
-  });
-  vncClient.scaleViewport = true;
+    wsProtocols: ['binary'],
+  })
+  vncClient.scaleViewport = true
 
-  vncClient.addEventListener("disconnect", handleDisconnectionEvent);
-  vncClient.addEventListener("connect", handleConnectionEvent);
-};
+  vncClient.addEventListener('disconnect', handleDisconnectionEvent)
+  vncClient.addEventListener('connect', handleConnectionEvent)
+}
 
 watchEffect(() => {
-  if (
-    url.value === undefined ||
-    vmConsoleContainer.value === undefined ||
-    !props.isConsoleAvailable
-  ) {
-    return;
+  if (url.value === undefined || vmConsoleContainer.value === undefined || !props.isConsoleAvailable) {
+    return
   }
 
-  nConnectionAttempts = 0;
+  nConnectionAttempts = 0
 
-  clearVncClient();
-  createVncConnection();
-});
+  clearVncClient()
+  createVncConnection()
+})
 
 onBeforeUnmount(() => {
-  clearVncClient();
-});
+  clearVncClient()
+})
 
 defineExpose({
   sendCtrlAltDel: () => vncClient?.sendCtrlAltDel(),
-});
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/RouterTab.vue b/@xen-orchestra/lite/src/components/RouterTab.vue
index bbdd2a15624..68654875709 100644
--- a/@xen-orchestra/lite/src/components/RouterTab.vue
+++ b/@xen-orchestra/lite/src/components/RouterTab.vue
@@ -7,20 +7,20 @@
 </template>
 
 <script lang="ts" setup>
-import { useContext } from "@/composables/context.composable";
-import { DisabledContext } from "@/context";
-import type { RouteLocationRaw } from "vue-router";
-import UiTab from "@/components/ui/UiTab.vue";
+import { useContext } from '@/composables/context.composable'
+import { DisabledContext } from '@/context'
+import type { RouteLocationRaw } from 'vue-router'
+import UiTab from '@/components/ui/UiTab.vue'
 
 const props = withDefaults(
   defineProps<{
-    to: RouteLocationRaw;
-    disabled?: boolean;
+    to: RouteLocationRaw
+    disabled?: boolean
   }>(),
   { disabled: undefined }
-);
+)
 
-const isDisabled = useContext(DisabledContext, () => props.disabled);
+const isDisabled = useContext(DisabledContext, () => props.disabled)
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/TextLogo.vue b/@xen-orchestra/lite/src/components/TextLogo.vue
index d46a905e7b2..ea10ae3cb01 100644
--- a/@xen-orchestra/lite/src/components/TextLogo.vue
+++ b/@xen-orchestra/lite/src/components/TextLogo.vue
@@ -19,12 +19,8 @@
       <g>
         <path d="M476.32,675.94h20.81v10.04h-33.47v-63.14h12.66v53.1Z" />
         <path d="M517.84,622.84v63.14h-12.66v-63.14h12.66Z" />
-        <path
-          d="M573.29,622.84v10.22h-16.82v52.92h-12.66v-52.92h-16.83v-10.22h46.31Z"
-        />
-        <path
-          d="M595.18,633.06v15.83h21.26v10.04h-21.26v16.73h23.97v10.31h-36.64v-63.23h36.64v10.31h-23.97Z"
-        />
+        <path d="M573.29,622.84v10.22h-16.82v52.92h-12.66v-52.92h-16.83v-10.22h46.31Z" />
+        <path d="M595.18,633.06v15.83h21.26v10.04h-21.26v16.73h23.97v10.31h-36.64v-63.23h36.64v10.31h-23.97Z" />
       </g>
     </g>
   </svg>
diff --git a/@xen-orchestra/lite/src/components/TitleBar.vue b/@xen-orchestra/lite/src/components/TitleBar.vue
index 9002e3277cb..2477ef1133b 100644
--- a/@xen-orchestra/lite/src/components/TitleBar.vue
+++ b/@xen-orchestra/lite/src/components/TitleBar.vue
@@ -11,12 +11,12 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 defineProps<{
-  icon: IconDefinition;
-}>();
+  icon: IconDefinition
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/UsageBar.vue b/@xen-orchestra/lite/src/components/UsageBar.vue
index c0c8ecc9ea5..11d75d210cb 100644
--- a/@xen-orchestra/lite/src/components/UsageBar.vue
+++ b/@xen-orchestra/lite/src/components/UsageBar.vue
@@ -10,49 +10,46 @@
       class="progress-item"
     >
       <UiProgressBar :value="item.value" color="custom" />
-      <UiProgressLegend
-        :label="item.label"
-        :value="item.badgeLabel ?? `${item.value}%`"
-      />
+      <UiProgressLegend :label="item.label" :value="item.badgeLabel ?? `${item.value}%`" />
     </div>
     <slot :total-percent="computedData.totalPercentUsage" name="footer" />
   </div>
 </template>
 
 <script lang="ts" setup>
-import UiProgressBar from "@/components/ui/progress/UiProgressBar.vue";
-import UiProgressLegend from "@/components/ui/progress/UiProgressLegend.vue";
-import type { StatData } from "@/types/stat";
-import { computed } from "vue";
+import UiProgressBar from '@/components/ui/progress/UiProgressBar.vue'
+import UiProgressLegend from '@/components/ui/progress/UiProgressLegend.vue'
+import type { StatData } from '@/types/stat'
+import { computed } from 'vue'
 
 interface Props {
-  data: StatData[];
-  nItems?: number;
+  data: StatData[]
+  nItems?: number
 }
 
-const MIN_WARNING_VALUE = 80;
-const MIN_DANGEROUS_VALUE = 90;
+const MIN_WARNING_VALUE = 80
+const MIN_DANGEROUS_VALUE = 90
 
-const props = defineProps<Props>();
+const props = defineProps<Props>()
 
 const computedData = computed(() => {
-  const _data = props.data;
-  let totalPercentUsage = 0;
+  const _data = props.data
+  let totalPercentUsage = 0
   return {
     sortedArray: _data
-      ?.map((item) => {
-        const value = Math.round((item.value / (item.maxValue ?? 100)) * 100);
-        totalPercentUsage += value;
+      ?.map(item => {
+        const value = Math.round((item.value / (item.maxValue ?? 100)) * 100)
+        totalPercentUsage += value
         return {
           ...item,
           value,
-        };
+        }
       })
       .sort((item, nextItem) => nextItem.value - item.value)
       .slice(0, props.nItems ?? _data.length),
     totalPercentUsage,
-  };
-});
+  }
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/charts/LinearChart.md b/@xen-orchestra/lite/src/components/charts/LinearChart.md
index 4a449f654b7..8410a6f843b 100644
--- a/@xen-orchestra/lite/src/components/charts/LinearChart.md
+++ b/@xen-orchestra/lite/src/components/charts/LinearChart.md
@@ -6,28 +6,28 @@
 </template>
 
 <script lang="ts" setup>
-import type { LinearChartData } from "@/types/chart";
-import LinearChart from "@/components/charts/LinearChart.vue";
+import type { LinearChartData } from '@/types/chart'
+import LinearChart from '@/components/charts/LinearChart.vue'
 
 const data: LinearChartData = [
   {
-    label: "First series",
+    label: 'First series',
     data: [
       { timestamp: 1670478371123, value: 1234 },
       { timestamp: 1670478519751, value: 1234 },
     ],
   },
   {
-    label: "Second series",
+    label: 'Second series',
     data: [
       { timestamp: 1670478519751, value: 1234 },
       { timestamp: 167047555000, value: 1234 },
     ],
   },
-];
+]
 
 const customValueFormatter = (value: number) => {
-  return `${value} (Doubled: ${value * 2})`;
-};
+  return `${value} (Doubled: ${value * 2})`
+}
 </script>
 ```
diff --git a/@xen-orchestra/lite/src/components/charts/LinearChart.vue b/@xen-orchestra/lite/src/components/charts/LinearChart.vue
index c932fac3896..ff0ef5bd797 100644
--- a/@xen-orchestra/lite/src/components/charts/LinearChart.vue
+++ b/@xen-orchestra/lite/src/components/charts/LinearChart.vue
@@ -3,81 +3,70 @@
 </template>
 
 <script lang="ts" setup>
-import type { LinearChartData, ValueFormatter } from "@/types/chart";
-import { IK_CHART_VALUE_FORMATTER } from "@/types/injection-keys";
-import { utcFormat } from "d3-time-format";
-import type { EChartsOption } from "echarts";
-import { LineChart } from "echarts/charts";
-import {
-  GridComponent,
-  LegendComponent,
-  TooltipComponent,
-} from "echarts/components";
-import { use } from "echarts/core";
-import { CanvasRenderer } from "echarts/renderers";
-import { computed, provide } from "vue";
-import VueCharts from "vue-echarts";
+import type { LinearChartData, ValueFormatter } from '@/types/chart'
+import { IK_CHART_VALUE_FORMATTER } from '@/types/injection-keys'
+import { utcFormat } from 'd3-time-format'
+import type { EChartsOption } from 'echarts'
+import { LineChart } from 'echarts/charts'
+import { GridComponent, LegendComponent, TooltipComponent } from 'echarts/components'
+import { use } from 'echarts/core'
+import { CanvasRenderer } from 'echarts/renderers'
+import { computed, provide } from 'vue'
+import VueCharts from 'vue-echarts'
 
-const Y_AXIS_MAX_VALUE = 200;
+const Y_AXIS_MAX_VALUE = 200
 
 const props = defineProps<{
-  data: LinearChartData;
-  valueFormatter?: ValueFormatter;
-  maxValue?: number;
-}>();
+  data: LinearChartData
+  valueFormatter?: ValueFormatter
+  maxValue?: number
+}>()
 
 const valueFormatter = computed<ValueFormatter>(() => {
-  const formatter = props.valueFormatter;
+  const formatter = props.valueFormatter
 
-  return (value) => {
+  return value => {
     if (formatter === undefined) {
-      return value.toString();
+      return value.toString()
     }
 
-    return formatter(value);
-  };
-});
+    return formatter(value)
+  }
+})
 
-provide(IK_CHART_VALUE_FORMATTER, valueFormatter);
+provide(IK_CHART_VALUE_FORMATTER, valueFormatter)
 
-use([
-  CanvasRenderer,
-  LineChart,
-  GridComponent,
-  TooltipComponent,
-  LegendComponent,
-]);
+use([CanvasRenderer, LineChart, GridComponent, TooltipComponent, LegendComponent])
 
 const option = computed<EChartsOption>(() => ({
   legend: {
-    data: props.data.map((series) => series.label),
+    data: props.data.map(series => series.label),
   },
   tooltip: {
-    valueFormatter: (v) => valueFormatter.value(v as number),
+    valueFormatter: v => valueFormatter.value(v as number),
   },
   xAxis: {
-    type: "time",
+    type: 'time',
     axisLabel: {
-      formatter: (timestamp: number) =>
-        utcFormat("%a\n%I:%M\n%p")(new Date(timestamp)),
+      formatter: (timestamp: number) => utcFormat('%a\n%I:%M\n%p')(new Date(timestamp)),
       showMaxLabel: false,
       showMinLabel: false,
     },
   },
   yAxis: {
-    type: "value",
+    type: 'value',
     axisLabel: {
       formatter: valueFormatter.value,
     },
     max: props.maxValue ?? Y_AXIS_MAX_VALUE,
   },
   series: props.data.map((series, index) => ({
-    type: "line",
+    type: 'line',
     name: series.label,
     zlevel: index + 1,
-    data: series.data.map((item) => [item.timestamp, item.value]),
+    data: series.data.map(item => [item.timestamp, item.value]),
   })),
-}));
+}))
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/component-story/ComponentStory.vue b/@xen-orchestra/lite/src/components/component-story/ComponentStory.vue
index dfaa996f281..ee811e2e450 100644
--- a/@xen-orchestra/lite/src/components/component-story/ComponentStory.vue
+++ b/@xen-orchestra/lite/src/components/component-story/ComponentStory.vue
@@ -3,31 +3,18 @@
     <UiTab v-bind="tab(TAB.PROPS, propParams)">Props</UiTab>
     <UiTab class="event-tab" v-bind="tab(TAB.EVENTS, eventParams)">
       Events
-      <UiCounter
-        v-if="unreadEventsCount > 0"
-        :value="unreadEventsCount"
-        color="success"
-      />
+      <UiCounter v-if="unreadEventsCount > 0" :value="unreadEventsCount" color="success" />
     </UiTab>
     <UiTab v-bind="tab(TAB.SLOTS, slotParams)">Slots</UiTab>
     <UiTab v-bind="tab(TAB.SETTINGS, settingParams)">Settings</UiTab>
     <AppMenu placement="bottom" shadow>
       <template #trigger="{ open, isOpen }">
-        <UiTab
-          :active="isOpen"
-          :disabled="presets === undefined"
-          class="preset-tab"
-          @click="open"
-        >
+        <UiTab :active="isOpen" :disabled="presets === undefined" class="preset-tab" @click="open">
           <UiIcon :icon="faSliders" />
           Presets
         </UiTab>
       </template>
-      <MenuItem
-        v-for="(preset, label) in presets"
-        :key="label"
-        @click="applyPreset(preset)"
-      >
+      <MenuItem v-for="(preset, label) in presets" :key="label" @click="applyPreset(preset)">
         {{ label }}
       </MenuItem>
     </AppMenu>
@@ -38,16 +25,9 @@
       <i>No configuration defined</i>
     </UiCard>
     <UiCard v-else-if="selectedTab === TAB.PROPS" class="tab-content">
-      <StoryPropParams
-        v-model="propValues"
-        :params="propParams"
-        @reset="resetProps"
-      />
+      <StoryPropParams v-model="propValues" :params="propParams" @reset="resetProps" />
     </UiCard>
-    <div
-      v-else-if="selectedTab === TAB.EVENTS"
-      class="tab-content event-tab-content"
-    >
+    <div v-else-if="selectedTab === TAB.EVENTS" class="tab-content event-tab-content">
       <UiCard>
         <StoryEventParams :params="eventParams" />
       </UiCard>
@@ -55,22 +35,11 @@
         <UiCardTitle>
           Logs
           <template #right>
-            <UiButton
-              v-if="eventsLog.length > 0"
-              transparent
-              @click="eventsLog = []"
-            >
-              Clear
-            </UiButton>
+            <UiButton v-if="eventsLog.length > 0" transparent @click="eventsLog = []"> Clear </UiButton>
           </template>
         </UiCardTitle>
         <div class="events-log">
-          <CodeHighlight
-            v-for="event in eventLogRows"
-            :key="event.id"
-            :code="event.args"
-            class="event-log"
-          />
+          <CodeHighlight v-for="event in eventLogRows" :key="event.id" :code="event.args" class="event-log" />
         </div>
       </UiCard>
     </div>
@@ -78,11 +47,7 @@
       <StorySlotParams :params="slotParams" />
     </UiCard>
     <UiCard v-else-if="selectedTab === TAB.SETTINGS" class="tab-content">
-      <StorySettingParams
-        v-model="settingValues"
-        :params="settingParams"
-        @reset="resetSettings"
-      />
+      <StorySettingParams v-model="settingValues" :params="settingParams" @reset="resetSettings" />
     </UiCard>
     <UiCard class="tab-content story-result">
       <slot :properties="slotProperties" :settings="slotSettings" />
@@ -94,21 +59,21 @@
 </template>
 
 <script lang="ts" setup>
-import AppMarkdown from "@/components/AppMarkdown.vue";
-import CodeHighlight from "@/components/CodeHighlight.vue";
-import StoryEventParams from "@/components/component-story/StoryEventParams.vue";
-import StoryPropParams from "@/components/component-story/StoryPropParams.vue";
-import StorySettingParams from "@/components/component-story/StorySettingParams.vue";
-import StorySlotParams from "@/components/component-story/StorySlotParams.vue";
-import AppMenu from "@/components/menu/AppMenu.vue";
-import MenuItem from "@/components/menu/MenuItem.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UiCounter from "@/components/ui/UiCounter.vue";
-import UiTab from "@/components/ui/UiTab.vue";
-import UiTabBar from "@/components/ui/UiTabBar.vue";
+import AppMarkdown from '@/components/AppMarkdown.vue'
+import CodeHighlight from '@/components/CodeHighlight.vue'
+import StoryEventParams from '@/components/component-story/StoryEventParams.vue'
+import StoryPropParams from '@/components/component-story/StoryPropParams.vue'
+import StorySettingParams from '@/components/component-story/StorySettingParams.vue'
+import StorySlotParams from '@/components/component-story/StorySlotParams.vue'
+import AppMenu from '@/components/menu/AppMenu.vue'
+import MenuItem from '@/components/menu/MenuItem.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UiCounter from '@/components/ui/UiCounter.vue'
+import UiTab from '@/components/ui/UiTab.vue'
+import UiTabBar from '@/components/ui/UiTabBar.vue'
 import {
   isEventParam,
   isModelParam,
@@ -117,183 +82,174 @@ import {
   isSlotParam,
   ModelParam,
   type Param,
-} from "@/libs/story/story-param";
-import { faSliders } from "@fortawesome/free-solid-svg-icons";
-import "highlight.js/styles/github-dark.css";
-import { uniqueId, upperFirst } from "lodash-es";
-import { computed, reactive, ref, watch, watchEffect } from "vue";
-import { useRoute } from "vue-router";
+} from '@/libs/story/story-param'
+import { faSliders } from '@fortawesome/free-solid-svg-icons'
+import 'highlight.js/styles/github-dark.css'
+import { uniqueId, upperFirst } from 'lodash-es'
+import { computed, reactive, ref, watch, watchEffect } from 'vue'
+import { useRoute } from 'vue-router'
+
+enum TAB {
+  NONE,
+  PROPS,
+  EVENTS,
+  SLOTS,
+  SETTINGS,
+}
 
 const tab = (tab: TAB, params: Param[]) =>
   reactive({
     onClick: () => (selectedTab.value = tab),
     active: computed(() => selectedTab.value === tab),
     disabled: computed(() => params.length === 0),
-  });
+  })
 
 const props = defineProps<{
-  params: (Param | ModelParam)[];
+  params: (Param | ModelParam)[]
   presets?: Record<
     string,
     {
-      props?: Record<string, any>;
-      settings?: Record<string, any>;
+      props?: Record<string, any>
+      settings?: Record<string, any>
     }
-  >;
-  fullWidthComponent?: boolean;
-}>();
+  >
+  fullWidthComponent?: boolean
+}>()
 
-enum TAB {
-  NONE,
-  PROPS,
-  EVENTS,
-  SLOTS,
-  SETTINGS,
-}
-
-const modelParams = computed(() => props.params.filter(isModelParam));
+const modelParams = computed(() => props.params.filter(isModelParam))
 
 const propParams = computed(() => [
   ...props.params.filter(isPropParam),
-  ...modelParams.value.map((modelParam) => modelParam.getPropParam()),
-]);
+  ...modelParams.value.map(modelParam => modelParam.getPropParam()),
+])
 
 const eventParams = computed(() => [
   ...props.params.filter(isEventParam),
-  ...modelParams.value.map((modelParam) => modelParam.getEventParam()),
-]);
+  ...modelParams.value.map(modelParam => modelParam.getEventParam()),
+])
 
-const settingParams = computed(() => props.params.filter(isSettingParam));
-const slotParams = computed(() => props.params.filter(isSlotParam));
+const settingParams = computed(() => props.params.filter(isSettingParam))
+const slotParams = computed(() => props.params.filter(isSlotParam))
 
-const selectedTab = ref<TAB>(TAB.NONE);
+const selectedTab = ref<TAB>(TAB.NONE)
 
 if (propParams.value.length !== 0) {
-  selectedTab.value = TAB.PROPS;
+  selectedTab.value = TAB.PROPS
 } else if (eventParams.value.length !== 0) {
-  selectedTab.value = TAB.EVENTS;
+  selectedTab.value = TAB.EVENTS
 } else if (slotParams.value.length !== 0) {
-  selectedTab.value = TAB.SLOTS;
+  selectedTab.value = TAB.SLOTS
 } else if (settingParams.value.length !== 0) {
-  selectedTab.value = TAB.SETTINGS;
+  selectedTab.value = TAB.SETTINGS
 }
 
-const propValues = ref<Record<string, any>>({});
-const settingValues = ref<Record<string, any>>({});
-const eventsLog = ref<
-  { id: string; name: string; args: { name: string; value: any }[] }[]
->([]);
-const unreadEventsCount = ref(0);
+const propValues = ref<Record<string, any>>({})
+const settingValues = ref<Record<string, any>>({})
+const eventsLog = ref<{ id: string; name: string; args: { name: string; value: any }[] }[]>([])
+const unreadEventsCount = ref(0)
 
 const resetProps = () => {
-  propParams.value.forEach((param) => {
-    propValues.value[param.name] = param.getPresetValue();
-  });
-};
+  propParams.value.forEach(param => {
+    propValues.value[param.name] = param.getPresetValue()
+  })
+}
 
 const resetSettings = () => {
-  settingParams.value.forEach((param) => {
-    settingValues.value[param.name] = param.getPresetValue();
-  });
-};
+  settingParams.value.forEach(param => {
+    settingValues.value[param.name] = param.getPresetValue()
+  })
+}
 
 watchEffect(() => {
-  resetProps();
-  resetSettings();
-});
+  resetProps()
+  resetSettings()
+})
 
-watch(selectedTab, (tab) => {
+watch(selectedTab, tab => {
   if (tab === TAB.EVENTS) {
-    unreadEventsCount.value = 0;
+    unreadEventsCount.value = 0
   }
-});
+})
 
 const logEvent = (name: string, args: { name: string; value: any }[]) => {
   if (selectedTab.value !== TAB.EVENTS) {
-    unreadEventsCount.value += 1;
+    unreadEventsCount.value += 1
   }
 
   eventsLog.value.unshift({
-    id: uniqueId("event-log"),
+    id: uniqueId('event-log'),
     name,
     args,
-  });
-};
+  })
+}
 
 const eventLogRows = computed(() => {
-  return eventsLog.value.map((eventLog) => {
-    const args = eventLog.args
-      .map((arg) => `${arg.name}: ${JSON.stringify(arg.value)}`)
-      .join(", ");
+  return eventsLog.value.map(eventLog => {
+    const args = eventLog.args.map(arg => `${arg.name}: ${JSON.stringify(arg.value)}`).join(', ')
 
     return {
       id: eventLog.id,
       name: eventLog.name,
       args: `${eventLog.name}(${args})`,
-    };
-  });
-});
+    }
+  })
+})
 
 const slotProperties = computed(() => {
-  const properties: Record<string, any> = {};
+  const properties: Record<string, any> = {}
 
   propParams.value.forEach(({ name }) => {
-    properties[name] = propValues.value[name];
-  });
+    properties[name] = propValues.value[name]
+  })
 
-  eventParams.value.forEach((eventParam) => {
+  eventParams.value.forEach(eventParam => {
     properties[`on${upperFirst(eventParam.name)}`] = (...args: any[]) => {
       if (eventParam.isVModel()) {
-        propValues.value[eventParam.rawName] = args[0];
+        propValues.value[eventParam.rawName] = args[0]
       }
-      const logArgs = Object.keys(eventParam.getArguments()).map(
-        (argName, index) => ({
-          name: argName,
-          value: args[index],
-        })
-      );
-      eventParam.getPresetValue()?.(...args);
-      logEvent(eventParam.name, logArgs);
-    };
-  });
-
-  return properties;
-});
+      const logArgs = Object.keys(eventParam.getArguments()).map((argName, index) => ({
+        name: argName,
+        value: args[index],
+      }))
+      eventParam.getPresetValue()?.(...args)
+      logEvent(eventParam.name, logArgs)
+    }
+  })
+
+  return properties
+})
 
 const slotSettings = computed(() => {
-  const result: Record<string, any> = {};
+  const result: Record<string, any> = {}
 
   settingParams.value.forEach(({ name }) => {
-    result[name] = settingValues.value[name];
-  });
+    result[name] = settingValues.value[name]
+  })
 
-  return result;
-});
+  return result
+})
 
-const documentation = ref();
+const documentation = ref()
 
-const route = useRoute();
+const route = useRoute()
 
-route.meta.storyMdLoader?.().then((md) => {
-  documentation.value = md;
-});
+route.meta.storyMdLoader?.().then(md => {
+  documentation.value = md
+})
 
-const applyPreset = (preset: {
-  props?: Record<string, any>;
-  settings?: Record<string, any>;
-}) => {
+const applyPreset = (preset: { props?: Record<string, any>; settings?: Record<string, any> }) => {
   if (preset.props !== undefined) {
     Object.entries(preset.props).forEach(([name, value]) => {
-      propValues.value[name] = value;
-    });
+      propValues.value[name] = value
+    })
   }
 
   if (preset.settings !== undefined) {
     Object.entries(preset.settings).forEach(([name, value]) => {
-      settingValues.value[name] = value;
-    });
+      settingValues.value[name] = value
+    })
   }
-};
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/component-story/StoryEventParams.vue b/@xen-orchestra/lite/src/components/component-story/StoryEventParams.vue
index a4822aea7f6..0fa25d13a32 100644
--- a/@xen-orchestra/lite/src/components/component-story/StoryEventParams.vue
+++ b/@xen-orchestra/lite/src/components/component-story/StoryEventParams.vue
@@ -24,11 +24,11 @@
 </template>
 
 <script lang="ts" setup>
-import CodeHighlight from "@/components/CodeHighlight.vue";
-import StoryParamsTable from "@/components/component-story/StoryParamsTable.vue";
-import type { EventParam } from "@/libs/story/story-param";
+import CodeHighlight from '@/components/CodeHighlight.vue'
+import StoryParamsTable from '@/components/component-story/StoryParamsTable.vue'
+import type { EventParam } from '@/libs/story/story-param'
 
 defineProps<{
-  params: EventParam[];
-}>();
+  params: EventParam[]
+}>()
 </script>
diff --git a/@xen-orchestra/lite/src/components/component-story/StoryExampleComponent.vue b/@xen-orchestra/lite/src/components/component-story/StoryExampleComponent.vue
index 4b9b831d8df..85ebc43baee 100644
--- a/@xen-orchestra/lite/src/components/component-story/StoryExampleComponent.vue
+++ b/@xen-orchestra/lite/src/components/component-story/StoryExampleComponent.vue
@@ -18,51 +18,39 @@
     <div>Optional string prop: {{ imOptional }}</div>
     <div>Optional string prop with default: {{ imOptionalWithDefault }}</div>
     Input for default v-model:
-    <input
-      :value="modelValue"
-      @input="
-        emit('update:modelValue', ($event.target as HTMLInputElement)?.value)
-      "
-    />
+    <input :value="modelValue" @input="emit('update:modelValue', ($event.target as HTMLInputElement)?.value)" />
     Input for v-model:customModel:
-    <input
-      :value="customModel"
-      @input="
-        emit('update:customModel', ($event.target as HTMLInputElement)?.value)
-      "
-    />
+    <input :value="customModel" @input="emit('update:customModel', ($event.target as HTMLInputElement)?.value)" />
     Event with no arguments:
     <button type="button" @click="emit('click')">Click me</button>
     Event with argument:
-    <button type="button" @click="emit('clickWithArg', 'my-id')">
-      Click me
-    </button>
+    <button type="button" @click="emit('clickWithArg', 'my-id')">Click me</button>
   </div>
 </template>
 
 <script lang="ts" setup>
-const moonDistance = 384400;
+const moonDistance = 384400
 
 withDefaults(
   defineProps<{
-    imString: string;
-    imNumber: number;
-    imOptional?: string;
-    imOptionalWithDefault?: string;
-    modelValue?: string;
-    customModel?: string;
+    imString: string
+    imNumber: number
+    imOptional?: string
+    imOptionalWithDefault?: string
+    modelValue?: string
+    customModel?: string
   }>(),
   {
-    imOptionalWithDefault: "My default value",
+    imOptionalWithDefault: 'My default value',
   }
-);
+)
 
 const emit = defineEmits<{
-  (event: "update:modelValue", value: string): void;
-  (event: "update:customModel", value: string): void;
-  (event: "click"): void;
-  (event: "clickWithArg", id: string): void;
-}>();
+  (event: 'update:modelValue', value: string): void
+  (event: 'update:customModel', value: string): void
+  (event: 'click'): void
+  (event: 'clickWithArg', id: string): void
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/component-story/StoryMenu.vue b/@xen-orchestra/lite/src/components/component-story/StoryMenu.vue
index 2a3f4df40ae..5f304b01aa6 100644
--- a/@xen-orchestra/lite/src/components/component-story/StoryMenu.vue
+++ b/@xen-orchestra/lite/src/components/component-story/StoryMenu.vue
@@ -2,80 +2,73 @@
   <RouterLink :to="{ name: 'story' }">
     <UiTitle type="h4">Stories</UiTitle>
   </RouterLink>
-  <StoryMenuTree
-    :tree="tree"
-    @toggle-directory="toggleDirectory"
-    :opened-directories="openedDirectories"
-  />
+  <StoryMenuTree :tree="tree" :opened-directories="openedDirectories" @toggle-directory="toggleDirectory" />
 </template>
 
 <script lang="ts" setup>
-import StoryMenuTree from "@/components/component-story/StoryMenuTree.vue";
-import UiTitle from "@/components/ui/UiTitle.vue";
-import { type RouteRecordNormalized, useRoute, useRouter } from "vue-router";
-import { ref } from "vue";
+import StoryMenuTree from '@/components/component-story/StoryMenuTree.vue'
+import UiTitle from '@/components/ui/UiTitle.vue'
+import { type RouteRecordNormalized, useRoute, useRouter } from 'vue-router'
+import { ref } from 'vue'
 
-const { getRoutes } = useRouter();
+const { getRoutes } = useRouter()
 
-const routes = getRoutes().filter((route) => route.meta.isStory);
+const routes = getRoutes().filter(route => route.meta.isStory)
 
-export type StoryTree = Map<
-  string,
-  { path: string; directory: string; children: StoryTree }
->;
+export type StoryTree = Map<string, { path: string; directory: string; children: StoryTree }>
 
 function createTree(routes: RouteRecordNormalized[]) {
-  const tree: StoryTree = new Map();
+  const tree: StoryTree = new Map()
 
   for (const route of routes) {
-    const parts = route.path.slice(7).split("/");
-    let currentNode = tree;
-    let currentPath = "";
+    const parts = route.path.slice(7).split('/')
+    let currentNode = tree
+    let currentPath = ''
 
     for (const part of parts) {
-      currentPath = currentPath ? `${currentPath}/${part}` : part;
+      currentPath = currentPath ? `${currentPath}/${part}` : part
       if (!currentNode.has(part)) {
         currentNode.set(part, {
           children: new Map(),
           path: route.path,
           directory: currentPath,
-        });
+        })
       }
-      currentNode = currentNode.get(part)!.children;
+      currentNode = currentNode.get(part)!.children
     }
   }
 
-  return tree;
+  return tree
 }
 
-const tree = createTree(routes);
+const tree = createTree(routes)
 
-const currentRoute = useRoute();
+const currentRoute = useRoute()
 
 const getDefaultOpenedDirectories = (): Set<string> => {
   if (!currentRoute.meta.isStory) {
-    return new Set<string>();
+    return new Set<string>()
   }
 
-  const openedDirectories = new Set<string>();
-  const parts = currentRoute.path.split("/").slice(2);
-  let currentPath = "";
+  const openedDirectories = new Set<string>()
+  const parts = currentRoute.path.split('/').slice(2)
+  let currentPath = ''
 
   for (const part of parts) {
-    currentPath = currentPath ? `${currentPath}/${part}` : part;
-    openedDirectories.add(currentPath);
+    currentPath = currentPath ? `${currentPath}/${part}` : part
+    openedDirectories.add(currentPath)
   }
 
-  return openedDirectories;
-};
+  return openedDirectories
+}
 
-const openedDirectories = ref(getDefaultOpenedDirectories());
+const openedDirectories = ref(getDefaultOpenedDirectories())
 
 const toggleDirectory = (directory: string) => {
   if (openedDirectories.value.has(directory)) {
-    openedDirectories.value.delete(directory);
+    openedDirectories.value.delete(directory)
   } else {
-    openedDirectories.value.add(directory);
+    openedDirectories.value.add(directory)
   }
-};
+}
 </script>
diff --git a/@xen-orchestra/lite/src/components/component-story/StoryMenuTree.vue b/@xen-orchestra/lite/src/components/component-story/StoryMenuTree.vue
index 89152e535a8..4fee5157078 100644
--- a/@xen-orchestra/lite/src/components/component-story/StoryMenuTree.vue
+++ b/@xen-orchestra/lite/src/components/component-story/StoryMenuTree.vue
@@ -1,14 +1,8 @@
 <template>
   <ul class="story-menu-tree">
     <li v-for="[key, node] in tree" :key="key">
-      <span
-        v-if="node.children.size > 0"
-        class="directory"
-        @click="emit('toggle-directory', node.directory)"
-      >
-        <UiIcon
-          :icon="isOpen(node.directory) ? faFolderOpen : faFolderClosed"
-        />
+      <span v-if="node.children.size > 0" class="directory" @click="emit('toggle-directory', node.directory)">
+        <UiIcon :icon="isOpen(node.directory) ? faFolderOpen : faFolderClosed" />
         {{ formatName(key) }}
       </span>
       <RouterLink v-else :to="node.path" class="link">
@@ -19,37 +13,33 @@
       <StoryMenuTree
         v-if="isOpen(node.directory)"
         :tree="node.children"
-        @toggle-directory="emit('toggle-directory', $event)"
         :opened-directories="openedDirectories"
+        @toggle-directory="emit('toggle-directory', $event)"
       />
     </li>
   </ul>
 </template>
 
 <script lang="ts" setup>
-import type { StoryTree } from "@/components/component-story/StoryMenu.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import {
-  faFile,
-  faFolderClosed,
-  faFolderOpen,
-} from "@fortawesome/free-regular-svg-icons";
+import type { StoryTree } from '@/components/component-story/StoryMenu.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { faFile, faFolderClosed, faFolderOpen } from '@fortawesome/free-regular-svg-icons'
 
 const props = defineProps<{
-  tree: StoryTree;
-  openedDirectories: Set<string>;
-}>();
+  tree: StoryTree
+  openedDirectories: Set<string>
+}>()
 
 const emit = defineEmits<{
-  (event: "toggle-directory", directory: string): void;
-}>();
+  (event: 'toggle-directory', directory: string): void
+}>()
 
-const isOpen = (directory: string) => props.openedDirectories.has(directory);
+const isOpen = (directory: string) => props.openedDirectories.has(directory)
 
 const formatName = (name: string) => {
-  const parts = name.split("-");
-  return parts.map((part) => part[0].toUpperCase() + part.slice(1)).join(" ");
-};
+  const parts = name.split('-')
+  return parts.map(part => part[0].toUpperCase() + part.slice(1)).join(' ')
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/component-story/StoryPropParams.vue b/@xen-orchestra/lite/src/components/component-story/StoryPropParams.vue
index 808825d84b8..0d0ba19d370 100644
--- a/@xen-orchestra/lite/src/components/component-story/StoryPropParams.vue
+++ b/@xen-orchestra/lite/src/components/component-story/StoryPropParams.vue
@@ -18,12 +18,7 @@
       </tr>
     </tfoot>
     <tbody>
-      <tr
-        v-for="param in params"
-        :key="param.name"
-        :class="{ required: param.isRequired() }"
-        class="row"
-      >
+      <tr v-for="param in params" :key="param.name" :class="{ required: param.isRequired() }" class="row">
         <th class="name">
           {{ param.getFullName() }}
           <sup
@@ -48,11 +43,7 @@
         </td>
         <td class="reset-param">
           <UiIcon
-            v-if="
-              param.hasWidget() &&
-              !param.isRequired() &&
-              model[param.name] !== undefined
-            "
+            v-if="param.hasWidget() && !param.isRequired() && model[param.name] !== undefined"
             :icon="faClose"
             class="reset-icon"
             @click="model[param.name] = undefined"
@@ -74,12 +65,8 @@
           </span>
         </td>
         <td>
-          <code
-            v-if="!param.isRequired()"
-            :class="{ active: model[param.name] === undefined }"
-            class="default-value"
-          >
-            {{ JSON.stringify(param.getDefaultValue()) ?? "undefined" }}
+          <code v-if="!param.isRequired()" :class="{ active: model[param.name] === undefined }" class="default-value">
+            {{ JSON.stringify(param.getDefaultValue()) ?? 'undefined' }}
           </code>
           <span v-else>-</span>
         </td>
@@ -92,42 +79,42 @@
 </template>
 
 <script lang="ts" setup>
-import CodeHighlight from "@/components/CodeHighlight.vue";
-import StoryParamsTable from "@/components/component-story/StoryParamsTable.vue";
-import StoryWidget from "@/components/component-story/StoryWidget.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useModal } from "@/composables/modal.composable";
-import useSortedCollection from "@/composables/sorted-collection.composable";
-import { vTooltip } from "@/directives/tooltip.directive";
-import type { PropParam } from "@/libs/story/story-param";
-import { faClose, faRepeat } from "@fortawesome/free-solid-svg-icons";
-import { useVModel } from "@vueuse/core";
-import { toRef } from "vue";
+import CodeHighlight from '@/components/CodeHighlight.vue'
+import StoryParamsTable from '@/components/component-story/StoryParamsTable.vue'
+import StoryWidget from '@/components/component-story/StoryWidget.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useModal } from '@/composables/modal.composable'
+import useSortedCollection from '@/composables/sorted-collection.composable'
+import { vTooltip } from '@/directives/tooltip.directive'
+import type { PropParam } from '@/libs/story/story-param'
+import { faClose, faRepeat } from '@fortawesome/free-solid-svg-icons'
+import { useVModel } from '@vueuse/core'
+import { toRef } from 'vue'
 
 const props = defineProps<{
-  params: PropParam[];
-  modelValue: Record<string, any>;
-}>();
+  params: PropParam[]
+  modelValue: Record<string, any>
+}>()
 
-const params = useSortedCollection(toRef(props, "params"), (p1, p2) => {
+const params = useSortedCollection(toRef(props, 'params'), (p1, p2) => {
   if (p1.isRequired() === p2.isRequired()) {
-    return 0;
+    return 0
   }
 
-  return p1.isRequired() ? -1 : 1;
-});
+  return p1.isRequired() ? -1 : 1
+})
 
 const emit = defineEmits<{
-  (event: "reset"): void;
-  (event: "update:modelValue", value: any): void;
-}>();
+  (event: 'reset'): void
+  (event: 'update:modelValue', value: any): void
+}>()
 
-const model = useVModel(props, "modelValue", emit);
+const model = useVModel(props, 'modelValue', emit)
 
 const openRawValueModal = (code: string) =>
-  useModal(() => import("@/components/modals/CodeHighlightModal.vue"), {
+  useModal(() => import('@/components/modals/CodeHighlightModal.vue'), {
     code,
-  });
+  })
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/component-story/StorySettingParams.vue b/@xen-orchestra/lite/src/components/component-story/StorySettingParams.vue
index 371a5c87012..209e73a36dc 100644
--- a/@xen-orchestra/lite/src/components/component-story/StorySettingParams.vue
+++ b/@xen-orchestra/lite/src/components/component-story/StorySettingParams.vue
@@ -35,22 +35,22 @@
 </template>
 
 <script lang="ts" setup>
-import { useVModel } from "@vueuse/core";
-import StoryParamsTable from "@/components/component-story/StoryParamsTable.vue";
-import StoryWidget from "@/components/component-story/StoryWidget.vue";
-import type { SettingParam } from "@/libs/story/story-param";
+import { useVModel } from '@vueuse/core'
+import StoryParamsTable from '@/components/component-story/StoryParamsTable.vue'
+import StoryWidget from '@/components/component-story/StoryWidget.vue'
+import type { SettingParam } from '@/libs/story/story-param'
 
 const props = defineProps<{
-  params: SettingParam[];
-  modelValue?: Record<string, any>;
-}>();
+  params: SettingParam[]
+  modelValue?: Record<string, any>
+}>()
 
 const emit = defineEmits<{
-  (event: "reset"): void;
-  (event: "update:modelValue", value: any): void;
-}>();
+  (event: 'reset'): void
+  (event: 'update:modelValue', value: any): void
+}>()
 
-const model = useVModel(props, "modelValue", emit);
+const model = useVModel(props, 'modelValue', emit)
 </script>
 
 <style lang="postcss">
diff --git a/@xen-orchestra/lite/src/components/component-story/StorySlotParams.vue b/@xen-orchestra/lite/src/components/component-story/StorySlotParams.vue
index fd37480eab6..eed87a12734 100644
--- a/@xen-orchestra/lite/src/components/component-story/StorySlotParams.vue
+++ b/@xen-orchestra/lite/src/components/component-story/StorySlotParams.vue
@@ -25,11 +25,11 @@
 </template>
 
 <script lang="ts" setup>
-import CodeHighlight from "@/components/CodeHighlight.vue";
-import StoryParamsTable from "@/components/component-story/StoryParamsTable.vue";
-import type { SlotParam } from "@/libs/story/story-param";
+import CodeHighlight from '@/components/CodeHighlight.vue'
+import StoryParamsTable from '@/components/component-story/StoryParamsTable.vue'
+import type { SlotParam } from '@/libs/story/story-param'
 
 defineProps<{
-  params: SlotParam[];
-}>();
+  params: SlotParam[]
+}>()
 </script>
diff --git a/@xen-orchestra/lite/src/components/component-story/StoryWidget.vue b/@xen-orchestra/lite/src/components/component-story/StoryWidget.vue
index 4ecc035bb22..d6a6a415362 100644
--- a/@xen-orchestra/lite/src/components/component-story/StoryWidget.vue
+++ b/@xen-orchestra/lite/src/components/component-story/StoryWidget.vue
@@ -1,15 +1,7 @@
 <template>
-  <FormSelect
-    v-if="isSelectWidget(widget)"
-    v-model="model"
-    :wrapper-attrs="{ class: 'full-width' }"
-  >
+  <FormSelect v-if="isSelectWidget(widget)" v-model="model" :wrapper-attrs="{ class: 'full-width' }">
     <option v-if="!required && model === undefined" :value="undefined" />
-    <option
-      v-for="choice in widget.choices"
-      :key="choice.label"
-      :value="choice.value"
-    >
+    <option v-for="choice in widget.choices" :key="choice.label" :value="choice.value">
       {{ choice.label }}
     </option>
   </FormSelect>
@@ -22,11 +14,7 @@
   <div v-else-if="isBooleanWidget(widget)">
     <FormCheckbox v-model="model" />
   </div>
-  <FormInput
-    v-else-if="isNumberWidget(widget)"
-    v-model.number="model"
-    type="number"
-  />
+  <FormInput v-else-if="isNumberWidget(widget)" v-model.number="model" type="number" />
   <FormInput v-else-if="isTextWidget(widget)" v-model="model" />
   <FormJson v-else-if="isObjectWidget(widget)" v-model="model" />
 </template>
@@ -40,40 +28,28 @@ import {
   isSelectWidget,
   isTextWidget,
   type Widget,
-} from "@/libs/story/story-widget";
-import { useVModel } from "@vueuse/core";
-import { defineAsyncComponent } from "vue";
+} from '@/libs/story/story-widget'
+import { useVModel } from '@vueuse/core'
+import { defineAsyncComponent } from 'vue'
 
-const FormJson = defineAsyncComponent(
-  () => import("@/components/form/FormJson.vue")
-);
-const FormSelect = defineAsyncComponent(
-  () => import("@/components/form/FormSelect.vue")
-);
-const FormCheckbox = defineAsyncComponent(
-  () => import("@/components/form/FormCheckbox.vue")
-);
-const FormInput = defineAsyncComponent(
-  () => import("@/components/form/FormInput.vue")
-);
-const FormInputWrapper = defineAsyncComponent(
-  () => import("@/components/form/FormInputWrapper.vue")
-);
-const FormRadio = defineAsyncComponent(
-  () => import("@/components/form/FormRadio.vue")
-);
+const FormJson = defineAsyncComponent(() => import('@/components/form/FormJson.vue'))
+const FormSelect = defineAsyncComponent(() => import('@/components/form/FormSelect.vue'))
+const FormCheckbox = defineAsyncComponent(() => import('@/components/form/FormCheckbox.vue'))
+const FormInput = defineAsyncComponent(() => import('@/components/form/FormInput.vue'))
+const FormInputWrapper = defineAsyncComponent(() => import('@/components/form/FormInputWrapper.vue'))
+const FormRadio = defineAsyncComponent(() => import('@/components/form/FormRadio.vue'))
 
 const props = defineProps<{
-  widget: Widget;
-  modelValue: any;
-  required?: boolean;
-}>();
+  widget: Widget
+  modelValue: any
+  required?: boolean
+}>()
 
 const emit = defineEmits<{
-  (event: "update:modelValue", value: any): void;
-}>();
+  (event: 'update:modelValue', value: any): void
+}>()
 
-const model = useVModel(props, "modelValue", emit);
+const model = useVModel(props, 'modelValue', emit)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/form/FormByteSize.vue b/@xen-orchestra/lite/src/components/form/FormByteSize.vue
index 8c2688f301a..67d17eb9d41 100644
--- a/@xen-orchestra/lite/src/components/form/FormByteSize.vue
+++ b/@xen-orchestra/lite/src/components/form/FormByteSize.vue
@@ -2,11 +2,7 @@
   <FormInputGroup>
     <FormNumber v-model="sizeInput" :max-decimals="3" />
     <FormSelect v-model="prefixInput">
-      <option
-        v-for="currentPrefix in availablePrefixes"
-        :key="currentPrefix"
-        :value="currentPrefix"
-      >
+      <option v-for="currentPrefix in availablePrefixes" :key="currentPrefix" :value="currentPrefix">
         {{ currentPrefix }}B
       </option>
     </FormSelect>
@@ -14,67 +10,66 @@
 </template>
 
 <script lang="ts" setup>
-import FormInputGroup from "@/components/form/FormInputGroup.vue";
-import FormNumber from "@/components/form/FormNumber.vue";
-import FormSelect from "@/components/form/FormSelect.vue";
-import { useVModel } from "@vueuse/core";
-import humanFormat, { type Prefix } from "human-format";
-import { ref, watch } from "vue";
+import FormInputGroup from '@/components/form/FormInputGroup.vue'
+import FormNumber from '@/components/form/FormNumber.vue'
+import FormSelect from '@/components/form/FormSelect.vue'
+import { useVModel } from '@vueuse/core'
+import format, { type Prefix } from 'human-format'
+import { ref, watch } from 'vue'
 
 const props = defineProps<{
-  modelValue: number | undefined;
-}>();
+  modelValue: number | undefined
+}>()
 
 const emit = defineEmits<{
-  (event: "update:modelValue", value: number): number;
-}>();
+  (event: 'update:modelValue', value: number): number
+}>()
 
-const availablePrefixes: Prefix<"binary">[] = ["Ki", "Mi", "Gi"];
+const availablePrefixes: Prefix<'binary'>[] = ['Ki', 'Mi', 'Gi']
 
-const model = useVModel(props, "modelValue", emit, {
-  shouldEmit: (value) => value !== props.modelValue,
-});
+const model = useVModel(props, 'modelValue', emit, {
+  shouldEmit: value => value !== props.modelValue,
+})
 
-const sizeInput = ref();
-const prefixInput = ref();
+const sizeInput = ref()
+const prefixInput = ref()
 
-const scale = humanFormat.Scale.create(availablePrefixes, 1024, 1);
+const scale = format.Scale.create(availablePrefixes, 1024, 1)
 
 watch([sizeInput, prefixInput], ([newSize, newPrefix]) => {
-  if (newSize === "" || newSize === undefined) {
-    return;
+  if (newSize === '' || newSize === undefined) {
+    return
   }
 
-  model.value = humanFormat.parse(`${newSize || 0} ${newPrefix || "Ki"}`, {
+  model.value = format.parse(`${newSize || 0} ${newPrefix || 'Ki'}`, {
     scale,
-  });
-});
+  })
+})
 
 watch(
   () => props.modelValue,
-  (newValue) => {
+  newValue => {
     if (newValue === undefined) {
-      sizeInput.value = undefined;
+      sizeInput.value = undefined
 
       if (prefixInput.value === undefined) {
-        prefixInput.value = availablePrefixes[0];
+        prefixInput.value = availablePrefixes[0]
       }
 
-      return;
+      return
     }
 
-    const { value, prefix } = humanFormat.raw(newValue, {
+    const { value, prefix } = format.raw(newValue, {
       scale,
       prefix: prefixInput.value,
-    });
-    console.log(value);
+    })
 
-    sizeInput.value = value;
+    sizeInput.value = value
 
     if (value !== 0) {
-      prefixInput.value = prefix;
+      prefixInput.value = prefix
     }
   },
   { immediate: true }
-);
+)
 </script>
diff --git a/@xen-orchestra/lite/src/components/form/FormCheckbox.vue b/@xen-orchestra/lite/src/components/form/FormCheckbox.vue
index d360c756cd1..bb926cff9d4 100644
--- a/@xen-orchestra/lite/src/components/form/FormCheckbox.vue
+++ b/@xen-orchestra/lite/src/components/form/FormCheckbox.vue
@@ -1,9 +1,5 @@
 <template>
-  <component
-    :is="hasLabel ? 'span' : 'label'"
-    :class="`form-${type}`"
-    v-bind="wrapperAttrs"
-  >
+  <component :is="hasLabel ? 'span' : 'label'" :class="`form-${type}`" v-bind="wrapperAttrs">
     <input
       v-model="value"
       :class="{ indeterminate: isIndeterminate }"
@@ -19,51 +15,49 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useContext } from "@/composables/context.composable";
-import { DisabledContext } from "@/context";
-import { IK_CHECKBOX_TYPE, IK_FORM_HAS_LABEL } from "@/types/injection-keys";
-import { faCheck, faCircle, faMinus } from "@fortawesome/free-solid-svg-icons";
-import { useVModel } from "@vueuse/core";
-import { computed, type HTMLAttributes, inject } from "vue";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useContext } from '@/composables/context.composable'
+import { DisabledContext } from '@/context'
+import { IK_CHECKBOX_TYPE, IK_FORM_HAS_LABEL } from '@/types/injection-keys'
+import { faCheck, faCircle, faMinus } from '@fortawesome/free-solid-svg-icons'
+import { useVModel } from '@vueuse/core'
+import { computed, type HTMLAttributes, inject } from 'vue'
 
-defineOptions({ inheritAttrs: false });
+defineOptions({ inheritAttrs: false })
 
 const props = withDefaults(
   defineProps<{
-    modelValue?: unknown;
-    disabled?: boolean;
-    wrapperAttrs?: HTMLAttributes;
+    modelValue?: unknown
+    disabled?: boolean
+    wrapperAttrs?: HTMLAttributes
   }>(),
   { disabled: undefined }
-);
+)
 
 const emit = defineEmits<{
-  (event: "update:modelValue", value: boolean): void;
-}>();
+  (event: 'update:modelValue', value: boolean): void
+}>()
 
-const value = useVModel(props, "modelValue", emit);
-const type = inject(IK_CHECKBOX_TYPE, "checkbox");
+const value = useVModel(props, 'modelValue', emit)
+const type = inject(IK_CHECKBOX_TYPE, 'checkbox')
 const hasLabel = inject(
   IK_FORM_HAS_LABEL,
   computed(() => false)
-);
-const isDisabled = useContext(DisabledContext, () => props.disabled);
+)
+const isDisabled = useContext(DisabledContext, () => props.disabled)
 const icon = computed(() => {
-  if (type !== "checkbox") {
-    return faCircle;
+  if (type !== 'checkbox') {
+    return faCircle
   }
 
   if (value.value === undefined) {
-    return faMinus;
+    return faMinus
   }
 
-  return faCheck;
-});
+  return faCheck
+})
 
-const isIndeterminate = computed(
-  () => (type === "checkbox" || type === "toggle") && value.value === undefined
-);
+const isIndeterminate = computed(() => (type === 'checkbox' || type === 'toggle') && value.value === undefined)
 </script>
 
 <style lang="postcss" scoped>
@@ -151,8 +145,7 @@ const isIndeterminate = computed(
   position: absolute;
   color: var(--color-blue-scale-500);
 
-  filter: drop-shadow(0 0.0625em 0.5em rgba(0, 0, 0, 0.1))
-    drop-shadow(0 0.1875em 0.1875em rgba(0, 0, 0, 0.06))
+  filter: drop-shadow(0 0.0625em 0.5em rgba(0, 0, 0, 0.1)) drop-shadow(0 0.1875em 0.1875em rgba(0, 0, 0, 0.06))
     drop-shadow(0 0.1875em 0.25em rgba(0, 0, 0, 0.08));
 }
 
diff --git a/@xen-orchestra/lite/src/components/form/FormInput.vue b/@xen-orchestra/lite/src/components/form/FormInput.vue
index bb90596f04f..10d0663cf3d 100644
--- a/@xen-orchestra/lite/src/components/form/FormInput.vue
+++ b/@xen-orchestra/lite/src/components/form/FormInput.vue
@@ -51,57 +51,48 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useContext } from "@/composables/context.composable";
-import { ColorContext, DisabledContext } from "@/context";
-import type { Color } from "@/types";
-import { IK_INPUT_ID, IK_INPUT_TYPE } from "@/types/injection-keys";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-import { faAngleDown } from "@fortawesome/free-solid-svg-icons";
-import { useTextareaAutosize, useVModel } from "@vueuse/core";
-import {
-  computed,
-  type HTMLAttributes,
-  inject,
-  nextTick,
-  ref,
-  watch,
-} from "vue";
-
-defineOptions({ inheritAttrs: false });
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useContext } from '@/composables/context.composable'
+import { ColorContext, DisabledContext } from '@/context'
+import type { Color } from '@/types'
+import { IK_INPUT_ID, IK_INPUT_TYPE } from '@/types/injection-keys'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
+import { faAngleDown } from '@fortawesome/free-solid-svg-icons'
+import { useTextareaAutosize, useVModel } from '@vueuse/core'
+import { computed, type HTMLAttributes, inject, nextTick, ref, watch } from 'vue'
+
+defineOptions({ inheritAttrs: false })
 
 const props = withDefaults(
   defineProps<{
-    id?: string;
-    modelValue?: any;
-    color?: Color;
-    before?: IconDefinition | string;
-    after?: IconDefinition | string;
-    beforeWidth?: string;
-    afterWidth?: string;
-    disabled?: boolean;
-    required?: boolean;
-    right?: boolean;
-    wrapperAttrs?: HTMLAttributes;
+    id?: string
+    modelValue?: any
+    color?: Color
+    before?: IconDefinition | string
+    after?: IconDefinition | string
+    beforeWidth?: string
+    afterWidth?: string
+    disabled?: boolean
+    required?: boolean
+    right?: boolean
+    wrapperAttrs?: HTMLAttributes
   }>(),
   { disabled: undefined }
-);
+)
 
-const { name: contextColor } = useContext(ColorContext, () => props.color);
+const { name: contextColor } = useContext(ColorContext, () => props.color)
 
-const inputElement = ref();
+const inputElement = ref()
 
 const emit = defineEmits<{
-  (event: "update:modelValue", value: any): void;
-}>();
+  (event: 'update:modelValue', value: any): void
+}>()
 
-const value = useVModel(props, "modelValue", emit);
-const isEmpty = computed(
-  () => props.modelValue == null || String(props.modelValue).trim() === ""
-);
-const inputType = inject(IK_INPUT_TYPE, "input");
+const value = useVModel(props, 'modelValue', emit)
+const isEmpty = computed(() => props.modelValue == null || String(props.modelValue).trim() === '')
+const inputType = inject(IK_INPUT_TYPE, 'input')
 
-const isDisabled = useContext(DisabledContext, () => props.disabled);
+const isDisabled = useContext(DisabledContext, () => props.disabled)
 
 const wrapperClass = computed(() => [
   `form-${inputType}`,
@@ -109,32 +100,32 @@ const wrapperClass = computed(() => [
     disabled: isDisabled.value,
     empty: isEmpty.value,
   },
-]);
+])
 
 const inputClass = computed(() => [
   contextColor.value,
   {
     right: props.right,
-    "has-before": props.before !== undefined,
-    "has-after": props.after !== undefined,
+    'has-before': props.before !== undefined,
+    'has-after': props.after !== undefined,
   },
-]);
+])
 
-const parentId = inject(IK_INPUT_ID, undefined);
+const parentId = inject(IK_INPUT_ID, undefined)
 
-const id = computed(() => props.id ?? parentId?.value);
+const id = computed(() => props.id ?? parentId?.value)
 
-const { textarea, triggerResize } = useTextareaAutosize();
+const { textarea, triggerResize } = useTextareaAutosize()
 
 watch(value, () => nextTick(() => triggerResize()), {
   immediate: true,
-});
+})
 
-const focus = () => inputElement.value.focus();
+const focus = () => inputElement.value.focus()
 
 defineExpose({
   focus,
-});
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/form/FormInputWrapper.vue b/@xen-orchestra/lite/src/components/form/FormInputWrapper.vue
index 9583aa6938a..eb45351276d 100644
--- a/@xen-orchestra/lite/src/components/form/FormInputWrapper.vue
+++ b/@xen-orchestra/lite/src/components/form/FormInputWrapper.vue
@@ -1,21 +1,13 @@
 <template>
   <div class="form-input-wrapper">
-    <div
-      v-if="label !== undefined || learnMoreUrl !== undefined"
-      class="label-container"
-    >
+    <div v-if="label !== undefined || learnMoreUrl !== undefined" class="label-container">
       <label :class="{ light }" :for="id" class="label">
         <UiIcon :icon="icon" />
         {{ label }}
       </label>
-      <a
-        v-if="learnMoreUrl !== undefined"
-        :href="learnMoreUrl"
-        class="learn-more-url"
-        target="_blank"
-      >
+      <a v-if="learnMoreUrl !== undefined" :href="learnMoreUrl" class="learn-more-url" target="_blank">
         <UiIcon :icon="faInfoCircle" />
-        <span>{{ $t("learn-more") }}</span>
+        <span>{{ $t('learn-more') }}</span>
       </a>
     </div>
     <div class="input-container">
@@ -36,55 +28,55 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useContext } from "@/composables/context.composable";
-import { ColorContext, DisabledContext } from "@/context";
-import type { Color } from "@/types";
-import { IK_FORM_HAS_LABEL, IK_INPUT_ID } from "@/types/injection-keys";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-import { faInfoCircle } from "@fortawesome/free-solid-svg-icons";
-import { uniqueId } from "lodash-es";
-import { computed, provide, useSlots } from "vue";
-
-const slots = useSlots();
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useContext } from '@/composables/context.composable'
+import { ColorContext, DisabledContext } from '@/context'
+import type { Color } from '@/types'
+import { IK_FORM_HAS_LABEL, IK_INPUT_ID } from '@/types/injection-keys'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
+import { faInfoCircle } from '@fortawesome/free-solid-svg-icons'
+import { uniqueId } from 'lodash-es'
+import { computed, provide, useSlots } from 'vue'
+
+const slots = useSlots()
 
 const props = withDefaults(
   defineProps<{
-    label?: string;
-    id?: string;
-    icon?: IconDefinition;
-    learnMoreUrl?: string;
-    warning?: string;
-    error?: string;
-    help?: string;
-    disabled?: boolean;
-    light?: boolean;
+    label?: string
+    id?: string
+    icon?: IconDefinition
+    learnMoreUrl?: string
+    warning?: string
+    error?: string
+    help?: string
+    disabled?: boolean
+    light?: boolean
   }>(),
   { disabled: undefined }
-);
+)
 
-const id = computed(() => props.id ?? uniqueId("form-input-"));
-provide(IK_INPUT_ID, id);
+const id = computed(() => props.id ?? uniqueId('form-input-'))
+provide(IK_INPUT_ID, id)
 
 const color = computed<Color | undefined>(() => {
-  if (props.error !== undefined && props.error.trim() !== "") {
-    return "error";
+  if (props.error !== undefined && props.error.trim() !== '') {
+    return 'error'
   }
 
-  if (props.warning !== undefined && props.warning.trim() !== "") {
-    return "warning";
+  if (props.warning !== undefined && props.warning.trim() !== '') {
+    return 'warning'
   }
 
-  return undefined;
-});
+  return undefined
+})
 
 provide(
   IK_FORM_HAS_LABEL,
   computed(() => slots.label !== undefined)
-);
+)
 
-useContext(ColorContext, color);
-useContext(DisabledContext, () => props.disabled);
+useContext(ColorContext, color)
+useContext(DisabledContext, () => props.disabled)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/form/FormJson.vue b/@xen-orchestra/lite/src/components/form/FormJson.vue
index e17fdf690e2..eb066d76c28 100644
--- a/@xen-orchestra/lite/src/components/form/FormJson.vue
+++ b/@xen-orchestra/lite/src/components/form/FormJson.vue
@@ -1,37 +1,31 @@
 <template>
-  <FormInput
-    :before="faCode"
-    :model-value="jsonValue"
-    readonly
-    @click="openModal()"
-  />
+  <FormInput :before="faCode" :model-value="jsonValue" readonly @click="openModal()" />
 </template>
 
 <script lang="ts" setup>
-import FormInput from "@/components/form/FormInput.vue";
-import { useModal } from "@/composables/modal.composable";
-import { faCode } from "@fortawesome/free-solid-svg-icons";
-import { useVModel } from "@vueuse/core";
-import { computed } from "vue";
+import FormInput from '@/components/form/FormInput.vue'
+import { useModal } from '@/composables/modal.composable'
+import { faCode } from '@fortawesome/free-solid-svg-icons'
+import { useVModel } from '@vueuse/core'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  modelValue: any;
-}>();
+  modelValue: any
+}>()
 
 const emit = defineEmits<{
-  (event: "update:modelValue", value: any): void;
-}>();
+  (event: 'update:modelValue', value: any): void
+}>()
 
-const model = useVModel(props, "modelValue", emit);
+const model = useVModel(props, 'modelValue', emit)
 
-const jsonValue = computed(() => JSON.stringify(model.value, undefined, 2));
+const jsonValue = computed(() => JSON.stringify(model.value, undefined, 2))
 
 const openModal = () => {
-  const { onApprove } = useModal<string>(
-    () => import("@/components/modals/JsonEditorModal.vue"),
-    { initialValue: jsonValue.value }
-  );
+  const { onApprove } = useModal<string>(() => import('@/components/modals/JsonEditorModal.vue'), {
+    initialValue: jsonValue.value,
+  })
 
-  onApprove((newValue) => (model.value = JSON.parse(newValue)));
-};
+  onApprove(newValue => (model.value = JSON.parse(newValue)))
+}
 </script>
diff --git a/@xen-orchestra/lite/src/components/form/FormNumber.vue b/@xen-orchestra/lite/src/components/form/FormNumber.vue
index 82461348169..2da1139e826 100644
--- a/@xen-orchestra/lite/src/components/form/FormNumber.vue
+++ b/@xen-orchestra/lite/src/components/form/FormNumber.vue
@@ -3,75 +3,70 @@
 </template>
 
 <script lang="ts" setup>
-import FormInput from "@/components/form/FormInput.vue";
-import { computed, ref, watch } from "vue";
+import FormInput from '@/components/form/FormInput.vue'
+import { computed, ref, watch } from 'vue'
 
 const props = defineProps<{
-  modelValue: number | undefined;
-  maxDecimals?: number;
-}>();
+  modelValue: number | undefined
+  maxDecimals?: number
+}>()
 
 const emit = defineEmits<{
-  (event: "update:modelValue", value: number | undefined): void;
-}>();
+  (event: 'update:modelValue', value: number | undefined): void
+}>()
 
-const localValue = ref("");
+const localValue = ref('')
 
-const hasTrailingDot = ref(false);
+const hasTrailingDot = ref(false)
 
 const cleaningRegex = computed(() => {
   if (props.maxDecimals === undefined) {
     // Any number with optional decimal part
-    return /(\d*\.?\d*)/;
+    return /(\d*\.?\d*)/
   }
 
   if (props.maxDecimals > 0) {
     // Numbers with up to `props.maxDecimals` decimal places
-    return new RegExp(`(\\d*\\.?\\d{0,${props.maxDecimals}})`);
+    return new RegExp(`(\\d*\\.?\\d{0,${props.maxDecimals}})`)
   }
 
   // Integer numbers only
-  return /(\d*)/;
-});
+  return /(\d*)/
+})
 
 watch(
   localValue,
-  (newLocalValue) => {
+  newLocalValue => {
     const cleanValue =
       localValue.value
-        .replace(",", ".")
-        .replace(/[^0-9.]/g, "")
-        .match(cleaningRegex.value)?.[0] ?? "";
+        .replace(',', '.')
+        .replace(/[^0-9.]/g, '')
+        .match(cleaningRegex.value)?.[0] ?? ''
 
-    hasTrailingDot.value = cleanValue.endsWith(".");
+    hasTrailingDot.value = cleanValue.endsWith('.')
 
     if (cleanValue !== newLocalValue) {
-      localValue.value = cleanValue;
-      return;
+      localValue.value = cleanValue
+      return
     }
 
-    if (newLocalValue === "") {
-      emit("update:modelValue", undefined);
-      return;
+    if (newLocalValue === '') {
+      emit('update:modelValue', undefined)
+      return
     }
 
-    const parsedValue = parseFloat(cleanValue);
+    const parsedValue = parseFloat(cleanValue)
 
-    emit(
-      "update:modelValue",
-      Number.isNaN(parsedValue) ? undefined : parsedValue
-    );
+    emit('update:modelValue', Number.isNaN(parsedValue) ? undefined : parsedValue)
   },
-  { flush: "post" }
-);
+  { flush: 'post' }
+)
 
 watch(
   () => props.modelValue,
-  (newModelValue) => {
-    localValue.value = `${newModelValue?.toString() ?? ""}${
-      hasTrailingDot.value ? "." : ""
-    }`;
+  newModelValue => {
+    localValue.value = `${newModelValue?.toString() ?? ''}${hasTrailingDot.value ? '.' : ''}`
   },
   { immediate: true }
-);
+)
 </script>
diff --git a/@xen-orchestra/lite/src/components/form/FormRadio.vue b/@xen-orchestra/lite/src/components/form/FormRadio.vue
index b9f6b39a299..812109d2eec 100644
--- a/@xen-orchestra/lite/src/components/form/FormRadio.vue
+++ b/@xen-orchestra/lite/src/components/form/FormRadio.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import FormCheckbox from "@/components/form/FormCheckbox.vue";
-import { IK_CHECKBOX_TYPE } from "@/types/injection-keys";
-import { provide } from "vue";
+import FormCheckbox from '@/components/form/FormCheckbox.vue'
+import { IK_CHECKBOX_TYPE } from '@/types/injection-keys'
+import { provide } from 'vue'
 
-provide(IK_CHECKBOX_TYPE, "radio");
+provide(IK_CHECKBOX_TYPE, 'radio')
 </script>
diff --git a/@xen-orchestra/lite/src/components/form/FormSection.vue b/@xen-orchestra/lite/src/components/form/FormSection.vue
index c121bcb437e..ca4a641a2f2 100644
--- a/@xen-orchestra/lite/src/components/form/FormSection.vue
+++ b/@xen-orchestra/lite/src/components/form/FormSection.vue
@@ -13,41 +13,41 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { faChevronDown, faChevronUp } from "@fortawesome/free-solid-svg-icons";
-import { useVModel, whenever } from "@vueuse/core";
-import { computed } from "vue";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { faChevronDown, faChevronUp } from '@fortawesome/free-solid-svg-icons'
+import { useVModel, whenever } from '@vueuse/core'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  label: string;
-  collapsible?: boolean;
-  collapsed?: boolean;
-}>();
+  label: string
+  collapsible?: boolean
+  collapsed?: boolean
+}>()
 
 const emit = defineEmits<{
-  (event: "update:collapsed", value: boolean): void;
-}>();
+  (event: 'update:collapsed', value: boolean): void
+}>()
 
-const isCollapsed = useVModel(props, "collapsed", emit);
+const isCollapsed = useVModel(props, 'collapsed', emit)
 
 const toggleCollapse = () => {
   if (props.collapsible) {
-    isCollapsed.value = !isCollapsed.value;
+    isCollapsed.value = !isCollapsed.value
   }
-};
+}
 
 const icon = computed(() => {
   if (!props.collapsible) {
-    return undefined;
+    return undefined
   }
 
-  return isCollapsed.value ? faChevronDown : faChevronUp;
-});
+  return isCollapsed.value ? faChevronDown : faChevronUp
+})
 
 whenever(
   () => !props.collapsible,
   () => (isCollapsed.value = false)
-);
+)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/form/FormSelect.vue b/@xen-orchestra/lite/src/components/form/FormSelect.vue
index 45f8e47e71e..a7b4f6232b9 100644
--- a/@xen-orchestra/lite/src/components/form/FormSelect.vue
+++ b/@xen-orchestra/lite/src/components/form/FormSelect.vue
@@ -5,11 +5,11 @@
 </template>
 
 <script lang="ts" setup>
-import FormInput from "@/components/form/FormInput.vue";
-import { IK_INPUT_TYPE } from "@/types/injection-keys";
-import { provide } from "vue";
+import FormInput from '@/components/form/FormInput.vue'
+import { IK_INPUT_TYPE } from '@/types/injection-keys'
+import { provide } from 'vue'
 
-provide(IK_INPUT_TYPE, "select");
+provide(IK_INPUT_TYPE, 'select')
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/form/FormTextarea.vue b/@xen-orchestra/lite/src/components/form/FormTextarea.vue
index fbeb39d36b5..20346669e59 100644
--- a/@xen-orchestra/lite/src/components/form/FormTextarea.vue
+++ b/@xen-orchestra/lite/src/components/form/FormTextarea.vue
@@ -3,11 +3,11 @@
 </template>
 
 <script lang="ts" setup>
-import FormInput from "@/components/form/FormInput.vue";
-import { IK_INPUT_TYPE } from "@/types/injection-keys";
-import { provide } from "vue";
+import FormInput from '@/components/form/FormInput.vue'
+import { IK_INPUT_TYPE } from '@/types/injection-keys'
+import { provide } from 'vue'
 
-provide(IK_INPUT_TYPE, "textarea");
+provide(IK_INPUT_TYPE, 'textarea')
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/form/FormToggle.vue b/@xen-orchestra/lite/src/components/form/FormToggle.vue
index a75205aa5dc..3dc3b6d7dff 100644
--- a/@xen-orchestra/lite/src/components/form/FormToggle.vue
+++ b/@xen-orchestra/lite/src/components/form/FormToggle.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import FormCheckbox from "@/components/form/FormCheckbox.vue";
-import { IK_CHECKBOX_TYPE } from "@/types/injection-keys";
-import { provide } from "vue";
+import FormCheckbox from '@/components/form/FormCheckbox.vue'
+import { IK_CHECKBOX_TYPE } from '@/types/injection-keys'
+import { provide } from 'vue'
 
-provide(IK_CHECKBOX_TYPE, "toggle");
+provide(IK_CHECKBOX_TYPE, 'toggle')
 </script>
diff --git a/@xen-orchestra/lite/src/components/infra/InfraAction.vue b/@xen-orchestra/lite/src/components/infra/InfraAction.vue
index 7ef6f9c14f6..e2a209c8094 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraAction.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraAction.vue
@@ -7,12 +7,12 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 defineProps<{
-  icon?: IconDefinition;
-}>();
+  icon?: IconDefinition
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/infra/InfraHostItem.vue b/@xen-orchestra/lite/src/components/infra/InfraHostItem.vue
index 31c9b7319b5..1cf9e2d38ec 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraHostItem.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraHostItem.vue
@@ -5,25 +5,13 @@
       :icon="faServer"
       :route="{ name: 'host.dashboard', params: { uuid: host.uuid } }"
     >
-      {{ host.name_label || "(Host)" }}
+      {{ host.name_label || '(Host)' }}
       <template #actions>
-        <InfraAction
-          v-if="isPoolMaster"
-          v-tooltip="'Master'"
-          :icon="faStar"
-          class="master-icon"
-        />
-        <p
-          class="vm-count"
-          v-tooltip="$t('vm-running', { count: vmCount })"
-          v-if="isReady"
-        >
+        <InfraAction v-if="isPoolMaster" v-tooltip="'Master'" :icon="faStar" class="master-icon" />
+        <p v-if="isReady" v-tooltip="$t('vm-running', { count: vmCount })" class="vm-count">
           {{ vmCount }}
         </p>
-        <InfraAction
-          :icon="isExpanded ? faAngleDown : faAngleUp"
-          @click="toggle()"
-        />
+        <InfraAction :icon="isExpanded ? faAngleDown : faAngleUp" @click="toggle()" />
       </template>
     </InfraItemLabel>
 
@@ -32,46 +20,37 @@
 </template>
 
 <script lang="ts" setup>
-import InfraAction from "@/components/infra/InfraAction.vue";
-import InfraItemLabel from "@/components/infra/InfraItemLabel.vue";
-import InfraVmList from "@/components/infra/InfraVmList.vue";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
-import { vTooltip } from "@/directives/tooltip.directive";
-import type { XenApiHost } from "@/libs/xen-api/xen-api.types";
-import { useUiStore } from "@/stores/ui.store";
-import {
-  faAngleDown,
-  faAngleUp,
-  faServer,
-  faStar,
-} from "@fortawesome/free-solid-svg-icons";
-import { useToggle } from "@vueuse/core";
-import { computed } from "vue";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
+import InfraAction from '@/components/infra/InfraAction.vue'
+import InfraItemLabel from '@/components/infra/InfraItemLabel.vue'
+import InfraVmList from '@/components/infra/InfraVmList.vue'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
+import { vTooltip } from '@/directives/tooltip.directive'
+import type { XenApiHost } from '@/libs/xen-api/xen-api.types'
+import { useUiStore } from '@/stores/ui.store'
+import { faAngleDown, faAngleUp, faServer, faStar } from '@fortawesome/free-solid-svg-icons'
+import { useToggle } from '@vueuse/core'
+import { computed } from 'vue'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
 
 const props = defineProps<{
-  hostOpaqueRef: XenApiHost["$ref"];
-}>();
+  hostOpaqueRef: XenApiHost['$ref']
+}>()
 
-const { getByOpaqueRef } = useHostCollection();
-const host = computed(() => getByOpaqueRef(props.hostOpaqueRef));
+const { getByOpaqueRef } = useHostCollection()
+const host = computed(() => getByOpaqueRef(props.hostOpaqueRef))
 
-const { pool } = usePoolCollection();
-const isPoolMaster = computed(() => pool.value?.master === props.hostOpaqueRef);
+const { pool } = usePoolCollection()
+const isPoolMaster = computed(() => pool.value?.master === props.hostOpaqueRef)
 
-const uiStore = useUiStore();
+const uiStore = useUiStore()
 
-const isCurrentHost = computed(
-  () => props.hostOpaqueRef === uiStore.currentHostOpaqueRef
-);
-const [isExpanded, toggle] = useToggle(true);
+const isCurrentHost = computed(() => props.hostOpaqueRef === uiStore.currentHostOpaqueRef)
+const [isExpanded, toggle] = useToggle(true)
 
-const { recordsByHostRef, isReady } = useVmCollection();
+const { recordsByHostRef, isReady } = useVmCollection()
 
-const vmCount = computed(
-  () => recordsByHostRef.value.get(props.hostOpaqueRef)?.length ?? 0
-);
+const vmCount = computed(() => recordsByHostRef.value.get(props.hostOpaqueRef)?.length ?? 0)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/infra/InfraHostList.vue b/@xen-orchestra/lite/src/components/infra/InfraHostList.vue
index b6f9df95b90..02693acfa64 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraHostList.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraHostList.vue
@@ -1,24 +1,20 @@
 <template>
   <ul class="infra-host-list">
     <li v-if="hasError" class="text-error">
-      {{ $t("error-no-data") }}
+      {{ $t('error-no-data') }}
     </li>
-    <li v-else-if="!isReady">{{ $t("loading-hosts") }}</li>
+    <li v-else-if="!isReady">{{ $t('loading-hosts') }}</li>
     <template v-else>
-      <InfraHostItem
-        v-for="host in hosts"
-        :key="host.$ref"
-        :host-opaque-ref="host.$ref"
-      />
+      <InfraHostItem v-for="host in hosts" :key="host.$ref" :host-opaque-ref="host.$ref" />
     </template>
   </ul>
 </template>
 
 <script lang="ts" setup>
-import InfraHostItem from "@/components/infra/InfraHostItem.vue";
-import { useHostCollection } from "@/stores/xen-api/host.store";
+import InfraHostItem from '@/components/infra/InfraHostItem.vue'
+import { useHostCollection } from '@/stores/xen-api/host.store'
 
-const { records: hosts, isReady, hasError } = useHostCollection();
+const { records: hosts, isReady, hasError } = useHostCollection()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/infra/InfraItemLabel.vue b/@xen-orchestra/lite/src/components/infra/InfraItemLabel.vue
index f42fac7aed2..051a618ce5f 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraItemLabel.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraItemLabel.vue
@@ -1,13 +1,11 @@
 <template>
   <RouterLink v-slot="{ isExactActive, href, navigate }" :to="route" custom>
     <div
-      :class="
-        isExactActive ? 'exact-active' : $props.active ? 'active' : undefined
-      "
+      :class="isExactActive ? 'exact-active' : $props.active ? 'active' : undefined"
       class="infra-item-label"
       v-bind="$attrs"
     >
-      <a :href="href" class="link" @click="navigate" v-tooltip="hasTooltip">
+      <a v-tooltip="hasTooltip" :href="href" class="link" @click="navigate">
         <UiIcon :icon="icon" class="icon" />
         <div ref="textElement" class="text">
           <slot />
@@ -21,21 +19,21 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { hasEllipsis } from "@/libs/utils";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-import { computed, ref } from "vue";
-import type { RouteLocationRaw } from "vue-router";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { hasEllipsis } from '@/libs/utils'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
+import { computed, ref } from 'vue'
+import type { RouteLocationRaw } from 'vue-router'
 
 defineProps<{
-  icon: IconDefinition;
-  route: RouteLocationRaw;
-  active?: boolean;
-}>();
+  icon: IconDefinition
+  route: RouteLocationRaw
+  active?: boolean
+}>()
 
-const textElement = ref<HTMLElement>();
-const hasTooltip = computed(() => hasEllipsis(textElement.value));
+const textElement = ref<HTMLElement>()
+const hasTooltip = computed(() => hasEllipsis(textElement.value))
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/infra/InfraLoadingItem.vue b/@xen-orchestra/lite/src/components/infra/InfraLoadingItem.vue
index cf53fa576f1..394a848e855 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraLoadingItem.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraLoadingItem.vue
@@ -10,12 +10,12 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 defineProps<{
-  icon: IconDefinition;
-}>();
+  icon: IconDefinition
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/infra/InfraPoolList.vue b/@xen-orchestra/lite/src/components/infra/InfraPoolList.vue
index 23bc265c08f..cea1a0426da 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraPoolList.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraPoolList.vue
@@ -1,19 +1,12 @@
 <template>
   <ul class="infra-pool-list">
     <li v-if="hasError" class="text-error">
-      {{ $t("error-no-data") }}
+      {{ $t('error-no-data') }}
     </li>
-    <InfraLoadingItem
-      v-else-if="!isReady || pool === undefined"
-      :icon="faBuilding"
-    />
+    <InfraLoadingItem v-else-if="!isReady || pool === undefined" :icon="faBuilding" />
     <li v-else class="infra-pool-item">
-      <InfraItemLabel
-        :icon="faBuilding"
-        :route="{ name: 'pool.dashboard', params: { uuid: pool.uuid } }"
-        active
-      >
-        {{ pool.name_label || "(Pool)" }}
+      <InfraItemLabel :icon="faBuilding" :route="{ name: 'pool.dashboard', params: { uuid: pool.uuid } }" active>
+        {{ pool.name_label || '(Pool)' }}
       </InfraItemLabel>
 
       <InfraHostList />
@@ -24,14 +17,14 @@
 </template>
 
 <script lang="ts" setup>
-import InfraHostList from "@/components/infra/InfraHostList.vue";
-import InfraItemLabel from "@/components/infra/InfraItemLabel.vue";
-import InfraLoadingItem from "@/components/infra/InfraLoadingItem.vue";
-import InfraVmList from "@/components/infra/InfraVmList.vue";
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
-import { faBuilding } from "@fortawesome/free-regular-svg-icons";
+import InfraHostList from '@/components/infra/InfraHostList.vue'
+import InfraItemLabel from '@/components/infra/InfraItemLabel.vue'
+import InfraLoadingItem from '@/components/infra/InfraLoadingItem.vue'
+import InfraVmList from '@/components/infra/InfraVmList.vue'
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
+import { faBuilding } from '@fortawesome/free-regular-svg-icons'
 
-const { isReady, hasError, pool } = usePoolCollection();
+const { isReady, hasError, pool } = usePoolCollection()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/infra/InfraVmItem.vue b/@xen-orchestra/lite/src/components/infra/InfraVmItem.vue
index 055350a864e..3a37280a4c4 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraVmItem.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraVmItem.vue
@@ -1,11 +1,7 @@
 <template>
   <li v-if="vm !== undefined" ref="rootElement" class="infra-vm-item">
-    <InfraItemLabel
-      v-if="isVisible"
-      :icon="faDisplay"
-      :route="{ name: 'vm.console', params: { uuid: vm.uuid } }"
-    >
-      {{ vm.name_label || "(VM)" }}
+    <InfraItemLabel v-if="isVisible" :icon="faDisplay" :route="{ name: 'vm.console', params: { uuid: vm.uuid } }">
+      {{ vm.name_label || '(VM)' }}
       <template #actions>
         <InfraAction>
           <PowerStateIcon :state="vm.power_state" />
@@ -16,30 +12,30 @@
 </template>
 
 <script lang="ts" setup>
-import InfraAction from "@/components/infra/InfraAction.vue";
-import InfraItemLabel from "@/components/infra/InfraItemLabel.vue";
-import PowerStateIcon from "@/components/PowerStateIcon.vue";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { faDisplay } from "@fortawesome/free-solid-svg-icons";
-import { useIntersectionObserver } from "@vueuse/core";
-import { computed, ref } from "vue";
+import InfraAction from '@/components/infra/InfraAction.vue'
+import InfraItemLabel from '@/components/infra/InfraItemLabel.vue'
+import PowerStateIcon from '@/components/PowerStateIcon.vue'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { faDisplay } from '@fortawesome/free-solid-svg-icons'
+import { useIntersectionObserver } from '@vueuse/core'
+import { computed, ref } from 'vue'
 
 const props = defineProps<{
-  vmOpaqueRef: XenApiVm["$ref"];
-}>();
+  vmOpaqueRef: XenApiVm['$ref']
+}>()
 
-const { getByOpaqueRef } = useVmCollection();
-const vm = computed(() => getByOpaqueRef(props.vmOpaqueRef));
-const rootElement = ref();
-const isVisible = ref(false);
+const { getByOpaqueRef } = useVmCollection()
+const vm = computed(() => getByOpaqueRef(props.vmOpaqueRef))
+const rootElement = ref()
+const isVisible = ref(false)
 
 const { stop } = useIntersectionObserver(rootElement, ([entry]) => {
   if (entry.isIntersecting) {
-    isVisible.value = true;
-    stop();
+    isVisible.value = true
+    stop()
   }
-});
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/infra/InfraVmList.vue b/@xen-orchestra/lite/src/components/infra/InfraVmList.vue
index cfe10ac444e..809d24e29af 100644
--- a/@xen-orchestra/lite/src/components/infra/InfraVmList.vue
+++ b/@xen-orchestra/lite/src/components/infra/InfraVmList.vue
@@ -1,6 +1,6 @@
 <template>
   <ul class="infra-vm-list">
-    <li v-if="hasError" class="text-error">{{ $t("error-no-data") }}</li>
+    <li v-if="hasError" class="text-error">{{ $t('error-no-data') }}</li>
     <template v-else-if="!isReady">
       <InfraLoadingItem v-for="i in 3" :key="i" :icon="faDisplay" />
     </template>
@@ -9,24 +9,20 @@
 </template>
 
 <script lang="ts" setup>
-import InfraLoadingItem from "@/components/infra/InfraLoadingItem.vue";
-import InfraVmItem from "@/components/infra/InfraVmItem.vue";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import type { XenApiHost } from "@/libs/xen-api/xen-api.types";
-import { faDisplay } from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+import InfraLoadingItem from '@/components/infra/InfraLoadingItem.vue'
+import InfraVmItem from '@/components/infra/InfraVmItem.vue'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import type { XenApiHost } from '@/libs/xen-api/xen-api.types'
+import { faDisplay } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  hostOpaqueRef?: XenApiHost["$ref"];
-}>();
+  hostOpaqueRef?: XenApiHost['$ref']
+}>()
 
-const { isReady, recordsByHostRef, hasError } = useVmCollection();
+const { isReady, recordsByHostRef, hasError } = useVmCollection()
 
-const vms = computed(() =>
-  recordsByHostRef.value.get(
-    props.hostOpaqueRef ?? ("OpaqueRef:NULL" as XenApiHost["$ref"])
-  )
-);
+const vms = computed(() => recordsByHostRef.value.get(props.hostOpaqueRef ?? ('OpaqueRef:NULL' as XenApiHost['$ref'])))
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/menu/AppMenu.vue b/@xen-orchestra/lite/src/components/menu/AppMenu.vue
index 99cb2dd2c3f..0c99557cb71 100644
--- a/@xen-orchestra/lite/src/components/menu/AppMenu.vue
+++ b/@xen-orchestra/lite/src/components/menu/AppMenu.vue
@@ -1,99 +1,83 @@
 <template>
   <slot :is-open="isOpen" :open="open" name="trigger" />
   <Teleport to="body" :disabled="!shouldTeleport">
-    <ul
-      v-if="!hasTrigger || isOpen"
-      ref="menu"
-      :class="{ horizontal, shadow }"
-      class="app-menu"
-      v-bind="$attrs"
-    >
+    <ul v-if="!hasTrigger || isOpen" ref="menu" :class="{ horizontal, shadow }" class="app-menu" v-bind="$attrs">
       <slot />
     </ul>
   </Teleport>
 </template>
 
 <script lang="ts" setup>
-import { useContext } from "@/composables/context.composable";
-import { DisabledContext } from "@/context";
-import {
-  IK_CLOSE_MENU,
-  IK_MENU_HORIZONTAL,
-  IK_MENU_TELEPORTED,
-} from "@/types/injection-keys";
-import placementJs, { type Options } from "placement.js";
-import { computed, inject, nextTick, provide, ref, useSlots } from "vue";
-import { onClickOutside, unrefElement, whenever } from "@vueuse/core";
+import { useContext } from '@/composables/context.composable'
+import { DisabledContext } from '@/context'
+import { IK_CLOSE_MENU, IK_MENU_HORIZONTAL, IK_MENU_TELEPORTED } from '@/types/injection-keys'
+import placementJs, { type Options } from 'placement.js'
+import { computed, inject, nextTick, provide, ref, useSlots } from 'vue'
+import { onClickOutside, unrefElement, whenever } from '@vueuse/core'
 
 const props = withDefaults(
   defineProps<{
-    horizontal?: boolean;
-    shadow?: boolean;
-    disabled?: boolean;
-    placement?: Options["placement"];
+    horizontal?: boolean
+    shadow?: boolean
+    disabled?: boolean
+    placement?: Options['placement']
   }>(),
   { disabled: undefined }
-);
+)
 
 defineOptions({
   inheritAttrs: false,
-});
+})
 
-const slots = useSlots();
-const isOpen = ref(false);
-const menu = ref();
+const slots = useSlots()
+const isOpen = ref(false)
+const menu = ref()
 const isParentHorizontal = inject(
   IK_MENU_HORIZONTAL,
   computed(() => false)
-);
+)
 provide(
   IK_MENU_HORIZONTAL,
   computed(() => props.horizontal ?? false)
-);
+)
 
-useContext(DisabledContext, () => props.disabled);
+useContext(DisabledContext, () => props.disabled)
 
-let clearClickOutsideEvent: (() => void) | undefined;
+let clearClickOutsideEvent: (() => void) | undefined
 
-const hasTrigger = useSlots().trigger !== undefined;
+const hasTrigger = useSlots().trigger !== undefined
 
-const shouldTeleport = hasTrigger && !inject(IK_MENU_TELEPORTED, false);
+const shouldTeleport = hasTrigger && !inject(IK_MENU_TELEPORTED, false)
 
 if (shouldTeleport) {
-  provide(IK_MENU_TELEPORTED, true);
+  provide(IK_MENU_TELEPORTED, true)
 }
 
 whenever(
   () => !isOpen.value,
   () => clearClickOutsideEvent?.()
-);
+)
 if (slots.trigger && inject(IK_CLOSE_MENU, undefined) === undefined) {
-  provide(IK_CLOSE_MENU, () => (isOpen.value = false));
+  provide(IK_CLOSE_MENU, () => (isOpen.value = false))
 }
 
 const open = (event: MouseEvent) => {
   if (isOpen.value) {
-    return (isOpen.value = false);
+    return (isOpen.value = false)
   }
 
-  isOpen.value = true;
+  isOpen.value = true
 
   nextTick(() => {
-    clearClickOutsideEvent = onClickOutside(
-      menu,
-      () => (isOpen.value = false),
-      {
-        ignore: [event.currentTarget as HTMLElement],
-      }
-    );
+    clearClickOutsideEvent = onClickOutside(menu, () => (isOpen.value = false), {
+      ignore: [event.currentTarget as HTMLElement],
+    })
 
     placementJs(event.currentTarget as HTMLElement, unrefElement(menu), {
-      placement:
-        props.placement ??
-        (isParentHorizontal.value ? "bottom-start" : "right-start"),
-    });
-  });
-};
+      placement: props.placement ?? (isParentHorizontal.value ? 'bottom-start' : 'right-start'),
+    })
+  })
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/menu/MenuItem.vue b/@xen-orchestra/lite/src/components/menu/MenuItem.vue
index 43117485ec6..2e7aebef5c1 100644
--- a/@xen-orchestra/lite/src/components/menu/MenuItem.vue
+++ b/@xen-orchestra/lite/src/components/menu/MenuItem.vue
@@ -12,19 +12,9 @@
     </MenuTrigger>
     <AppMenu v-else :disabled="isDisabled" shadow>
       <template #trigger="{ open, isOpen }">
-        <MenuTrigger
-          :active="isOpen"
-          :busy="isBusy"
-          :disabled="isDisabled"
-          :icon="icon"
-          @click="open"
-        >
+        <MenuTrigger :active="isOpen" :busy="isBusy" :disabled="isDisabled" :icon="icon" @click="open">
           <slot />
-          <UiIcon
-            :fixed-width="false"
-            :icon="submenuIcon"
-            class="submenu-icon"
-          />
+          <UiIcon :fixed-width="false" :icon="submenuIcon" class="submenu-icon" />
         </MenuTrigger>
       </template>
       <slot name="submenu" />
@@ -33,53 +23,51 @@
 </template>
 
 <script lang="ts" setup>
-import AppMenu from "@/components/menu/AppMenu.vue";
-import MenuTrigger from "@/components/menu/MenuTrigger.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useContext } from "@/composables/context.composable";
-import { DisabledContext } from "@/context";
-import { IK_CLOSE_MENU, IK_MENU_HORIZONTAL } from "@/types/injection-keys";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-import { faAngleDown, faAngleRight } from "@fortawesome/free-solid-svg-icons";
-import { computed, inject, ref } from "vue";
+import AppMenu from '@/components/menu/AppMenu.vue'
+import MenuTrigger from '@/components/menu/MenuTrigger.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useContext } from '@/composables/context.composable'
+import { DisabledContext } from '@/context'
+import { IK_CLOSE_MENU, IK_MENU_HORIZONTAL } from '@/types/injection-keys'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
+import { faAngleDown, faAngleRight } from '@fortawesome/free-solid-svg-icons'
+import { computed, inject, ref } from 'vue'
 
 const props = withDefaults(
   defineProps<{
-    icon?: IconDefinition;
-    onClick?: () => any;
-    disabled?: boolean;
-    busy?: boolean;
+    icon?: IconDefinition
+    onClick?: () => any
+    disabled?: boolean
+    busy?: boolean
   }>(),
   { disabled: undefined }
-);
+)
 
 const isParentHorizontal = inject(
   IK_MENU_HORIZONTAL,
   computed(() => false)
-);
-const isDisabled = useContext(DisabledContext, () => props.disabled);
+)
+const isDisabled = useContext(DisabledContext, () => props.disabled)
 
-const submenuIcon = computed(() =>
-  isParentHorizontal.value ? faAngleDown : faAngleRight
-);
+const submenuIcon = computed(() => (isParentHorizontal.value ? faAngleDown : faAngleRight))
 
-const isHandlingClick = ref(false);
-const isBusy = computed(() => isHandlingClick.value || props.busy === true);
-const closeMenu = inject(IK_CLOSE_MENU, undefined);
+const isHandlingClick = ref(false)
+const isBusy = computed(() => isHandlingClick.value || props.busy === true)
+const closeMenu = inject(IK_CLOSE_MENU, undefined)
 
 const handleClick = async () => {
   if (isDisabled.value || isBusy.value) {
-    return;
+    return
   }
 
-  isHandlingClick.value = true;
+  isHandlingClick.value = true
   try {
-    await props.onClick?.();
-    closeMenu?.();
+    await props.onClick?.()
+    closeMenu?.()
   } finally {
-    isHandlingClick.value = false;
+    isHandlingClick.value = false
   }
-};
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/menu/MenuSeparator.vue b/@xen-orchestra/lite/src/components/menu/MenuSeparator.vue
index 7d7eb992508..861bfd60b5a 100644
--- a/@xen-orchestra/lite/src/components/menu/MenuSeparator.vue
+++ b/@xen-orchestra/lite/src/components/menu/MenuSeparator.vue
@@ -3,13 +3,13 @@
 </template>
 
 <script lang="ts" setup>
-import { IK_MENU_HORIZONTAL } from "@/types/injection-keys";
-import { computed, inject } from "vue";
+import { IK_MENU_HORIZONTAL } from '@/types/injection-keys'
+import { computed, inject } from 'vue'
 
 const horizontal = inject(
   IK_MENU_HORIZONTAL,
   computed(() => false)
-);
+)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/menu/MenuTrigger.vue b/@xen-orchestra/lite/src/components/menu/MenuTrigger.vue
index f5dd9de38cf..dcf7e1c7815 100644
--- a/@xen-orchestra/lite/src/components/menu/MenuTrigger.vue
+++ b/@xen-orchestra/lite/src/components/menu/MenuTrigger.vue
@@ -6,15 +6,15 @@
 </template>
 
 <script lang="ts" setup>
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
 
 defineProps<{
-  active?: boolean;
-  busy?: boolean;
-  disabled?: boolean;
-  icon?: IconDefinition;
-}>();
+  active?: boolean
+  busy?: boolean
+  disabled?: boolean
+  icon?: IconDefinition
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/modals/CodeHighlightModal.vue b/@xen-orchestra/lite/src/components/modals/CodeHighlightModal.vue
index ad4cd0a0655..9925b5e9bc1 100644
--- a/@xen-orchestra/lite/src/components/modals/CodeHighlightModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/CodeHighlightModal.vue
@@ -7,11 +7,11 @@
 </template>
 
 <script lang="ts" setup>
-import CodeHighlight from "@/components/CodeHighlight.vue";
-import BasicModalLayout from "@/components/ui/modals/layouts/BasicModalLayout.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
+import CodeHighlight from '@/components/CodeHighlight.vue'
+import BasicModalLayout from '@/components/ui/modals/layouts/BasicModalLayout.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
 
 defineProps<{
-  code: any;
-}>();
+  code: any
+}>()
 </script>
diff --git a/@xen-orchestra/lite/src/components/modals/CollectionFilterModal.vue b/@xen-orchestra/lite/src/components/modals/CollectionFilterModal.vue
index 30fbf4974bd..6c70c997ad1 100644
--- a/@xen-orchestra/lite/src/components/modals/CollectionFilterModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/CollectionFilterModal.vue
@@ -12,17 +12,10 @@
           />
         </div>
 
-        <div
-          v-if="newFilters.some((filter) => filter.isAdvanced)"
-          class="available-properties"
-        >
-          {{ $t("available-properties-for-advanced-filter") }}
+        <div v-if="newFilters.some(filter => filter.isAdvanced)" class="available-properties">
+          {{ $t('available-properties-for-advanced-filter') }}
           <div class="properties">
-            <UiBadge
-              v-for="(filter, property) in availableFilters"
-              :key="property"
-              :icon="getFilterIcon(filter)"
-            >
+            <UiBadge v-for="(filter, property) in availableFilters" :key="property" :icon="getFilterIcon(filter)">
               {{ property }}
             </UiBadge>
           </div>
@@ -31,11 +24,11 @@
 
       <template #buttons>
         <UiButton transparent @click="addNewFilter()">
-          {{ $t("add-or") }}
+          {{ $t('add-or') }}
         </UiButton>
         <ModalDeclineButton />
         <ModalApproveButton :disabled="!isFilterValid">
-          {{ $t(editedFilter ? "update" : "add") }}
+          {{ $t(editedFilter ? 'update' : 'add') }}
         </ModalApproveButton>
       </template>
     </ConfirmModalLayout>
@@ -43,79 +36,76 @@
 </template>
 
 <script lang="ts" setup>
-import CollectionFilterRow from "@/components/CollectionFilterRow.vue";
-import ConfirmModalLayout from "@/components/ui/modals/layouts/ConfirmModalLayout.vue";
-import ModalApproveButton from "@/components/ui/modals/ModalApproveButton.vue";
-import ModalDeclineButton from "@/components/ui/modals/ModalDeclineButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import UiBadge from "@/components/ui/UiBadge.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import { getFilterIcon } from "@/libs/utils";
-import type { Filters, NewFilter } from "@/types/filter";
-import { IK_MODAL } from "@/types/injection-keys";
-import { Or, parse } from "complex-matcher";
-import { computed, inject, onMounted, ref } from "vue";
+import CollectionFilterRow from '@/components/CollectionFilterRow.vue'
+import ConfirmModalLayout from '@/components/ui/modals/layouts/ConfirmModalLayout.vue'
+import ModalApproveButton from '@/components/ui/modals/ModalApproveButton.vue'
+import ModalDeclineButton from '@/components/ui/modals/ModalDeclineButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import UiBadge from '@/components/ui/UiBadge.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import { getFilterIcon } from '@/libs/utils'
+import type { Filters, NewFilter } from '@/types/filter'
+import { IK_MODAL } from '@/types/injection-keys'
+import { Or, parse } from 'complex-matcher'
+import { computed, inject, onMounted, ref } from 'vue'
 
 const props = defineProps<{
-  availableFilters: Filters;
-  editedFilter?: string;
-}>();
+  availableFilters: Filters
+  editedFilter?: string
+}>()
 
-const modal = inject(IK_MODAL)!;
-const newFilters = ref<NewFilter[]>([]);
-let newFilterId = 0;
+const modal = inject(IK_MODAL)!
+const newFilters = ref<NewFilter[]>([])
+let newFilterId = 0
 
 const addNewFilter = () =>
   newFilters.value.push({
     id: newFilterId++,
-    content: "",
+    content: '',
     isAdvanced: false,
-    builder: { property: "", comparison: "", value: "", negate: false },
-  });
+    builder: { property: '', comparison: '', value: '', negate: false },
+  })
 
 const removeNewFilter = (id: number) => {
-  const index = newFilters.value.findIndex((newFilter) => newFilter.id === id);
+  const index = newFilters.value.findIndex(newFilter => newFilter.id === id)
   if (index >= 0) {
-    newFilters.value.splice(index, 1);
+    newFilters.value.splice(index, 1)
   }
-};
+}
 
 const generatedFilter = computed(() => {
-  const filters = newFilters.value.filter(
-    (newFilter) => newFilter.content !== ""
-  );
+  const filters = newFilters.value.filter(newFilter => newFilter.content !== '')
 
   if (filters.length === 0) {
-    return "";
+    return ''
   }
 
   if (filters.length === 1) {
-    return filters[0].content;
+    return filters[0].content
   }
 
-  return `|(${filters.map((filter) => filter.content).join(" ")})`;
-});
+  return `|(${filters.map(filter => filter.content).join(' ')})`
+})
 
-const isFilterValid = computed(() => generatedFilter.value !== "");
+const isFilterValid = computed(() => generatedFilter.value !== '')
 
 onMounted(() => {
   if (props.editedFilter === undefined) {
-    addNewFilter();
-    return;
+    addNewFilter()
+    return
   }
 
-  const parsedFilter = parse(props.editedFilter);
+  const parsedFilter = parse(props.editedFilter)
 
-  const nodes =
-    parsedFilter instanceof Or ? parsedFilter.children : [parsedFilter];
+  const nodes = parsedFilter instanceof Or ? parsedFilter.children : [parsedFilter]
 
-  newFilters.value = nodes.map((node) => ({
+  newFilters.value = nodes.map(node => ({
     id: newFilterId++,
     content: node.toString(),
     isAdvanced: true,
-    builder: { property: "", comparison: "", value: "", negate: false },
-  }));
-});
+    builder: { property: '', comparison: '', value: '', negate: false },
+  }))
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/modals/CollectionSorterModal.vue b/@xen-orchestra/lite/src/components/modals/CollectionSorterModal.vue
index 4f195ca5ef9..547e1f69342 100644
--- a/@xen-orchestra/lite/src/components/modals/CollectionSorterModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/CollectionSorterModal.vue
@@ -6,19 +6,15 @@
           <FormWidget :label="$t('sort-by')">
             <select v-model="newSortProperty">
               <option v-if="!newSortProperty"></option>
-              <option
-                v-for="(sort, property) in availableSorts"
-                :key="property"
-                :value="property"
-              >
+              <option v-for="(sort, property) in availableSorts" :key="property" :value="property">
                 {{ sort.label ?? property }}
               </option>
             </select>
           </FormWidget>
           <FormWidget>
             <select v-model="newSortIsAscending">
-              <option :value="true">{{ $t("ascending") }}</option>
-              <option :value="false">{{ $t("descending") }}</option>
+              <option :value="true">{{ $t('ascending') }}</option>
+              <option :value="false">{{ $t('descending') }}</option>
             </select>
           </FormWidget>
         </div>
@@ -26,37 +22,37 @@
 
       <template #buttons>
         <ModalDeclineButton />
-        <ModalApproveButton>{{ $t("add") }}</ModalApproveButton>
+        <ModalApproveButton>{{ $t('add') }}</ModalApproveButton>
       </template>
     </ConfirmModalLayout>
   </UiModal>
 </template>
 
 <script lang="ts" setup>
-import FormWidget from "@/components/FormWidget.vue";
-import ConfirmModalLayout from "@/components/ui/modals/layouts/ConfirmModalLayout.vue";
-import ModalApproveButton from "@/components/ui/modals/ModalApproveButton.vue";
-import ModalDeclineButton from "@/components/ui/modals/ModalDeclineButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import { IK_MODAL } from "@/types/injection-keys";
-import type { NewSort, Sorts } from "@/types/sort";
-import { inject, ref } from "vue";
+import FormWidget from '@/components/FormWidget.vue'
+import ConfirmModalLayout from '@/components/ui/modals/layouts/ConfirmModalLayout.vue'
+import ModalApproveButton from '@/components/ui/modals/ModalApproveButton.vue'
+import ModalDeclineButton from '@/components/ui/modals/ModalDeclineButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import { IK_MODAL } from '@/types/injection-keys'
+import type { NewSort, Sorts } from '@/types/sort'
+import { inject, ref } from 'vue'
 
 defineProps<{
-  availableSorts: Sorts;
-}>();
+  availableSorts: Sorts
+}>()
 
-const newSortProperty = ref();
-const newSortIsAscending = ref<boolean>(true);
+const newSortProperty = ref()
+const newSortIsAscending = ref<boolean>(true)
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 
 const handleSubmit = () => {
   modal.approve<NewSort>({
     property: newSortProperty.value,
     isAscending: newSortIsAscending.value,
-  });
-};
+  })
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/modals/InvalidFieldModal.vue b/@xen-orchestra/lite/src/components/modals/InvalidFieldModal.vue
index af51fc7cb1f..9350155baaf 100644
--- a/@xen-orchestra/lite/src/components/modals/InvalidFieldModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/InvalidFieldModal.vue
@@ -1,7 +1,7 @@
 <template>
   <UiModal color="error" @submit="modal.approve()">
     <ConfirmModalLayout :icon="faExclamationCircle">
-      <template #title>{{ $t("invalid-field") }}</template>
+      <template #title>{{ $t('invalid-field') }}</template>
 
       <template #default>
         {{ message }}
@@ -9,7 +9,7 @@
 
       <template #buttons>
         <ModalApproveButton>
-          {{ $t("ok") }}
+          {{ $t('ok') }}
         </ModalApproveButton>
       </template>
     </ConfirmModalLayout>
@@ -17,18 +17,18 @@
 </template>
 
 <script lang="ts" setup>
-import ConfirmModalLayout from "@/components/ui/modals/layouts/ConfirmModalLayout.vue";
-import ModalApproveButton from "@/components/ui/modals/ModalApproveButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import { IK_MODAL } from "@/types/injection-keys";
-import { faExclamationCircle } from "@fortawesome/free-solid-svg-icons";
-import { inject } from "vue";
+import ConfirmModalLayout from '@/components/ui/modals/layouts/ConfirmModalLayout.vue'
+import ModalApproveButton from '@/components/ui/modals/ModalApproveButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import { IK_MODAL } from '@/types/injection-keys'
+import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons'
+import { inject } from 'vue'
 
 defineProps<{
-  message: string;
-}>();
+  message: string
+}>()
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/modals/JsonEditorModal.vue b/@xen-orchestra/lite/src/components/modals/JsonEditorModal.vue
index 5a52dfbc9ca..0f0a4eef412 100644
--- a/@xen-orchestra/lite/src/components/modals/JsonEditorModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/JsonEditorModal.vue
@@ -1,8 +1,5 @@
 <template>
-  <UiModal
-    :color="isJsonValid ? 'success' : 'error'"
-    @submit.prevent="handleSubmit()"
-  >
+  <UiModal :color="isJsonValid ? 'success' : 'error'" @submit.prevent="handleSubmit()">
     <FormModalLayout :icon="faCode" class="layout">
       <template #default>
         <FormTextarea v-model="editedJson" class="modal-textarea" />
@@ -10,11 +7,11 @@
 
       <template #buttons>
         <UiButton transparent @click="formatJson()">
-          {{ $t("reformat") }}
+          {{ $t('reformat') }}
         </UiButton>
         <ModalDeclineButton />
         <ModalApproveButton :disabled="!isJsonValid">
-          {{ $t("save") }}
+          {{ $t('save') }}
         </ModalApproveButton>
       </template>
     </FormModalLayout>
@@ -22,49 +19,49 @@
 </template>
 
 <script lang="ts" setup>
-import FormTextarea from "@/components/form/FormTextarea.vue";
-import FormModalLayout from "@/components/ui/modals/layouts/FormModalLayout.vue";
-import ModalApproveButton from "@/components/ui/modals/ModalApproveButton.vue";
-import ModalDeclineButton from "@/components/ui/modals/ModalDeclineButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import { IK_MODAL } from "@/types/injection-keys";
-import { faCode } from "@fortawesome/free-solid-svg-icons";
-import { computed, inject, ref } from "vue";
+import FormTextarea from '@/components/form/FormTextarea.vue'
+import FormModalLayout from '@/components/ui/modals/layouts/FormModalLayout.vue'
+import ModalApproveButton from '@/components/ui/modals/ModalApproveButton.vue'
+import ModalDeclineButton from '@/components/ui/modals/ModalDeclineButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import { IK_MODAL } from '@/types/injection-keys'
+import { faCode } from '@fortawesome/free-solid-svg-icons'
+import { computed, inject, ref } from 'vue'
 
 const props = defineProps<{
-  initialValue?: string;
-}>();
+  initialValue?: string
+}>()
 
-const editedJson = ref<string>(props.initialValue ?? "");
-const modal = inject(IK_MODAL)!;
+const editedJson = ref<string>(props.initialValue ?? '')
+const modal = inject(IK_MODAL)!
 
 const isJsonValid = computed(() => {
   try {
-    JSON.parse(editedJson.value);
-    return true;
+    JSON.parse(editedJson.value)
+    return true
   } catch {
-    return false;
+    return false
   }
-});
+})
 
 const formatJson = () => {
   if (!isJsonValid.value) {
-    return;
+    return
   }
 
-  editedJson.value = JSON.stringify(JSON.parse(editedJson.value), undefined, 2);
-};
+  editedJson.value = JSON.stringify(JSON.parse(editedJson.value), undefined, 2)
+}
 
 const handleSubmit = () => {
   if (!isJsonValid.value) {
-    return;
+    return
   }
 
-  formatJson();
+  formatJson()
 
-  modal.approve(editedJson.value);
-};
+  modal.approve(editedJson.value)
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/modals/UnreachableHostsModal.vue b/@xen-orchestra/lite/src/components/modals/UnreachableHostsModal.vue
index 8ad85144d82..56d57fa8654 100644
--- a/@xen-orchestra/lite/src/components/modals/UnreachableHostsModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/UnreachableHostsModal.vue
@@ -1,12 +1,12 @@
 <template>
   <UiModal color="error" @submit="modal.approve()">
     <ConfirmModalLayout :icon="faServer">
-      <template #title>{{ $t("unreachable-hosts") }}</template>
+      <template #title>{{ $t('unreachable-hosts') }}</template>
 
       <template #default>
         <div class="description">
-          <p>{{ $t("following-hosts-unreachable") }}</p>
-          <p>{{ $t("allow-self-signed-ssl") }}</p>
+          <p>{{ $t('following-hosts-unreachable') }}</p>
+          <p>{{ $t('allow-self-signed-ssl') }}</p>
           <ul>
             <li v-for="url in urls" :key="url">
               <a :href="url" class="link" rel="noopener" target="_blank">
@@ -20,7 +20,7 @@
       <template #buttons>
         <ModalDeclineButton />
         <ModalApproveButton>
-          {{ $t("unreachable-hosts-reload-page") }}
+          {{ $t('unreachable-hosts-reload-page') }}
         </ModalApproveButton>
       </template>
     </ConfirmModalLayout>
@@ -28,19 +28,19 @@
 </template>
 
 <script lang="ts" setup>
-import ConfirmModalLayout from "@/components/ui/modals/layouts/ConfirmModalLayout.vue";
-import ModalApproveButton from "@/components/ui/modals/ModalApproveButton.vue";
-import ModalDeclineButton from "@/components/ui/modals/ModalDeclineButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import { IK_MODAL } from "@/types/injection-keys";
-import { faServer } from "@fortawesome/free-solid-svg-icons";
-import { inject } from "vue";
+import ConfirmModalLayout from '@/components/ui/modals/layouts/ConfirmModalLayout.vue'
+import ModalApproveButton from '@/components/ui/modals/ModalApproveButton.vue'
+import ModalDeclineButton from '@/components/ui/modals/ModalDeclineButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import { IK_MODAL } from '@/types/injection-keys'
+import { faServer } from '@fortawesome/free-solid-svg-icons'
+import { inject } from 'vue'
 
 defineProps<{
-  urls: string[];
-}>();
+  urls: string[]
+}>()
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/modals/VmDeleteModal.vue b/@xen-orchestra/lite/src/components/modals/VmDeleteModal.vue
index d7d8b7685a0..2483b40f03a 100644
--- a/@xen-orchestra/lite/src/components/modals/VmDeleteModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/VmDeleteModal.vue
@@ -4,21 +4,21 @@
       <template #title>
         <i18n-t keypath="confirm-delete" scope="global" tag="div">
           <span :class="textClass">
-            {{ $t("n-vms", { n: vmRefs.length }) }}
+            {{ $t('n-vms', { n: vmRefs.length }) }}
           </span>
         </i18n-t>
       </template>
 
       <template #subtitle>
-        {{ $t("please-confirm") }}
+        {{ $t('please-confirm') }}
       </template>
 
       <template #buttons>
         <ModalDeclineButton>
-          {{ $t("go-back") }}
+          {{ $t('go-back') }}
         </ModalDeclineButton>
         <ModalApproveButton>
-          {{ $t("delete-vms", { n: vmRefs.length }) }}
+          {{ $t('delete-vms', { n: vmRefs.length }) }}
         </ModalApproveButton>
       </template>
     </ConfirmModalLayout>
@@ -26,28 +26,28 @@
 </template>
 
 <script lang="ts" setup>
-import ConfirmModalLayout from "@/components/ui/modals/layouts/ConfirmModalLayout.vue";
-import ModalApproveButton from "@/components/ui/modals/ModalApproveButton.vue";
-import ModalDeclineButton from "@/components/ui/modals/ModalDeclineButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import { useContext } from "@/composables/context.composable";
-import { ColorContext } from "@/context";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { IK_MODAL } from "@/types/injection-keys";
-import { faSatellite } from "@fortawesome/free-solid-svg-icons";
-import { inject } from "vue";
+import ConfirmModalLayout from '@/components/ui/modals/layouts/ConfirmModalLayout.vue'
+import ModalApproveButton from '@/components/ui/modals/ModalApproveButton.vue'
+import ModalDeclineButton from '@/components/ui/modals/ModalDeclineButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import { useContext } from '@/composables/context.composable'
+import { ColorContext } from '@/context'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { IK_MODAL } from '@/types/injection-keys'
+import { faSatellite } from '@fortawesome/free-solid-svg-icons'
+import { inject } from 'vue'
 
 const props = defineProps<{
-  vmRefs: XenApiVm["$ref"][];
-}>();
+  vmRefs: XenApiVm['$ref'][]
+}>()
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 
-const { textClass } = useContext(ColorContext);
+const { textClass } = useContext(ColorContext)
 
 const handleSubmit = () => {
-  const xenApi = useXenApiStore().getXapi();
-  modal.approve(xenApi.vm.delete(props.vmRefs));
-};
+  const xenApi = useXenApiStore().getXapi()
+  modal.approve(xenApi.vm.delete(props.vmRefs))
+}
 </script>
diff --git a/@xen-orchestra/lite/src/components/modals/VmExportBlockedUrlsModal.vue b/@xen-orchestra/lite/src/components/modals/VmExportBlockedUrlsModal.vue
index b2d8cb6ea24..d2a9cc7cb15 100644
--- a/@xen-orchestra/lite/src/components/modals/VmExportBlockedUrlsModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/VmExportBlockedUrlsModal.vue
@@ -2,11 +2,11 @@
   <UiModal>
     <FormModalLayout :icon="faDisplay">
       <template #title>
-        {{ $t("export-n-vms-manually", { n: labelWithUrl.length }) }}
+        {{ $t('export-n-vms-manually', { n: labelWithUrl.length }) }}
       </template>
 
       <p>
-        {{ $t("export-vms-manually-information") }}
+        {{ $t('export-vms-manually-information') }}
       </p>
       <ul class="list">
         <li v-for="({ url, label }, index) in labelWithUrl" :key="index">
@@ -24,29 +24,29 @@
 </template>
 
 <script lang="ts" setup>
-import FormModalLayout from "@/components/ui/modals/layouts/FormModalLayout.vue";
-import ModalDeclineButton from "@/components/ui/modals/ModalDeclineButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { faDisplay } from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+import FormModalLayout from '@/components/ui/modals/layouts/FormModalLayout.vue'
+import ModalDeclineButton from '@/components/ui/modals/ModalDeclineButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { faDisplay } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  blockedUrls: URL[];
-}>();
+  blockedUrls: URL[]
+}>()
 
-const { getByOpaqueRef } = useVmCollection();
+const { getByOpaqueRef } = useVmCollection()
 
 const labelWithUrl = computed(() =>
-  props.blockedUrls.map((url) => {
-    const ref = url.searchParams.get("ref") as XenApiVm["$ref"];
+  props.blockedUrls.map(url => {
+    const ref = url.searchParams.get('ref') as XenApiVm['$ref']
     return {
-      url: url,
+      url,
       label: getByOpaqueRef(ref)?.name_label ?? ref,
-    };
+    }
   })
-);
+)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/modals/VmExportModal.vue b/@xen-orchestra/lite/src/components/modals/VmExportModal.vue
index 01e957fe08a..caa8a6df823 100644
--- a/@xen-orchestra/lite/src/components/modals/VmExportModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/VmExportModal.vue
@@ -2,7 +2,7 @@
   <UiModal @submit.prevent="handleSubmit">
     <FormModalLayout :icon="faDisplay">
       <template #title>
-        {{ $t("export-n-vms", { n: vmRefs.length }) }}
+        {{ $t('export-n-vms', { n: vmRefs.length }) }}
       </template>
 
       <FormInputWrapper
@@ -14,9 +14,7 @@
           <option
             v-for="key in Object.keys(VM_COMPRESSION_TYPE)"
             :key="key"
-            :value="
-              VM_COMPRESSION_TYPE[key as keyof typeof VM_COMPRESSION_TYPE]
-            "
+            :value="VM_COMPRESSION_TYPE[key as keyof typeof VM_COMPRESSION_TYPE]"
           >
             {{ $t(key.toLowerCase()) }}
           </option>
@@ -26,7 +24,7 @@
       <template #buttons>
         <ModalDeclineButton />
         <ModalApproveButton>
-          {{ $t("export-n-vms", { n: vmRefs.length }) }}
+          {{ $t('export-n-vms', { n: vmRefs.length }) }}
         </ModalApproveButton>
       </template>
     </FormModalLayout>
@@ -34,32 +32,32 @@
 </template>
 
 <script lang="ts" setup>
-import { faDisplay } from "@fortawesome/free-solid-svg-icons";
-import { inject, ref } from "vue";
+import { faDisplay } from '@fortawesome/free-solid-svg-icons'
+import { inject, ref } from 'vue'
 
-import FormInputWrapper from "@/components/form/FormInputWrapper.vue";
-import FormSelect from "@/components/form/FormSelect.vue";
-import FormModalLayout from "@/components/ui/modals/layouts/FormModalLayout.vue";
-import ModalApproveButton from "@/components/ui/modals/ModalApproveButton.vue";
-import ModalDeclineButton from "@/components/ui/modals/ModalDeclineButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import { IK_MODAL } from "@/types/injection-keys";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { VM_COMPRESSION_TYPE } from "@/libs/xen-api/xen-api.enums";
+import FormInputWrapper from '@/components/form/FormInputWrapper.vue'
+import FormSelect from '@/components/form/FormSelect.vue'
+import FormModalLayout from '@/components/ui/modals/layouts/FormModalLayout.vue'
+import ModalApproveButton from '@/components/ui/modals/ModalApproveButton.vue'
+import ModalDeclineButton from '@/components/ui/modals/ModalDeclineButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import { IK_MODAL } from '@/types/injection-keys'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { VM_COMPRESSION_TYPE } from '@/libs/xen-api/xen-api.enums'
 
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
 
 const props = defineProps<{
-  vmRefs: XenApiVm["$ref"][];
-}>();
+  vmRefs: XenApiVm['$ref'][]
+}>()
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 
-const compressionType = ref(VM_COMPRESSION_TYPE.DISABLED);
+const compressionType = ref(VM_COMPRESSION_TYPE.DISABLED)
 
 const handleSubmit = () => {
-  const xenApi = useXenApiStore().getXapi();
-  xenApi.vm.export(props.vmRefs, compressionType.value);
-  modal.approve();
-};
+  const xenApi = useXenApiStore().getXapi()
+  xenApi.vm.export(props.vmRefs, compressionType.value)
+  modal.approve()
+}
 </script>
diff --git a/@xen-orchestra/lite/src/components/modals/VmMigrateModal.vue b/@xen-orchestra/lite/src/components/modals/VmMigrateModal.vue
index f6e9d9d87ee..be7be8bb2a4 100644
--- a/@xen-orchestra/lite/src/components/modals/VmMigrateModal.vue
+++ b/@xen-orchestra/lite/src/components/modals/VmMigrateModal.vue
@@ -2,20 +2,16 @@
   <UiModal @submit.prevent="handleSubmit()">
     <FormModalLayout>
       <template #title>
-        {{ $t("migrate-n-vms", { n: vmRefs.length }) }}
+        {{ $t('migrate-n-vms', { n: vmRefs.length }) }}
       </template>
 
       <div>
         <FormInputWrapper :label="$t('select-destination-host')" light>
           <FormSelect v-model="selectedHost">
             <option :value="undefined">
-              {{ $t("select-destination-host") }}
+              {{ $t('select-destination-host') }}
             </option>
-            <option
-              v-for="host in availableHosts"
-              :key="host.$ref"
-              :value="host"
-            >
+            <option v-for="host in availableHosts" :key="host.$ref" :value="host">
               {{ host.name_label }}
             </option>
           </FormSelect>
@@ -25,7 +21,7 @@
       <template #buttons>
         <ModalDeclineButton />
         <ModalApproveButton>
-          {{ $t("migrate-n-vms", { n: vmRefs.length }) }}
+          {{ $t('migrate-n-vms', { n: vmRefs.length }) }}
         </ModalApproveButton>
       </template>
     </FormModalLayout>
@@ -33,32 +29,30 @@
 </template>
 
 <script lang="ts" setup>
-import FormInputWrapper from "@/components/form/FormInputWrapper.vue";
-import FormSelect from "@/components/form/FormSelect.vue";
-import FormModalLayout from "@/components/ui/modals/layouts/FormModalLayout.vue";
-import ModalApproveButton from "@/components/ui/modals/ModalApproveButton.vue";
-import ModalDeclineButton from "@/components/ui/modals/ModalDeclineButton.vue";
-import UiModal from "@/components/ui/modals/UiModal.vue";
-import { useVmMigration } from "@/composables/vm-migration.composable";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { IK_MODAL } from "@/types/injection-keys";
-import { inject } from "vue";
+import FormInputWrapper from '@/components/form/FormInputWrapper.vue'
+import FormSelect from '@/components/form/FormSelect.vue'
+import FormModalLayout from '@/components/ui/modals/layouts/FormModalLayout.vue'
+import ModalApproveButton from '@/components/ui/modals/ModalApproveButton.vue'
+import ModalDeclineButton from '@/components/ui/modals/ModalDeclineButton.vue'
+import UiModal from '@/components/ui/modals/UiModal.vue'
+import { useVmMigration } from '@/composables/vm-migration.composable'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { IK_MODAL } from '@/types/injection-keys'
+import { inject } from 'vue'
 
 const props = defineProps<{
-  vmRefs: XenApiVm["$ref"][];
-}>();
+  vmRefs: XenApiVm['$ref'][]
+}>()
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 
-const { selectedHost, availableHosts, isValid, migrate } = useVmMigration(
-  () => props.vmRefs
-);
+const { selectedHost, availableHosts, isValid, migrate } = useVmMigration(() => props.vmRefs)
 
 const handleSubmit = () => {
   if (!isValid.value) {
-    return;
+    return
   }
 
-  modal.approve(migrate());
-};
+  modal.approve(migrate())
+}
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/PoolHeader.vue b/@xen-orchestra/lite/src/components/pool/PoolHeader.vue
index 9c62df01bb7..5f070b269f1 100644
--- a/@xen-orchestra/lite/src/components/pool/PoolHeader.vue
+++ b/@xen-orchestra/lite/src/components/pool/PoolHeader.vue
@@ -5,12 +5,12 @@
 </template>
 
 <script lang="ts" setup>
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
-import { computed } from "vue";
-import { faBuilding } from "@fortawesome/free-regular-svg-icons";
-import TitleBar from "@/components/TitleBar.vue";
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
+import { computed } from 'vue'
+import { faBuilding } from '@fortawesome/free-regular-svg-icons'
+import TitleBar from '@/components/TitleBar.vue'
 
-const { pool } = usePoolCollection();
+const { pool } = usePoolCollection()
 
-const name = computed(() => pool.value?.name_label ?? "...");
+const name = computed(() => pool.value?.name_label ?? '...')
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/PoolTabBar.vue b/@xen-orchestra/lite/src/components/pool/PoolTabBar.vue
index 22966f69e7b..b1d53a7584d 100644
--- a/@xen-orchestra/lite/src/components/pool/PoolTabBar.vue
+++ b/@xen-orchestra/lite/src/components/pool/PoolTabBar.vue
@@ -1,39 +1,39 @@
 <template>
   <UiTabBar :disabled="!isReady">
     <RouterTab :to="{ name: 'pool.dashboard', params: { uuid: pool?.uuid } }">
-      {{ $t("dashboard") }}
+      {{ $t('dashboard') }}
     </RouterTab>
     <RouterTab :to="{ name: 'pool.alarms', params: { uuid: pool?.uuid } }">
-      {{ $t("alarms") }}
+      {{ $t('alarms') }}
     </RouterTab>
     <RouterTab :to="{ name: 'pool.stats', params: { uuid: pool?.uuid } }">
-      {{ $t("stats") }}
+      {{ $t('stats') }}
     </RouterTab>
     <RouterTab :to="{ name: 'pool.system', params: { uuid: pool?.uuid } }">
-      {{ $t("system") }}
+      {{ $t('system') }}
     </RouterTab>
     <RouterTab :to="{ name: 'pool.network', params: { uuid: pool?.uuid } }">
-      {{ $t("network") }}
+      {{ $t('network') }}
     </RouterTab>
     <RouterTab :to="{ name: 'pool.storage', params: { uuid: pool?.uuid } }">
-      {{ $t("storage") }}
+      {{ $t('storage') }}
     </RouterTab>
     <RouterTab :to="{ name: 'pool.tasks', params: { uuid: pool?.uuid } }">
-      {{ $t("tasks") }}
+      {{ $t('tasks') }}
     </RouterTab>
     <RouterTab :to="{ name: 'pool.hosts', params: { uuid: pool?.uuid } }">
-      {{ $t("hosts") }}
+      {{ $t('hosts') }}
     </RouterTab>
     <RouterTab :to="{ name: 'pool.vms', params: { uuid: pool?.uuid } }">
-      {{ $t("vms") }}
+      {{ $t('vms') }}
     </RouterTab>
   </UiTabBar>
 </template>
 
 <script lang="ts" setup>
-import RouterTab from "@/components/RouterTab.vue";
-import UiTabBar from "@/components/ui/UiTabBar.vue";
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
+import RouterTab from '@/components/RouterTab.vue'
+import UiTabBar from '@/components/ui/UiTabBar.vue'
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
 
-const { pool, isReady } = usePoolCollection();
+const { pool, isReady } = usePoolCollection()
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardAlarms.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardAlarms.vue
index 0d64b55d6fc..2de94fb9223 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardAlarms.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardAlarms.vue
@@ -1,7 +1,7 @@
 <template>
   <UiCard class="pool-dashboard-alarms">
     <UiCardTitle>
-      {{ $t("alarms") }}
+      {{ $t('alarms') }}
       <template v-if="isReady && alarms.length > 0" #right>
         <UiCounter :value="alarms.length" color="error" />
       </template>
@@ -9,9 +9,9 @@
     <div v-if="!isStarted" class="pre-start">
       <div>
         <p class="text">
-          {{ $t("click-to-display-alarms") }}
+          {{ $t('click-to-display-alarms') }}
         </p>
-        <UiButton @click="start">{{ $t("load-now") }}</UiButton>
+        <UiButton @click="start">{{ $t('load-now') }}</UiButton>
       </div>
       <div>
         <img alt="" src="@/assets/server-status.svg" />
@@ -25,9 +25,7 @@
       <div>
         <img alt="" src="@/assets/server-status.svg" />
       </div>
-      <p class="text">
-        {{ $t("all-good") }}<br />{{ $t("no-alarm-triggered") }}
-      </p>
+      <p class="text">{{ $t('all-good') }}<br />{{ $t('no-alarm-triggered') }}</p>
     </div>
     <div v-else class="table-container">
       <UiTable>
@@ -40,23 +38,17 @@
 </template>
 
 <script lang="ts" setup>
-import NoDataError from "@/components/NoDataError.vue";
-import AlarmRow from "@/components/pool/dashboard/alarm/AlarmRow.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UiCounter from "@/components/ui/UiCounter.vue";
-import UiTable from "@/components/ui/UiTable.vue";
-import { useAlarmCollection } from "@/stores/xen-api/alarm.store";
+import NoDataError from '@/components/NoDataError.vue'
+import AlarmRow from '@/components/pool/dashboard/alarm/AlarmRow.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UiCounter from '@/components/ui/UiCounter.vue'
+import UiTable from '@/components/ui/UiTable.vue'
+import { useAlarmCollection } from '@/stores/xen-api/alarm.store'
 
-const {
-  records: alarms,
-  start,
-  isStarted,
-  isReady,
-  hasError,
-} = useAlarmCollection({ defer: true });
+const { records: alarms, start, isStarted, isReady, hasError } = useAlarmCollection({ defer: true })
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardCpuProvisioning.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardCpuProvisioning.vue
index 3f112fc6462..2eaf63b468d 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardCpuProvisioning.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardCpuProvisioning.vue
@@ -1,7 +1,7 @@
 <template>
   <UiCard :color="hasError ? 'error' : undefined">
     <UiCardTitle>
-      {{ $t("cpu-provisioning") }}
+      {{ $t('cpu-provisioning') }}
       <template v-if="!hasError" #right>
         <UiStatusIcon
           v-if="state !== 'success'"
@@ -20,11 +20,11 @@
       <UiProgressLegend :label="$t('vcpus')" :value="`${value}%`" />
       <UiCardFooter class="ui-card-footer">
         <template #left>
-          <p>{{ $t("vcpus-used") }}</p>
+          <p>{{ $t('vcpus-used') }}</p>
           <p class="footer-value">{{ nVCpuInUse }}</p>
         </template>
         <template #right>
-          <p>{{ $t("total-cpus") }}</p>
+          <p>{{ $t('total-cpus') }}</p>
           <p class="footer-value">{{ nPCpu }}</p>
         </template>
       </UiCardFooter>
@@ -34,74 +34,49 @@
 </template>
 
 <script lang="ts" setup>
-import NoDataError from "@/components/NoDataError.vue";
-import UiStatusIcon from "@/components/ui/icon/UiStatusIcon.vue";
-import UiProgressBar from "@/components/ui/progress/UiProgressBar.vue";
-import UiProgressLegend from "@/components/ui/progress/UiProgressLegend.vue";
-import UiProgressScale from "@/components/ui/progress/UiProgressScale.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardFooter from "@/components/ui/UiCardFooter.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { percent } from "@/libs/utils";
-import { VM_POWER_STATE } from "@/libs/xen-api/xen-api.enums";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useVmMetricsCollection } from "@/stores/xen-api/vm-metrics.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { logicAnd } from "@vueuse/math";
-import { computed } from "vue";
+import NoDataError from '@/components/NoDataError.vue'
+import UiStatusIcon from '@/components/ui/icon/UiStatusIcon.vue'
+import UiProgressBar from '@/components/ui/progress/UiProgressBar.vue'
+import UiProgressLegend from '@/components/ui/progress/UiProgressLegend.vue'
+import UiProgressScale from '@/components/ui/progress/UiProgressScale.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardFooter from '@/components/ui/UiCardFooter.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { percent } from '@/libs/utils'
+import { VM_POWER_STATE } from '@/libs/xen-api/xen-api.enums'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useVmMetricsCollection } from '@/stores/xen-api/vm-metrics.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { logicAnd } from '@vueuse/math'
+import { computed } from 'vue'
 
-const ACTIVE_STATES = new Set([VM_POWER_STATE.RUNNING, VM_POWER_STATE.PAUSED]);
+const ACTIVE_STATES = new Set([VM_POWER_STATE.RUNNING, VM_POWER_STATE.PAUSED])
 
-const {
-  hasError: hostStoreHasError,
-  isReady: isHostStoreReady,
-  runningHosts,
-} = useHostCollection();
+const { hasError: hostStoreHasError, isReady: isHostStoreReady, runningHosts } = useHostCollection()
 
-const {
-  hasError: vmStoreHasError,
-  isReady: isVmStoreReady,
-  records: vms,
-} = useVmCollection();
+const { hasError: vmStoreHasError, isReady: isVmStoreReady, records: vms } = useVmCollection()
 
-const { getByOpaqueRef: getVmMetrics, isReady: isVmMetricsStoreReady } =
-  useVmMetricsCollection();
+const { getByOpaqueRef: getVmMetrics, isReady: isVmMetricsStoreReady } = useVmMetricsCollection()
 
-const nPCpu = computed(() =>
-  runningHosts.value.reduce(
-    (total, host) => total + Number(host.cpu_info.cpu_count),
-    0
-  )
-);
+const nPCpu = computed(() => runningHosts.value.reduce((total, host) => total + Number(host.cpu_info.cpu_count), 0))
 
 const nVCpuInUse = computed(() => {
   if (!isReady.value) {
-    return 0;
+    return 0
   }
 
   return vms.value.reduce(
-    (total, vm) =>
-      ACTIVE_STATES.has(vm.power_state)
-        ? total + getVmMetrics(vm.metrics)!.VCPUs_number
-        : total,
+    (total, vm) => (ACTIVE_STATES.has(vm.power_state) ? total + getVmMetrics(vm.metrics)!.VCPUs_number : total),
     0
-  );
-});
-const value = computed(() =>
-  Math.round(percent(nVCpuInUse.value, nPCpu.value))
-);
-const maxValue = computed(() => Math.ceil(value.value / 100) * 100);
-const state = computed(() => (value.value > 100 ? "warning" : "success"));
-const isReady = logicAnd(
-  isVmStoreReady,
-  isHostStoreReady,
-  isVmMetricsStoreReady
-);
-const hasError = computed(
-  () => hostStoreHasError.value || vmStoreHasError.value
-);
+  )
+})
+const value = computed(() => Math.round(percent(nVCpuInUse.value, nPCpu.value)))
+const maxValue = computed(() => Math.ceil(value.value / 100) * 100)
+const state = computed(() => (value.value > 100 ? 'warning' : 'success'))
+const isReady = logicAnd(isVmStoreReady, isHostStoreReady, isVmMetricsStoreReady)
+const hasError = computed(() => hostStoreHasError.value || vmStoreHasError.value)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardCpuUsage.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardCpuUsage.vue
index ffd91657689..7a5695a3e69 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardCpuUsage.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardCpuUsage.vue
@@ -1,7 +1,7 @@
 <template>
   <UiCard :color="hasError ? 'error' : undefined">
     <UiCardTitle>
-      {{ $t("cpu-usage") }}
+      {{ $t('cpu-usage') }}
       <template v-if="vmStatsCanBeExpired || hostStatsCanBeExpired" #right>
         <UiSpinner v-tooltip="$t('fetching-fresh-data')" />
       </template>
@@ -11,38 +11,34 @@
   </UiCard>
 </template>
 <script lang="ts" setup>
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { vTooltip } from "@/directives/tooltip.directive";
-import HostsCpuUsage from "@/components/pool/dashboard/cpuUsage/HostsCpuUsage.vue";
-import VmsCpuUsage from "@/components/pool/dashboard/cpuUsage/VmsCpuUsage.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import { computed, inject, type ComputedRef } from "vue";
-import type { Stat } from "@/composables/fetch-stats.composable";
-import type { HostStats, VmStats } from "@/libs/xapi-stats";
-import UiSpinner from "@/components/ui/UiSpinner.vue";
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { vTooltip } from '@/directives/tooltip.directive'
+import HostsCpuUsage from '@/components/pool/dashboard/cpuUsage/HostsCpuUsage.vue'
+import VmsCpuUsage from '@/components/pool/dashboard/cpuUsage/VmsCpuUsage.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import { computed, inject, type ComputedRef } from 'vue'
+import type { Stat } from '@/composables/fetch-stats.composable'
+import type { HostStats, VmStats } from '@/libs/xapi-stats'
+import UiSpinner from '@/components/ui/UiSpinner.vue'
 
-const { hasError: hasVmError } = useVmCollection();
-const { hasError: hasHostError } = useHostCollection();
+const { hasError: hasVmError } = useVmCollection()
+const { hasError: hasHostError } = useHostCollection()
 
 const vmStats = inject<ComputedRef<Stat<VmStats>[]>>(
-  "vmStats",
+  'vmStats',
   computed(() => [])
-);
+)
 
 const hostStats = inject<ComputedRef<Stat<HostStats>[]>>(
-  "hostStats",
+  'hostStats',
   computed(() => [])
-);
+)
 
-const vmStatsCanBeExpired = computed(() =>
-  vmStats.value.some((stat) => stat.canBeExpired)
-);
+const vmStatsCanBeExpired = computed(() => vmStats.value.some(stat => stat.canBeExpired))
 
-const hostStatsCanBeExpired = computed(() =>
-  hostStats.value.some((stat) => stat.canBeExpired)
-);
+const hostStatsCanBeExpired = computed(() => hostStats.value.some(stat => stat.canBeExpired))
 
-const hasError = computed(() => hasVmError.value || hasHostError.value);
+const hasError = computed(() => hasVmError.value || hasHostError.value)
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardHostsPatches.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardHostsPatches.vue
index 68ba58416e5..a7817560b44 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardHostsPatches.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardHostsPatches.vue
@@ -1,9 +1,9 @@
 <template>
   <UiCard>
     <UiCardTitle class="patches-title">
-      {{ $t("patches") }}
+      {{ $t('patches') }}
       <template v-if="areAllLoaded && count > 0" #right>
-        {{ $t("n-missing", { n: count }) }}
+        {{ $t('n-missing', { n: count }) }}
       </template>
     </UiCardTitle>
     <div class="table-container">
@@ -18,15 +18,15 @@
 </template>
 
 <script lang="ts" setup>
-import HostPatches from "@/components/HostPatchesTable.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import { useHostPatches } from "@/composables/host-patches.composable";
-import { useHostCollection } from "@/stores/xen-api/host.store";
+import HostPatches from '@/components/HostPatchesTable.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import { useHostPatches } from '@/composables/host-patches.composable'
+import { useHostCollection } from '@/stores/xen-api/host.store'
 
-const { records: hosts } = useHostCollection();
+const { records: hosts } = useHostCollection()
 
-const { count, patches, areSomeLoaded, areAllLoaded } = useHostPatches(hosts);
+const { count, patches, areSomeLoaded, areAllLoaded } = useHostPatches(hosts)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardNetworkChart.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardNetworkChart.vue
index eda84c26bb6..d59a844265b 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardNetworkChart.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardNetworkChart.vue
@@ -1,126 +1,110 @@
 <template>
   <UiCard class="linear-chart" :color="hasError ? 'error' : undefined">
-    <UiCardTitle>{{ $t("network-throughput") }}</UiCardTitle>
+    <UiCardTitle>{{ $t('network-throughput') }}</UiCardTitle>
     <UiCardTitle :level="UiCardTitleLevel.Subtitle">
-      {{ $t("last-week") }}
+      {{ $t('last-week') }}
     </UiCardTitle>
     <NoDataError v-if="hasError" />
     <UiCardSpinner v-else-if="isLoading" />
-    <LinearChart
-      v-else
-      :data="data"
-      :max-value="customMaxValue"
-      :value-formatter="customValueFormatter"
-    />
+    <LinearChart v-else :data="data" :max-value="customMaxValue" :value-formatter="customValueFormatter" />
   </UiCard>
 </template>
 
 <script lang="ts" setup>
-import { computed, defineAsyncComponent, inject } from "vue";
-import { formatSize } from "@/libs/utils";
-import type { HostStats } from "@/libs/xapi-stats";
-import { IK_HOST_LAST_WEEK_STATS } from "@/types/injection-keys";
-import type { LinearChartData } from "@/types/chart";
-import { map } from "lodash-es";
-import NoDataError from "@/components/NoDataError.vue";
-import { RRD_STEP_FROM_STRING } from "@/libs/xapi-stats";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import { UiCardTitleLevel } from "@/types/enums";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useI18n } from "vue-i18n";
-
-const { t } = useI18n();
-
-const LinearChart = defineAsyncComponent(
-  () => import("@/components/charts/LinearChart.vue")
-);
-
-const hostLastWeekStats = inject(IK_HOST_LAST_WEEK_STATS);
-const { hasError, isFetching } = useHostCollection();
+import { computed, defineAsyncComponent, inject } from 'vue'
+import { formatSize } from '@/libs/utils'
+import type { HostStats } from '@/libs/xapi-stats'
+import { IK_HOST_LAST_WEEK_STATS } from '@/types/injection-keys'
+import type { LinearChartData } from '@/types/chart'
+import { map } from 'lodash-es'
+import NoDataError from '@/components/NoDataError.vue'
+import { RRD_STEP_FROM_STRING } from '@/libs/xapi-stats'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import { UiCardTitleLevel } from '@/types/enums'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
+
+const LinearChart = defineAsyncComponent(() => import('@/components/charts/LinearChart.vue'))
+
+const hostLastWeekStats = inject(IK_HOST_LAST_WEEK_STATS)
+const { hasError, isFetching } = useHostCollection()
 
 const data = computed<LinearChartData>(() => {
-  const stats = hostLastWeekStats?.stats?.value;
-  const timestampStart = hostLastWeekStats?.timestampStart?.value;
+  const stats = hostLastWeekStats?.stats?.value
+  const timestampStart = hostLastWeekStats?.timestampStart?.value
 
   if (timestampStart === undefined || stats == null) {
-    return [];
+    return []
   }
 
   const results = {
     tx: new Map<number, { timestamp: number; value: number }>(),
     rx: new Map<number, { timestamp: number; value: number }>(),
-  };
+  }
 
-  const addResult = (stats: HostStats, type: "tx" | "rx") => {
-    const networkStats = Object.values(stats.pifs[type]);
+  const addResult = (stats: HostStats, type: 'tx' | 'rx') => {
+    const networkStats = Object.values(stats.pifs[type])
 
     for (let hourIndex = 0; hourIndex < networkStats[0].length; hourIndex++) {
-      const timestamp =
-        (timestampStart + hourIndex * RRD_STEP_FROM_STRING.hours) * 1000;
+      const timestamp = (timestampStart + hourIndex * RRD_STEP_FROM_STRING.hours) * 1000
 
-      const networkThroughput = networkStats.reduce(
-        (total, throughput) => total + throughput[hourIndex],
-        0
-      );
+      const networkThroughput = networkStats.reduce((total, throughput) => total + throughput[hourIndex], 0)
 
       results[type].set(timestamp, {
         timestamp,
         value: (results[type].get(timestamp)?.value ?? 0) + networkThroughput,
-      });
+      })
     }
-  };
+  }
 
-  stats.forEach((host) => {
+  stats.forEach(host => {
     if (!host.stats) {
-      return;
+      return
     }
 
-    addResult(host.stats, "rx");
-    addResult(host.stats, "tx");
-  });
+    addResult(host.stats, 'rx')
+    addResult(host.stats, 'tx')
+  })
 
   return [
     {
-      label: t("network-upload"),
-      data: Array.from(results["tx"].values()),
+      label: t('network-upload'),
+      data: Array.from(results.tx.values()),
     },
     {
-      label: t("network-download"),
-      data: Array.from(results["rx"].values()),
+      label: t('network-download'),
+      data: Array.from(results.rx.values()),
     },
-  ];
-});
+  ]
+})
 
 const isStatFetched = computed(() => {
-  const stats = hostLastWeekStats?.stats?.value;
+  const stats = hostLastWeekStats?.stats?.value
   if (stats === undefined) {
-    return false;
+    return false
   }
 
-  return stats.every((host) => {
-    const hostStats = host.stats;
+  return stats.every(host => {
+    const hostStats = host.stats
     return (
       hostStats != null &&
-      Object.values(hostStats.pifs["rx"])[0].length +
-        Object.values(hostStats.pifs["tx"])[0].length ===
+      Object.values(hostStats.pifs.rx)[0].length + Object.values(hostStats.pifs.tx)[0].length ===
         data.value[0].data.length + data.value[1].data.length
-    );
-  });
-});
+    )
+  })
+})
 
-const isLoading = computed(() => isFetching.value || !isStatFetched.value);
+const isLoading = computed(() => isFetching.value || !isStatFetched.value)
 
 // TODO: improve the way to get the max value of graph
 // See: https://github.com/vatesfr/xen-orchestra/pull/6610/files#r1072237279
 const customMaxValue = computed(
-  () =>
-    Math.max(
-      ...map(data.value[0].data, "value"),
-      ...map(data.value[1].data, "value")
-    ) * 1.5
-);
-
-const customValueFormatter = (value: number) => String(formatSize(value));
+  () => Math.max(...map(data.value[0].data, 'value'), ...map(data.value[1].data, 'value')) * 1.5
+)
+
+const customValueFormatter = (value: number) => String(formatSize(value))
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardRamUsage.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardRamUsage.vue
index 393c2382771..d606404688c 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardRamUsage.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardRamUsage.vue
@@ -1,7 +1,7 @@
 <template>
   <UiCard :color="hasError ? 'error' : undefined">
     <UiCardTitle>
-      {{ $t("ram-usage") }}
+      {{ $t('ram-usage') }}
       <template v-if="vmStatsCanBeExpired || hostStatsCanBeExpired" #right>
         <UiSpinner v-tooltip="$t('fetching-fresh-data')" />
       </template>
@@ -12,39 +12,35 @@
 </template>
 
 <script lang="ts" setup>
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { vTooltip } from "@/directives/tooltip.directive";
-import HostsRamUsage from "@/components/pool/dashboard/ramUsage/HostsRamUsage.vue";
-import VmsRamUsage from "@/components/pool/dashboard/ramUsage/VmsRamUsage.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import { computed, inject } from "vue";
-import type { ComputedRef } from "vue";
-import type { HostStats, VmStats } from "@/libs/xapi-stats";
-import type { Stat } from "@/composables/fetch-stats.composable";
-import UiSpinner from "@/components/ui/UiSpinner.vue";
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { vTooltip } from '@/directives/tooltip.directive'
+import HostsRamUsage from '@/components/pool/dashboard/ramUsage/HostsRamUsage.vue'
+import VmsRamUsage from '@/components/pool/dashboard/ramUsage/VmsRamUsage.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import { computed, inject } from 'vue'
+import type { ComputedRef } from 'vue'
+import type { HostStats, VmStats } from '@/libs/xapi-stats'
+import type { Stat } from '@/composables/fetch-stats.composable'
+import UiSpinner from '@/components/ui/UiSpinner.vue'
 
-const { hasError: hasVmError } = useVmCollection();
-const { hasError: hasHostError } = useHostCollection();
+const { hasError: hasVmError } = useVmCollection()
+const { hasError: hasHostError } = useHostCollection()
 
 const vmStats = inject<ComputedRef<Stat<VmStats>[]>>(
-  "vmStats",
+  'vmStats',
   computed(() => [])
-);
+)
 
 const hostStats = inject<ComputedRef<Stat<HostStats>[]>>(
-  "hostStats",
+  'hostStats',
   computed(() => [])
-);
+)
 
-const vmStatsCanBeExpired = computed(() =>
-  vmStats.value.some((stat) => stat.canBeExpired)
-);
+const vmStatsCanBeExpired = computed(() => vmStats.value.some(stat => stat.canBeExpired))
 
-const hostStatsCanBeExpired = computed(() =>
-  hostStats.value.some((stat) => stat.canBeExpired)
-);
+const hostStatsCanBeExpired = computed(() => hostStats.value.some(stat => stat.canBeExpired))
 
-const hasError = computed(() => hasVmError.value || hasHostError.value);
+const hasError = computed(() => hasVmError.value || hasHostError.value)
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStatus.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStatus.vue
index a088d4124f3..35b73069b07 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStatus.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStatus.vue
@@ -1,60 +1,40 @@
 <template>
   <UiCard :color="hasError ? 'error' : undefined">
-    <UiCardTitle>{{ $t("status") }}</UiCardTitle>
+    <UiCardTitle>{{ $t('status') }}</UiCardTitle>
     <NoDataError v-if="hasError" />
     <UiCardSpinner v-else-if="!isReady" />
     <template v-else>
-      <PoolDashboardStatusItem
-        :active="activeHostsCount"
-        :label="$t('hosts')"
-        :total="totalHostsCount"
-      />
+      <PoolDashboardStatusItem :active="activeHostsCount" :label="$t('hosts')" :total="totalHostsCount" />
       <UiSeparator />
-      <PoolDashboardStatusItem
-        :active="activeVmsCount"
-        :label="$t('vms')"
-        :total="totalVmsCount"
-      />
+      <PoolDashboardStatusItem :active="activeVmsCount" :label="$t('vms')" :total="totalVmsCount" />
     </template>
   </UiCard>
 </template>
 
 <script lang="ts" setup>
-import NoDataError from "@/components/NoDataError.vue";
-import PoolDashboardStatusItem from "@/components/pool/dashboard/PoolDashboardStatusItem.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UiSeparator from "@/components/ui/UiSeparator.vue";
-import { useHostMetricsCollection } from "@/stores/xen-api/host-metrics.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { computed } from "vue";
-
-const {
-  isReady: isVmReady,
-  records: vms,
-  hasError: hasVmError,
-} = useVmCollection();
-
-const {
-  isReady: isHostMetricsReady,
-  records: hostMetrics,
-  hasError: hasHostMetricsError,
-} = useHostMetricsCollection();
-
-const hasError = computed(() => hasVmError.value || hasHostMetricsError.value);
-
-const isReady = computed(() => isVmReady.value && isHostMetricsReady.value);
-
-const totalHostsCount = computed(() => hostMetrics.value.length);
-
-const activeHostsCount = computed(
-  () => hostMetrics.value.filter((hostMetrics) => hostMetrics.live).length
-);
-
-const totalVmsCount = computed(() => vms.value.length);
-
-const activeVmsCount = computed(
-  () => vms.value.filter((vm) => vm.power_state === "Running").length
-);
+import NoDataError from '@/components/NoDataError.vue'
+import PoolDashboardStatusItem from '@/components/pool/dashboard/PoolDashboardStatusItem.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UiSeparator from '@/components/ui/UiSeparator.vue'
+import { useHostMetricsCollection } from '@/stores/xen-api/host-metrics.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { computed } from 'vue'
+
+const { isReady: isVmReady, records: vms, hasError: hasVmError } = useVmCollection()
+
+const { isReady: isHostMetricsReady, records: hostMetrics, hasError: hasHostMetricsError } = useHostMetricsCollection()
+
+const hasError = computed(() => hasVmError.value || hasHostMetricsError.value)
+
+const isReady = computed(() => isVmReady.value && isHostMetricsReady.value)
+
+const totalHostsCount = computed(() => hostMetrics.value.length)
+
+const activeHostsCount = computed(() => hostMetrics.value.filter(hostMetrics => hostMetrics.live).length)
+
+const totalVmsCount = computed(() => vms.value.length)
+
+const activeVmsCount = computed(() => vms.value.filter(vm => vm.power_state === 'Running').length)
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStatusItem.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStatusItem.vue
index b55a8cc0a22..f3108dd4af7 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStatusItem.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStatusItem.vue
@@ -21,17 +21,17 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from "vue";
-import ProgressCircle from "@/components/ProgressCircle.vue";
-import UiTitle from "@/components/ui/UiTitle.vue";
+import { computed } from 'vue'
+import ProgressCircle from '@/components/ProgressCircle.vue'
+import UiTitle from '@/components/ui/UiTitle.vue'
 
 const props = defineProps<{
-  label: string;
-  active: number;
-  total: number;
-}>();
+  label: string
+  active: number
+  total: number
+}>()
 
-const inactive = computed(() => props.total - props.active);
+const inactive = computed(() => props.total - props.active)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStorageUsage.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStorageUsage.vue
index 42bec8d7205..844cb116a09 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStorageUsage.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardStorageUsage.vue
@@ -1,12 +1,9 @@
 <template>
   <UiCard :color="hasError ? 'error' : undefined">
-    <UiCardTitle
-      :left="$t('storage-usage')"
-      :right="$t('top-#', { n: N_ITEMS })"
-    />
+    <UiCardTitle :left="$t('storage-usage')" :right="$t('top-#', { n: N_ITEMS })" />
     <NoDataError v-if="hasError" />
     <UiCardSpinner v-else-if="!isReady" />
-    <UsageBar v-else :data="data.result" :nItems="N_ITEMS">
+    <UsageBar v-else :data="data.result" :n-items="N_ITEMS">
       <template #footer>
         <SizeStatsSummary :size="data.maxSize" :usage="data.usedSize" />
       </template>
@@ -15,49 +12,47 @@
 </template>
 
 <script lang="ts" setup>
-import NoDataError from "@/components/NoDataError.vue";
-import SizeStatsSummary from "@/components/ui/SizeStatsSummary.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UsageBar from "@/components/UsageBar.vue";
-import { useSrCollection } from "@/stores/xen-api/sr.store";
-import { N_ITEMS } from "@/views/pool/PoolDashboardView.vue";
-import { computed } from "vue";
-
-const { records: srs, isReady, hasError } = useSrCollection();
+import NoDataError from '@/components/NoDataError.vue'
+import SizeStatsSummary from '@/components/ui/SizeStatsSummary.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UsageBar from '@/components/UsageBar.vue'
+import { useSrCollection } from '@/stores/xen-api/sr.store'
+import { N_ITEMS } from '@/views/pool/PoolDashboardView.vue'
+import { computed } from 'vue'
+
+const { records: srs, isReady, hasError } = useSrCollection()
 
 const data = computed<{
-  result: { id: string; label: string; value: number }[];
-  maxSize: number;
-  usedSize: number;
+  result: { id: string; label: string; value: number }[]
+  maxSize: number
+  usedSize: number
 }>(() => {
-  const result: { id: string; label: string; value: number }[] = [];
-  let maxSize = 0;
-  let usedSize = 0;
-
-  srs.value.forEach(
-    ({ name_label, physical_size, physical_utilisation, uuid }) => {
-      if (physical_size < 0 || physical_utilisation < 0) {
-        return;
-      }
-
-      maxSize += physical_size;
-      usedSize += physical_utilisation;
-
-      const percent = (physical_utilisation / physical_size) * 100;
-
-      if (isNaN(percent)) {
-        return;
-      }
-
-      result.push({
-        id: uuid,
-        label: name_label,
-        value: percent,
-      });
+  const result: { id: string; label: string; value: number }[] = []
+  let maxSize = 0
+  let usedSize = 0
+
+  srs.value.forEach(({ name_label, physical_size, physical_utilisation, uuid }) => {
+    if (physical_size < 0 || physical_utilisation < 0) {
+      return
+    }
+
+    maxSize += physical_size
+    usedSize += physical_utilisation
+
+    const percent = (physical_utilisation / physical_size) * 100
+
+    if (isNaN(percent)) {
+      return
     }
-  );
-  return { result, maxSize, usedSize };
-});
+
+    result.push({
+      id: uuid,
+      label: name_label,
+      value: percent,
+    })
+  })
+  return { result, maxSize, usedSize }
+})
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardTasks.vue b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardTasks.vue
index 28250f5397c..4f90de25acf 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardTasks.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/PoolDashboardTasks.vue
@@ -1,17 +1,17 @@
 <template>
   <UiCard>
-    <UiCardTitle :count="pendingTasks.length">{{ $t("tasks") }}</UiCardTitle>
+    <UiCardTitle :count="pendingTasks.length">{{ $t('tasks') }}</UiCardTitle>
     <TasksTable :pending-tasks="pendingTasks" />
   </UiCard>
 </template>
 
 <script lang="ts" setup>
-import TasksTable from "@/components/tasks/TasksTable.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import { useTaskCollection } from "@/stores/xen-api/task.store";
+import TasksTable from '@/components/tasks/TasksTable.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import { useTaskCollection } from '@/stores/xen-api/task.store'
 
-const { pendingTasks } = useTaskCollection();
+const { pendingTasks } = useTaskCollection()
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/alarm/AlarmRow.vue b/@xen-orchestra/lite/src/components/pool/dashboard/alarm/AlarmRow.vue
index 0f034dcc54d..8b34acecfc3 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/alarm/AlarmRow.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/alarm/AlarmRow.vue
@@ -1,24 +1,17 @@
 <template>
   <tr>
     <th>
-      <div
-        v-tooltip="new Date(parseDateTime(alarm.timestamp)).toLocaleString()"
-        class="ellipsis time"
-      >
+      <div v-tooltip="new Date(parseDateTime(alarm.timestamp)).toLocaleString()" class="ellipsis time">
         <RelativeTime :date="alarm.timestamp" />
       </div>
     </th>
     <td>
-      <div
-        ref="descriptionElement"
-        v-tooltip="hasTooltip"
-        class="ellipsis description"
-      >
+      <div ref="descriptionElement" v-tooltip="hasTooltip" class="ellipsis description">
         {{ $t(`alarm-type.${alarm.type}`, { n: alarm.triggerLevel * 100 }) }}
       </div>
     </td>
     <td class="level">{{ alarm.level * 100 }}%</td>
-    <td class="on">{{ $t("on-object", { object: alarm.cls }) }}</td>
+    <td class="on">{{ $t('on-object', { object: alarm.cls }) }}</td>
     <td class="object">
       <ObjectLink :type="rawTypeToType(alarm.cls)" :uuid="alarm.obj_uuid" />
     </td>
@@ -26,21 +19,21 @@
 </template>
 
 <script lang="ts" setup generic="T extends RawObjectType">
-import ObjectLink from "@/components/ObjectLink.vue";
-import RelativeTime from "@/components/RelativeTime.vue";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { hasEllipsis, parseDateTime } from "@/libs/utils";
-import type { RawObjectType } from "@/libs/xen-api/xen-api.types";
-import { rawTypeToType } from "@/libs/xen-api/xen-api.utils";
-import type { XenApiAlarm } from "@/types/xen-api";
-import { computed, ref } from "vue";
+import ObjectLink from '@/components/ObjectLink.vue'
+import RelativeTime from '@/components/RelativeTime.vue'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { hasEllipsis, parseDateTime } from '@/libs/utils'
+import type { RawObjectType } from '@/libs/xen-api/xen-api.types'
+import { rawTypeToType } from '@/libs/xen-api/xen-api.utils'
+import type { XenApiAlarm } from '@/types/xen-api'
+import { computed, ref } from 'vue'
 
 defineProps<{
-  alarm: XenApiAlarm<T>;
-}>();
+  alarm: XenApiAlarm<T>
+}>()
 
-const descriptionElement = ref<HTMLElement>();
-const hasTooltip = computed(() => hasEllipsis(descriptionElement.value));
+const descriptionElement = ref<HTMLElement>()
+const hasTooltip = computed(() => hasEllipsis(descriptionElement.value))
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/HostsCpuUsage.vue b/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/HostsCpuUsage.vue
index ad00a8762b5..ab4398fae5d 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/HostsCpuUsage.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/HostsCpuUsage.vue
@@ -11,50 +11,50 @@
 </template>
 
 <script lang="ts" setup>
-import NoDataError from "@/components/NoDataError.vue";
-import NoResult from "@/components/NoResult.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UsageBar from "@/components/UsageBar.vue";
-import { useStatStatus } from "@/composables/stat-status.composable";
-import { getAvgCpuUsage } from "@/libs/utils";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { UiCardTitleLevel } from "@/types/enums";
-import { IK_HOST_STATS } from "@/types/injection-keys";
-import type { StatData } from "@/types/stat";
-import { N_ITEMS } from "@/views/pool/PoolDashboardView.vue";
-import { computed, inject } from "vue";
-
-const { hasError, isFetching } = useHostCollection();
+import NoDataError from '@/components/NoDataError.vue'
+import NoResult from '@/components/NoResult.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UsageBar from '@/components/UsageBar.vue'
+import { useStatStatus } from '@/composables/stat-status.composable'
+import { getAvgCpuUsage } from '@/libs/utils'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { UiCardTitleLevel } from '@/types/enums'
+import { IK_HOST_STATS } from '@/types/injection-keys'
+import type { StatData } from '@/types/stat'
+import { N_ITEMS } from '@/views/pool/PoolDashboardView.vue'
+import { computed, inject } from 'vue'
+
+const { hasError, isFetching } = useHostCollection()
 
 const stats = inject(
   IK_HOST_STATS,
   computed(() => [])
-);
+)
 
 const data = computed<StatData[]>(() => {
-  const result: StatData[] = [];
+  const result: StatData[] = []
 
-  stats.value.forEach((stat) => {
+  stats.value.forEach(stat => {
     if (stat.stats == null) {
-      return;
+      return
     }
 
-    const avgCpuUsage = getAvgCpuUsage(stat.stats.cpus);
+    const avgCpuUsage = getAvgCpuUsage(stat.stats.cpus)
 
     if (avgCpuUsage === undefined) {
-      return;
+      return
     }
 
     result.push({
       id: stat.id,
       label: stat.name,
       value: avgCpuUsage,
-    });
-  });
+    })
+  })
 
-  return result;
-});
+  return result
+})
 
-const { isLoading, isStatEmpty } = useStatStatus(stats, data, isFetching);
+const { isLoading, isStatEmpty } = useStatStatus(stats, data, isFetching)
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/PoolCpuUsageChart.vue b/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/PoolCpuUsageChart.vue
index 6a79aac9e47..82e50a961f6 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/PoolCpuUsageChart.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/PoolCpuUsageChart.vue
@@ -1,108 +1,92 @@
 <template>
   <UiCard class="linear-chart" :color="hasError ? 'error' : undefined">
-    <UiCardTitle>{{ $t("pool-cpu-usage") }}</UiCardTitle>
+    <UiCardTitle>{{ $t('pool-cpu-usage') }}</UiCardTitle>
     <UiCardTitle :level="UiCardTitleLevel.Subtitle">
-      {{ $t("last-week") }}
+      {{ $t('last-week') }}
     </UiCardTitle>
     <NoDataError v-if="hasError" />
     <UiCardSpinner v-else-if="isLoading" />
-    <LinearChart
-      v-else
-      :data="data"
-      :max-value="customMaxValue"
-      :value-formatter="customValueFormatter"
-    />
+    <LinearChart v-else :data="data" :max-value="customMaxValue" :value-formatter="customValueFormatter" />
   </UiCard>
 </template>
 
 <script lang="ts" setup>
-import { computed, defineAsyncComponent, inject } from "vue";
-import type { HostStats } from "@/libs/xapi-stats";
-import { IK_HOST_LAST_WEEK_STATS } from "@/types/injection-keys";
-import type { LinearChartData, ValueFormatter } from "@/types/chart";
-import NoDataError from "@/components/NoDataError.vue";
-import { RRD_STEP_FROM_STRING } from "@/libs/xapi-stats";
-import { sumBy } from "lodash-es";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import { UiCardTitleLevel } from "@/types/enums";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useI18n } from "vue-i18n";
-
-const LinearChart = defineAsyncComponent(
-  () => import("@/components/charts/LinearChart.vue")
-);
-
-const { t } = useI18n();
-
-const hostLastWeekStats = inject(IK_HOST_LAST_WEEK_STATS);
-
-const { records: hosts, isFetching, hasError } = useHostCollection();
-const customMaxValue = computed(
-  () => 100 * sumBy(hosts.value, (host) => +host.cpu_info.cpu_count)
-);
+import { computed, defineAsyncComponent, inject } from 'vue'
+import type { HostStats } from '@/libs/xapi-stats'
+import { IK_HOST_LAST_WEEK_STATS } from '@/types/injection-keys'
+import type { LinearChartData, ValueFormatter } from '@/types/chart'
+import NoDataError from '@/components/NoDataError.vue'
+import { RRD_STEP_FROM_STRING } from '@/libs/xapi-stats'
+import { sumBy } from 'lodash-es'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import { UiCardTitleLevel } from '@/types/enums'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useI18n } from 'vue-i18n'
+
+const LinearChart = defineAsyncComponent(() => import('@/components/charts/LinearChart.vue'))
+
+const { t } = useI18n()
+
+const hostLastWeekStats = inject(IK_HOST_LAST_WEEK_STATS)
+
+const { records: hosts, isFetching, hasError } = useHostCollection()
+const customMaxValue = computed(() => 100 * sumBy(hosts.value, host => +host.cpu_info.cpu_count))
 
 const data = computed<LinearChartData>(() => {
-  const timestampStart = hostLastWeekStats?.timestampStart?.value;
-  const stats = hostLastWeekStats?.stats?.value;
+  const timestampStart = hostLastWeekStats?.timestampStart?.value
+  const stats = hostLastWeekStats?.stats?.value
 
   if (timestampStart === undefined || stats == null) {
-    return [];
+    return []
   }
 
-  const result = new Map<number, { timestamp: number; value: number }>();
+  const result = new Map<number, { timestamp: number; value: number }>()
 
   const addResult = (stats: HostStats) => {
-    const cpus = Object.values(stats.cpus);
+    const cpus = Object.values(stats.cpus)
 
     for (let hourIndex = 0; hourIndex < cpus[0].length; hourIndex++) {
-      const timestamp =
-        (timestampStart + hourIndex * RRD_STEP_FROM_STRING.hours) * 1000;
+      const timestamp = (timestampStart + hourIndex * RRD_STEP_FROM_STRING.hours) * 1000
 
-      const cpuUsageSum = cpus.reduce(
-        (total, cpu) => total + cpu[hourIndex],
-        0
-      );
+      const cpuUsageSum = cpus.reduce((total, cpu) => total + cpu[hourIndex], 0)
 
       result.set(timestamp, {
-        timestamp: timestamp,
+        timestamp,
         value: Math.round((result.get(timestamp)?.value ?? 0) + cpuUsageSum),
-      });
+      })
     }
-  };
+  }
 
-  stats.forEach((host) => {
+  stats.forEach(host => {
     if (!host.stats) {
-      return;
+      return
     }
 
-    addResult(host.stats);
-  });
+    addResult(host.stats)
+  })
 
   return [
     {
-      label: t("stacked-cpu-usage"),
+      label: t('stacked-cpu-usage'),
       data: Array.from(result.values()),
     },
-  ];
-});
+  ]
+})
 const isStatFetched = computed(() => {
-  const stats = hostLastWeekStats?.stats?.value;
+  const stats = hostLastWeekStats?.stats?.value
   if (stats === undefined) {
-    return false;
+    return false
   }
 
-  return stats.every((host) => {
-    const hostStats = host.stats;
-    return (
-      hostStats != null &&
-      Object.values(hostStats.cpus)[0].length === data.value[0].data.length
-    );
-  });
-});
+  return stats.every(host => {
+    const hostStats = host.stats
+    return hostStats != null && Object.values(hostStats.cpus)[0].length === data.value[0].data.length
+  })
+})
 
-const isLoading = computed(() => isFetching.value || !isStatFetched.value);
+const isLoading = computed(() => isFetching.value || !isStatFetched.value)
 
-const customValueFormatter: ValueFormatter = (value) => `${value}%`;
+const customValueFormatter: ValueFormatter = value => `${value}%`
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/VmsCpuUsage.vue b/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/VmsCpuUsage.vue
index 9b9366bd10b..300c66ee285 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/VmsCpuUsage.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/VmsCpuUsage.vue
@@ -1,9 +1,5 @@
 <template>
-  <UiCardTitle
-    :left="$t('vms')"
-    :level="UiCardTitleLevel.SubtitleWithUnderline"
-    :right="$t('top-#', { n: N_ITEMS })"
-  />
+  <UiCardTitle :left="$t('vms')" :level="UiCardTitleLevel.SubtitleWithUnderline" :right="$t('top-#', { n: N_ITEMS })" />
   <NoDataError v-if="hasError" />
   <UiCardSpinner v-else-if="isLoading" />
   <NoResult v-else-if="isStatEmpty" />
@@ -11,50 +7,50 @@
 </template>
 
 <script lang="ts" setup>
-import NoDataError from "@/components/NoDataError.vue";
-import NoResult from "@/components/NoResult.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UsageBar from "@/components/UsageBar.vue";
-import { useStatStatus } from "@/composables/stat-status.composable";
-import { getAvgCpuUsage } from "@/libs/utils";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { UiCardTitleLevel } from "@/types/enums";
-import { IK_VM_STATS } from "@/types/injection-keys";
-import type { StatData } from "@/types/stat";
-import { N_ITEMS } from "@/views/pool/PoolDashboardView.vue";
-import { computed, inject } from "vue";
-
-const { hasError, isFetching } = useVmCollection();
+import NoDataError from '@/components/NoDataError.vue'
+import NoResult from '@/components/NoResult.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UsageBar from '@/components/UsageBar.vue'
+import { useStatStatus } from '@/composables/stat-status.composable'
+import { getAvgCpuUsage } from '@/libs/utils'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { UiCardTitleLevel } from '@/types/enums'
+import { IK_VM_STATS } from '@/types/injection-keys'
+import type { StatData } from '@/types/stat'
+import { N_ITEMS } from '@/views/pool/PoolDashboardView.vue'
+import { computed, inject } from 'vue'
+
+const { hasError, isFetching } = useVmCollection()
 
 const stats = inject(
   IK_VM_STATS,
   computed(() => [])
-);
+)
 
 const data = computed<StatData[]>(() => {
-  const result: StatData[] = [];
+  const result: StatData[] = []
 
-  stats.value.forEach((stat) => {
+  stats.value.forEach(stat => {
     if (!stat.stats) {
-      return;
+      return
     }
 
-    const avgCpuUsage = getAvgCpuUsage(stat.stats.cpus);
+    const avgCpuUsage = getAvgCpuUsage(stat.stats.cpus)
 
     if (avgCpuUsage === undefined) {
-      return;
+      return
     }
 
     result.push({
       id: stat.id,
       label: stat.name,
       value: avgCpuUsage,
-    });
-  });
+    })
+  })
 
-  return result;
-});
+  return result
+})
 
-const { isLoading, isStatEmpty } = useStatStatus(stats, data, isFetching);
+const { isLoading, isStatEmpty } = useStatStatus(stats, data, isFetching)
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/HostsRamUsage.vue b/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/HostsRamUsage.vue
index 55c91c2a3d4..c5eff00fddf 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/HostsRamUsage.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/HostsRamUsage.vue
@@ -11,45 +11,45 @@
 </template>
 
 <script lang="ts" setup>
-import NoDataError from "@/components/NoDataError.vue";
-import NoResult from "@/components/NoResult.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UsageBar from "@/components/UsageBar.vue";
-import { useStatStatus } from "@/composables/stat-status.composable";
-import { formatSize, parseRamUsage } from "@/libs/utils";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { UiCardTitleLevel } from "@/types/enums";
-import { IK_HOST_STATS } from "@/types/injection-keys";
-import type { StatData } from "@/types/stat";
-import { N_ITEMS } from "@/views/pool/PoolDashboardView.vue";
-import { computed, inject } from "vue";
+import NoDataError from '@/components/NoDataError.vue'
+import NoResult from '@/components/NoResult.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UsageBar from '@/components/UsageBar.vue'
+import { useStatStatus } from '@/composables/stat-status.composable'
+import { formatSize, parseRamUsage } from '@/libs/utils'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { UiCardTitleLevel } from '@/types/enums'
+import { IK_HOST_STATS } from '@/types/injection-keys'
+import type { StatData } from '@/types/stat'
+import { N_ITEMS } from '@/views/pool/PoolDashboardView.vue'
+import { computed, inject } from 'vue'
 
-const { hasError, isFetching } = useHostCollection();
+const { hasError, isFetching } = useHostCollection()
 
 const stats = inject(
   IK_HOST_STATS,
   computed(() => [])
-);
+)
 
 const data = computed(() => {
-  const result: StatData[] = [];
+  const result: StatData[] = []
 
-  stats.value.forEach((stat) => {
+  stats.value.forEach(stat => {
     if (stat.stats == null) {
-      return;
+      return
     }
 
-    const { percentUsed, total, used } = parseRamUsage(stat.stats);
+    const { percentUsed, total, used } = parseRamUsage(stat.stats)
     result.push({
       id: stat.id,
       label: stat.name,
       value: percentUsed,
       badgeLabel: `${formatSize(used)}/${formatSize(total)}`,
-    });
-  });
-  return result;
-});
+    })
+  })
+  return result
+})
 
-const { isLoading, isStatEmpty } = useStatStatus(stats, data, isFetching);
+const { isLoading, isStatEmpty } = useStatStatus(stats, data, isFetching)
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/PoolRamUsage.vue b/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/PoolRamUsage.vue
index 1cb72a12f8f..b65027ab030 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/PoolRamUsage.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/PoolRamUsage.vue
@@ -1,120 +1,104 @@
 <template>
   <UiCard class="linear-chart" :color="hasError ? 'error' : undefined">
-    <UiCardTitle>{{ $t("pool-ram-usage") }}</UiCardTitle>
+    <UiCardTitle>{{ $t('pool-ram-usage') }}</UiCardTitle>
     <UiCardTitle :level="UiCardTitleLevel.Subtitle">
-      {{ $t("last-week") }}
+      {{ $t('last-week') }}
     </UiCardTitle>
     <NoDataError v-if="hasError" />
     <UiCardSpinner v-else-if="isLoading" />
-    <LinearChart
-      v-else
-      :data="data"
-      :max-value="customMaxValue"
-      :value-formatter="customValueFormatter"
-    />
+    <LinearChart v-else :data="data" :max-value="customMaxValue" :value-formatter="customValueFormatter" />
     <SizeStatsSummary :size="currentData.size" :usage="currentData.usage" />
   </UiCard>
 </template>
 
 <script lang="ts" setup>
-import { computed, defineAsyncComponent, inject } from "vue";
-import { formatSize } from "@/libs/utils";
-import { IK_HOST_LAST_WEEK_STATS } from "@/types/injection-keys";
-import type { LinearChartData } from "@/types/chart";
-import NoDataError from "@/components/NoDataError.vue";
-import { RRD_STEP_FROM_STRING } from "@/libs/xapi-stats";
-import SizeStatsSummary from "@/components/ui/SizeStatsSummary.vue";
-import { sumBy } from "lodash-es";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import { UiCardTitleLevel } from "@/types/enums";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useHostMetricsCollection } from "@/stores/xen-api/host-metrics.store";
-import { useI18n } from "vue-i18n";
-
-const LinearChart = defineAsyncComponent(
-  () => import("@/components/charts/LinearChart.vue")
-);
-
-const { runningHosts, isFetching, hasError } = useHostCollection();
-const { getHostMemory } = useHostMetricsCollection();
-
-const { t } = useI18n();
-
-const hostLastWeekStats = inject(IK_HOST_LAST_WEEK_STATS);
-
-const customMaxValue = computed(() =>
-  sumBy(runningHosts.value, (host) => getHostMemory(host)?.size ?? 0)
-);
+import { computed, defineAsyncComponent, inject } from 'vue'
+import { formatSize } from '@/libs/utils'
+import { IK_HOST_LAST_WEEK_STATS } from '@/types/injection-keys'
+import type { LinearChartData } from '@/types/chart'
+import NoDataError from '@/components/NoDataError.vue'
+import { RRD_STEP_FROM_STRING } from '@/libs/xapi-stats'
+import SizeStatsSummary from '@/components/ui/SizeStatsSummary.vue'
+import { sumBy } from 'lodash-es'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import { UiCardTitleLevel } from '@/types/enums'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useHostMetricsCollection } from '@/stores/xen-api/host-metrics.store'
+import { useI18n } from 'vue-i18n'
+
+const LinearChart = defineAsyncComponent(() => import('@/components/charts/LinearChart.vue'))
+
+const { runningHosts, isFetching, hasError } = useHostCollection()
+const { getHostMemory } = useHostMetricsCollection()
+
+const { t } = useI18n()
+
+const hostLastWeekStats = inject(IK_HOST_LAST_WEEK_STATS)
+
+const customMaxValue = computed(() => sumBy(runningHosts.value, host => getHostMemory(host)?.size ?? 0))
 
 const currentData = computed(() => {
-  let size = 0,
-    usage = 0;
-  runningHosts.value.forEach((host) => {
-    const hostMemory = getHostMemory(host);
-    size += hostMemory?.size ?? 0;
-    usage += hostMemory?.usage ?? 0;
-  });
-  return { size, usage };
-});
+  let size = 0
+  let usage = 0
+  runningHosts.value.forEach(host => {
+    const hostMemory = getHostMemory(host)
+    size += hostMemory?.size ?? 0
+    usage += hostMemory?.usage ?? 0
+  })
+  return { size, usage }
+})
 
 const data = computed<LinearChartData>(() => {
-  const timestampStart = hostLastWeekStats?.timestampStart?.value;
-  const stats = hostLastWeekStats?.stats?.value;
+  const timestampStart = hostLastWeekStats?.timestampStart?.value
+  const stats = hostLastWeekStats?.stats?.value
 
   if (timestampStart === undefined || stats == null) {
-    return [];
+    return []
   }
 
-  const result = new Map<number, { timestamp: number; value: number }>();
+  const result = new Map<number, { timestamp: number; value: number }>()
 
   stats.forEach(({ stats }) => {
     if (stats?.memory === undefined) {
-      return;
+      return
     }
 
-    const memoryFree = stats.memoryFree;
-    const memoryUsage = stats.memory.map(
-      (memory, index) => memory - memoryFree[index]
-    );
+    const memoryFree = stats.memoryFree
+    const memoryUsage = stats.memory.map((memory, index) => memory - memoryFree[index])
 
     memoryUsage.forEach((value, hourIndex) => {
-      const timestamp =
-        (timestampStart + hourIndex * RRD_STEP_FROM_STRING.hours) * 1000;
+      const timestamp = (timestampStart + hourIndex * RRD_STEP_FROM_STRING.hours) * 1000
 
       result.set(timestamp, {
         timestamp,
         value: (result.get(timestamp)?.value ?? 0) + memoryUsage[hourIndex],
-      });
-    });
-  });
+      })
+    })
+  })
 
   return [
     {
-      label: t("stacked-ram-usage"),
+      label: t('stacked-ram-usage'),
       data: Array.from(result.values()),
     },
-  ];
-});
+  ]
+})
 
 const isStatFetched = computed(() => {
-  const stats = hostLastWeekStats?.stats?.value;
+  const stats = hostLastWeekStats?.stats?.value
   if (stats === undefined) {
-    return false;
+    return false
   }
 
-  return stats.every((host) => {
-    const hostStats = host.stats;
-    return (
-      hostStats != null && hostStats.memory.length === data.value[0].data.length
-    );
-  });
-});
+  return stats.every(host => {
+    const hostStats = host.stats
+    return hostStats != null && hostStats.memory.length === data.value[0].data.length
+  })
+})
 
-const isLoading = computed(
-  () => (isFetching.value && !hasError.value) || !isStatFetched.value
-);
+const isLoading = computed(() => (isFetching.value && !hasError.value) || !isStatFetched.value)
 
-const customValueFormatter = (value: number) => String(formatSize(value));
+const customValueFormatter = (value: number) => String(formatSize(value))
 </script>
diff --git a/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/VmsRamUsage.vue b/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/VmsRamUsage.vue
index adb2c59d1f9..8d7da3a6d2f 100644
--- a/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/VmsRamUsage.vue
+++ b/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/VmsRamUsage.vue
@@ -1,9 +1,5 @@
 <template>
-  <UiCardTitle
-    :left="$t('vms')"
-    :level="UiCardTitleLevel.SubtitleWithUnderline"
-    :right="$t('top-#', { n: N_ITEMS })"
-  />
+  <UiCardTitle :left="$t('vms')" :level="UiCardTitleLevel.SubtitleWithUnderline" :right="$t('top-#', { n: N_ITEMS })" />
   <NoDataError v-if="hasError" />
   <UiCardSpinner v-else-if="isLoading" />
   <NoResult v-else-if="isStatEmpty" />
@@ -11,45 +7,45 @@
 </template>
 
 <script lang="ts" setup>
-import NoDataError from "@/components/NoDataError.vue";
-import NoResult from "@/components/NoResult.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UsageBar from "@/components/UsageBar.vue";
-import { useStatStatus } from "@/composables/stat-status.composable";
-import { formatSize, parseRamUsage } from "@/libs/utils";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { UiCardTitleLevel } from "@/types/enums";
-import { IK_VM_STATS } from "@/types/injection-keys";
-import type { StatData } from "@/types/stat";
-import { N_ITEMS } from "@/views/pool/PoolDashboardView.vue";
-import { computed, inject } from "vue";
+import NoDataError from '@/components/NoDataError.vue'
+import NoResult from '@/components/NoResult.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UsageBar from '@/components/UsageBar.vue'
+import { useStatStatus } from '@/composables/stat-status.composable'
+import { formatSize, parseRamUsage } from '@/libs/utils'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { UiCardTitleLevel } from '@/types/enums'
+import { IK_VM_STATS } from '@/types/injection-keys'
+import type { StatData } from '@/types/stat'
+import { N_ITEMS } from '@/views/pool/PoolDashboardView.vue'
+import { computed, inject } from 'vue'
 
-const { hasError, isFetching } = useVmCollection();
+const { hasError, isFetching } = useVmCollection()
 
 const stats = inject(
   IK_VM_STATS,
   computed(() => [])
-);
+)
 
 const data = computed(() => {
-  const result: StatData[] = [];
+  const result: StatData[] = []
 
-  stats.value.forEach((stat) => {
+  stats.value.forEach(stat => {
     if (stat.stats == null) {
-      return;
+      return
     }
 
-    const { percentUsed, total, used } = parseRamUsage(stat.stats);
+    const { percentUsed, total, used } = parseRamUsage(stat.stats)
     result.push({
       id: stat.id,
       label: stat.name,
       value: percentUsed,
       badgeLabel: `${formatSize(used)}/${formatSize(total)}`,
-    });
-  });
-  return result;
-});
+    })
+  })
+  return result
+})
 
-const { isLoading, isStatEmpty } = useStatStatus(stats, data, isFetching);
+const { isLoading, isStatEmpty } = useStatStatus(stats, data, isFetching)
 </script>
diff --git a/@xen-orchestra/lite/src/components/tasks/TaskRow.vue b/@xen-orchestra/lite/src/components/tasks/TaskRow.vue
index c76518e14f4..4bd45d31c2c 100644
--- a/@xen-orchestra/lite/src/components/tasks/TaskRow.vue
+++ b/@xen-orchestra/lite/src/components/tasks/TaskRow.vue
@@ -17,48 +17,39 @@
     </td>
     <td>
       <RelativeTime v-if="isPending" :date="createdAt" />
-      <template v-else>{{ $d(createdAt, "datetime_short") }}</template>
+      <template v-else>{{ $d(createdAt, 'datetime_short') }}</template>
     </td>
     <td>
       <template v-if="finishedAt !== undefined">
-        {{ $d(finishedAt, "datetime_short") }}
+        {{ $d(finishedAt, 'datetime_short') }}
       </template>
-      <RelativeTime
-        v-else-if="isPending && estimatedEndAt !== Infinity"
-        :date="estimatedEndAt"
-      />
+      <RelativeTime v-else-if="isPending && estimatedEndAt !== Infinity" :date="estimatedEndAt" />
     </td>
   </tr>
 </template>
 
 <script lang="ts" setup>
-import RelativeTime from "@/components/RelativeTime.vue";
-import UiProgressBar from "@/components/ui/progress/UiProgressBar.vue";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { parseDateTime } from "@/libs/utils";
-import type { XenApiTask } from "@/libs/xen-api/xen-api.types";
-import { computed } from "vue";
+import RelativeTime from '@/components/RelativeTime.vue'
+import UiProgressBar from '@/components/ui/progress/UiProgressBar.vue'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { parseDateTime } from '@/libs/utils'
+import type { XenApiTask } from '@/libs/xen-api/xen-api.types'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  isPending?: boolean;
-  task: XenApiTask;
-}>();
+  isPending?: boolean
+  task: XenApiTask
+}>()
 
-const { getByOpaqueRef: getHost } = useHostCollection();
+const { getByOpaqueRef: getHost } = useHostCollection()
 
-const createdAt = computed(() => parseDateTime(props.task.created));
+const createdAt = computed(() => parseDateTime(props.task.created))
 
-const host = computed(() => getHost(props.task.resident_on));
+const host = computed(() => getHost(props.task.resident_on))
 
-const estimatedEndAt = computed(
-  () =>
-    createdAt.value +
-    (new Date().getTime() - createdAt.value) / props.task.progress
-);
+const estimatedEndAt = computed(() => createdAt.value + (new Date().getTime() - createdAt.value) / props.task.progress)
 
-const finishedAt = computed(() =>
-  props.isPending ? undefined : parseDateTime(props.task.finished)
-);
+const finishedAt = computed(() => (props.isPending ? undefined : parseDateTime(props.task.finished)))
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/tasks/TasksTable.vue b/@xen-orchestra/lite/src/components/tasks/TasksTable.vue
index 0da084a800f..0b1da46e1e5 100644
--- a/@xen-orchestra/lite/src/components/tasks/TasksTable.vue
+++ b/@xen-orchestra/lite/src/components/tasks/TasksTable.vue
@@ -2,17 +2,17 @@
   <UiTable :color="hasError ? 'error' : undefined" class="tasks-table">
     <thead>
       <tr>
-        <th>{{ $t("name") }}</th>
-        <th>{{ $t("object") }}</th>
-        <th>{{ $t("task.progress") }}</th>
-        <th>{{ $t("task.started") }}</th>
-        <th>{{ $t("task.estimated-end") }}</th>
+        <th>{{ $t('name') }}</th>
+        <th>{{ $t('object') }}</th>
+        <th>{{ $t('task.progress') }}</th>
+        <th>{{ $t('task.started') }}</th>
+        <th>{{ $t('task.estimated-end') }}</th>
       </tr>
     </thead>
     <tbody>
       <tr v-if="hasError">
         <td colspan="5">
-          <span class="text-error">{{ $t("error-no-data") }}</span>
+          <span class="text-error">{{ $t('error-no-data') }}</span>
         </td>
       </tr>
       <tr v-else-if="isFetching">
@@ -21,15 +21,10 @@
         </td>
       </tr>
       <tr v-else-if="!hasTasks">
-        <td class="no-tasks" colspan="5">{{ $t("no-tasks") }}</td>
+        <td class="no-tasks" colspan="5">{{ $t('no-tasks') }}</td>
       </tr>
       <template v-else>
-        <TaskRow
-          v-for="task in pendingTasks"
-          :key="task.uuid"
-          :task="task"
-          is-pending
-        />
+        <TaskRow v-for="task in pendingTasks" :key="task.uuid" :task="task" is-pending />
         <TaskRow v-for="task in finishedTasks" :key="task.uuid" :task="task" />
       </template>
     </tbody>
@@ -37,23 +32,21 @@
 </template>
 
 <script lang="ts" setup>
-import TaskRow from "@/components/tasks/TaskRow.vue";
-import UiSpinner from "@/components/ui/UiSpinner.vue";
-import UiTable from "@/components/ui/UiTable.vue";
-import { useTaskCollection } from "@/stores/xen-api/task.store";
-import type { XenApiTask } from "@/libs/xen-api/xen-api.types";
-import { computed } from "vue";
+import TaskRow from '@/components/tasks/TaskRow.vue'
+import UiSpinner from '@/components/ui/UiSpinner.vue'
+import UiTable from '@/components/ui/UiTable.vue'
+import { useTaskCollection } from '@/stores/xen-api/task.store'
+import type { XenApiTask } from '@/libs/xen-api/xen-api.types'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  pendingTasks: XenApiTask[];
-  finishedTasks?: XenApiTask[];
-}>();
+  pendingTasks: XenApiTask[]
+  finishedTasks?: XenApiTask[]
+}>()
 
-const { hasError, isFetching } = useTaskCollection();
+const { hasError, isFetching } = useTaskCollection()
 
-const hasTasks = computed(
-  () => props.pendingTasks.length > 0 || (props.finishedTasks?.length ?? 0) > 0
-);
+const hasTasks = computed(() => props.pendingTasks.length > 0 || (props.finishedTasks?.length ?? 0) > 0)
 </script>
 
 <style lang="postcss" scoped>
@@ -67,7 +60,7 @@ const hasTasks = computed(
   font-style: italic;
 }
 
-td[colspan="5"] {
+td[colspan='5'] {
   text-align: center;
 }
 
diff --git a/@xen-orchestra/lite/src/components/ui/SizeStatsSummary.vue b/@xen-orchestra/lite/src/components/ui/SizeStatsSummary.vue
index 03286cc3d0c..6b148bbb136 100644
--- a/@xen-orchestra/lite/src/components/ui/SizeStatsSummary.vue
+++ b/@xen-orchestra/lite/src/components/ui/SizeStatsSummary.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="summary" v-if="isDisplayed">
+  <div v-if="isDisplayed" class="summary">
     <div class="summary-card">
-      <p>{{ $t("total-used") }}:</p>
+      <p>{{ $t('total-used') }}:</p>
       <div class="summary-value">
         <p>{{ percentUsed }}%</p>
         <p>
@@ -10,7 +10,7 @@
       </div>
     </div>
     <div class="summary-card">
-      <p>{{ $t("total-free") }}:</p>
+      <p>{{ $t('total-free') }}:</p>
       <div class="summary-value">
         <p>{{ percentFree }}%</p>
         <p>
@@ -21,20 +21,18 @@
   </div>
 </template>
 <script lang="ts" setup>
-import { formatSize, percent } from "@/libs/utils";
-import { computed } from "vue";
+import { formatSize, percent } from '@/libs/utils'
+import { computed } from 'vue'
 const props = defineProps<{
-  size: number;
-  usage: number;
-}>();
+  size: number
+  usage: number
+}>()
 
-const free = computed(() => props.size - props.usage);
-const percentFree = computed(() => percent(free.value, props.size));
-const percentUsed = computed(() => percent(props.usage, props.size));
+const free = computed(() => props.size - props.usage)
+const percentFree = computed(() => percent(free.value, props.size))
+const percentUsed = computed(() => percent(props.usage, props.size))
 
-const isDisplayed = computed(
-  () => !isNaN(percentUsed.value) && !isNaN(percentFree.value)
-);
+const isDisplayed = computed(() => !isNaN(percentUsed.value) && !isNaN(percentFree.value))
 </script>
 <style lang="postcss" scoped>
 .summary {
diff --git a/@xen-orchestra/lite/src/components/ui/UiActionButton.vue b/@xen-orchestra/lite/src/components/ui/UiActionButton.vue
index ae5cf75b248..a62ff6d496d 100644
--- a/@xen-orchestra/lite/src/components/ui/UiActionButton.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiActionButton.vue
@@ -16,22 +16,22 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useContext } from "@/composables/context.composable";
-import { DisabledContext } from "@/context";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useContext } from '@/composables/context.composable'
+import { DisabledContext } from '@/context'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 const props = withDefaults(
   defineProps<{
-    busy?: boolean;
-    disabled?: boolean;
-    icon?: IconDefinition;
-    active?: boolean;
+    busy?: boolean
+    disabled?: boolean
+    icon?: IconDefinition
+    active?: boolean
   }>(),
   { disabled: undefined }
-);
+)
 
-const isDisabled = useContext(DisabledContext, () => props.disabled);
+const isDisabled = useContext(DisabledContext, () => props.disabled)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiBadge.vue b/@xen-orchestra/lite/src/components/ui/UiBadge.vue
index cb8e0ce78b0..ad6adbdf1a8 100644
--- a/@xen-orchestra/lite/src/components/ui/UiBadge.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiBadge.vue
@@ -6,12 +6,12 @@
 </template>
 
 <script lang="ts" setup>
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
 
 defineProps<{
-  icon?: IconDefinition;
-}>();
+  icon?: IconDefinition
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiButton.vue b/@xen-orchestra/lite/src/components/ui/UiButton.vue
index f82b0220163..c684ef0f486 100644
--- a/@xen-orchestra/lite/src/components/ui/UiButton.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiButton.vue
@@ -1,10 +1,5 @@
 <template>
-  <button
-    :class="className"
-    :disabled="busy || isDisabled"
-    :type="type || 'button'"
-    class="ui-button"
-  >
+  <button :class="className" :disabled="busy || isDisabled" :type="type || 'button'" class="ui-button">
     <UiSpinner v-if="busy" />
     <template v-else>
       <UiIcon :icon="icon" class="icon" />
@@ -14,49 +9,46 @@
 </template>
 
 <script lang="ts" setup>
-import UiSpinner from "@/components/ui/UiSpinner.vue";
-import { useContext } from "@/composables/context.composable";
-import { ColorContext, DisabledContext } from "@/context";
-import {
-  IK_BUTTON_GROUP_OUTLINED,
-  IK_BUTTON_GROUP_TRANSPARENT,
-} from "@/types/injection-keys";
-import { computed, inject } from "vue";
-import type { Color } from "@/types";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
+import UiSpinner from '@/components/ui/UiSpinner.vue'
+import { useContext } from '@/composables/context.composable'
+import { ColorContext, DisabledContext } from '@/context'
+import { IK_BUTTON_GROUP_OUTLINED, IK_BUTTON_GROUP_TRANSPARENT } from '@/types/injection-keys'
+import { computed, inject } from 'vue'
+import type { Color } from '@/types'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
 
 const props = withDefaults(
   defineProps<{
-    type?: "button" | "reset" | "submit";
-    busy?: boolean;
-    disabled?: boolean;
-    icon?: IconDefinition;
-    color?: Color;
-    outlined?: boolean;
-    transparent?: boolean;
-    active?: boolean;
+    type?: 'button' | 'reset' | 'submit'
+    busy?: boolean
+    disabled?: boolean
+    icon?: IconDefinition
+    color?: Color
+    outlined?: boolean
+    transparent?: boolean
+    active?: boolean
   }>(),
   {
     disabled: undefined,
     outlined: undefined,
     transparent: undefined,
   }
-);
+)
 
-const isDisabled = useContext(DisabledContext, () => props.disabled);
+const isDisabled = useContext(DisabledContext, () => props.disabled)
 
 const isGroupOutlined = inject(
   IK_BUTTON_GROUP_OUTLINED,
   computed(() => false)
-);
+)
 
 const isGroupTransparent = inject(
   IK_BUTTON_GROUP_TRANSPARENT,
   computed(() => false)
-);
+)
 
-const { name: contextColor } = useContext(ColorContext, () => props.color);
+const { name: contextColor } = useContext(ColorContext, () => props.color)
 
 const className = computed(() => {
   return [
@@ -68,8 +60,8 @@ const className = computed(() => {
       outlined: props.outlined ?? isGroupOutlined.value,
       transparent: props.transparent ?? isGroupTransparent.value,
     },
-  ];
-});
+  ]
+})
 </script>
 
 <style lang="postcss" scoped>
@@ -178,7 +170,7 @@ const className = computed(() => {
   &::after {
     width: 1.2em;
     height: 1.2em;
-    content: "";
+    content: '';
     border-radius: 0.6em;
     background-color: var(--button-background-color);
   }
diff --git a/@xen-orchestra/lite/src/components/ui/UiButtonGroup.vue b/@xen-orchestra/lite/src/components/ui/UiButtonGroup.vue
index 8ba27fb095a..044386ad837 100644
--- a/@xen-orchestra/lite/src/components/ui/UiButtonGroup.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiButtonGroup.vue
@@ -5,37 +5,34 @@
 </template>
 
 <script lang="ts" setup>
-import { useContext } from "@/composables/context.composable";
-import { ColorContext, DisabledContext } from "@/context";
-import type { Color } from "@/types";
-import {
-  IK_BUTTON_GROUP_OUTLINED,
-  IK_BUTTON_GROUP_TRANSPARENT,
-} from "@/types/injection-keys";
-import { computed, provide } from "vue";
+import { useContext } from '@/composables/context.composable'
+import { ColorContext, DisabledContext } from '@/context'
+import type { Color } from '@/types'
+import { IK_BUTTON_GROUP_OUTLINED, IK_BUTTON_GROUP_TRANSPARENT } from '@/types/injection-keys'
+import { computed, provide } from 'vue'
 
 const props = withDefaults(
   defineProps<{
-    busy?: boolean;
-    disabled?: boolean;
-    color?: Color;
-    outlined?: boolean;
-    transparent?: boolean;
-    merge?: boolean;
+    busy?: boolean
+    disabled?: boolean
+    color?: Color
+    outlined?: boolean
+    transparent?: boolean
+    merge?: boolean
   }>(),
   { disabled: undefined }
-);
+)
 provide(
   IK_BUTTON_GROUP_OUTLINED,
   computed(() => props.outlined ?? false)
-);
+)
 provide(
   IK_BUTTON_GROUP_TRANSPARENT,
   computed(() => props.transparent ?? false)
-);
+)
 
-useContext(ColorContext, () => props.color);
-useContext(DisabledContext, () => props.disabled);
+useContext(ColorContext, () => props.color)
+useContext(DisabledContext, () => props.disabled)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiCard.vue b/@xen-orchestra/lite/src/components/ui/UiCard.vue
index 70a79f42489..c8f7957bc1b 100644
--- a/@xen-orchestra/lite/src/components/ui/UiCard.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiCard.vue
@@ -5,28 +5,25 @@
 </template>
 
 <script lang="ts" setup>
-import { ColorContext } from "@/context";
-import { useContext } from "@/composables/context.composable";
-import type { Color } from "@/types";
-import { computed } from "vue";
+import { ColorContext } from '@/context'
+import { useContext } from '@/composables/context.composable'
+import type { Color } from '@/types'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  color?: Color;
-}>();
+  color?: Color
+}>()
 
-const { name: contextColor, backgroundClass } = useContext(
-  ColorContext,
-  () => props.color
-);
+const { name: contextColor, backgroundClass } = useContext(ColorContext, () => props.color)
 
 // We don't want to inherit "info" color
 const classProp = computed(() => {
-  if (props.color === undefined && contextColor.value === "info") {
-    return "bg-primary";
+  if (props.color === undefined && contextColor.value === 'info') {
+    return 'bg-primary'
   }
 
-  return backgroundClass.value;
-});
+  return backgroundClass.value
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiCardComingSoon.vue b/@xen-orchestra/lite/src/components/ui/UiCardComingSoon.vue
index f77fe129c02..d8947fe20c2 100644
--- a/@xen-orchestra/lite/src/components/ui/UiCardComingSoon.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiCardComingSoon.vue
@@ -4,17 +4,17 @@
     <div class="content">
       <img alt="" src="@/assets/under-construction.svg" />
     </div>
-    <div class="content">{{ $t("coming-soon") }}</div>
+    <div class="content">{{ $t('coming-soon') }}</div>
   </UiCard>
 </template>
 
 <script setup lang="ts">
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
 
 defineProps<{
-  title: string;
-}>();
+  title: string
+}>()
 </script>
 
 <style scoped lang="postcss">
diff --git a/@xen-orchestra/lite/src/components/ui/UiCardGroup.vue b/@xen-orchestra/lite/src/components/ui/UiCardGroup.vue
index a94d62b59f4..74c9500ce99 100644
--- a/@xen-orchestra/lite/src/components/ui/UiCardGroup.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiCardGroup.vue
@@ -5,12 +5,12 @@
 </template>
 
 <script lang="ts" setup>
-import { IK_CARD_GROUP_VERTICAL } from "@/types/injection-keys";
-import { inject, provide } from "vue";
+import { IK_CARD_GROUP_VERTICAL } from '@/types/injection-keys'
+import { inject, provide } from 'vue'
 
-const vertical = inject(IK_CARD_GROUP_VERTICAL, false);
+const vertical = inject(IK_CARD_GROUP_VERTICAL, false)
 
-provide(IK_CARD_GROUP_VERTICAL, !vertical);
+provide(IK_CARD_GROUP_VERTICAL, !vertical)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiCardSpinner.vue b/@xen-orchestra/lite/src/components/ui/UiCardSpinner.vue
index 9c729f940be..dca455302c0 100644
--- a/@xen-orchestra/lite/src/components/ui/UiCardSpinner.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiCardSpinner.vue
@@ -5,7 +5,7 @@
 </template>
 
 <script lang="ts" setup>
-import UiSpinner from "@/components/ui/UiSpinner.vue";
+import UiSpinner from '@/components/ui/UiSpinner.vue'
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiCardTitle.vue b/@xen-orchestra/lite/src/components/ui/UiCardTitle.vue
index 2909d0a2823..62b4d27782a 100644
--- a/@xen-orchestra/lite/src/components/ui/UiCardTitle.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiCardTitle.vue
@@ -2,7 +2,7 @@
   <div :class="['ui-section-title', tags.left]">
     <component :is="tags.left" v-if="$slots.default || left" class="left">
       <slot>{{ left }}</slot>
-      <UiCounter class="count" v-if="count > 0" :value="count" color="info" />
+      <UiCounter v-if="count > 0" class="count" :value="count" color="info" />
     </component>
     <component :is="tags.right" v-if="$slots.right || right" class="right">
       <slot name="right">{{ right }}</slot>
@@ -11,30 +11,30 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from "vue";
-import UiCounter from "@/components/ui/UiCounter.vue";
-import { UiCardTitleLevel } from "@/types/enums";
+import { computed } from 'vue'
+import UiCounter from '@/components/ui/UiCounter.vue'
+import { UiCardTitleLevel } from '@/types/enums'
 
 const props = withDefaults(
   defineProps<{
-    count?: number;
-    level?: UiCardTitleLevel;
-    left?: string;
-    right?: string;
+    count?: number
+    level?: UiCardTitleLevel
+    left?: string
+    right?: string
   }>(),
   { count: 0, level: UiCardTitleLevel.Title }
-);
+)
 
 const tags = computed(() => {
   switch (props.level) {
     case UiCardTitleLevel.Subtitle:
-      return { left: "h6", right: "h6" };
+      return { left: 'h6', right: 'h6' }
     case UiCardTitleLevel.SubtitleWithUnderline:
-      return { left: "h5", right: "h6" };
+      return { left: 'h5', right: 'h6' }
     default:
-      return { left: "h4", right: "h5" };
+      return { left: 'h4', right: 'h5' }
   }
-});
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiCounter.vue b/@xen-orchestra/lite/src/components/ui/UiCounter.vue
index 6b73d95c46d..5235ab9bfa5 100644
--- a/@xen-orchestra/lite/src/components/ui/UiCounter.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiCounter.vue
@@ -7,12 +7,12 @@
 </template>
 
 <script lang="ts" setup>
-import type { Color } from "@/types";
+import type { Color } from '@/types'
 
 defineProps<{
-  value: number;
-  color?: Color;
-}>();
+  value: number
+  color?: Color
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiFilter.vue b/@xen-orchestra/lite/src/components/ui/UiFilter.vue
index fb7fca75c30..524fa1c6fb3 100644
--- a/@xen-orchestra/lite/src/components/ui/UiFilter.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiFilter.vue
@@ -10,13 +10,13 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { faRemove } from "@fortawesome/free-solid-svg-icons";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { faRemove } from '@fortawesome/free-solid-svg-icons'
 
 const emit = defineEmits<{
-  (event: "edit"): void;
-  (event: "remove"): void;
-}>();
+  (event: 'edit'): void
+  (event: 'remove'): void
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiKeyValueRow.vue b/@xen-orchestra/lite/src/components/ui/UiKeyValueRow.vue
index 2a8130e1349..ee7b64bb8fa 100644
--- a/@xen-orchestra/lite/src/components/ui/UiKeyValueRow.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiKeyValueRow.vue
@@ -12,7 +12,7 @@
 <script lang="ts" setup></script>
 
 <style lang="postcss" scoped>
-@import "@/assets/_responsive.pcss";
+@import '@/assets/_responsive.pcss';
 
 .key,
 .value {
diff --git a/@xen-orchestra/lite/src/components/ui/UiSpinner.vue b/@xen-orchestra/lite/src/components/ui/UiSpinner.vue
index 5e1b6dd39ee..203667797d5 100644
--- a/@xen-orchestra/lite/src/components/ui/UiSpinner.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiSpinner.vue
@@ -1,12 +1,7 @@
 <!-- Adapted from https://www.benmvp.com/blog/how-to-create-circle-svg-gradient-loading-spinner/ -->
 
 <template>
-  <svg
-    class="ui-spinner"
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 400 400"
-    fill="none"
-  >
+  <svg class="ui-spinner" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400" fill="none">
     <defs>
       <linearGradient :id="secondHalfId">
         <stop offset="0%" stop-opacity="0" stop-color="currentColor" />
@@ -19,28 +14,18 @@
     </defs>
 
     <g stroke-width="40">
-      <path
-        d="M 30 200 A 170 170 180 0 1 370 200"
-        :stroke="`url(#${secondHalfId})`"
-      />
-      <path
-        d="M 370 200 A 170 170 0 0 1 30 200"
-        :stroke="`url(#${firstHalfId})`"
-      />
-      <path
-        stroke="currentColor"
-        stroke-linecap="round"
-        d="M 30 200 A 170 170 180 0 1 30 200"
-      />
+      <path d="M 30 200 A 170 170 180 0 1 370 200" :stroke="`url(#${secondHalfId})`" />
+      <path d="M 370 200 A 170 170 0 0 1 30 200" :stroke="`url(#${firstHalfId})`" />
+      <path stroke="currentColor" stroke-linecap="round" d="M 30 200 A 170 170 180 0 1 30 200" />
     </g>
   </svg>
 </template>
 
 <script lang="ts" setup>
-import { uniqueId } from "lodash-es";
+import { uniqueId } from 'lodash-es'
 
-const firstHalfId = uniqueId("spinner-first-half-");
-const secondHalfId = uniqueId("spinner-second-half-");
+const firstHalfId = uniqueId('spinner-first-half-')
+const secondHalfId = uniqueId('spinner-second-half-')
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiStatusPanel.vue b/@xen-orchestra/lite/src/components/ui/UiStatusPanel.vue
index 1381c2d1ad8..a7aa62695ba 100644
--- a/@xen-orchestra/lite/src/components/ui/UiStatusPanel.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiStatusPanel.vue
@@ -9,10 +9,10 @@
 
 <script lang="ts" setup>
 defineProps<{
-  imageSource: string;
-  title?: string;
-  subtitle?: string;
-}>();
+  imageSource: string
+  title?: string
+  subtitle?: string
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiTab.vue b/@xen-orchestra/lite/src/components/ui/UiTab.vue
index e13bac6a4fe..a72792d0586 100644
--- a/@xen-orchestra/lite/src/components/ui/UiTab.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiTab.vue
@@ -1,27 +1,23 @@
 <template>
-  <component
-    :is="tag"
-    :class="{ active, disabled: disabled || isTabBarDisabled }"
-    class="ui-tab"
-  >
+  <component :is="tag" :class="{ active, disabled: disabled || isTabBarDisabled }" class="ui-tab">
     <slot />
   </component>
 </template>
 
 <script lang="ts" setup>
-import { useContext } from "@/composables/context.composable";
-import { DisabledContext } from "@/context";
+import { useContext } from '@/composables/context.composable'
+import { DisabledContext } from '@/context'
 
 const props = withDefaults(
   defineProps<{
-    disabled?: boolean;
-    active?: boolean;
-    tag?: string;
+    disabled?: boolean
+    active?: boolean
+    tag?: string
   }>(),
-  { tag: "span", disabled: undefined }
-);
+  { tag: 'span', disabled: undefined }
+)
 
-const isTabBarDisabled = useContext(DisabledContext, () => props.disabled);
+const isTabBarDisabled = useContext(DisabledContext, () => props.disabled)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiTabBar.vue b/@xen-orchestra/lite/src/components/ui/UiTabBar.vue
index edb1626936d..45f9ac8f13b 100644
--- a/@xen-orchestra/lite/src/components/ui/UiTabBar.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiTabBar.vue
@@ -5,17 +5,17 @@
 </template>
 
 <script lang="ts" setup>
-import { useContext } from "@/composables/context.composable";
-import { DisabledContext } from "@/context";
+import { useContext } from '@/composables/context.composable'
+import { DisabledContext } from '@/context'
 
 const props = withDefaults(
   defineProps<{
-    disabled?: boolean;
+    disabled?: boolean
   }>(),
   { disabled: undefined }
-);
+)
 
-useContext(DisabledContext, () => props.disabled);
+useContext(DisabledContext, () => props.disabled)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiTable.vue b/@xen-orchestra/lite/src/components/ui/UiTable.vue
index ec84f4eaa31..02b7bf19b33 100644
--- a/@xen-orchestra/lite/src/components/ui/UiTable.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiTable.vue
@@ -1,17 +1,14 @@
 <template>
-  <table
-    :class="{ 'vertical-border': verticalBorder, error: color === 'error' }"
-    class="ui-table"
-  >
+  <table :class="{ 'vertical-border': verticalBorder, error: color === 'error' }" class="ui-table">
     <slot />
   </table>
 </template>
 
 <script lang="ts" setup>
 defineProps<{
-  color?: "error";
-  verticalBorder?: boolean;
-}>();
+  color?: 'error'
+  verticalBorder?: boolean
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/UiTitle.vue b/@xen-orchestra/lite/src/components/ui/UiTitle.vue
index 3e988f4efe1..d21bce89675 100644
--- a/@xen-orchestra/lite/src/components/ui/UiTitle.vue
+++ b/@xen-orchestra/lite/src/components/ui/UiTitle.vue
@@ -5,19 +5,19 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from "vue";
+import { computed } from 'vue'
 
 const props = defineProps<{
-  type: "display" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
-}>();
+  type: 'display' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'
+}>()
 
 const tag = computed(() => {
-  if (props.type === "display") {
-    return "h1";
+  if (props.type === 'display') {
+    return 'h1'
   }
 
-  return props.type;
-});
+  return props.type
+})
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/icon/UiIcon.vue b/@xen-orchestra/lite/src/components/ui/icon/UiIcon.vue
index aa9be87fa36..d37912c3c6a 100644
--- a/@xen-orchestra/lite/src/components/ui/icon/UiIcon.vue
+++ b/@xen-orchestra/lite/src/components/ui/icon/UiIcon.vue
@@ -1,26 +1,21 @@
 <template>
   <UiSpinner v-if="busy" class="ui-icon" />
-  <FontAwesomeIcon
-    v-else-if="icon !== undefined"
-    :icon="icon"
-    class="ui-icon"
-    :fixed-width="fixedWidth"
-  />
+  <FontAwesomeIcon v-else-if="icon !== undefined" :icon="icon" class="ui-icon" :fixed-width="fixedWidth" />
 </template>
 
 <script lang="ts" setup>
-import UiSpinner from "@/components/ui/UiSpinner.vue";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
+import UiSpinner from '@/components/ui/UiSpinner.vue'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 withDefaults(
   defineProps<{
-    busy?: boolean;
-    icon?: IconDefinition;
-    fixedWidth?: boolean;
+    busy?: boolean
+    icon?: IconDefinition
+    fixedWidth?: boolean
   }>(),
   { fixedWidth: true }
-);
+)
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/ui/icon/UiStatusIcon.vue b/@xen-orchestra/lite/src/components/ui/icon/UiStatusIcon.vue
index 4fa1f09fd94..0b8aa4fb636 100644
--- a/@xen-orchestra/lite/src/components/ui/icon/UiStatusIcon.vue
+++ b/@xen-orchestra/lite/src/components/ui/icon/UiStatusIcon.vue
@@ -3,30 +3,26 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { computed } from "vue";
-import {
-  faCheckCircle,
-  faInfoCircle,
-  faWarning,
-} from "@fortawesome/free-solid-svg-icons";
-import type { Color } from "@/types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { computed } from 'vue'
+import { faCheckCircle, faInfoCircle, faWarning } from '@fortawesome/free-solid-svg-icons'
+import type { Color } from '@/types'
 
 const props = defineProps<{
-  state: Color;
-}>();
+  state: Color
+}>()
 
 const icon = computed(() => {
   switch (props.state) {
-    case "error":
-    case "warning":
-      return faWarning;
-    case "info":
-      return faInfoCircle;
+    case 'error':
+    case 'warning':
+      return faWarning
+    case 'info':
+      return faInfoCircle
     default:
-      return faCheckCircle;
+      return faCheckCircle
   }
-});
+})
 </script>
 
 <style scoped lang="postcss">
diff --git a/@xen-orchestra/lite/src/components/ui/modals/ModalApproveButton.vue b/@xen-orchestra/lite/src/components/ui/modals/ModalApproveButton.vue
index 681562513cd..2f99a9d6d7e 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/ModalApproveButton.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/ModalApproveButton.vue
@@ -5,9 +5,9 @@
 </template>
 
 <script lang="ts" setup>
-import UiButton from "@/components/ui/UiButton.vue";
-import { IK_MODAL } from "@/types/injection-keys";
-import { inject } from "vue";
+import UiButton from '@/components/ui/UiButton.vue'
+import { IK_MODAL } from '@/types/injection-keys'
+import { inject } from 'vue'
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 </script>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/ModalCloseIcon.vue b/@xen-orchestra/lite/src/components/ui/modals/ModalCloseIcon.vue
index fef9ce57fcf..9c98e8e602a 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/ModalCloseIcon.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/ModalCloseIcon.vue
@@ -1,23 +1,18 @@
 <template>
-  <UiIcon
-    :class="textClass"
-    :icon="faXmark"
-    class="modal-close-icon"
-    @click="modal?.decline()"
-  />
+  <UiIcon :class="textClass" :icon="faXmark" class="modal-close-icon" @click="modal?.decline()" />
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useContext } from "@/composables/context.composable";
-import { ColorContext } from "@/context";
-import { IK_MODAL } from "@/types/injection-keys";
-import { faXmark } from "@fortawesome/free-solid-svg-icons";
-import { inject } from "vue";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useContext } from '@/composables/context.composable'
+import { ColorContext } from '@/context'
+import { IK_MODAL } from '@/types/injection-keys'
+import { faXmark } from '@fortawesome/free-solid-svg-icons'
+import { inject } from 'vue'
 
-const { textClass } = useContext(ColorContext);
+const { textClass } = useContext(ColorContext)
 
-const modal = inject(IK_MODAL, undefined);
+const modal = inject(IK_MODAL, undefined)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/ModalContainer.vue b/@xen-orchestra/lite/src/components/ui/modals/ModalContainer.vue
index 9626cebe46a..3eafdfb87f0 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/ModalContainer.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/ModalContainer.vue
@@ -13,26 +13,26 @@
 </template>
 
 <script lang="ts" setup>
-import { useContext } from "@/composables/context.composable";
-import { ColorContext } from "@/context";
-import type { Color } from "@/types";
-import { IK_MODAL_NESTED } from "@/types/injection-keys";
-import { inject, provide } from "vue";
+import { useContext } from '@/composables/context.composable'
+import { ColorContext } from '@/context'
+import type { Color } from '@/types'
+import { IK_MODAL_NESTED } from '@/types/injection-keys'
+import { inject, provide } from 'vue'
 
 const props = defineProps<{
-  color?: Color;
-}>();
+  color?: Color
+}>()
 
 defineSlots<{
-  header: () => any;
-  default: () => any;
-  footer: () => any;
-}>();
+  header: () => any
+  default: () => any
+  footer: () => any
+}>()
 
-const { backgroundClass } = useContext(ColorContext, () => props.color);
+const { backgroundClass } = useContext(ColorContext, () => props.color)
 
-const isNested = inject(IK_MODAL_NESTED, false);
-provide(IK_MODAL_NESTED, true);
+const isNested = inject(IK_MODAL_NESTED, false)
+provide(IK_MODAL_NESTED, true)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/ModalDeclineButton.vue b/@xen-orchestra/lite/src/components/ui/modals/ModalDeclineButton.vue
index 987a47641fe..1fc21d796de 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/ModalDeclineButton.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/ModalDeclineButton.vue
@@ -1,13 +1,13 @@
 <template>
   <UiButton outlined :busy="modal.isBusy" @click="modal.decline()">
-    <slot>{{ $t("cancel") }}</slot>
+    <slot>{{ $t('cancel') }}</slot>
   </UiButton>
 </template>
 
 <script lang="ts" setup>
-import UiButton from "@/components/ui/UiButton.vue";
-import { IK_MODAL } from "@/types/injection-keys";
-import { inject } from "vue";
+import UiButton from '@/components/ui/UiButton.vue'
+import { IK_MODAL } from '@/types/injection-keys'
+import { inject } from 'vue'
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 </script>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/ModalList.vue b/@xen-orchestra/lite/src/components/ui/modals/ModalList.vue
index 02daba8c3d9..fb5521e5a56 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/ModalList.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/ModalList.vue
@@ -1,14 +1,10 @@
 <template>
-  <ModalListItem
-    v-for="modal in modalStore.modals"
-    :key="modal.id"
-    :modal="modal"
-  />
+  <ModalListItem v-for="modal in modalStore.modals" :key="modal.id" :modal="modal" />
 </template>
 
 <script lang="ts" setup>
-import ModalListItem from "@/components/ui/modals/ModalListItem.vue";
-import { useModalStore } from "@/stores/modal.store";
+import ModalListItem from '@/components/ui/modals/ModalListItem.vue'
+import { useModalStore } from '@/stores/modal.store'
 
-const modalStore = useModalStore();
+const modalStore = useModalStore()
 </script>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/ModalListItem.vue b/@xen-orchestra/lite/src/components/ui/modals/ModalListItem.vue
index 555ca85f57f..a01f09ba083 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/ModalListItem.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/ModalListItem.vue
@@ -3,13 +3,13 @@
 </template>
 
 <script lang="ts" setup>
-import type { ModalController } from "@/types";
-import { IK_MODAL } from "@/types/injection-keys";
-import { provide } from "vue";
+import type { ModalController } from '@/types'
+import { IK_MODAL } from '@/types/injection-keys'
+import { provide } from 'vue'
 
 const props = defineProps<{
-  modal: ModalController;
-}>();
+  modal: ModalController
+}>()
 
-provide(IK_MODAL, props.modal);
+provide(IK_MODAL, props.modal)
 </script>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/UiModal.vue b/@xen-orchestra/lite/src/components/ui/modals/UiModal.vue
index 990bdb0e4e0..51a6d22b692 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/UiModal.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/UiModal.vue
@@ -7,30 +7,30 @@
 </template>
 
 <script lang="ts" setup>
-import { useContext } from "@/composables/context.composable";
-import { ColorContext, DisabledContext } from "@/context";
-import type { Color } from "@/types";
-import { IK_MODAL } from "@/types/injection-keys";
-import { useMagicKeys, whenever } from "@vueuse/core";
-import { inject } from "vue";
+import { useContext } from '@/composables/context.composable'
+import { ColorContext, DisabledContext } from '@/context'
+import type { Color } from '@/types'
+import { IK_MODAL } from '@/types/injection-keys'
+import { useMagicKeys, whenever } from '@vueuse/core'
+import { inject } from 'vue'
 
 const props = defineProps<{
-  color?: Color;
-  disabled?: boolean;
-}>();
+  color?: Color
+  disabled?: boolean
+}>()
 
 defineOptions({
   inheritAttrs: false,
-});
+})
 
-const modal = inject(IK_MODAL)!;
+const modal = inject(IK_MODAL)!
 
-useContext(ColorContext, () => props.color);
-useContext(DisabledContext, () => props.disabled || modal.isBusy);
+useContext(ColorContext, () => props.color)
+useContext(DisabledContext, () => props.disabled || modal.isBusy)
 
-const { escape } = useMagicKeys();
+const { escape } = useMagicKeys()
 
-whenever(escape, () => modal.decline());
+whenever(escape, () => modal.decline())
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/layouts/BasicModalLayout.vue b/@xen-orchestra/lite/src/components/ui/modals/layouts/BasicModalLayout.vue
index f8dd7f619c6..26be9ae96f7 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/layouts/BasicModalLayout.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/layouts/BasicModalLayout.vue
@@ -11,12 +11,12 @@
 </template>
 
 <script lang="ts" setup>
-import ModalCloseIcon from "@/components/ui/modals/ModalCloseIcon.vue";
-import ModalContainer from "@/components/ui/modals/ModalContainer.vue";
+import ModalCloseIcon from '@/components/ui/modals/ModalCloseIcon.vue'
+import ModalContainer from '@/components/ui/modals/ModalContainer.vue'
 
 defineSlots<{
-  default: () => void;
-}>();
+  default: () => void
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/layouts/ConfirmModalLayout.vue b/@xen-orchestra/lite/src/components/ui/modals/layouts/ConfirmModalLayout.vue
index 2dbaacf73e9..d8e810db7c3 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/layouts/ConfirmModalLayout.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/layouts/ConfirmModalLayout.vue
@@ -30,27 +30,27 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import ModalCloseIcon from "@/components/ui/modals/ModalCloseIcon.vue";
-import ModalContainer from "@/components/ui/modals/ModalContainer.vue";
-import UiButtonGroup from "@/components/ui/UiButtonGroup.vue";
-import UiTitle from "@/components/ui/UiTitle.vue";
-import { useContext } from "@/composables/context.composable";
-import { ColorContext } from "@/context";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import ModalCloseIcon from '@/components/ui/modals/ModalCloseIcon.vue'
+import ModalContainer from '@/components/ui/modals/ModalContainer.vue'
+import UiButtonGroup from '@/components/ui/UiButtonGroup.vue'
+import UiTitle from '@/components/ui/UiTitle.vue'
+import { useContext } from '@/composables/context.composable'
+import { ColorContext } from '@/context'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 defineProps<{
-  icon?: IconDefinition;
-}>();
+  icon?: IconDefinition
+}>()
 
-const { textClass } = useContext(ColorContext);
+const { textClass } = useContext(ColorContext)
 
 defineSlots<{
-  title: () => void;
-  subtitle: () => void;
-  default: () => void;
-  buttons: () => void;
-}>();
+  title: () => void
+  subtitle: () => void
+  default: () => void
+  buttons: () => void
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/modals/layouts/FormModalLayout.vue b/@xen-orchestra/lite/src/components/ui/modals/layouts/FormModalLayout.vue
index 61fa25948ca..480cf80c6cf 100644
--- a/@xen-orchestra/lite/src/components/ui/modals/layouts/FormModalLayout.vue
+++ b/@xen-orchestra/lite/src/components/ui/modals/layouts/FormModalLayout.vue
@@ -21,25 +21,25 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import ModalCloseIcon from "@/components/ui/modals/ModalCloseIcon.vue";
-import ModalContainer from "@/components/ui/modals/ModalContainer.vue";
-import UiButtonGroup from "@/components/ui/UiButtonGroup.vue";
-import { useContext } from "@/composables/context.composable";
-import { ColorContext } from "@/context";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import ModalCloseIcon from '@/components/ui/modals/ModalCloseIcon.vue'
+import ModalContainer from '@/components/ui/modals/ModalContainer.vue'
+import UiButtonGroup from '@/components/ui/UiButtonGroup.vue'
+import { useContext } from '@/composables/context.composable'
+import { ColorContext } from '@/context'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 defineProps<{
-  icon?: IconDefinition;
-}>();
+  icon?: IconDefinition
+}>()
 
 defineSlots<{
-  title: () => void;
-  default: () => void;
-  buttons: () => void;
-}>();
+  title: () => void
+  default: () => void
+  buttons: () => void
+}>()
 
-const { textClass, borderClass } = useContext(ColorContext);
+const { textClass, borderClass } = useContext(ColorContext)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/progress/UiProgressBar.vue b/@xen-orchestra/lite/src/components/ui/progress/UiProgressBar.vue
index 3d328546198..2bd73ae6cd7 100644
--- a/@xen-orchestra/lite/src/components/ui/progress/UiProgressBar.vue
+++ b/@xen-orchestra/lite/src/components/ui/progress/UiProgressBar.vue
@@ -5,22 +5,22 @@
 </template>
 
 <script lang="ts" setup>
-import type { Color } from "@/types";
-import { computed } from "vue";
+import type { Color } from '@/types'
+import { computed } from 'vue'
 
 const props = withDefaults(
   defineProps<{
-    value: number;
-    color?: Color | "custom";
-    maxValue?: number;
+    value: number
+    color?: Color | 'custom'
+    maxValue?: number
   }>(),
-  { color: "info", maxValue: 100 }
-);
+  { color: 'info', maxValue: 100 }
+)
 
 const progressWithUnit = computed(() => {
-  const progress = (props.value / props.maxValue) * 100;
-  return `${progress}%`;
-});
+  const progress = (props.value / props.maxValue) * 100
+  return `${progress}%`
+})
 </script>
 
 <style lang="postcss" scoped>
@@ -29,10 +29,7 @@ const progressWithUnit = computed(() => {
   height: var(--progress-bar-height, 0.4rem);
   margin: 1rem 0;
   border-radius: 0.4rem;
-  background-color: var(
-    --progress-bar-background-color,
-    var(--background-color-extra-blue)
-  );
+  background-color: var(--progress-bar-background-color, var(--background-color-extra-blue));
 
   &.color-info {
     --progress-bar-color: var(--color-extra-blue-base);
diff --git a/@xen-orchestra/lite/src/components/ui/progress/UiProgressLegend.vue b/@xen-orchestra/lite/src/components/ui/progress/UiProgressLegend.vue
index d38555e26e7..b9dbf097323 100644
--- a/@xen-orchestra/lite/src/components/ui/progress/UiProgressLegend.vue
+++ b/@xen-orchestra/lite/src/components/ui/progress/UiProgressLegend.vue
@@ -15,21 +15,19 @@
 </template>
 
 <script lang="ts" setup>
-import UiBadge from "@/components/ui/UiBadge.vue";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { hasEllipsis } from "@/libs/utils";
-import { computed, ref } from "vue";
+import UiBadge from '@/components/ui/UiBadge.vue'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { hasEllipsis } from '@/libs/utils'
+import { computed, ref } from 'vue'
 
 defineProps<{
-  label?: string;
-  value?: string;
-}>();
+  label?: string
+  value?: string
+}>()
 
-const labelElement = ref<HTMLElement>();
+const labelElement = ref<HTMLElement>()
 
-const isTooltipEnabled = computed(() =>
-  hasEllipsis(labelElement.value, { vertical: true })
-);
+const isTooltipEnabled = computed(() => hasEllipsis(labelElement.value, { vertical: true }))
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/ui/progress/UiProgressScale.vue b/@xen-orchestra/lite/src/components/ui/progress/UiProgressScale.vue
index 6a910538c6b..05aa124dd6f 100644
--- a/@xen-orchestra/lite/src/components/ui/progress/UiProgressScale.vue
+++ b/@xen-orchestra/lite/src/components/ui/progress/UiProgressScale.vue
@@ -1,9 +1,7 @@
 <template>
   <p class="unit">
     <span>0{{ unit }}</span>
-    <span v-for="step in steps" :key="step">
-      {{ Math.round((maxValue / (steps + 1)) * step) }}{{ unit }}
-    </span>
+    <span v-for="step in steps" :key="step"> {{ Math.round((maxValue / (steps + 1)) * step) }}{{ unit }} </span>
     <span>{{ maxValue }}{{ unit }}</span>
   </p>
 </template>
@@ -11,12 +9,12 @@
 <script lang="ts" setup>
 withDefaults(
   defineProps<{
-    maxValue?: number;
-    steps?: number;
-    unit?: string;
+    maxValue?: number
+    steps?: number
+    unit?: string
   }>(),
   { maxValue: 100, steps: 1 }
-);
+)
 </script>
 
 <style lang="postcss">
diff --git a/@xen-orchestra/lite/src/components/ui/resources/UiResource.vue b/@xen-orchestra/lite/src/components/ui/resources/UiResource.vue
index af34943cdd1..50821c453bb 100644
--- a/@xen-orchestra/lite/src/components/ui/resources/UiResource.vue
+++ b/@xen-orchestra/lite/src/components/ui/resources/UiResource.vue
@@ -8,14 +8,14 @@
 </template>
 
 <script lang="ts" setup>
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 defineProps<{
-  icon: IconDefinition;
-  label: string;
-  count: string | number;
-}>();
+  icon: IconDefinition
+  label: string
+  count: string | number
+}>()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionCopyItem.vue b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionCopyItem.vue
index d2994c97c1b..16ec8c80a64 100644
--- a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionCopyItem.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionCopyItem.vue
@@ -1,66 +1,57 @@
 <template>
   <MenuItem
-    v-tooltip="
-      !areAllSelectedVmsHalted &&
-      $t(isSingleAction ? 'vm-is-running' : 'selected-vms-in-execution')
-    "
+    v-tooltip="!areAllSelectedVmsHalted && $t(isSingleAction ? 'vm-is-running' : 'selected-vms-in-execution')"
     :busy="areSomeSelectedVmsCloning"
     :disabled="isDisabled"
     :icon="faCopy"
     @click="handleCopy"
   >
-    {{ $t("copy") }}
+    {{ $t('copy') }}
   </MenuItem>
 </template>
 
 <script lang="ts" setup>
-import MenuItem from "@/components/menu/MenuItem.vue";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { VM_POWER_STATE, VM_OPERATION } from "@/libs/xen-api/xen-api.enums";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { faCopy } from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+import MenuItem from '@/components/menu/MenuItem.vue'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { VM_POWER_STATE, VM_OPERATION } from '@/libs/xen-api/xen-api.enums'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { faCopy } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  selectedRefs: XenApiVm["$ref"][];
-  isSingleAction?: boolean;
-}>();
+  selectedRefs: XenApiVm['$ref'][]
+  isSingleAction?: boolean
+}>()
 
-const { getByOpaqueRef, isOperationPending } = useVmCollection();
+const { getByOpaqueRef, isOperationPending } = useVmCollection()
 
 const selectedVms = computed(() =>
-  props.selectedRefs
-    .map((vmRef) => getByOpaqueRef(vmRef))
-    .filter((vm): vm is XenApiVm => vm !== undefined)
-);
+  props.selectedRefs.map(vmRef => getByOpaqueRef(vmRef)).filter((vm): vm is XenApiVm => vm !== undefined)
+)
 
 const areAllSelectedVmsHalted = computed(
   () =>
     selectedVms.value.length > 0 &&
-    selectedVms.value.every(
-      (selectedVm) => selectedVm.power_state === VM_POWER_STATE.HALTED
-    )
-);
+    selectedVms.value.every(selectedVm => selectedVm.power_state === VM_POWER_STATE.HALTED)
+)
 
 const areSomeSelectedVmsCloning = computed(() =>
-  selectedVms.value.some((vm) => isOperationPending(vm, VM_OPERATION.CLONE))
-);
+  selectedVms.value.some(vm => isOperationPending(vm, VM_OPERATION.CLONE))
+)
 
 const isDisabled = computed(() => {
-  return selectedVms.value.length === 0 || !areAllSelectedVmsHalted.value;
-});
+  return selectedVms.value.length === 0 || !areAllSelectedVmsHalted.value
+})
 
 const handleCopy = async () => {
-  const xapiStore = useXenApiStore();
+  const xapiStore = useXenApiStore()
 
-  const vmRefsToClone = Object.fromEntries(
-    selectedVms.value.map((vm) => [vm.$ref, `${vm.name_label} (COPY)`])
-  );
+  const vmRefsToClone = Object.fromEntries(selectedVms.value.map(vm => [vm.$ref, `${vm.name_label} (COPY)`]))
 
-  await xapiStore.getXapi().vm.clone(vmRefsToClone);
-};
+  await xapiStore.getXapi().vm.clone(vmRefsToClone)
+}
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionDeleteItem.vue b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionDeleteItem.vue
index eed5e64e562..b6f67d336bf 100644
--- a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionDeleteItem.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionDeleteItem.vue
@@ -5,40 +5,34 @@
     :icon="faTrashCan"
     @click="openDeleteModal"
   >
-    {{ $t("delete") }}
+    {{ $t('delete') }}
   </MenuItem>
 </template>
 
 <script lang="ts" setup>
-import MenuItem from "@/components/menu/MenuItem.vue";
-import { useModal } from "@/composables/modal.composable";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { VM_POWER_STATE } from "@/libs/xen-api/xen-api.enums";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { faTrashCan } from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+import MenuItem from '@/components/menu/MenuItem.vue'
+import { useModal } from '@/composables/modal.composable'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { VM_POWER_STATE } from '@/libs/xen-api/xen-api.enums'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { faTrashCan } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  vmRefs: XenApiVm["$ref"][];
-}>();
+  vmRefs: XenApiVm['$ref'][]
+}>()
 
-const { getByOpaqueRef: getVm } = useVmCollection();
+const { getByOpaqueRef: getVm } = useVmCollection()
 
-const vms = computed<XenApiVm[]>(() =>
-  props.vmRefs.map(getVm).filter((vm): vm is XenApiVm => vm !== undefined)
-);
+const vms = computed<XenApiVm[]>(() => props.vmRefs.map(getVm).filter((vm): vm is XenApiVm => vm !== undefined))
 
-const areSomeVmsInExecution = computed(() =>
-  vms.value.some((vm) => vm.power_state !== VM_POWER_STATE.HALTED)
-);
+const areSomeVmsInExecution = computed(() => vms.value.some(vm => vm.power_state !== VM_POWER_STATE.HALTED))
 
-const isDisabled = computed(
-  () => vms.value.length === 0 || areSomeVmsInExecution.value
-);
+const isDisabled = computed(() => vms.value.length === 0 || areSomeVmsInExecution.value)
 
 const openDeleteModal = () =>
-  useModal(() => import("@/components/modals/VmDeleteModal.vue"), {
+  useModal(() => import('@/components/modals/VmDeleteModal.vue'), {
     vmRefs: props.vmRefs,
-  });
+  })
 </script>
diff --git a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionExportItem.vue b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionExportItem.vue
index 77b57b71f4c..b1991746183 100644
--- a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionExportItem.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionExportItem.vue
@@ -1,53 +1,47 @@
 <template>
   <MenuItem
     v-tooltip="
-      vmRefs.length > 0 &&
-      !isSomeExportable &&
-      $t(isSingleAction ? 'vm-is-running' : 'no-selected-vm-can-be-exported')
+      vmRefs.length > 0 && !isSomeExportable && $t(isSingleAction ? 'vm-is-running' : 'no-selected-vm-can-be-exported')
     "
     :icon="faDisplay"
     :disabled="isDisabled"
     @click="openModal"
   >
-    {{ $t(isSingleAction ? "export-vm" : "export-vms") }}
+    {{ $t(isSingleAction ? 'export-vm' : 'export-vms') }}
   </MenuItem>
 </template>
 <script lang="ts" setup>
-import { computed } from "vue";
-import { faDisplay } from "@fortawesome/free-solid-svg-icons";
+import { computed } from 'vue'
+import { faDisplay } from '@fortawesome/free-solid-svg-icons'
 
-import MenuItem from "@/components/menu/MenuItem.vue";
-import { DisabledContext } from "@/context";
-import { useContext } from "@/composables/context.composable";
-import { useModal } from "@/composables/modal.composable";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { VM_OPERATION } from "@/libs/xen-api/xen-api.enums";
-import { vTooltip } from "@/directives/tooltip.directive";
+import MenuItem from '@/components/menu/MenuItem.vue'
+import { DisabledContext } from '@/context'
+import { useContext } from '@/composables/context.composable'
+import { useModal } from '@/composables/modal.composable'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { VM_OPERATION } from '@/libs/xen-api/xen-api.enums'
+import { vTooltip } from '@/directives/tooltip.directive'
 
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
 
 const props = defineProps<{
-  vmRefs: XenApiVm["$ref"][];
-  isSingleAction?: boolean;
-}>();
+  vmRefs: XenApiVm['$ref'][]
+  isSingleAction?: boolean
+}>()
 
-const { getByOpaqueRefs, areSomeOperationAllowed } = useVmCollection();
+const { getByOpaqueRefs, areSomeOperationAllowed } = useVmCollection()
 
-const isParentDisabled = useContext(DisabledContext);
+const isParentDisabled = useContext(DisabledContext)
 
 const isSomeExportable = computed(() =>
-  getByOpaqueRefs(props.vmRefs).some((vm) =>
-    areSomeOperationAllowed(vm, VM_OPERATION.EXPORT)
-  )
-);
+  getByOpaqueRefs(props.vmRefs).some(vm => areSomeOperationAllowed(vm, VM_OPERATION.EXPORT))
+)
 
-const isDisabled = computed(
-  () => isParentDisabled.value || !isSomeExportable.value
-);
+const isDisabled = computed(() => isParentDisabled.value || !isSomeExportable.value)
 
 const openModal = () => {
-  useModal(() => import("@/components/modals/VmExportModal.vue"), {
+  useModal(() => import('@/components/modals/VmExportModal.vue'), {
     vmRefs: props.vmRefs,
-  });
-};
+  })
+}
 </script>
diff --git a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionExportItems.vue b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionExportItems.vue
index 49f1a204888..6695a5edd0b 100644
--- a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionExportItems.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionExportItems.vue
@@ -1,45 +1,31 @@
 <template>
   <MenuItem :icon="faFileExport">
-    {{ $t("export") }}
+    {{ $t('export') }}
     <template #submenu>
-      <VmActionExportItem :vmRefs="vmRefs" />
-      <MenuItem
-        :icon="faCode"
-        @click="
-          exportVmsAsJsonFile(vms, `vms_${new Date().toISOString()}.json`)
-        "
-      >
-        {{ $t("export-table-to", { type: ".json" }) }}
+      <VmActionExportItem :vm-refs="vmRefs" />
+      <MenuItem :icon="faCode" @click="exportVmsAsJsonFile(vms, `vms_${new Date().toISOString()}.json`)">
+        {{ $t('export-table-to', { type: '.json' }) }}
       </MenuItem>
-      <MenuItem
-        :icon="faFileCsv"
-        @click="exportVmsAsCsvFile(vms, `vms_${new Date().toISOString()}.csv`)"
-      >
-        {{ $t("export-table-to", { type: ".csv" }) }}
+      <MenuItem :icon="faFileCsv" @click="exportVmsAsCsvFile(vms, `vms_${new Date().toISOString()}.csv`)">
+        {{ $t('export-table-to', { type: '.csv' }) }}
       </MenuItem>
     </template>
   </MenuItem>
 </template>
 
 <script lang="ts" setup>
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { computed } from "vue";
-import { exportVmsAsCsvFile, exportVmsAsJsonFile } from "@/libs/vm";
-import MenuItem from "@/components/menu/MenuItem.vue";
-import VmActionExportItem from "@/components/vm/VmActionItems/VmActionExportItem.vue";
-import {
-  faCode,
-  faFileCsv,
-  faFileExport,
-} from "@fortawesome/free-solid-svg-icons";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { computed } from 'vue'
+import { exportVmsAsCsvFile, exportVmsAsJsonFile } from '@/libs/vm'
+import MenuItem from '@/components/menu/MenuItem.vue'
+import VmActionExportItem from '@/components/vm/VmActionItems/VmActionExportItem.vue'
+import { faCode, faFileCsv, faFileExport } from '@fortawesome/free-solid-svg-icons'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
 
 const props = defineProps<{
-  vmRefs: XenApiVm["$ref"][];
-}>();
+  vmRefs: XenApiVm['$ref'][]
+}>()
 
-const { getByOpaqueRef: getVm } = useVmCollection();
-const vms = computed(() =>
-  props.vmRefs.map(getVm).filter((vm): vm is XenApiVm => vm !== undefined)
-);
+const { getByOpaqueRef: getVm } = useVmCollection()
+const vms = computed(() => props.vmRefs.map(getVm).filter((vm): vm is XenApiVm => vm !== undefined))
 </script>
diff --git a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionMigrateItem.vue b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionMigrateItem.vue
index dd1fb2d58e2..84ef6c2435a 100644
--- a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionMigrateItem.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionMigrateItem.vue
@@ -3,63 +3,52 @@
     v-tooltip="
       selectedRefs.length > 0 &&
       !isMigratable &&
-      $t(
-        isSingleAction
-          ? 'this-vm-cant-be-migrated'
-          : 'no-selected-vm-can-be-migrated'
-      )
+      $t(isSingleAction ? 'this-vm-cant-be-migrated' : 'no-selected-vm-can-be-migrated')
     "
     :busy="isMigrating"
     :disabled="isParentDisabled || !isMigratable"
     :icon="faRoute"
     @click="openModal()"
   >
-    {{ $t("migrate") }}
+    {{ $t('migrate') }}
   </MenuItem>
 </template>
 
 <script lang="ts" setup>
-import MenuItem from "@/components/menu/MenuItem.vue";
-import { useContext } from "@/composables/context.composable";
-import { useModal } from "@/composables/modal.composable";
-import { DisabledContext } from "@/context";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { VM_OPERATION } from "@/libs/xen-api/xen-api.enums";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { faRoute } from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+import MenuItem from '@/components/menu/MenuItem.vue'
+import { useContext } from '@/composables/context.composable'
+import { useModal } from '@/composables/modal.composable'
+import { DisabledContext } from '@/context'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { VM_OPERATION } from '@/libs/xen-api/xen-api.enums'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { faRoute } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  selectedRefs: XenApiVm["$ref"][];
-  isSingleAction?: boolean;
-}>();
+  selectedRefs: XenApiVm['$ref'][]
+  isSingleAction?: boolean
+}>()
 
-const { getByOpaqueRefs, isOperationPending, areSomeOperationAllowed } =
-  useVmCollection();
+const { getByOpaqueRefs, isOperationPending, areSomeOperationAllowed } = useVmCollection()
 
-const isParentDisabled = useContext(DisabledContext);
+const isParentDisabled = useContext(DisabledContext)
 
 const isMigratable = computed(() =>
-  getByOpaqueRefs(props.selectedRefs).some((vm) =>
-    areSomeOperationAllowed(vm, [
-      VM_OPERATION.POOL_MIGRATE,
-      VM_OPERATION.MIGRATE_SEND,
-    ])
+  getByOpaqueRefs(props.selectedRefs).some(vm =>
+    areSomeOperationAllowed(vm, [VM_OPERATION.POOL_MIGRATE, VM_OPERATION.MIGRATE_SEND])
   )
-);
+)
 
 const isMigrating = computed(() =>
-  getByOpaqueRefs(props.selectedRefs).some((vm) =>
-    isOperationPending(vm, [
-      VM_OPERATION.POOL_MIGRATE,
-      VM_OPERATION.MIGRATE_SEND,
-    ])
+  getByOpaqueRefs(props.selectedRefs).some(vm =>
+    isOperationPending(vm, [VM_OPERATION.POOL_MIGRATE, VM_OPERATION.MIGRATE_SEND])
   )
-);
+)
 
 const openModal = () =>
-  useModal(() => import("@/components/modals/VmMigrateModal.vue"), {
+  useModal(() => import('@/components/modals/VmMigrateModal.vue'), {
     vmRefs: props.selectedRefs,
-  });
+  })
 </script>
diff --git a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionPowerStateItems.vue b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionPowerStateItems.vue
index aebff351337..275cb840fde 100644
--- a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionPowerStateItems.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionPowerStateItems.vue
@@ -1,53 +1,26 @@
 <template>
-  <MenuItem
-    :busy="areVmsBusyToStart"
-    :disabled="!areVmsHalted"
-    :icon="faPlay"
-    @click="xenApi.vm.start(vmRefs)"
-  >
-    {{ $t("start") }}
+  <MenuItem :busy="areVmsBusyToStart" :disabled="!areVmsHalted" :icon="faPlay" @click="xenApi.vm.start(vmRefs)">
+    {{ $t('start') }}
   </MenuItem>
-  <MenuItem
-    :busy="areVmsBusyToStartOnHost"
-    :disabled="!areVmsHalted"
-    :icon="faServer"
-  >
-    {{ $t("start-on-host") }}
+  <MenuItem :busy="areVmsBusyToStartOnHost" :disabled="!areVmsHalted" :icon="faServer">
+    {{ $t('start-on-host') }}
     <template #submenu>
-      <MenuItem
-        v-for="host in hosts"
-        v-bind:key="host.$ref"
-        :icon="faServer"
-        @click="xenApi.vm.startOn(vmRefs, host.$ref)"
-      >
+      <MenuItem v-for="host in hosts" :key="host.$ref" :icon="faServer" @click="xenApi.vm.startOn(vmRefs, host.$ref)">
         <div class="wrapper">
           {{ host.name_label }}
           <div>
-            <UiIcon
-              :icon="host.$ref === pool?.master ? faStar : undefined"
-              class="star"
-            />
+            <UiIcon :icon="host.$ref === pool?.master ? faStar : undefined" class="star" />
             <PowerStateIcon :state="getHostState(host)" />
           </div>
         </div>
       </MenuItem>
     </template>
   </MenuItem>
-  <MenuItem
-    :busy="areVmsBusyToPause"
-    :disabled="!areVmsRunning"
-    :icon="faPause"
-    @click="xenApi.vm.pause(vmRefs)"
-  >
-    {{ $t("pause") }}
+  <MenuItem :busy="areVmsBusyToPause" :disabled="!areVmsRunning" :icon="faPause" @click="xenApi.vm.pause(vmRefs)">
+    {{ $t('pause') }}
   </MenuItem>
-  <MenuItem
-    :busy="areVmsBusyToSuspend"
-    :disabled="!areVmsRunning"
-    :icon="faMoon"
-    @click="xenApi.vm.suspend(vmRefs)"
-  >
-    {{ $t("suspend") }}
+  <MenuItem :busy="areVmsBusyToSuspend" :disabled="!areVmsRunning" :icon="faMoon" @click="xenApi.vm.suspend(vmRefs)">
+    {{ $t('suspend') }}
   </MenuItem>
   <MenuItem
     :busy="areVmsBusyToResume"
@@ -55,7 +28,7 @@
     :icon="faCirclePlay"
     @click="xenApi.vm.resume(vmRefsWithPowerState)"
   >
-    {{ $t("resume") }}
+    {{ $t('resume') }}
   </MenuItem>
   <MenuItem
     :busy="areVmsBusyToReboot"
@@ -63,7 +36,7 @@
     :icon="faRotateLeft"
     @click="xenApi.vm.reboot(vmRefs)"
   >
-    {{ $t("reboot") }}
+    {{ $t('reboot') }}
   </MenuItem>
   <MenuItem
     :busy="areVmsBusyToForceReboot"
@@ -71,7 +44,7 @@
     :icon="faRepeat"
     @click="xenApi.vm.reboot(vmRefs, true)"
   >
-    {{ $t("force-reboot") }}
+    {{ $t('force-reboot') }}
   </MenuItem>
   <MenuItem
     :busy="areVmsBusyToShutdown"
@@ -79,7 +52,7 @@
     :icon="faPowerOff"
     @click="xenApi.vm.shutdown(vmRefs)"
   >
-    {{ $t("shutdown") }}
+    {{ $t('shutdown') }}
   </MenuItem>
   <MenuItem
     :busy="areVmsBusyToForceShutdown"
@@ -87,21 +60,21 @@
     :icon="faPlug"
     @click="xenApi.vm.shutdown(vmRefs, true)"
   >
-    {{ $t("force-shutdown") }}
+    {{ $t('force-shutdown') }}
   </MenuItem>
 </template>
 
 <script lang="ts" setup>
-import MenuItem from "@/components/menu/MenuItem.vue";
-import PowerStateIcon from "@/components/PowerStateIcon.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useHostMetricsCollection } from "@/stores/xen-api/host-metrics.store";
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import type { XenApiHost, XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { VM_POWER_STATE, VM_OPERATION } from "@/libs/xen-api/xen-api.enums";
-import { useXenApiStore } from "@/stores/xen-api.store";
+import MenuItem from '@/components/menu/MenuItem.vue'
+import PowerStateIcon from '@/components/PowerStateIcon.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useHostMetricsCollection } from '@/stores/xen-api/host-metrics.store'
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import type { XenApiHost, XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { VM_POWER_STATE, VM_OPERATION } from '@/libs/xen-api/xen-api.enums'
+import { useXenApiStore } from '@/stores/xen-api.store'
 import {
   faCirclePlay,
   faMoon,
@@ -113,73 +86,42 @@ import {
   faRotateLeft,
   faServer,
   faStar,
-} from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+} from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  vmRefs: XenApiVm["$ref"][];
-}>();
+  vmRefs: XenApiVm['$ref'][]
+}>()
 
-const { getByOpaqueRef: getVm, isOperationPending } = useVmCollection();
-const { records: hosts } = useHostCollection();
-const { pool } = usePoolCollection();
-const { isHostRunning } = useHostMetricsCollection();
+const { getByOpaqueRef: getVm, isOperationPending } = useVmCollection()
+const { records: hosts } = useHostCollection()
+const { pool } = usePoolCollection()
+const { isHostRunning } = useHostMetricsCollection()
 
-const vms = computed(() =>
-  props.vmRefs.map(getVm).filter((vm): vm is XenApiVm => vm !== undefined)
-);
+const vms = computed(() => props.vmRefs.map(getVm).filter((vm): vm is XenApiVm => vm !== undefined))
 
-const vmRefsWithPowerState = computed(() =>
-  vms.value.reduce((acc, vm) => ({ ...acc, [vm.$ref]: vm.power_state }), {})
-);
+const vmRefsWithPowerState = computed(() => vms.value.reduce((acc, vm) => ({ ...acc, [vm.$ref]: vm.power_state }), {}))
 
-const xenApi = useXenApiStore().getXapi();
+const xenApi = useXenApiStore().getXapi()
 
-const areVmsRunning = computed(() =>
-  vms.value.every((vm) => vm.power_state === VM_POWER_STATE.RUNNING)
-);
-const areVmsHalted = computed(() =>
-  vms.value.every((vm) => vm.power_state === VM_POWER_STATE.HALTED)
-);
-const areVmsSuspended = computed(() =>
-  vms.value.every((vm) => vm.power_state === VM_POWER_STATE.SUSPENDED)
-);
-const areVmsPaused = computed(() =>
-  vms.value.every((vm) => vm.power_state === VM_POWER_STATE.PAUSED)
-);
+const areVmsRunning = computed(() => vms.value.every(vm => vm.power_state === VM_POWER_STATE.RUNNING))
+const areVmsHalted = computed(() => vms.value.every(vm => vm.power_state === VM_POWER_STATE.HALTED))
+const areVmsSuspended = computed(() => vms.value.every(vm => vm.power_state === VM_POWER_STATE.SUSPENDED))
+const areVmsPaused = computed(() => vms.value.every(vm => vm.power_state === VM_POWER_STATE.PAUSED))
 
 const areOperationsPending = (operation: VM_OPERATION | VM_OPERATION[]) =>
-  vms.value.some((vm) => isOperationPending(vm, operation));
+  vms.value.some(vm => isOperationPending(vm, operation))
 
-const areVmsBusyToStart = computed(() =>
-  areOperationsPending(VM_OPERATION.START)
-);
-const areVmsBusyToStartOnHost = computed(() =>
-  areOperationsPending(VM_OPERATION.START_ON)
-);
-const areVmsBusyToPause = computed(() =>
-  areOperationsPending(VM_OPERATION.PAUSE)
-);
-const areVmsBusyToSuspend = computed(() =>
-  areOperationsPending(VM_OPERATION.SUSPEND)
-);
-const areVmsBusyToResume = computed(() =>
-  areOperationsPending([VM_OPERATION.UNPAUSE, VM_OPERATION.RESUME])
-);
-const areVmsBusyToReboot = computed(() =>
-  areOperationsPending(VM_OPERATION.CLEAN_REBOOT)
-);
-const areVmsBusyToForceReboot = computed(() =>
-  areOperationsPending(VM_OPERATION.HARD_REBOOT)
-);
-const areVmsBusyToShutdown = computed(() =>
-  areOperationsPending(VM_OPERATION.CLEAN_SHUTDOWN)
-);
-const areVmsBusyToForceShutdown = computed(() =>
-  areOperationsPending(VM_OPERATION.HARD_SHUTDOWN)
-);
-const getHostState = (host: XenApiHost) =>
-  isHostRunning(host) ? VM_POWER_STATE.RUNNING : VM_POWER_STATE.HALTED;
+const areVmsBusyToStart = computed(() => areOperationsPending(VM_OPERATION.START))
+const areVmsBusyToStartOnHost = computed(() => areOperationsPending(VM_OPERATION.START_ON))
+const areVmsBusyToPause = computed(() => areOperationsPending(VM_OPERATION.PAUSE))
+const areVmsBusyToSuspend = computed(() => areOperationsPending(VM_OPERATION.SUSPEND))
+const areVmsBusyToResume = computed(() => areOperationsPending([VM_OPERATION.UNPAUSE, VM_OPERATION.RESUME]))
+const areVmsBusyToReboot = computed(() => areOperationsPending(VM_OPERATION.CLEAN_REBOOT))
+const areVmsBusyToForceReboot = computed(() => areOperationsPending(VM_OPERATION.HARD_REBOOT))
+const areVmsBusyToShutdown = computed(() => areOperationsPending(VM_OPERATION.CLEAN_SHUTDOWN))
+const areVmsBusyToForceShutdown = computed(() => areOperationsPending(VM_OPERATION.HARD_SHUTDOWN))
+const getHostState = (host: XenApiHost) => (isHostRunning(host) ? VM_POWER_STATE.RUNNING : VM_POWER_STATE.HALTED)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionSnapshotItem.vue b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionSnapshotItem.vue
index 30bf7b53e98..910c9a6763d 100644
--- a/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionSnapshotItem.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmActionItems/VmActionSnapshotItem.vue
@@ -1,52 +1,38 @@
 <template>
-  <MenuItem
-    :busy="areSomeVmsSnapshoting"
-    :disabled="isDisabled"
-    :icon="faCamera"
-    @click="handleSnapshot"
-  >
-    {{ $t("snapshot") }}
+  <MenuItem :busy="areSomeVmsSnapshoting" :disabled="isDisabled" :icon="faCamera" @click="handleSnapshot">
+    {{ $t('snapshot') }}
   </MenuItem>
 </template>
 
 <script lang="ts" setup>
-import MenuItem from "@/components/menu/MenuItem.vue";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { VM_OPERATION } from "@/libs/xen-api/xen-api.enums";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { faCamera } from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
+import MenuItem from '@/components/menu/MenuItem.vue'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { VM_OPERATION } from '@/libs/xen-api/xen-api.enums'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { faCamera } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
 
 const props = defineProps<{
-  vmRefs: XenApiVm["$ref"][];
-}>();
+  vmRefs: XenApiVm['$ref'][]
+}>()
 
-const { getByOpaqueRef, isOperationPending } = useVmCollection();
+const { getByOpaqueRef, isOperationPending } = useVmCollection()
 
 const vms = computed(() =>
-  props.vmRefs
-    .map((vmRef) => getByOpaqueRef(vmRef))
-    .filter((vm): vm is XenApiVm => vm !== undefined)
-);
+  props.vmRefs.map(vmRef => getByOpaqueRef(vmRef)).filter((vm): vm is XenApiVm => vm !== undefined)
+)
 
-const areSomeVmsSnapshoting = computed(() =>
-  vms.value.some((vm) => isOperationPending(vm, VM_OPERATION.SNAPSHOT))
-);
+const areSomeVmsSnapshoting = computed(() => vms.value.some(vm => isOperationPending(vm, VM_OPERATION.SNAPSHOT)))
 
-const isDisabled = computed(
-  () => vms.value.length === 0 || areSomeVmsSnapshoting.value
-);
+const isDisabled = computed(() => vms.value.length === 0 || areSomeVmsSnapshoting.value)
 
 const handleSnapshot = () => {
   const vmRefsToSnapshot = Object.fromEntries(
-    vms.value.map((vm) => [
-      vm.$ref,
-      `${vm.name_label}_${new Date().toISOString()}`,
-    ])
-  );
-  return useXenApiStore().getXapi().vm.snapshot(vmRefsToSnapshot);
-};
+    vms.value.map(vm => [vm.$ref, `${vm.name_label}_${new Date().toISOString()}`])
+  )
+  return useXenApiStore().getXapi().vm.snapshot(vmRefsToSnapshot)
+}
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/components/vm/VmHeader.vue b/@xen-orchestra/lite/src/components/vm/VmHeader.vue
index 7f03f23f72b..93dd0c64bab 100644
--- a/@xen-orchestra/lite/src/components/vm/VmHeader.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmHeader.vue
@@ -5,7 +5,7 @@
       <AppMenu v-if="vm !== undefined" placement="bottom-end" shadow>
         <template #trigger="{ open, isOpen }">
           <UiButton :active="isOpen" :icon="faPowerOff" @click="open">
-            {{ $t("change-state") }}
+            {{ $t('change-state') }}
             <UiIcon :icon="faAngleDown" />
           </UiButton>
         </template>
@@ -14,15 +14,15 @@
       <AppMenu v-if="vm !== undefined" placement="bottom-end" shadow>
         <template #trigger="{ open, isOpen }">
           <UiButton
-            :active="isOpen"
-            :icon="faEllipsisVertical"
-            @click="open"
-            transparent
-            class="more-actions-button"
             v-tooltip="{
               placement: 'left',
               content: $t('more-actions'),
             }"
+            :active="isOpen"
+            :icon="faEllipsisVertical"
+            transparent
+            class="more-actions-button"
+            @click="open"
           />
         </template>
         <VmActionCopyItem :selected-refs="[vm.$ref]" is-single-action />
@@ -35,35 +35,28 @@
 </template>
 
 <script lang="ts" setup>
-import AppMenu from "@/components/menu/AppMenu.vue";
-import TitleBar from "@/components/TitleBar.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import VmActionMigrateItem from "@/components/vm/VmActionItems/VmActionMigrateItem.vue";
-import VmActionPowerStateItems from "@/components/vm/VmActionItems/VmActionPowerStateItems.vue";
-import VmActionSnapshotItem from "@/components/vm/VmActionItems/VmActionSnapshotItem.vue";
-import VmActionCopyItem from "@/components/vm/VmActionItems/VmActionCopyItem.vue";
-import VmActionExportItem from "@/components/vm/VmActionItems/VmActionExportItem.vue";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { vTooltip } from "@/directives/tooltip.directive";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import {
-  faAngleDown,
-  faDisplay,
-  faEllipsisVertical,
-  faPowerOff,
-} from "@fortawesome/free-solid-svg-icons";
-import { computed } from "vue";
-import { useRouter } from "vue-router";
+import AppMenu from '@/components/menu/AppMenu.vue'
+import TitleBar from '@/components/TitleBar.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import VmActionMigrateItem from '@/components/vm/VmActionItems/VmActionMigrateItem.vue'
+import VmActionPowerStateItems from '@/components/vm/VmActionItems/VmActionPowerStateItems.vue'
+import VmActionSnapshotItem from '@/components/vm/VmActionItems/VmActionSnapshotItem.vue'
+import VmActionCopyItem from '@/components/vm/VmActionItems/VmActionCopyItem.vue'
+import VmActionExportItem from '@/components/vm/VmActionItems/VmActionExportItem.vue'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { vTooltip } from '@/directives/tooltip.directive'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { faAngleDown, faDisplay, faEllipsisVertical, faPowerOff } from '@fortawesome/free-solid-svg-icons'
+import { computed } from 'vue'
+import { useRouter } from 'vue-router'
 
-const { getByUuid: getVmByUuid } = useVmCollection();
-const { currentRoute } = useRouter();
+const { getByUuid: getVmByUuid } = useVmCollection()
+const { currentRoute } = useRouter()
 
-const vm = computed(() =>
-  getVmByUuid(currentRoute.value.params.uuid as XenApiVm["uuid"])
-);
+const vm = computed(() => getVmByUuid(currentRoute.value.params.uuid as XenApiVm['uuid']))
 
-const name = computed(() => vm.value?.name_label);
+const name = computed(() => vm.value?.name_label)
 </script>
 
 <style lang="postcss">
diff --git a/@xen-orchestra/lite/src/components/vm/VmTabBar.vue b/@xen-orchestra/lite/src/components/vm/VmTabBar.vue
index 20cedd26908..50330924fe6 100644
--- a/@xen-orchestra/lite/src/components/vm/VmTabBar.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmTabBar.vue
@@ -1,37 +1,37 @@
 <template>
   <UiTabBar>
     <RouterTab :to="{ name: 'vm.dashboard', params: { uuid } }">
-      {{ $t("dashboard") }}
+      {{ $t('dashboard') }}
     </RouterTab>
     <RouterTab :to="{ name: 'vm.console', params: { uuid } }">
-      {{ $t("console") }}
+      {{ $t('console') }}
     </RouterTab>
     <RouterTab :to="{ name: 'vm.alarms', params: { uuid } }">
-      {{ $t("alarms") }}
+      {{ $t('alarms') }}
     </RouterTab>
     <RouterTab :to="{ name: 'vm.stats', params: { uuid } }">
-      {{ $t("stats") }}
+      {{ $t('stats') }}
     </RouterTab>
     <RouterTab :to="{ name: 'vm.system', params: { uuid } }">
-      {{ $t("system") }}
+      {{ $t('system') }}
     </RouterTab>
     <RouterTab :to="{ name: 'vm.network', params: { uuid } }">
-      {{ $t("network") }}
+      {{ $t('network') }}
     </RouterTab>
     <RouterTab :to="{ name: 'vm.storage', params: { uuid } }">
-      {{ $t("storage") }}
+      {{ $t('storage') }}
     </RouterTab>
     <RouterTab :to="{ name: 'vm.tasks', params: { uuid } }">
-      {{ $t("tasks") }}
+      {{ $t('tasks') }}
     </RouterTab>
   </UiTabBar>
 </template>
 
 <script lang="ts" setup>
-import RouterTab from "@/components/RouterTab.vue";
-import UiTabBar from "@/components/ui/UiTabBar.vue";
+import RouterTab from '@/components/RouterTab.vue'
+import UiTabBar from '@/components/ui/UiTabBar.vue'
 
 defineProps<{
-  uuid: string;
-}>();
+  uuid: string
+}>()
 </script>
diff --git a/@xen-orchestra/lite/src/components/vm/VmsActionsBar.vue b/@xen-orchestra/lite/src/components/vm/VmsActionsBar.vue
index f4cc361d0e7..ea82ab21f71 100644
--- a/@xen-orchestra/lite/src/components/vm/VmsActionsBar.vue
+++ b/@xen-orchestra/lite/src/components/vm/VmsActionsBar.vue
@@ -10,7 +10,7 @@
       <UiButton :active="isOpen" :icon="faEllipsis" transparent @click="open" />
     </template>
     <MenuItem :icon="faPowerOff">
-      {{ $t("change-state") }}
+      {{ $t('change-state') }}
       <template #submenu>
         <VmActionPowerStateItems :vm-refs="selectedRefs" />
       </template>
@@ -18,7 +18,7 @@
     <VmActionMigrateItem :selected-refs="selectedRefs" />
     <VmActionCopyItem :selected-refs="selectedRefs" />
     <MenuItem v-tooltip="$t('coming-soon')" :icon="faEdit">
-      {{ $t("edit-config") }}
+      {{ $t('edit-config') }}
     </MenuItem>
     <VmActionSnapshotItem :vm-refs="selectedRefs" />
     <VmActionExportItems :vm-refs="selectedRefs" />
@@ -27,31 +27,27 @@
 </template>
 
 <script lang="ts" setup>
-import AppMenu from "@/components/menu/AppMenu.vue";
-import MenuItem from "@/components/menu/MenuItem.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import VmActionCopyItem from "@/components/vm/VmActionItems/VmActionCopyItem.vue";
-import VmActionDeleteItem from "@/components/vm/VmActionItems/VmActionDeleteItem.vue";
-import VmActionExportItems from "@/components/vm/VmActionItems/VmActionExportItems.vue";
-import VmActionMigrateItem from "@/components/vm/VmActionItems/VmActionMigrateItem.vue";
-import VmActionPowerStateItems from "@/components/vm/VmActionItems/VmActionPowerStateItems.vue";
-import VmActionSnapshotItem from "@/components/vm/VmActionItems/VmActionSnapshotItem.vue";
-import { vTooltip } from "@/directives/tooltip.directive";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { useUiStore } from "@/stores/ui.store";
-import {
-  faEdit,
-  faEllipsis,
-  faPowerOff,
-} from "@fortawesome/free-solid-svg-icons";
-import { storeToRefs } from "pinia";
+import AppMenu from '@/components/menu/AppMenu.vue'
+import MenuItem from '@/components/menu/MenuItem.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import VmActionCopyItem from '@/components/vm/VmActionItems/VmActionCopyItem.vue'
+import VmActionDeleteItem from '@/components/vm/VmActionItems/VmActionDeleteItem.vue'
+import VmActionExportItems from '@/components/vm/VmActionItems/VmActionExportItems.vue'
+import VmActionMigrateItem from '@/components/vm/VmActionItems/VmActionMigrateItem.vue'
+import VmActionPowerStateItems from '@/components/vm/VmActionItems/VmActionPowerStateItems.vue'
+import VmActionSnapshotItem from '@/components/vm/VmActionItems/VmActionSnapshotItem.vue'
+import { vTooltip } from '@/directives/tooltip.directive'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { useUiStore } from '@/stores/ui.store'
+import { faEdit, faEllipsis, faPowerOff } from '@fortawesome/free-solid-svg-icons'
+import { storeToRefs } from 'pinia'
 
 defineProps<{
-  disabled?: boolean;
-  selectedRefs: XenApiVm["$ref"][];
-}>();
+  disabled?: boolean
+  selectedRefs: XenApiVm['$ref'][]
+}>()
 
-const { isMobile } = storeToRefs(useUiStore());
+const { isMobile } = storeToRefs(useUiStore())
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/composables/array-removed-items-history.composable.md b/@xen-orchestra/lite/src/composables/array-removed-items-history.composable.md
index d313447d6de..6e8118a3235 100644
--- a/@xen-orchestra/lite/src/composables/array-removed-items-history.composable.md
+++ b/@xen-orchestra/lite/src/composables/array-removed-items-history.composable.md
@@ -5,28 +5,28 @@ This composable allows you to keep a history of each removed item of an array.
 ## Usage
 
 ```typescript
-const myArray = ref([]);
-const history = useArrayRemovedItemsHistory(myArray);
+const myArray = ref([])
+const history = useArrayRemovedItemsHistory(myArray)
 
-myArray.push("A"); // myArray = ['A']; history = []
-myArray.push("B"); // myArray = ['A', 'B']; history = []
-myArray.shift(); // myArray = ['B']; history = ['A']
+myArray.push('A') // myArray = ['A']; history = []
+myArray.push('B') // myArray = ['A', 'B']; history = []
+myArray.shift() // myArray = ['B']; history = ['A']
 ```
 
 You can limit the number of items to keep in history:
 
 ```typescript
-const myArray = ref([]);
-const history = useArrayRemovedItemsHistory(myArray, 30);
+const myArray = ref([])
+const history = useArrayRemovedItemsHistory(myArray, 30)
 ```
 
 Be careful when using an array of objects which is likely to be replaced (instead of being altered):
 
 ```typescript
-const myArray = ref([]);
-const history = useArrayRemovedItemsHistory(myArray);
-myArray.value = [{ id: "foo" }, { id: "bar" }];
-myArray.value = [{ id: "bar" }, { id: "baz" }]; // history = [{ id: 'foo' }, { id: 'bar' }]
+const myArray = ref([])
+const history = useArrayRemovedItemsHistory(myArray)
+myArray.value = [{ id: 'foo' }, { id: 'bar' }]
+myArray.value = [{ id: 'bar' }, { id: 'baz' }] // history = [{ id: 'foo' }, { id: 'bar' }]
 ```
 
 In this case, `{ id: 'bar' }` is detected as removed since in JavaScript `{ id: 'bar' } !== { id: 'bar' }`.
@@ -34,12 +34,8 @@ In this case, `{ id: 'bar' }` is detected as removed since in JavaScript `{ id:
 You must therefore use an identity function as third parameter to return the value to be used to detect deletion:
 
 ```typescript
-const myArray = ref<{ id: string }[]>([]);
-const history = useArrayRemovedItemsHistory(
-  myArray,
-  undefined,
-  (item) => item.id
-);
-myArray.value = [{ id: "foo" }, { id: "bar" }];
-myArray.value = [{ id: "bar" }, { id: "baz" }]; // history = [{ id: 'foo' }]
+const myArray = ref<{ id: string }[]>([])
+const history = useArrayRemovedItemsHistory(myArray, undefined, item => item.id)
+myArray.value = [{ id: 'foo' }, { id: 'bar' }]
+myArray.value = [{ id: 'bar' }, { id: 'baz' }] // history = [{ id: 'foo' }]
 ```
diff --git a/@xen-orchestra/lite/src/composables/array-removed-items-history.composable.ts b/@xen-orchestra/lite/src/composables/array-removed-items-history.composable.ts
index f318f2f0f24..a3fcfafeabc 100644
--- a/@xen-orchestra/lite/src/composables/array-removed-items-history.composable.ts
+++ b/@xen-orchestra/lite/src/composables/array-removed-items-history.composable.ts
@@ -1,35 +1,35 @@
-import type { MaybeRef } from "@vueuse/core";
-import { differenceBy } from "lodash-es";
-import { type Ref, ref, unref, watch } from "vue";
+import type { MaybeRef } from '@vueuse/core'
+import { differenceBy } from 'lodash-es'
+import { type Ref, ref, unref, watch } from 'vue'
 
 export default function useArrayRemovedItemsHistory<T>(
   list: Ref<T[]>,
-  iteratee: (item: T) => unknown = (item) => item,
+  iteratee: (item: T) => unknown = item => item,
   options: {
-    limit?: MaybeRef<number>;
-    onRemove?: (items: T[]) => any[];
+    limit?: MaybeRef<number>
+    onRemove?: (items: T[]) => any[]
   } = {}
 ) {
-  const currentList: Ref<T[]> = ref([]);
-  const history: Ref<T[]> = ref([]);
-  const { limit = Infinity, onRemove = (items) => items } = options;
+  const currentList: Ref<T[]> = ref([])
+  const history: Ref<T[]> = ref([])
+  const { limit = Infinity, onRemove = items => items } = options
 
   watch(
     list,
-    (updatedList) => {
-      currentList.value = [...updatedList];
+    updatedList => {
+      currentList.value = [...updatedList]
     },
     { deep: true }
-  );
+  )
 
   watch(currentList, (nextList, previousList) => {
-    const removedItems = differenceBy(previousList, nextList, iteratee);
-    history.value.push(...onRemove(removedItems));
-    const currentLimit = unref(limit);
+    const removedItems = differenceBy(previousList, nextList, iteratee)
+    history.value.push(...onRemove(removedItems))
+    const currentLimit = unref(limit)
     if (history.value.length > currentLimit) {
-      history.value = history.value.slice(-currentLimit);
+      history.value = history.value.slice(-currentLimit)
     }
-  });
+  })
 
-  return history;
+  return history
 }
diff --git a/@xen-orchestra/lite/src/composables/busy.composable.md b/@xen-orchestra/lite/src/composables/busy.composable.md
index 29d4ba89423..aa8ea3be4dc 100644
--- a/@xen-orchestra/lite/src/composables/busy.composable.md
+++ b/@xen-orchestra/lite/src/composables/busy.composable.md
@@ -7,16 +7,16 @@
 </template>
 
 <script lang="ts" setup>
-import useBusy from "@/composables/busy.composable";
+import useBusy from '@/composables/busy.composable'
 
 async function doSomething() {
   try {
     // Doing some async work
   } catch (e) {
-    throw "Something bad happened";
+    throw 'Something bad happened'
   }
 }
 
-const { isBusy, error, run } = useBusy(doSomething);
+const { isBusy, error, run } = useBusy(doSomething)
 </script>
 ```
diff --git a/@xen-orchestra/lite/src/composables/busy.composable.ts b/@xen-orchestra/lite/src/composables/busy.composable.ts
index ee7fd7cb9f4..22427bbfed1 100644
--- a/@xen-orchestra/lite/src/composables/busy.composable.ts
+++ b/@xen-orchestra/lite/src/composables/busy.composable.ts
@@ -1,26 +1,26 @@
-import { ref } from "vue";
+import { ref } from 'vue'
 
 export default function useBusy<T extends (...args: any[]) => any>(func: T) {
-  const isBusy = ref(false);
-  const error = ref<any>();
+  const isBusy = ref(false)
+  const error = ref<any>()
 
   const run = async (...args: Parameters<T>): Promise<ReturnType<T>> => {
-    error.value = undefined;
-    isBusy.value = true;
+    error.value = undefined
+    isBusy.value = true
 
     try {
-      return await func(...args);
+      return await func(...args)
     } catch (_error) {
-      error.value = _error;
-      throw _error;
+      error.value = _error
+      throw _error
     } finally {
-      isBusy.value = false;
+      isBusy.value = false
     }
-  };
+  }
 
   return {
     isBusy,
     error,
     run,
-  };
+  }
 }
diff --git a/@xen-orchestra/lite/src/composables/chart-theme.composable.ts b/@xen-orchestra/lite/src/composables/chart-theme.composable.ts
index 9487518e470..38bc2b8e0e8 100644
--- a/@xen-orchestra/lite/src/composables/chart-theme.composable.ts
+++ b/@xen-orchestra/lite/src/composables/chart-theme.composable.ts
@@ -1,24 +1,24 @@
-import { useUiStore } from "@/stores/ui.store";
-import { storeToRefs } from "pinia";
-import { computed, provide, ref, watch } from "vue";
-import { THEME_KEY } from "vue-echarts";
+import { useUiStore } from '@/stores/ui.store'
+import { storeToRefs } from 'pinia'
+import { computed, provide, ref, watch } from 'vue'
+import { THEME_KEY } from 'vue-echarts'
 
 export const useChartTheme = () => {
-  const { colorMode } = storeToRefs(useUiStore());
+  const { colorMode } = storeToRefs(useUiStore())
 
-  const style = window.getComputedStyle(window.document.documentElement);
+  const style = window.getComputedStyle(window.document.documentElement)
 
   const getColors = () => ({
-    background: style.getPropertyValue("--background-color-primary"),
-    text: style.getPropertyValue("--color-blue-scale-300"),
-    splitLine: style.getPropertyValue("--color-blue-scale-400"),
-    primary: style.getPropertyValue("--color-extra-blue-base"),
-    secondary: style.getPropertyValue("--color-orange-world-base"),
-  });
+    background: style.getPropertyValue('--background-color-primary'),
+    text: style.getPropertyValue('--color-blue-scale-300'),
+    splitLine: style.getPropertyValue('--color-blue-scale-400'),
+    primary: style.getPropertyValue('--color-extra-blue-base'),
+    secondary: style.getPropertyValue('--color-orange-world-base'),
+  })
 
-  const colors = ref(getColors());
+  const colors = ref(getColors())
 
-  watch(colorMode, () => (colors.value = getColors()), { flush: "post" });
+  watch(colorMode, () => (colors.value = getColors()), { flush: 'post' })
 
   provide(
     THEME_KEY,
@@ -40,7 +40,7 @@ export const useChartTheme = () => {
         },
         showSymbol: false,
         symbolSize: 10,
-        symbol: "circle",
+        symbol: 'circle',
         smooth: false,
       },
       radar: {
@@ -51,127 +51,120 @@ export const useChartTheme = () => {
           width: 2,
         },
         symbolSize: 10,
-        symbol: "circle",
+        symbol: 'circle',
         smooth: false,
       },
       bar: {
         itemStyle: {
           barBorderWidth: 0,
-          barBorderColor: "#cccccc",
+          barBorderColor: '#cccccc',
         },
       },
       pie: {
         itemStyle: {
           borderWidth: 0,
-          borderColor: "#cccccc",
+          borderColor: '#cccccc',
         },
       },
       scatter: {
         itemStyle: {
           borderWidth: 0,
-          borderColor: "#cccccc",
+          borderColor: '#cccccc',
         },
       },
       boxplot: {
         itemStyle: {
           borderWidth: 0,
-          borderColor: "#cccccc",
+          borderColor: '#cccccc',
         },
       },
       parallel: {
         itemStyle: {
           borderWidth: 0,
-          borderColor: "#cccccc",
+          borderColor: '#cccccc',
         },
       },
       sankey: {
         itemStyle: {
           borderWidth: 0,
-          borderColor: "#cccccc",
+          borderColor: '#cccccc',
         },
       },
       funnel: {
         itemStyle: {
           borderWidth: 0,
-          borderColor: "#cccccc",
+          borderColor: '#cccccc',
         },
       },
       gauge: {
         itemStyle: {
           borderWidth: 0,
-          borderColor: "#cccccc",
+          borderColor: '#cccccc',
         },
       },
       candlestick: {
         itemStyle: {
-          color: "#eb8146",
-          color0: "transparent",
-          borderColor: "#d95850",
-          borderColor0: "#58c470",
-          borderWidth: "2",
+          color: '#eb8146',
+          color0: 'transparent',
+          borderColor: '#d95850',
+          borderColor0: '#58c470',
+          borderWidth: '2',
         },
       },
       graph: {
         itemStyle: {
           borderWidth: 0,
-          borderColor: "#cccccc",
+          borderColor: '#cccccc',
         },
         lineStyle: {
           width: 1,
-          color: "#aaaaaa",
+          color: '#aaaaaa',
         },
-        symbolSize: "10",
-        symbol: "emptyArrow",
+        symbolSize: '10',
+        symbol: 'emptyArrow',
         smooth: true,
-        color: [
-          "#893448",
-          "#d95850",
-          "#eb8146",
-          "#ffb248",
-          "#f2d643",
-          "#ebdba4",
-        ],
+        color: ['#893448', '#d95850', '#eb8146', '#ffb248', '#f2d643', '#ebdba4'],
         label: {
-          color: "#ffffff",
+          color: '#ffffff',
         },
       },
       map: {
         itemStyle: {
-          areaColor: "#f3f3f3",
-          borderColor: "#999999",
+          areaColor: '#f3f3f3',
+          borderColor: '#999999',
           borderWidth: 0.5,
         },
         label: {
-          color: "#893448",
+          color: '#893448',
         },
         emphasis: {
           itemStyle: {
-            areaColor: "#ffb248",
-            borderColor: "#eb8146",
+            areaColor: '#ffb248',
+            borderColor: '#eb8146',
             borderWidth: 1,
           },
           label: {
-            color: "#893448",
+            color: '#893448',
           },
         },
       },
       geo: {
         itemStyle: {
-          areaColor: "#f3f3f3",
-          borderColor: "#999999",
+          areaColor: '#f3f3f3',
+          borderColor: '#999999',
           borderWidth: 0.5,
         },
         label: {
-          color: "#893448",
+          color: '#893448',
         },
         emphasis: {
           itemStyle: {
-            areaColor: "#ffb248",
-            borderColor: "#eb8146",
+            areaColor: '#ffb248',
+            borderColor: '#eb8146',
             borderWidth: 1,
           },
           label: {
-            color: "#893448",
+            color: '#893448',
           },
         },
       },
@@ -179,18 +172,18 @@ export const useChartTheme = () => {
         axisLine: {
           show: true,
           lineStyle: {
-            color: "#aaaaaa",
+            color: '#aaaaaa',
           },
         },
         axisTick: {
           show: false,
           lineStyle: {
-            color: "#333",
+            color: '#333',
           },
         },
         axisLabel: {
           show: true,
-          color: "#999999",
+          color: '#999999',
         },
         splitLine: {
           show: true,
@@ -201,7 +194,7 @@ export const useChartTheme = () => {
         splitArea: {
           show: false,
           areaStyle: {
-            color: ["rgba(250,250,250,0.05)", "rgba(200,200,200,0.02)"],
+            color: ['rgba(250,250,250,0.05)', 'rgba(200,200,200,0.02)'],
           },
         },
       },
@@ -231,7 +224,7 @@ export const useChartTheme = () => {
         splitArea: {
           show: false,
           areaStyle: {
-            color: ["rgba(250,250,250,0.05)", "rgba(200,200,200,0.02)"],
+            color: ['rgba(250,250,250,0.05)', 'rgba(200,200,200,0.02)'],
           },
         },
       },
@@ -239,18 +232,18 @@ export const useChartTheme = () => {
         axisLine: {
           show: true,
           lineStyle: {
-            color: "#aaaaaa",
+            color: '#aaaaaa',
           },
         },
         axisTick: {
           show: false,
           lineStyle: {
-            color: "#333",
+            color: '#333',
           },
         },
         axisLabel: {
           show: true,
-          color: "#999999",
+          color: '#999999',
         },
         splitLine: {
           show: true,
@@ -261,7 +254,7 @@ export const useChartTheme = () => {
         splitArea: {
           show: false,
           areaStyle: {
-            color: ["rgba(250,250,250,0.05)", "rgba(200,200,200,0.02)"],
+            color: ['rgba(250,250,250,0.05)', 'rgba(200,200,200,0.02)'],
           },
         },
       },
@@ -285,112 +278,105 @@ export const useChartTheme = () => {
         splitLine: {
           show: true,
           lineStyle: {
-            type: "dashed",
+            type: 'dashed',
             color: [colors.value.splitLine],
           },
         },
         splitArea: {
           show: false,
           areaStyle: {
-            color: ["rgba(250,250,250,0.05)", "rgba(200,200,200,0.02)"],
+            color: ['rgba(250,250,250,0.05)', 'rgba(200,200,200,0.02)'],
           },
         },
       },
       toolbox: {
         iconStyle: {
-          borderColor: "#999999",
+          borderColor: '#999999',
         },
         emphasis: {
           iconStyle: {
-            borderColor: "#666666",
+            borderColor: '#666666',
           },
         },
       },
       legend: {
-        left: "right",
-        top: "bottom",
+        left: 'right',
+        top: 'bottom',
         textStyle: {
           color: colors.value.text,
         },
       },
       tooltip: {
-        trigger: "axis",
+        trigger: 'axis',
         axisPointer: {
           lineStyle: {
-            color: "#8F84FF",
+            color: '#8F84FF',
             width: 1,
           },
           crossStyle: {
-            color: "#8F84FF",
+            color: '#8F84FF',
             width: 1,
           },
         },
       },
       timeline: {
         lineStyle: {
-          color: "#893448",
+          color: '#893448',
           width: 1,
         },
         itemStyle: {
-          color: "#893448",
+          color: '#893448',
           borderWidth: 1,
         },
         controlStyle: {
-          color: "#893448",
-          borderColor: "#893448",
+          color: '#893448',
+          borderColor: '#893448',
           borderWidth: 0.5,
         },
         checkpointStyle: {
-          color: "#eb8146",
-          borderColor: "#ffb248",
+          color: '#eb8146',
+          borderColor: '#ffb248',
         },
         label: {
-          color: "#893448",
+          color: '#893448',
         },
         emphasis: {
           itemStyle: {
-            color: "#ffb248",
+            color: '#ffb248',
           },
           controlStyle: {
-            color: "#893448",
-            borderColor: "#893448",
+            color: '#893448',
+            borderColor: '#893448',
             borderWidth: 0.5,
           },
           label: {
-            color: "#893448",
+            color: '#893448',
           },
         },
       },
       visualMap: {
-        color: [
-          "#893448",
-          "#d95850",
-          "#eb8146",
-          "#ffb248",
-          "#f2d643",
-          "rgb(247,238,173)",
-        ],
+        color: ['#893448', '#d95850', '#eb8146', '#ffb248', '#f2d643', 'rgb(247,238,173)'],
       },
       dataZoom: {
-        backgroundColor: "rgba(255,255,255,0)",
-        dataBackgroundColor: "rgba(255,178,72,0.5)",
-        fillerColor: "rgba(255,178,72,0.15)",
-        handleColor: "#ffb248",
-        handleSize: "100%",
+        backgroundColor: 'rgba(255,255,255,0)',
+        dataBackgroundColor: 'rgba(255,178,72,0.5)',
+        fillerColor: 'rgba(255,178,72,0.15)',
+        handleColor: '#ffb248',
+        handleSize: '100%',
         textStyle: {
-          color: "#333",
+          color: '#333',
         },
       },
       markPoint: {
         label: {
-          color: "#ffffff",
+          color: '#ffffff',
         },
         emphasis: {
           label: {
-            color: "#ffffff",
+            color: '#ffffff',
           },
         },
       },
     }))
-  );
-};
+  )
+}
diff --git a/@xen-orchestra/lite/src/composables/collection-filter.composable.md b/@xen-orchestra/lite/src/composables/collection-filter.composable.md
index ac028e3cf92..f8ddc4eefe3 100644
--- a/@xen-orchestra/lite/src/composables/collection-filter.composable.md
+++ b/@xen-orchestra/lite/src/composables/collection-filter.composable.md
@@ -3,12 +3,11 @@
 ## Usage
 
 ```typescript
-const { filters, addFilter, removeFilter, predicate } =
-  useCollectionFilter(options);
+const { filters, addFilter, removeFilter, predicate } = useCollectionFilter(options)
 
-const filteredCollection = computed(() => myCollection.filter(predicate));
-addFilter("name:/^Foo/");
-addFilter("count:>3");
+const filteredCollection = computed(() => myCollection.filter(predicate))
+addFilter('name:/^Foo/')
+addFilter('count:>3')
 ```
 
 ## Options
@@ -18,8 +17,8 @@ addFilter("count:>3");
 This option allows to activate the URL Query String support.
 
 ```typescript
-const { addFilter } = useCollectionFilter({ queryStringParam: "filter" });
-addFilter("name:/^foo/i"); // Will update the URL with ?filter=name:/^foo/i
+const { addFilter } = useCollectionFilter({ queryStringParam: 'filter' })
+addFilter('name:/^foo/i') // Will update the URL with ?filter=name:/^foo/i
 ```
 
 ### Initial filters
@@ -29,7 +28,7 @@ This option allows to set some initial filters.
 ```typescript
 const {
   /* ... */
-} = useCollectionFilter({ initialFilters: ["!name_label:foobar"] });
+} = useCollectionFilter({ initialFilters: ['!name_label:foobar'] })
 ```
 
 When using the `initialFilters` option with the `queryStringParam` option,
@@ -50,27 +49,27 @@ When using the `initialFilters` option with the `queryStringParam` option,
 </template>
 
 <script lang="ts" setup>
-import CollectionFilter from "@/components/CollectionFilter.vue";
-import useCollectionFilter from "@/composables/collection-filter.composable";
-import { computed } from "vue";
+import CollectionFilter from '@/components/CollectionFilter.vue'
+import useCollectionFilter from '@/composables/collection-filter.composable'
+import { computed } from 'vue'
 
 const collection = [
-  { name: "Foo", age: 5, registered: true },
-  { name: "Bar", age: 12, registered: false },
-  { name: "Foo Bar", age: 2, registered: true },
-  { name: "Bar Baz", age: 45, registered: false },
-  { name: "Foo Baz", age: 32, registered: false },
-  { name: "Foo Bar Baz", age: 32, registered: true },
-];
+  { name: 'Foo', age: 5, registered: true },
+  { name: 'Bar', age: 12, registered: false },
+  { name: 'Foo Bar', age: 2, registered: true },
+  { name: 'Bar Baz', age: 45, registered: false },
+  { name: 'Foo Baz', age: 32, registered: false },
+  { name: 'Foo Bar Baz', age: 32, registered: true },
+]
 
 const availableFilters: AvailableFilter[] = [
-  { property: "name", label: "Name", type: "string" },
-  { property: "age", label: "Age", type: "number" },
-  { property: "registered", label: "Registered", type: "boolean", icon: faKey },
-];
+  { property: 'name', label: 'Name', type: 'string' },
+  { property: 'age', label: 'Age', type: 'number' },
+  { property: 'registered', label: 'Registered', type: 'boolean', icon: faKey },
+]
 
-const { filters, addFilter, removeFilter, predicate } = useCollectionFilter();
+const { filters, addFilter, removeFilter, predicate } = useCollectionFilter()
 
-const filteredCollection = computed(() => collection.filter(predicate));
+const filteredCollection = computed(() => collection.filter(predicate))
 </script>
 ```
diff --git a/@xen-orchestra/lite/src/composables/collection-filter.composable.ts b/@xen-orchestra/lite/src/composables/collection-filter.composable.ts
index 17c1c36e504..99d4d4faed5 100644
--- a/@xen-orchestra/lite/src/composables/collection-filter.composable.ts
+++ b/@xen-orchestra/lite/src/composables/collection-filter.composable.ts
@@ -1,66 +1,64 @@
-import { getFirst } from "@/libs/utils";
-import * as CM from "complex-matcher";
-import { computed, ref, watch } from "vue";
-import { type LocationQueryValue, useRoute, useRouter } from "vue-router";
+import { getFirst } from '@/libs/utils'
+import * as CM from 'complex-matcher'
+import { computed, ref, watch } from 'vue'
+import { type LocationQueryValue, useRoute, useRouter } from 'vue-router'
 
 interface Config {
-  queryStringParam?: string;
-  initialFilters?: string[];
+  queryStringParam?: string
+  initialFilters?: string[]
 }
 
 export default function useCollectionFilter<T>(config: Config = {}) {
-  const route = useRoute();
-  const router = useRouter();
-  const { queryStringParam, initialFilters = [] } = config;
-  const filtersSet = ref<Set<string>>(new Set(initialFilters));
-  const filters = computed(() => Array.from(filtersSet.value.values()));
+  const route = useRoute()
+  const router = useRouter()
+  const { queryStringParam, initialFilters = [] } = config
+  const filtersSet = ref<Set<string>>(new Set(initialFilters))
+  const filters = computed(() => Array.from(filtersSet.value.values()))
 
   if (queryStringParam !== undefined) {
-    const queryString = route.query[queryStringParam];
+    const queryString = route.query[queryStringParam]
 
     if (queryString !== undefined) {
-      filtersSet.value = queryToSet(getFirst(queryString));
+      filtersSet.value = queryToSet(getFirst(queryString))
     }
 
-    watch(filters, (value) =>
+    watch(filters, value =>
       router.replace({
-        query: { ...route.query, [queryStringParam]: value.join(" ") },
+        query: { ...route.query, [queryStringParam]: value.join(' ') },
       })
-    );
+    )
   }
 
   const addFilter = (filter: string) => {
-    filtersSet.value.add(filter);
-  };
+    filtersSet.value.add(filter)
+  }
 
   const removeFilter = (filter: string) => {
-    filtersSet.value.delete(filter);
-  };
+    filtersSet.value.delete(filter)
+  }
 
   const predicate = computed<(value: T) => boolean>(() => {
-    return CM.parse(
-      Array.from(filters.value.values()).join(" ")
-    ).createPredicate();
-  });
+    return CM.parse(Array.from(filters.value.values()).join(' ')).createPredicate()
+  })
 
   return {
     filters,
     addFilter,
     removeFilter,
     predicate,
-  };
+  }
 }
 
 function queryToSet(query?: LocationQueryValue): Set<string> {
   if (!query) {
-    return new Set();
+    return new Set()
   }
 
-  const rootNode = CM.parse(query);
+  const rootNode = CM.parse(query)
 
   if (rootNode instanceof CM.And) {
-    return new Set(rootNode.children.map((child) => child.toString()));
+    return new Set(rootNode.children.map(child => child.toString()))
   } else {
-    return new Set([rootNode.toString()]);
+    return new Set([rootNode.toString()])
   }
 }
diff --git a/@xen-orchestra/lite/src/composables/collection-sorter.composable.md b/@xen-orchestra/lite/src/composables/collection-sorter.composable.md
index 5b03ec84949..246bd5479d5 100644
--- a/@xen-orchestra/lite/src/composables/collection-sorter.composable.md
+++ b/@xen-orchestra/lite/src/composables/collection-sorter.composable.md
@@ -3,12 +3,11 @@
 ## Usage
 
 ```typescript
-const { sorts, addSort, removeSort, compareFn, toggleSortDirection } =
-  useCollectionSorter(options);
+const { sorts, addSort, removeSort, compareFn, toggleSortDirection } = useCollectionSorter(options)
 
-const sortedCollection = computed(() => myCollection.sort(compareFn));
-addSort("name", true);
-addSort("age", false);
+const sortedCollection = computed(() => myCollection.sort(compareFn))
+addSort('name', true)
+addSort('age', false)
 ```
 
 ## Options
@@ -18,8 +17,8 @@ addSort("age", false);
 This option allows to activate the URL Query String support.
 
 ```typescript
-const { addSort } = useCollectionSorter({ queryStringParam: "sort" });
-addSort("name", true); // Will update the URL with ?sort=name:1
+const { addSort } = useCollectionSorter({ queryStringParam: 'sort' })
+addSort('name', true) // Will update the URL with ?sort=name:1
 ```
 
 ### Initial sorts
@@ -32,8 +31,8 @@ Use `key` for ascending sort and `-key` for descending sort.
 const {
   /* ... */
 } = useCollectionSorter({
-  initialSorts: ["name", "-age"],
-});
+  initialSorts: ['name', '-age'],
+})
 ```
 
 When using the `initialSorts` option with the `queryStringParam` option,
diff --git a/@xen-orchestra/lite/src/composables/collection-sorter.composable.ts b/@xen-orchestra/lite/src/composables/collection-sorter.composable.ts
index cc1893ba43c..ced00b7ee66 100644
--- a/@xen-orchestra/lite/src/composables/collection-sorter.composable.ts
+++ b/@xen-orchestra/lite/src/composables/collection-sorter.composable.ts
@@ -1,68 +1,68 @@
-import { getFirst } from "@/libs/utils";
-import type { ActiveSorts, InitialSorts, SortConfig } from "@/types/sort";
-import { computed, ref, watch } from "vue";
-import { type LocationQueryValue, useRoute, useRouter } from "vue-router";
+import { getFirst } from '@/libs/utils'
+import type { ActiveSorts, InitialSorts, SortConfig } from '@/types/sort'
+import { computed, ref, watch } from 'vue'
+import { type LocationQueryValue, useRoute, useRouter } from 'vue-router'
 
 export default function useCollectionSorter<T>(config: SortConfig<T> = {}) {
-  const route = useRoute();
-  const router = useRouter();
-  const { queryStringParam, initialSorts = [] } = config;
-  const sorts = ref<ActiveSorts<T>>(parseInitialSorts(initialSorts));
+  const route = useRoute()
+  const router = useRouter()
+  const { queryStringParam, initialSorts = [] } = config
+  const sorts = ref<ActiveSorts<T>>(parseInitialSorts(initialSorts))
 
   const sortsAsString = computed(() =>
     Array.from(sorts.value)
-      .map(([property, isAsc]) => `${String(property)}:${isAsc ? "1" : "0"}`)
-      .join(",")
-  );
+      .map(([property, isAsc]) => `${String(property)}:${isAsc ? '1' : '0'}`)
+      .join(',')
+  )
 
   if (queryStringParam !== undefined) {
-    const queryString = route.query[queryStringParam];
+    const queryString = route.query[queryStringParam]
 
     if (queryString !== undefined) {
-      sorts.value = queryToMap(getFirst(queryString));
+      sorts.value = queryToMap(getFirst(queryString))
     }
 
-    watch(sortsAsString, (value) =>
+    watch(sortsAsString, value =>
       router.replace({
         query: { ...route.query, [queryStringParam]: value },
       })
-    );
+    )
   }
 
   const addSort = (property: keyof T, isAscending: boolean) => {
-    sorts.value.set(property, isAscending);
-  };
+    sorts.value.set(property, isAscending)
+  }
 
   const removeSort = (property: keyof T) => {
-    sorts.value.delete(property);
-  };
+    sorts.value.delete(property)
+  }
 
   const toggleSortDirection = (property: keyof T) => {
     if (!sorts.value.has(property)) {
-      return;
+      return
     }
 
-    sorts.value.set(property, !sorts.value.get(property));
-  };
+    sorts.value.set(property, !sorts.value.get(property))
+  }
 
   const compareFn = computed(() => {
     return (record1: T, record2: T) => {
       for (const [property, isAscending] of sorts.value) {
-        const value1 = record1[property];
-        const value2 = record2[property];
+        const value1 = record1[property]
+        const value2 = record2[property]
 
         if (value1 < value2) {
-          return isAscending ? -1 : 1;
+          return isAscending ? -1 : 1
         }
 
         if (value1 > value2) {
-          return isAscending ? 1 : -1;
+          return isAscending ? 1 : -1
         }
       }
 
-      return 0;
-    };
-  });
+      return 0
+    }
+  })
 
   return {
     sorts,
@@ -70,29 +70,29 @@ export default function useCollectionSorter<T>(config: SortConfig<T> = {}) {
     removeSort,
     toggleSortDirection,
     compareFn,
-  };
+  }
 }
 
 function queryToMap(query?: LocationQueryValue) {
   if (!query) {
-    return new Map();
+    return new Map()
   }
 
   return new Map(
-    query.split(",").map((sortRaw): [string, boolean] => {
-      const [property, isAscending] = sortRaw.split(":");
-      return [property, isAscending === "1"];
+    query.split(',').map((sortRaw): [string, boolean] => {
+      const [property, isAscending] = sortRaw.split(':')
+      return [property, isAscending === '1']
     })
-  );
+  )
 }
 
 function parseInitialSorts<T>(sorts: InitialSorts<T>): ActiveSorts<T> {
   return new Map(
-    sorts.map((sort) => {
-      const isDescending = sort.startsWith("-");
-      const property = (isDescending ? sort.substring(1) : sort) as keyof T;
+    sorts.map(sort => {
+      const isDescending = sort.startsWith('-')
+      const property = (isDescending ? sort.substring(1) : sort) as keyof T
 
-      return [property, !isDescending];
+      return [property, !isDescending]
     })
-  );
+  )
 }
diff --git a/@xen-orchestra/lite/src/composables/context.composable.md b/@xen-orchestra/lite/src/composables/context.composable.md
index 07c0033ba6b..bd897207050 100644
--- a/@xen-orchestra/lite/src/composables/context.composable.md
+++ b/@xen-orchestra/lite/src/composables/context.composable.md
@@ -30,7 +30,7 @@ Each descendant has the ability to change the context value, affecting itself an
 ```ts
 // context.ts
 
-const CounterContext = createContext(0);
+const CounterContext = createContext(0)
 ```
 
 ### 2. Use the context
@@ -40,9 +40,9 @@ const CounterContext = createContext(0);
 You can get the current Context value by using `useContext(CounterContext)`.
 
 ```ts
-const counter = useContext(CounterContext);
+const counter = useContext(CounterContext)
 
-console.log(counter.value); // 0
+console.log(counter.value) // 0
 ```
 
 #### 2.2. Update
@@ -53,16 +53,16 @@ You can pass a `MaybeRefOrGetter` as second argument to update the context value
 // MyComponent.vue
 
 const props = defineProps<{
-  counter?: number;
-}>();
+  counter?: number
+}>()
 
-const counter = useContext(CounterContext, () => props.counter);
+const counter = useContext(CounterContext, () => props.counter)
 
 // When calling <MyComponent />
-console.log(counter.value); // 0
+console.log(counter.value) // 0
 
 // When calling <MyComponent :counter="20" />
-console.log(counter.value); // 20
+console.log(counter.value) // 20
 ```
 
 ## Advanced Context
@@ -75,13 +75,13 @@ To customize the context output, you can pass a custom context builder as the se
 // context.ts
 
 // Example 1. Return a object
-const CounterContext = createContext(10, (counter) => ({
+const CounterContext = createContext(10, counter => ({
   counter,
   isEven: computed(() => counter.value % 2 === 0),
-}));
+}))
 
 // Example 2. Return a computed value
-const DoubleContext = createContext(10, (num) => computed(() => num.value * 2));
+const DoubleContext = createContext(10, num => computed(() => num.value * 2))
 ```
 
 ### 2. Use the context
@@ -91,12 +91,12 @@ const DoubleContext = createContext(10, (num) => computed(() => num.value * 2));
 When using the context, it will return your custom value.
 
 ```ts
-const { counter, isEven } = useContext(CounterContext);
-const double = useContext(DoubleContext);
+const { counter, isEven } = useContext(CounterContext)
+const double = useContext(DoubleContext)
 
-console.log(counter.value); // 10
-console.log(isEven.value); // true
-console.log(double.value); // 20
+console.log(counter.value) // 10
+console.log(isEven.value) // true
+console.log(double.value) // 20
 ```
 
 #### 2.2. Update
@@ -105,15 +105,15 @@ Same as with a simple context, you can pass a `MaybeRefOrGetter` as second argum
 
 ```ts
 // Parent.vue
-useContext(CounterContext, 99);
-useContext(DoubleContext, 99);
+useContext(CounterContext, 99)
+useContext(DoubleContext, 99)
 
 // Child.vue
-const { isEven } = useContext(CounterContext);
-const double = useContext(DoubleContext);
+const { isEven } = useContext(CounterContext)
+const double = useContext(DoubleContext)
 
-console.log(isEven.value); // false
-console.log(double.value); // 198
+console.log(isEven.value) // false
+console.log(double.value) // 198
 ```
 
 ## Caveats (boolean props)
@@ -126,10 +126,10 @@ This could be problematic if the value comes from a `boolean` prop.
 
 ```ts
 const props = defineProps<{
-  disabled?: boolean;
-}>();
+  disabled?: boolean
+}>()
 
-useContext(MyBooleanContext, () => props.disabled); // Update to `false` if `undefined`
+useContext(MyBooleanContext, () => props.disabled) // Update to `false` if `undefined`
 ```
 
 In that case, Vue will automatically set the default value for `disabled` prop to `false`.
@@ -143,10 +143,10 @@ to `undefined`:
 ```ts
 const props = withDefaults(
   defineProps<{
-    disabled?: boolean;
+    disabled?: boolean
   }>(),
   { disabled: undefined }
-);
+)
 
-useContext(MyBoolean, () => props.disabled); // Keep parent value if `undefined`
+useContext(MyBoolean, () => props.disabled) // Keep parent value if `undefined`
 ```
diff --git a/@xen-orchestra/lite/src/composables/context.composable.ts b/@xen-orchestra/lite/src/composables/context.composable.ts
index 9614516db7c..341b03eb674 100644
--- a/@xen-orchestra/lite/src/composables/context.composable.ts
+++ b/@xen-orchestra/lite/src/composables/context.composable.ts
@@ -1,43 +1,36 @@
-import type { ComputedRef, InjectionKey, MaybeRefOrGetter } from "vue";
-import { computed, inject, provide, toValue } from "vue";
-
-type Context<T = any, Output = any> = ReturnType<
-  typeof createContext<T, Output>
->;
-
-type ContextOutput<Ctx extends Context> = Ctx extends Context<any, infer Output>
-  ? Output
-  : never;
-
-type ContextValue<Ctx extends Context> = Ctx extends Context<infer T>
-  ? T
-  : never;
+import type { ComputedRef, InjectionKey, MaybeRefOrGetter } from 'vue'
+import { computed, inject, provide, toValue } from 'vue'
 
 export const createContext = <T, Output = ComputedRef<T>>(
   initialValue: MaybeRefOrGetter<T>,
   customBuilder?: (value: ComputedRef<T>) => Output
 ) => {
   return {
-    id: Symbol() as InjectionKey<MaybeRefOrGetter<T>>,
+    id: Symbol('CONTEXT_ID') as InjectionKey<MaybeRefOrGetter<T>>,
     initialValue,
-    builder: customBuilder ?? ((value) => value as Output),
-  };
-};
+    builder: customBuilder ?? (value => value as Output),
+  }
+}
+
+type Context<T = any, Output = any> = ReturnType<typeof createContext<T, Output>>
+
+type ContextOutput<Ctx extends Context> = Ctx extends Context<any, infer Output> ? Output : never
+
+type ContextValue<Ctx extends Context> = Ctx extends Context<infer T> ? T : never
 
 export const useContext = <Ctx extends Context, T extends ContextValue<Ctx>>(
   context: Ctx,
   newValue?: MaybeRefOrGetter<T | undefined>
 ): ContextOutput<Ctx> => {
-  const currentValue = inject(context.id, context.initialValue);
+  const currentValue = inject(context.id, context.initialValue)
 
-  const build = (value: MaybeRefOrGetter<T>) =>
-    context.builder(computed(() => toValue(value)));
+  const build = (value: MaybeRefOrGetter<T>) => context.builder(computed(() => toValue(value)))
 
   if (newValue !== undefined) {
-    const updatedValue = () => toValue(newValue) ?? toValue(currentValue);
-    provide(context.id, updatedValue);
-    return build(updatedValue);
+    const updatedValue = () => toValue(newValue) ?? toValue(currentValue)
+    provide(context.id, updatedValue)
+    return build(updatedValue)
   }
 
-  return build(currentValue);
-};
+  return build(currentValue)
+}
diff --git a/@xen-orchestra/lite/src/composables/fetch-stats.composable.md b/@xen-orchestra/lite/src/composables/fetch-stats.composable.md
index f6f16b21421..14e6cec6a74 100644
--- a/@xen-orchestra/lite/src/composables/fetch-stats.composable.md
+++ b/@xen-orchestra/lite/src/composables/fetch-stats.composable.md
@@ -7,19 +7,16 @@
   </p>
 </div>
 <script lang="ts" setup>
-import { onMounted } from "vue";
-import useFetchStats from "@/composables/fetch-stats-composable";
-import { GRANULARITY, type HostStats, type VmStats } from "@/libs/xapi-stats";
+import { onMounted } from 'vue'
+import useFetchStats from '@/composables/fetch-stats-composable'
+import { GRANULARITY, type HostStats, type VmStats } from '@/libs/xapi-stats'
 
-const vmStore = useVmStore();
+const vmStore = useVmStore()
 
-const { register, unregister, stats } = useFetchStats<XenApiVm, VmStats>(
-  "vm",
-  GRANULARITY.Seconds
-);
+const { register, unregister, stats } = useFetchStats<XenApiVm, VmStats>('vm', GRANULARITY.Seconds)
 
 onMounted(() => {
-  vmStore.allRecords.forEach(register);
-});
+  vmStore.allRecords.forEach(register)
+})
 </script>
 ```
diff --git a/@xen-orchestra/lite/src/composables/fetch-stats.composable.ts b/@xen-orchestra/lite/src/composables/fetch-stats.composable.ts
index f3a38496dd5..98170bb4a26 100644
--- a/@xen-orchestra/lite/src/composables/fetch-stats.composable.ts
+++ b/@xen-orchestra/lite/src/composables/fetch-stats.composable.ts
@@ -4,86 +4,79 @@ import {
   RRD_STEP_FROM_STRING,
   type VmStats,
   type XapiStatsResponse,
-} from "@/libs/xapi-stats";
-import type { XenApiHost, XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { type Pausable, promiseTimeout, useTimeoutPoll } from "@vueuse/core";
-import { computed, type ComputedRef, onUnmounted, ref, type Ref } from "vue";
+} from '@/libs/xapi-stats'
+import type { XenApiHost, XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { type Pausable, promiseTimeout, useTimeoutPoll } from '@vueuse/core'
+import { computed, type ComputedRef, onUnmounted, ref, type Ref } from 'vue'
 
 export type Stat<T> = {
-  canBeExpired: boolean;
-  id: string;
-  name: string;
-  stats: T | undefined;
-  pausable: Pausable;
-};
+  canBeExpired: boolean
+  id: string
+  name: string
+  stats: T | undefined
+  pausable: Pausable
+}
 
 export type GetStats<
   T extends XenApiHost | XenApiVm,
   S extends HostStats | VmStats = T extends XenApiHost ? HostStats : VmStats,
 > = (
-  uuid: T["uuid"],
+  uuid: T['uuid'],
   granularity: GRANULARITY,
   ignoreExpired: boolean,
   opts: { abortSignal?: AbortSignal }
-) => Promise<XapiStatsResponse<S> | undefined> | undefined;
+) => Promise<XapiStatsResponse<S> | undefined> | undefined
 
 export type FetchedStats<
   T extends XenApiHost | XenApiVm,
   S extends HostStats | VmStats = T extends XenApiHost ? HostStats : VmStats,
 > = {
-  register: (object: T) => void;
-  unregister: (object: T) => void;
-  stats: ComputedRef<Stat<S>[]>;
-  timestampStart: ComputedRef<number>;
-  timestampEnd: ComputedRef<number>;
-};
+  register: (object: T) => void
+  unregister: (object: T) => void
+  stats: ComputedRef<Stat<S>[]>
+  timestampStart: ComputedRef<number>
+  timestampEnd: ComputedRef<number>
+}
 
 export default function useFetchStats<
   T extends XenApiHost | XenApiVm,
   S extends HostStats | VmStats = T extends XenApiHost ? HostStats : VmStats,
 >(getStats: GetStats<T, S>, granularity: GRANULARITY): FetchedStats<T, S> {
-  const stats = ref(new Map()) as Ref<Map<string, Stat<S>>>;
-  const timestamp = ref<number[]>([0, 0]);
-  const abortController = new AbortController();
+  const stats = ref(new Map()) as Ref<Map<string, Stat<S>>>
+  const timestamp = ref<number[]>([0, 0])
+  const abortController = new AbortController()
 
   const register = (object: T) => {
-    const mapKey = `${object.uuid}-${granularity}`;
+    const mapKey = `${object.uuid}-${granularity}`
     if (stats.value.has(mapKey)) {
-      stats.value.get(mapKey)!.pausable.resume();
-      return;
+      stats.value.get(mapKey)!.pausable.resume()
+      return
     }
 
-    const ignoreExpired = computed(() => !stats.value.has(mapKey));
+    const ignoreExpired = computed(() => !stats.value.has(mapKey))
 
     const pausable = useTimeoutPoll(
       async () => {
-        const newStats = (await getStats(
-          object.uuid,
-          granularity,
-          ignoreExpired.value,
-          {
-            abortSignal: abortController.signal,
-          }
-        )) as XapiStatsResponse<S>;
+        const newStats = (await getStats(object.uuid, granularity, ignoreExpired.value, {
+          abortSignal: abortController.signal,
+        })) as XapiStatsResponse<S>
 
         if (newStats === undefined) {
-          return;
+          return
         }
 
         timestamp.value = [
-          newStats.endTimestamp -
-            RRD_STEP_FROM_STRING[granularity] *
-              (newStats.stats.memory.length - 1),
+          newStats.endTimestamp - RRD_STEP_FROM_STRING[granularity] * (newStats.stats.memory.length - 1),
           newStats.endTimestamp,
-        ];
+        ]
 
-        stats.value.get(mapKey)!.stats = newStats.stats;
-        stats.value.get(mapKey)!.canBeExpired = newStats.canBeExpired;
-        await promiseTimeout(newStats.interval * 1000);
+        stats.value.get(mapKey)!.stats = newStats.stats
+        stats.value.get(mapKey)!.canBeExpired = newStats.canBeExpired
+        await promiseTimeout(newStats.interval * 1000)
       },
       0,
       { immediate: true }
-    );
+    )
 
     stats.value.set(mapKey, {
       canBeExpired: false,
@@ -91,19 +84,19 @@ export default function useFetchStats<
       name: object.name_label,
       stats: undefined,
       pausable,
-    });
-  };
+    })
+  }
 
   const unregister = (object: T) => {
-    const mapKey = `${object.uuid}-${granularity}`;
-    stats.value.get(mapKey)?.pausable.pause();
-    stats.value.delete(mapKey);
-  };
+    const mapKey = `${object.uuid}-${granularity}`
+    stats.value.get(mapKey)?.pausable.pause()
+    stats.value.delete(mapKey)
+  }
 
   onUnmounted(() => {
-    abortController.abort();
-    stats.value.forEach((stat) => stat.pausable.pause());
-  });
+    abortController.abort()
+    stats.value.forEach(stat => stat.pausable.pause())
+  })
 
   return {
     register,
@@ -111,5 +104,5 @@ export default function useFetchStats<
     stats: computed(() => Array.from(stats.value.values()) as Stat<S>[]),
     timestampStart: computed(() => timestamp.value[0]),
     timestampEnd: computed(() => timestamp.value[1]),
-  };
+  }
 }
diff --git a/@xen-orchestra/lite/src/composables/filtered-collection.composable.md b/@xen-orchestra/lite/src/composables/filtered-collection.composable.md
index 6dab6fc5443..20510992238 100644
--- a/@xen-orchestra/lite/src/composables/filtered-collection.composable.md
+++ b/@xen-orchestra/lite/src/composables/filtered-collection.composable.md
@@ -2,17 +2,14 @@
 
 ```vue
 <script lang="ts" setup>
-import useFilteredCollection from "./filtered-collection.composable";
+import useFilteredCollection from './filtered-collection.composable'
 
 const players = [
-  { name: "Foo", team: "Blue" },
-  { name: "Bar", team: "Red" },
-  { name: "Baz", team: "Blue" },
-];
+  { name: 'Foo', team: 'Blue' },
+  { name: 'Bar', team: 'Red' },
+  { name: 'Baz', team: 'Blue' },
+]
 
-const bluePlayers = useFilteredCollection(
-  players,
-  (player) => player.team === "Blue"
-);
+const bluePlayers = useFilteredCollection(players, player => player.team === 'Blue')
 </script>
 ```
diff --git a/@xen-orchestra/lite/src/composables/filtered-collection.composable.ts b/@xen-orchestra/lite/src/composables/filtered-collection.composable.ts
index d612ee7e26f..1b1bc96ff2f 100644
--- a/@xen-orchestra/lite/src/composables/filtered-collection.composable.ts
+++ b/@xen-orchestra/lite/src/composables/filtered-collection.composable.ts
@@ -1,11 +1,11 @@
-import { computed, unref } from "vue";
-import type { MaybeRef } from "@vueuse/core";
+import { computed, unref } from 'vue'
+import type { MaybeRef } from '@vueuse/core'
 
 export default function useFilteredCollection<T>(
   collection: MaybeRef<T[]>,
   predicate: MaybeRef<(value: T) => boolean>
 ) {
   return computed(() => {
-    return unref(collection).filter(unref(predicate));
-  });
+    return unref(collection).filter(unref(predicate))
+  })
 }
diff --git a/@xen-orchestra/lite/src/composables/host-patches.composable.ts b/@xen-orchestra/lite/src/composables/host-patches.composable.ts
index f52c6144649..5d8be373563 100644
--- a/@xen-orchestra/lite/src/composables/host-patches.composable.ts
+++ b/@xen-orchestra/lite/src/composables/host-patches.composable.ts
@@ -1,95 +1,91 @@
-import type { XenApiHost } from "@/libs/xen-api/xen-api.types";
-import { useHostStore } from "@/stores/xen-api/host.store";
-import type { XenApiPatch } from "@/types/xen-api";
-import { type Pausable, useTimeoutPoll, watchArray } from "@vueuse/core";
-import { computed, type MaybeRefOrGetter, reactive, toValue } from "vue";
+import type { XenApiHost } from '@/libs/xen-api/xen-api.types'
+import { useHostStore } from '@/stores/xen-api/host.store'
+import type { XenApiPatch } from '@/types/xen-api'
+import { type Pausable, useTimeoutPoll, watchArray } from '@vueuse/core'
+import { computed, type MaybeRefOrGetter, reactive, toValue } from 'vue'
 
-export type XenApiPatchWithHostRefs = XenApiPatch & { $hostRefs: Set<string> };
+export type XenApiPatchWithHostRefs = XenApiPatch & { $hostRefs: Set<string> }
 
 type HostConfig = {
-  timeoutPoll: Pausable;
-  patches: XenApiPatch[];
-  isLoaded: boolean;
-};
+  timeoutPoll: Pausable
+  patches: XenApiPatch[]
+  isLoaded: boolean
+}
 
 export const useHostPatches = (hosts: MaybeRefOrGetter<XenApiHost[]>) => {
-  const hostStore = useHostStore();
+  const hostStore = useHostStore()
 
-  const configByHost = reactive(new Map()) as Map<string, HostConfig>;
+  const configByHost = reactive(new Map()) as Map<string, HostConfig>
 
-  const fetchHostPatches = async (hostRef: XenApiHost["$ref"]) => {
+  const fetchHostPatches = async (hostRef: XenApiHost['$ref']) => {
     if (!configByHost.has(hostRef)) {
-      return;
+      return
     }
 
-    const config = configByHost.get(hostRef)!;
+    const config = configByHost.get(hostRef)!
 
-    config.patches = await hostStore.fetchMissingPatches(hostRef);
-    config.isLoaded = true;
-  };
+    config.patches = await hostStore.fetchMissingPatches(hostRef)
+    config.isLoaded = true
+  }
 
-  const registerHost = (hostRef: XenApiHost["$ref"]) => {
+  const registerHost = (hostRef: XenApiHost['$ref']) => {
     if (configByHost.has(hostRef)) {
-      return;
+      return
     }
 
     const timeoutPoll = useTimeoutPoll(() => fetchHostPatches(hostRef), 10000, {
       immediate: true,
-    });
+    })
 
     configByHost.set(hostRef, {
       timeoutPoll,
       patches: [],
       isLoaded: false,
-    });
-  };
+    })
+  }
 
   const unregisterHost = (hostRef: string) => {
-    configByHost.get(hostRef)?.timeoutPoll.pause();
-    configByHost.delete(hostRef);
-  };
+    configByHost.get(hostRef)?.timeoutPoll.pause()
+    configByHost.delete(hostRef)
+  }
 
   watchArray(
-    () => toValue(hosts).map((host) => host.$ref),
+    () => toValue(hosts).map(host => host.$ref),
     (_n, _p, addedRefs, removedRefs) => {
-      addedRefs.forEach((ref) => registerHost(ref));
-      removedRefs?.forEach((ref) => unregisterHost(ref));
+      addedRefs.forEach(ref => registerHost(ref))
+      removedRefs?.forEach(ref => unregisterHost(ref))
     },
     { immediate: true }
-  );
+  )
 
   const patches = computed(() => {
-    const records = new Map<string, XenApiPatchWithHostRefs>();
+    const records = new Map<string, XenApiPatchWithHostRefs>()
 
     configByHost.forEach(({ patches }, hostRef) => {
-      patches.forEach((patch) => {
-        const record = records.get(patch.$id);
+      patches.forEach(patch => {
+        const record = records.get(patch.$id)
 
         if (record !== undefined) {
-          return record.$hostRefs.add(hostRef);
+          return record.$hostRefs.add(hostRef)
         }
 
         records.set(patch.$id, {
           ...patch,
           $hostRefs: new Set([hostRef]),
-        });
-      });
-    });
+        })
+      })
+    })
 
-    return Array.from(records.values());
-  });
+    return Array.from(records.values())
+  })
 
-  const count = computed(() => patches.value.length);
+  const count = computed(() => patches.value.length)
 
-  const areAllLoaded = computed(() =>
-    Array.from(configByHost.values()).every((config) => config.isLoaded)
-  );
+  const areAllLoaded = computed(() => Array.from(configByHost.values()).every(config => config.isLoaded))
 
   const areSomeLoaded = computed(
-    () =>
-      areAllLoaded.value ||
-      Array.from(configByHost.values()).some((config) => config.isLoaded)
-  );
+    () => areAllLoaded.value || Array.from(configByHost.values()).some(config => config.isLoaded)
+  )
 
-  return { patches, count, areAllLoaded, areSomeLoaded };
-};
+  return { patches, count, areAllLoaded, areSomeLoaded }
+}
diff --git a/@xen-orchestra/lite/src/composables/modal.composable.ts b/@xen-orchestra/lite/src/composables/modal.composable.ts
index 0658595be03..ce88d4835cb 100644
--- a/@xen-orchestra/lite/src/composables/modal.composable.ts
+++ b/@xen-orchestra/lite/src/composables/modal.composable.ts
@@ -1,5 +1,4 @@
-import { useModalStore } from "@/stores/modal.store";
-import type { AsyncComponentLoader } from "vue";
+import { useModalStore } from '@/stores/modal.store'
+import type { AsyncComponentLoader } from 'vue'
 
-export const useModal = <T>(loader: AsyncComponentLoader, props: object = {}) =>
-  useModalStore().open<T>(loader, props);
+export const useModal = <T>(loader: AsyncComponentLoader, props: object = {}) => useModalStore().open<T>(loader, props)
diff --git a/@xen-orchestra/lite/src/composables/multi-select.composable.md b/@xen-orchestra/lite/src/composables/multi-select.composable.md
index f94b33021a6..03267f39189 100644
--- a/@xen-orchestra/lite/src/composables/multi-select.composable.md
+++ b/@xen-orchestra/lite/src/composables/multi-select.composable.md
@@ -26,8 +26,8 @@
 </template>
 
 <script lang="ts" setup>
-import useMultiSelect from "./multi-select.composable";
+import useMultiSelect from './multi-select.composable'
 
-const { selected, areAllSelected } = useMultiSelect();
+const { selected, areAllSelected } = useMultiSelect()
 </script>
 ```
diff --git a/@xen-orchestra/lite/src/composables/multi-select.composable.ts b/@xen-orchestra/lite/src/composables/multi-select.composable.ts
index 834f6a713af..d4f900f0bc5 100644
--- a/@xen-orchestra/lite/src/composables/multi-select.composable.ts
+++ b/@xen-orchestra/lite/src/composables/multi-select.composable.ts
@@ -1,40 +1,32 @@
-import type { MaybeRef } from "@vueuse/core";
-import { computed, ref, type Ref, unref } from "vue";
+import { computed, ref, unref, type MaybeRef, type Ref } from 'vue'
 
-export default function useMultiSelect<T>(
-  usableIds: MaybeRef<T[]>,
-  selectableIds?: MaybeRef<T[]>
-) {
-  const $selected = ref(new Set()) as Ref<Set<T>>;
+export default function useMultiSelect<T>(usableIds: MaybeRef<T[]>, selectableIds?: MaybeRef<T[]>) {
+  const $selected = ref(new Set()) as Ref<Set<T>>
 
   const selected = computed({
     get() {
-      return unref(usableIds).filter((usableId) =>
-        $selected.value.has(usableId)
-      );
+      return unref(usableIds).filter(usableId => $selected.value.has(usableId))
     },
     set(ids: T[]) {
-      $selected.value = new Set(ids);
+      $selected.value = new Set(ids)
     },
-  });
+  })
 
   const areAllSelected = computed({
     get() {
-      return (unref(selectableIds) ?? unref(usableIds)).every((id) =>
-        $selected.value.has(id)
-      );
+      return (unref(selectableIds) ?? unref(usableIds)).every(id => $selected.value.has(id))
     },
     set(value: boolean) {
       if (value) {
-        $selected.value = new Set(unref(selectableIds) ?? unref(usableIds));
+        $selected.value = new Set(unref(selectableIds) ?? unref(usableIds))
       } else {
-        $selected.value = new Set();
+        $selected.value = new Set()
       }
     },
-  });
+  })
 
   return {
     selected,
     areAllSelected,
-  };
+  }
 }
diff --git a/@xen-orchestra/lite/src/composables/relative-time.composable.md b/@xen-orchestra/lite/src/composables/relative-time.composable.md
index eda208b8446..b7c1c24b64b 100644
--- a/@xen-orchestra/lite/src/composables/relative-time.composable.md
+++ b/@xen-orchestra/lite/src/composables/relative-time.composable.md
@@ -3,9 +3,9 @@
 ## Usage
 
 ```ts
-const relativeTime = useRelativeTime(fromDate, toDate);
+const relativeTime = useRelativeTime(fromDate, toDate)
 
-console.log(relativeTime.value); // 3 days 27 minutes 10 seconds ago
+console.log(relativeTime.value) // 3 days 27 minutes 10 seconds ago
 ```
 
 # Reactivity
@@ -13,6 +13,6 @@ console.log(relativeTime.value); // 3 days 27 minutes 10 seconds ago
 Both arguments can be `Ref`
 
 ```ts
-const now = useNow();
-const relativeTime = useRelativeTime(fromDate, now); // Value will be updated each time `now` changes
+const now = useNow()
+const relativeTime = useRelativeTime(fromDate, now) // Value will be updated each time `now` changes
 ```
diff --git a/@xen-orchestra/lite/src/composables/relative-time.composable.ts b/@xen-orchestra/lite/src/composables/relative-time.composable.ts
index f6f90e2c68c..b043f32b676 100644
--- a/@xen-orchestra/lite/src/composables/relative-time.composable.ts
+++ b/@xen-orchestra/lite/src/composables/relative-time.composable.ts
@@ -1,69 +1,66 @@
-import type { MaybeRef } from "@vueuse/core";
-import { computed, unref } from "vue";
-import { useI18n } from "vue-i18n";
+import type { MaybeRef } from '@vueuse/core'
+import { computed, unref } from 'vue'
+import { useI18n } from 'vue-i18n'
 
-export default function useRelativeTime(
-  fromDate: MaybeRef<Date>,
-  toDate: MaybeRef<Date>
-) {
-  const { t } = useI18n();
-  const fromTime = computed(() => unref(fromDate).getTime());
-  const toTime = computed(() => unref(toDate).getTime());
-  const isPast = computed(() => toTime.value > fromTime.value);
-  const diff = computed(() => Math.abs(toTime.value - fromTime.value));
+export default function useRelativeTime(fromDate: MaybeRef<Date>, toDate: MaybeRef<Date>) {
+  const { t } = useI18n()
+  const fromTime = computed(() => unref(fromDate).getTime())
+  const toTime = computed(() => unref(toDate).getTime())
+  const isPast = computed(() => toTime.value > fromTime.value)
+  const diff = computed(() => Math.abs(toTime.value - fromTime.value))
 
   return computed(() => {
     if (diff.value < 10000) {
-      return t("relative-time.now");
+      return t('relative-time.now')
     }
 
-    const years = Math.floor(diff.value / 31556952000);
-    let timeLeft = diff.value % 31556952000;
+    const years = Math.floor(diff.value / 31556952000)
+    let timeLeft = diff.value % 31556952000
 
-    const months = Math.floor(timeLeft / 2629746000);
-    timeLeft = timeLeft % 2629746000;
+    const months = Math.floor(timeLeft / 2629746000)
+    timeLeft = timeLeft % 2629746000
 
-    const days = Math.floor(timeLeft / 86400000);
-    timeLeft = timeLeft % 86400000;
+    const days = Math.floor(timeLeft / 86400000)
+    timeLeft = timeLeft % 86400000
 
-    const hours = Math.floor(timeLeft / 3600000);
-    timeLeft = timeLeft % 3600000;
+    const hours = Math.floor(timeLeft / 3600000)
+    timeLeft = timeLeft % 3600000
 
-    const minutes = Math.floor(timeLeft / 60000);
-    timeLeft = timeLeft % 60000;
-    const seconds = Math.floor(timeLeft / 1000);
+    const minutes = Math.floor(timeLeft / 60000)
+    timeLeft = timeLeft % 60000
+    const seconds = Math.floor(timeLeft / 1000)
 
-    const parts = [];
+    const parts = []
 
     if (years > 0) {
-      parts.push(t("relative-time.year", { n: years }));
+      parts.push(t('relative-time.year', { n: years }))
     }
 
     if (months > 0) {
-      const n = days >= 15 ? months + 1 : months;
-      parts.push(t("relative-time.month", { n }));
+      const n = days >= 15 ? months + 1 : months
+      parts.push(t('relative-time.month', { n }))
     }
 
     if (years === 0 && months === 0) {
       if (days > 0) {
-        parts.push(t("relative-time.day", { n: days }));
+        parts.push(t('relative-time.day', { n: days }))
       }
 
       if (days <= 1 && hours > 0) {
-        parts.push(t("relative-time.hour", { n: hours }));
+        parts.push(t('relative-time.hour', { n: hours }))
       }
 
       if (days === 0 && minutes > 0) {
-        parts.push(t("relative-time.minute", { n: minutes }));
+        parts.push(t('relative-time.minute', { n: minutes }))
       }
 
       if (days === 0 && seconds > 0) {
-        parts.push(t("relative-time.second", { n: seconds }));
+        parts.push(t('relative-time.second', { n: seconds }))
       }
     }
 
-    return t(isPast.value ? "relative-time.past" : "relative-time.future", {
-      str: parts.join(" "),
-    });
-  });
+    return t(isPast.value ? 'relative-time.past' : 'relative-time.future', {
+      str: parts.join(' '),
+    })
+  })
 }
diff --git a/@xen-orchestra/lite/src/composables/sorted-collection.composable.ts b/@xen-orchestra/lite/src/composables/sorted-collection.composable.ts
index 0932db45070..a2db20d9816 100644
--- a/@xen-orchestra/lite/src/composables/sorted-collection.composable.ts
+++ b/@xen-orchestra/lite/src/composables/sorted-collection.composable.ts
@@ -1,11 +1,11 @@
-import { computed, unref } from "vue";
-import type { MaybeRef } from "@vueuse/core";
+import { computed, unref } from 'vue'
+import type { MaybeRef } from '@vueuse/core'
 
 export default function useSortedCollection<T>(
   collection: MaybeRef<T[]>,
   compareFn: MaybeRef<(value1: T, value2: T) => -1 | 1 | 0>
 ) {
   return computed(() => {
-    return [...unref(collection)].sort(unref(compareFn));
-  });
+    return [...unref(collection)].sort(unref(compareFn))
+  })
 }
diff --git a/@xen-orchestra/lite/src/composables/stat-status.composable.ts b/@xen-orchestra/lite/src/composables/stat-status.composable.ts
index 1f5dd765693..9c3c093d53d 100644
--- a/@xen-orchestra/lite/src/composables/stat-status.composable.ts
+++ b/@xen-orchestra/lite/src/composables/stat-status.composable.ts
@@ -1,32 +1,27 @@
-import type { Stat } from "@/composables/fetch-stats.composable";
-import type { StatData } from "@/types/stat";
-import type { MaybeRef } from "@vueuse/core";
-import { computed, type ComputedRef, toRef } from "vue";
+import type { Stat } from '@/composables/fetch-stats.composable'
+import type { StatData } from '@/types/stat'
+import type { MaybeRef } from '@vueuse/core'
+import { computed, type ComputedRef, toRef } from 'vue'
 
 export const useStatStatus = (
   _stats: MaybeRef<Stat<any>[]>,
   _data: MaybeRef<StatData[]>,
   _isFetching: MaybeRef<boolean>
 ) => {
-  const stats = toRef(_stats);
-  const data = toRef(_data);
-  const isFetching = toRef(_isFetching);
+  const stats = toRef(_stats)
+  const data = toRef(_data)
+  const isFetching = toRef(_isFetching)
 
-  const _isStatFetched: ComputedRef<boolean> = computed(
-    () => stats.value.length === data.value.length
-  );
+  const _isStatFetched: ComputedRef<boolean> = computed(() => stats.value.length === data.value.length)
 
   const isStatEmpty: ComputedRef<boolean> = computed(
-    () =>
-      !isFetching.value && stats.value.length === 0 && data.value.length === 0
-  );
+    () => !isFetching.value && stats.value.length === 0 && data.value.length === 0
+  )
 
-  const isLoading: ComputedRef<boolean> = computed(
-    () => isFetching.value || !_isStatFetched.value
-  );
+  const isLoading: ComputedRef<boolean> = computed(() => isFetching.value || !_isStatFetched.value)
 
   return {
     isStatEmpty,
     isLoading,
-  };
-};
+  }
+}
diff --git a/@xen-orchestra/lite/src/composables/subscriber.composable.ts b/@xen-orchestra/lite/src/composables/subscriber.composable.ts
index 01610999a9f..5b59d7d7d35 100644
--- a/@xen-orchestra/lite/src/composables/subscriber.composable.ts
+++ b/@xen-orchestra/lite/src/composables/subscriber.composable.ts
@@ -1,16 +1,16 @@
-import { computed, type MaybeRefOrGetter, ref, toValue, watch } from "vue";
+import { computed, type MaybeRefOrGetter, ref, toValue, watch } from 'vue'
 
 export type SubscriberDependencies = {
-  subscribe: (id: symbol) => void;
-  unsubscribe: (id: symbol) => void;
-}[];
+  subscribe: (id: symbol) => void
+  unsubscribe: (id: symbol) => void
+}[]
 
 export type SubscriberOptions = {
-  onSubscriptionStart?: () => void;
-  onSubscriptionEnd?: () => void;
-  enabled?: MaybeRefOrGetter<boolean>;
-  dependencies?: SubscriberDependencies;
-};
+  onSubscriptionStart?: () => void
+  onSubscriptionEnd?: () => void
+  enabled?: MaybeRefOrGetter<boolean>
+  dependencies?: SubscriberDependencies
+}
 
 export const useSubscriber = ({
   onSubscriptionStart,
@@ -18,36 +18,36 @@ export const useSubscriber = ({
   enabled = true,
   dependencies,
 }: SubscriberOptions = {}) => {
-  const subscribers = ref(new Set<symbol>());
+  const subscribers = ref(new Set<symbol>())
 
-  const hasSubscribers = computed(() => subscribers.value.size > 0);
+  const hasSubscribers = computed(() => subscribers.value.size > 0)
 
   const subscribe = (id: symbol) => {
-    dependencies?.forEach((dependency) => dependency.subscribe(id));
-    subscribers.value.add(id);
-  };
+    dependencies?.forEach(dependency => dependency.subscribe(id))
+    subscribers.value.add(id)
+  }
 
   const unsubscribe = (id: symbol) => {
-    dependencies?.forEach((dependency) => dependency.unsubscribe(id));
-    subscribers.value.delete(id);
-  };
+    dependencies?.forEach(dependency => dependency.unsubscribe(id))
+    subscribers.value.delete(id)
+  }
 
   watch(
     () => hasSubscribers.value && toValue(enabled),
-    (hasSubscribers) => {
+    hasSubscribers => {
       if (hasSubscribers) {
-        onSubscriptionStart?.();
+        onSubscriptionStart?.()
       } else {
-        onSubscriptionEnd?.();
+        onSubscriptionEnd?.()
       }
     }
-  );
+  )
 
   return {
     subscribe,
     unsubscribe,
     hasSubscribers,
-  };
-};
+  }
+}
 
-export type Subscriber = ReturnType<typeof useSubscriber>;
+export type Subscriber = ReturnType<typeof useSubscriber>
diff --git a/@xen-orchestra/lite/src/composables/unreachable-hosts.composable.ts b/@xen-orchestra/lite/src/composables/unreachable-hosts.composable.ts
index 54a863240a2..7ba83abe85f 100644
--- a/@xen-orchestra/lite/src/composables/unreachable-hosts.composable.ts
+++ b/@xen-orchestra/lite/src/composables/unreachable-hosts.composable.ts
@@ -1,37 +1,32 @@
-import { useModal } from "@/composables/modal.composable";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { whenever } from "@vueuse/core";
-import { difference } from "lodash-es";
-import { computed, ref, watch } from "vue";
+import { useModal } from '@/composables/modal.composable'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { whenever } from '@vueuse/core'
+import { difference } from 'lodash-es'
+import { computed, ref, watch } from 'vue'
 
 export const useUnreachableHosts = () => {
-  const { records: hosts } = useHostCollection();
-  const unreachableHostsUrls = ref<Set<string>>(new Set());
+  const { records: hosts } = useHostCollection()
+  const unreachableHostsUrls = ref<Set<string>>(new Set())
 
   watch(hosts, (nextHosts, previousHosts) => {
-    difference(nextHosts, previousHosts).forEach((host) => {
-      const url = new URL("http://localhost");
-      url.protocol = window.location.protocol;
-      url.hostname = host.address;
-      fetch(url, { mode: "no-cors" }).catch(() =>
-        unreachableHostsUrls.value.add(url.toString())
-      );
-    });
-  });
+    difference(nextHosts, previousHosts).forEach(host => {
+      const url = new URL('http://localhost')
+      url.protocol = window.location.protocol
+      url.hostname = host.address
+      fetch(url, { mode: 'no-cors' }).catch(() => unreachableHostsUrls.value.add(url.toString()))
+    })
+  })
 
   whenever(
     () => unreachableHostsUrls.value.size > 0,
     () => {
-      const { onApprove, onDecline } = useModal(
-        () => import("@/components/modals/UnreachableHostsModal.vue"),
-        {
-          urls: computed(() => Array.from(unreachableHostsUrls.value.values())),
-        }
-      );
+      const { onApprove, onDecline } = useModal(() => import('@/components/modals/UnreachableHostsModal.vue'), {
+        urls: computed(() => Array.from(unreachableHostsUrls.value.values())),
+      })
 
-      onApprove(() => window.location.reload());
-      onDecline(() => unreachableHostsUrls.value.clear());
+      onApprove(() => window.location.reload())
+      onDecline(() => unreachableHostsUrls.value.clear())
     },
     { immediate: true }
-  );
-};
+  )
+}
diff --git a/@xen-orchestra/lite/src/composables/vm-migration.composable.ts b/@xen-orchestra/lite/src/composables/vm-migration.composable.ts
index 5182f1ff3a7..fd3fd257a51 100644
--- a/@xen-orchestra/lite/src/composables/vm-migration.composable.ts
+++ b/@xen-orchestra/lite/src/composables/vm-migration.composable.ts
@@ -1,69 +1,58 @@
-import { sortRecordsByNameLabel } from "@/libs/utils";
-import { VM_OPERATION } from "@/libs/xen-api/xen-api.enums";
-import type { XenApiHost, XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import { castArray } from "lodash-es";
-import type { MaybeRefOrGetter } from "vue";
-import { computed, ref, toValue } from "vue";
+import { sortRecordsByNameLabel } from '@/libs/utils'
+import { VM_OPERATION } from '@/libs/xen-api/xen-api.enums'
+import type { XenApiHost, XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import { castArray } from 'lodash-es'
+import type { MaybeRefOrGetter } from 'vue'
+import { computed, ref, toValue } from 'vue'
 
-export const useVmMigration = (
-  vmRefs: MaybeRefOrGetter<XenApiVm["$ref"] | XenApiVm["$ref"][]>
-) => {
-  const $isMigrating = ref(false);
-  const selectedHost = ref<XenApiHost>();
-  const { getByOpaqueRef: getVm } = useVmCollection();
-  const { records: hosts } = useHostCollection();
+export const useVmMigration = (vmRefs: MaybeRefOrGetter<XenApiVm['$ref'] | XenApiVm['$ref'][]>) => {
+  const $isMigrating = ref(false)
+  const selectedHost = ref<XenApiHost>()
+  const { getByOpaqueRef: getVm } = useVmCollection()
+  const { records: hosts } = useHostCollection()
 
   const vms = computed(
     () =>
       castArray(toValue(vmRefs))
-        .map((vmRef) => getVm(vmRef))
-        .filter((vm) => vm !== undefined) as XenApiVm[]
-  );
+        .map(vmRef => getVm(vmRef))
+        .filter(vm => vm !== undefined) as XenApiVm[]
+  )
 
   const isMigrating = computed(
     () =>
       $isMigrating.value ||
-      vms.value.some((vm) =>
-        Object.values(vm.current_operations).some(
-          (operation) => operation === VM_OPERATION.POOL_MIGRATE
-        )
+      vms.value.some(vm =>
+        Object.values(vm.current_operations).some(operation => operation === VM_OPERATION.POOL_MIGRATE)
       )
-  );
+  )
 
   const availableHosts = computed(() => {
-    return hosts.value
-      .filter((host) => vms.value.some((vm) => vm.resident_on !== host.$ref))
-      .sort(sortRecordsByNameLabel);
-  });
+    return hosts.value.filter(host => vms.value.some(vm => vm.resident_on !== host.$ref)).sort(sortRecordsByNameLabel)
+  })
 
-  const isValid = computed(
-    () =>
-      !isMigrating.value &&
-      vms.value.length > 0 &&
-      selectedHost.value !== undefined
-  );
+  const isValid = computed(() => !isMigrating.value && vms.value.length > 0 && selectedHost.value !== undefined)
 
   const migrate = async () => {
     if (!isValid.value) {
-      return;
+      return
     }
 
     try {
-      $isMigrating.value = true;
-      const hostRef = selectedHost.value!.$ref;
-      const xapi = useXenApiStore().getXapi();
+      $isMigrating.value = true
+      const hostRef = selectedHost.value!.$ref
+      const xapi = useXenApiStore().getXapi()
 
       await xapi.vm.migrate(
-        vms.value.map((vm) => vm.$ref),
+        vms.value.map(vm => vm.$ref),
         hostRef
-      );
+      )
     } finally {
-      $isMigrating.value = false;
+      $isMigrating.value = false
     }
-  };
+  }
 
   return {
     isMigrating,
@@ -71,5 +60,5 @@ export const useVmMigration = (
     selectedHost,
     isValid,
     migrate,
-  };
-};
+  }
+}
diff --git a/@xen-orchestra/lite/src/composables/xen-api-store-base-context.composable.ts b/@xen-orchestra/lite/src/composables/xen-api-store-base-context.composable.ts
index 63824504a0c..1b78950403a 100644
--- a/@xen-orchestra/lite/src/composables/xen-api-store-base-context.composable.ts
+++ b/@xen-orchestra/lite/src/composables/xen-api-store-base-context.composable.ts
@@ -1,50 +1,46 @@
-import type { XenApiRecord } from "@/libs/xen-api/xen-api.types";
-import { computed, ref, shallowReactive } from "vue";
+import type { XenApiRecord } from '@/libs/xen-api/xen-api.types'
+import { computed, ref, shallowReactive } from 'vue'
 
-export const useXenApiStoreBaseContext = <
-  XRecord extends XenApiRecord<any>,
->() => {
-  const recordsByOpaqueRef = shallowReactive(new Map<string, XRecord>());
-  const recordsByUuid = shallowReactive(new Map<string, XRecord>());
-  const records = computed(() => Array.from(recordsByOpaqueRef.values()));
-  const isReady = ref(false);
-  const isFetching = ref(false);
-  const isLoading = computed(() => !isReady.value && isFetching.value);
-  const isReloading = computed(() => isReady.value && isFetching.value);
-  const lastError = ref<string>();
-  const hasError = computed(() => lastError.value !== undefined);
+export const useXenApiStoreBaseContext = <XRecord extends XenApiRecord<any>>() => {
+  const recordsByOpaqueRef = shallowReactive(new Map<string, XRecord>())
+  const recordsByUuid = shallowReactive(new Map<string, XRecord>())
+  const records = computed(() => Array.from(recordsByOpaqueRef.values()))
+  const isReady = ref(false)
+  const isFetching = ref(false)
+  const isLoading = computed(() => !isReady.value && isFetching.value)
+  const isReloading = computed(() => isReady.value && isFetching.value)
+  const lastError = ref<string>()
+  const hasError = computed(() => lastError.value !== undefined)
 
-  const getByOpaqueRef = (opaqueRef: XRecord["$ref"]) => {
-    return recordsByOpaqueRef.get(opaqueRef);
-  };
+  const getByOpaqueRef = (opaqueRef: XRecord['$ref']) => {
+    return recordsByOpaqueRef.get(opaqueRef)
+  }
 
-  const getByOpaqueRefs = (opaqueRefs: XRecord["$ref"][]) => {
-    return opaqueRefs
-      .map(getByOpaqueRef)
-      .filter((record) => record !== undefined) as XRecord[];
-  };
+  const getByOpaqueRefs = (opaqueRefs: XRecord['$ref'][]) => {
+    return opaqueRefs.map(getByOpaqueRef).filter(record => record !== undefined) as XRecord[]
+  }
 
-  const getByUuid = (uuid: XRecord["uuid"]) => {
-    return recordsByUuid.get(uuid);
-  };
+  const getByUuid = (uuid: XRecord['uuid']) => {
+    return recordsByUuid.get(uuid)
+  }
 
-  const hasUuid = (uuid: XRecord["uuid"]) => {
-    return recordsByUuid.has(uuid);
-  };
+  const hasUuid = (uuid: XRecord['uuid']) => {
+    return recordsByUuid.has(uuid)
+  }
 
   const add = (record: XRecord) => {
-    recordsByOpaqueRef.set(record.$ref, record);
-    recordsByUuid.set(record.uuid, record);
-  };
+    recordsByOpaqueRef.set(record.$ref, record)
+    recordsByUuid.set(record.uuid, record)
+  }
 
-  const remove = (opaqueRef: XRecord["$ref"]) => {
-    const record = getByOpaqueRef(opaqueRef);
+  const remove = (opaqueRef: XRecord['$ref']) => {
+    const record = getByOpaqueRef(opaqueRef)
 
     if (record !== undefined) {
-      recordsByOpaqueRef.delete(opaqueRef);
-      recordsByUuid.delete(record.uuid);
+      recordsByOpaqueRef.delete(opaqueRef)
+      recordsByUuid.delete(record.uuid)
     }
-  };
+  }
 
   return {
     isFetching,
@@ -60,8 +56,9 @@ export const useXenApiStoreBaseContext = <
     hasUuid,
     add,
     remove,
-  };
-};
+  }
+}
 
-export type XenApiStoreBaseContext<XRecord extends XenApiRecord<any>> =
-  ReturnType<typeof useXenApiStoreBaseContext<XRecord>>;
+export type XenApiStoreBaseContext<XRecord extends XenApiRecord<any>> = ReturnType<
+  typeof useXenApiStoreBaseContext<XRecord>
+>
diff --git a/@xen-orchestra/lite/src/composables/xen-api-store-subscribable-context.composable.ts b/@xen-orchestra/lite/src/composables/xen-api-store-subscribable-context.composable.ts
index c61db867ec5..e5f2a42cf0e 100644
--- a/@xen-orchestra/lite/src/composables/xen-api-store-subscribable-context.composable.ts
+++ b/@xen-orchestra/lite/src/composables/xen-api-store-subscribable-context.composable.ts
@@ -1,22 +1,16 @@
-import type { SubscriberDependencies } from "@/composables/subscriber.composable";
-import { useXenApiStoreBaseContext } from "@/composables/xen-api-store-base-context.composable";
-import { useXenApiStoreSubscriber } from "@/composables/xen-api-store-subscriber.composable";
-import type {
-  ObjectType,
-  ObjectTypeToRecord,
-} from "@/libs/xen-api/xen-api.types";
+import type { SubscriberDependencies } from '@/composables/subscriber.composable'
+import { useXenApiStoreBaseContext } from '@/composables/xen-api-store-base-context.composable'
+import { useXenApiStoreSubscriber } from '@/composables/xen-api-store-subscriber.composable'
+import type { ObjectType, ObjectTypeToRecord } from '@/libs/xen-api/xen-api.types'
 
-export const useXenApiStoreSubscribableContext = <
-  Type extends ObjectType,
-  XRecord extends ObjectTypeToRecord<Type>,
->(
+export const useXenApiStoreSubscribableContext = <Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(
   type: Type,
   dependencies?: SubscriberDependencies
 ) => {
-  const baseContext = useXenApiStoreBaseContext<XRecord>();
-  const subscriber = useXenApiStoreSubscriber(type, baseContext, dependencies);
+  const baseContext = useXenApiStoreBaseContext<XRecord>()
+  const subscriber = useXenApiStoreSubscriber(type, baseContext, dependencies)
   return {
     ...baseContext,
     ...subscriber,
-  };
-};
+  }
+}
diff --git a/@xen-orchestra/lite/src/composables/xen-api-store-subscriber.composable.ts b/@xen-orchestra/lite/src/composables/xen-api-store-subscriber.composable.ts
index ca8c286e9e1..5bf9d997511 100644
--- a/@xen-orchestra/lite/src/composables/xen-api-store-subscriber.composable.ts
+++ b/@xen-orchestra/lite/src/composables/xen-api-store-subscriber.composable.ts
@@ -1,75 +1,63 @@
-import {
-  type SubscriberDependencies,
-  useSubscriber,
-} from "@/composables/subscriber.composable";
-import type { XenApiStoreBaseContext } from "@/composables/xen-api-store-base-context.composable";
-import type {
-  ObjectType,
-  ObjectTypeToRecord,
-} from "@/libs/xen-api/xen-api.types";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { useI18n } from "vue-i18n";
+import { type SubscriberDependencies, useSubscriber } from '@/composables/subscriber.composable'
+import type { XenApiStoreBaseContext } from '@/composables/xen-api-store-base-context.composable'
+import type { ObjectType, ObjectTypeToRecord } from '@/libs/xen-api/xen-api.types'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { useI18n } from 'vue-i18n'
 
-export const useXenApiStoreSubscriber = <
-  Type extends ObjectType,
-  XRecord extends ObjectTypeToRecord<Type>,
->(
+export const useXenApiStoreSubscriber = <Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(
   type: Type,
   context: XenApiStoreBaseContext<XRecord>,
   dependencies?: SubscriberDependencies
 ) => {
-  const xenApiStore = useXenApiStore();
-  const xenApi = xenApiStore.getXapi();
-  const i18n = useI18n();
+  const xenApiStore = useXenApiStore()
+  const xenApi = xenApiStore.getXapi()
+  const i18n = useI18n()
 
-  const onBeforeLoad = () => (context.isFetching.value = true);
+  const onBeforeLoad = () => (context.isFetching.value = true)
 
   const onAfterLoad = (records: XRecord[]) => {
-    records.forEach((record) => context.add(record));
-    context.isFetching.value = false;
-    context.isReady.value = true;
-  };
+    records.forEach(record => context.add(record))
+    context.isFetching.value = false
+    context.isReady.value = true
+  }
 
   const onLoadError = (error: Error) => {
-    context.isFetching.value = false;
-    context.isReady.value = false;
-    context.lastError.value = i18n.t("error-no-data");
-    console.error(error);
-  };
+    context.isFetching.value = false
+    context.isReady.value = false
+    context.lastError.value = i18n.t('error-no-data')
+    console.error(error)
+  }
 
   const onAdd = (record: XRecord) => {
-    context.add(record);
-  };
+    context.add(record)
+  }
 
-  const onRemove = (opaqueRef: XRecord["$ref"]) => {
-    context.remove(opaqueRef);
-  };
+  const onRemove = (opaqueRef: XRecord['$ref']) => {
+    context.remove(opaqueRef)
+  }
 
   return useSubscriber({
     enabled: () => xenApiStore.isConnected,
     onSubscriptionStart: () => {
-      xenApi.addEventListener<Type>(`${type}.beforeLoad`, onBeforeLoad);
-      xenApi.addEventListener<Type, XRecord>(`${type}.afterLoad`, onAfterLoad);
-      xenApi.addEventListener<Type>(`${type}.loadError`, onLoadError);
-      xenApi.addEventListener<Type, XRecord>(`${type}.add`, onAdd);
-      xenApi.addEventListener<Type, XRecord>(`${type}.mod`, onAdd);
-      xenApi.addEventListener<Type, XRecord>(`${type}.del`, onRemove);
-
-      void xenApi.loadRecords<Type, XRecord>(type);
+      xenApi.addEventListener<Type>(`${type}.beforeLoad`, onBeforeLoad)
+      xenApi.addEventListener<Type, XRecord>(`${type}.afterLoad`, onAfterLoad)
+      xenApi.addEventListener<Type>(`${type}.loadError`, onLoadError)
+      xenApi.addEventListener<Type, XRecord>(`${type}.add`, onAdd)
+      xenApi.addEventListener<Type, XRecord>(`${type}.mod`, onAdd)
+      xenApi.addEventListener<Type, XRecord>(`${type}.del`, onRemove)
+
+      void xenApi.loadRecords<Type, XRecord>(type)
     },
     onSubscriptionEnd: async () => {
-      context.isReady.value = false;
-
-      xenApi.removeEventListener<Type>(`${type}.beforeLoad`, onBeforeLoad);
-      xenApi.removeEventListener<Type, XRecord>(
-        `${type}.afterLoad`,
-        onAfterLoad
-      );
-      xenApi.removeEventListener<Type>(`${type}.loadError`, onLoadError);
-      xenApi.removeEventListener<Type, XRecord>(`${type}.add`, onAdd);
-      xenApi.removeEventListener<Type, XRecord>(`${type}.mod`, onAdd);
-      xenApi.removeEventListener<Type, XRecord>(`${type}.del`, onRemove);
+      context.isReady.value = false
+
+      xenApi.removeEventListener<Type>(`${type}.beforeLoad`, onBeforeLoad)
+      xenApi.removeEventListener<Type, XRecord>(`${type}.afterLoad`, onAfterLoad)
+      xenApi.removeEventListener<Type>(`${type}.loadError`, onLoadError)
+      xenApi.removeEventListener<Type, XRecord>(`${type}.add`, onAdd)
+      xenApi.removeEventListener<Type, XRecord>(`${type}.mod`, onAdd)
+      xenApi.removeEventListener<Type, XRecord>(`${type}.del`, onRemove)
     },
     dependencies,
-  });
-};
+  })
+}
diff --git a/@xen-orchestra/lite/src/context.ts b/@xen-orchestra/lite/src/context.ts
index e60ab72720f..6d278574202 100644
--- a/@xen-orchestra/lite/src/context.ts
+++ b/@xen-orchestra/lite/src/context.ts
@@ -1,12 +1,12 @@
-import { createContext } from "@/composables/context.composable";
-import type { Color } from "@/types";
-import { computed } from "vue";
+import { createContext } from '@/composables/context.composable'
+import type { Color } from '@/types'
+import { computed } from 'vue'
 
-export const DisabledContext = createContext(false);
+export const DisabledContext = createContext(false)
 
-export const ColorContext = createContext("info" as Color, (color) => ({
+export const ColorContext = createContext('info' as Color, color => ({
   name: color,
   textClass: computed(() => `context-color-${color.value}`),
   backgroundClass: computed(() => `context-background-color-${color.value}`),
   borderClass: computed(() => `context-border-color-${color.value}`),
-}));
+}))
diff --git a/@xen-orchestra/lite/src/directives/tooltip.directive.md b/@xen-orchestra/lite/src/directives/tooltip.directive.md
index fbcb40592e4..db0194cb71a 100644
--- a/@xen-orchestra/lite/src/directives/tooltip.directive.md
+++ b/@xen-orchestra/lite/src/directives/tooltip.directive.md
@@ -39,14 +39,8 @@ Tooltip can be placed on the following positions:
 ```vue
 <template>
   <!-- Boolean / Undefined -->
-  <span v-tooltip="true"
-    >This content will be ellipsized by CSS but displayed entirely in the
-    tooltip</span
-  >
-  <span v-tooltip
-    >This content will be ellipsized by CSS but displayed entirely in the
-    tooltip</span
-  >
+  <span v-tooltip="true">This content will be ellipsized by CSS but displayed entirely in the tooltip</span>
+  <span v-tooltip>This content will be ellipsized by CSS but displayed entirely in the tooltip</span>
 
   <!-- String -->
   <span v-tooltip="'Tooltip content'">Item</span>
@@ -62,10 +56,10 @@ Tooltip can be placed on the following positions:
 </template>
 
 <script setup>
-import { ref } from "vue";
-import { vTooltip } from "@/directives/tooltip.directive";
+import { ref } from 'vue'
+import { vTooltip } from '@/directives/tooltip.directive'
 
-const myTooltip = ref("Content"); // or ref({ content: "Content", placement: "left-end" })
-const isTooltipEnabled = ref(true);
+const myTooltip = ref('Content') // or ref({ content: "Content", placement: "left-end" })
+const isTooltipEnabled = ref(true)
 </script>
 ```
diff --git a/@xen-orchestra/lite/src/directives/tooltip.directive.ts b/@xen-orchestra/lite/src/directives/tooltip.directive.ts
index 0e63ed9d44f..489ef42eb0a 100644
--- a/@xen-orchestra/lite/src/directives/tooltip.directive.ts
+++ b/@xen-orchestra/lite/src/directives/tooltip.directive.ts
@@ -1,51 +1,43 @@
-import type { TooltipEvents, TooltipOptions } from "@/stores/tooltip.store";
-import { useTooltipStore } from "@/stores/tooltip.store";
-import { isObject } from "lodash-es";
-import type { Options } from "placement.js";
-import type { Directive } from "vue";
+import type { TooltipEvents, TooltipOptions } from '@/stores/tooltip.store'
+import { useTooltipStore } from '@/stores/tooltip.store'
+import { isObject } from 'lodash-es'
+import type { Options } from 'placement.js'
+import type { Directive } from 'vue'
 
-type TooltipDirectiveContent = undefined | boolean | string;
+type TooltipDirectiveContent = undefined | boolean | string
 
 type TooltipDirectiveOptions =
   | TooltipDirectiveContent
   | {
-      content?: TooltipDirectiveContent;
-      placement?: Options["placement"];
-    };
+      content?: TooltipDirectiveContent
+      placement?: Options['placement']
+    }
 
-const parseOptions = (
-  options: TooltipDirectiveOptions,
-  target: HTMLElement
-): TooltipOptions => {
-  const { placement, content } = isObject(options)
-    ? options
-    : { placement: undefined, content: options };
+const parseOptions = (options: TooltipDirectiveOptions, target: HTMLElement): TooltipOptions => {
+  const { placement, content } = isObject(options) ? options : { placement: undefined, content: options }
 
   return {
     placement,
-    content:
-      content === true || content === undefined
-        ? target.innerText.trim()
-        : content,
-  };
-};
+    content: content === true || content === undefined ? target.innerText.trim() : content,
+  }
+}
 
 export const vTooltip: Directive<HTMLElement, TooltipDirectiveOptions> = {
   mounted(target, binding) {
-    const store = useTooltipStore();
+    const store = useTooltipStore()
 
     const events: TooltipEvents = binding.modifiers.focus
-      ? { on: "focusin", off: "focusout" }
-      : { on: "mouseenter", off: "mouseleave" };
+      ? { on: 'focusin', off: 'focusout' }
+      : { on: 'mouseenter', off: 'mouseleave' }
 
-    store.register(target, parseOptions(binding.value, target), events);
+    store.register(target, parseOptions(binding.value, target), events)
   },
   updated(target, binding) {
-    const store = useTooltipStore();
-    store.updateOptions(target, parseOptions(binding.value, target));
+    const store = useTooltipStore()
+    store.updateOptions(target, parseOptions(binding.value, target))
   },
   beforeUnmount(target) {
-    const store = useTooltipStore();
-    store.unregister(target);
+    const store = useTooltipStore()
+    store.unregister(target)
   },
-};
+}
diff --git a/@xen-orchestra/lite/src/i18n.ts b/@xen-orchestra/lite/src/i18n.ts
index aa4fa720205..176ba982577 100644
--- a/@xen-orchestra/lite/src/i18n.ts
+++ b/@xen-orchestra/lite/src/i18n.ts
@@ -1,112 +1,112 @@
-import { createI18n } from "vue-i18n";
-import messages from "@intlify/unplugin-vue-i18n/messages";
+import { createI18n } from 'vue-i18n'
+import messages from '@intlify/unplugin-vue-i18n/messages'
 
 interface Locales {
   [key: string]: {
-    code: string;
-    name: string;
-  };
+    code: string
+    name: string
+  }
 }
 
 export const locales: Locales = {
   en: {
-    code: "en",
-    name: "English",
+    code: 'en',
+    name: 'English',
   },
   fr: {
-    code: "fr",
-    name: "Français",
+    code: 'fr',
+    name: 'Français',
   },
-};
+}
 
 export default createI18n({
-  locale: localStorage.getItem("lang") ?? "en",
-  fallbackLocale: "en",
+  locale: localStorage.getItem('lang') ?? 'en',
+  fallbackLocale: 'en',
   messages,
   datetimeFormats: {
     en: {
       date_short: {
-        year: "numeric",
-        month: "numeric",
-        day: "numeric",
+        year: 'numeric',
+        month: 'numeric',
+        day: 'numeric',
       },
       date_medium: {
-        year: "numeric",
-        month: "short",
-        day: "numeric",
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
       },
       date_long: {
-        year: "numeric",
-        month: "long",
-        day: "numeric",
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
       },
       datetime_short: {
-        year: "numeric",
-        month: "numeric",
-        day: "numeric",
-        hour: "2-digit",
-        minute: "2-digit",
+        year: 'numeric',
+        month: 'numeric',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
       },
       datetime_medium: {
-        year: "numeric",
-        month: "short",
-        day: "numeric",
-        hour: "2-digit",
-        minute: "2-digit",
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
       },
       datetime_long: {
-        year: "numeric",
-        month: "long",
-        day: "numeric",
-        hour: "2-digit",
-        minute: "2-digit",
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
       },
       time: {
-        hour: "2-digit",
-        minute: "2-digit",
+        hour: '2-digit',
+        minute: '2-digit',
       },
     },
     fr: {
       date_short: {
-        year: "numeric",
-        month: "numeric",
-        day: "numeric",
+        year: 'numeric',
+        month: 'numeric',
+        day: 'numeric',
       },
       date_medium: {
-        year: "numeric",
-        month: "short",
-        day: "numeric",
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
       },
       date_long: {
-        year: "numeric",
-        month: "long",
-        day: "numeric",
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
       },
       datetime_short: {
-        year: "numeric",
-        month: "numeric",
-        day: "numeric",
-        hour: "2-digit",
-        minute: "2-digit",
+        year: 'numeric',
+        month: 'numeric',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
       },
       datetime_medium: {
-        year: "numeric",
-        month: "short",
-        day: "numeric",
-        hour: "2-digit",
-        minute: "2-digit",
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
       },
       datetime_long: {
-        year: "numeric",
-        month: "long",
-        day: "numeric",
-        hour: "2-digit",
-        minute: "2-digit",
+        year: 'numeric',
+        month: 'long',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
       },
       time: {
-        hour: "2-digit",
-        minute: "2-digit",
+        hour: '2-digit',
+        minute: '2-digit',
       },
     },
   },
-});
+})
diff --git a/@xen-orchestra/lite/src/libs/alarm.ts b/@xen-orchestra/lite/src/libs/alarm.ts
index f6169802c7a..fe780972efd 100644
--- a/@xen-orchestra/lite/src/libs/alarm.ts
+++ b/@xen-orchestra/lite/src/libs/alarm.ts
@@ -1,57 +1,50 @@
-import type {
-  RawObjectType,
-  XenApiMessage,
-} from "@/libs/xen-api/xen-api.types";
-import type { XenApiAlarm, XenApiAlarmType } from "@/types/xen-api";
+import type { RawObjectType, XenApiMessage } from '@/libs/xen-api/xen-api.types'
+import type { XenApiAlarm, XenApiAlarmType } from '@/types/xen-api'
 
 export const messageToAlarm = <RelationType extends RawObjectType>(
   message: XenApiMessage<RelationType> | undefined
 ): XenApiAlarm<RelationType> | undefined => {
-  if (message === undefined || message.name !== "ALARM") {
-    return;
+  if (message === undefined || message.name !== 'ALARM') {
+    return
   }
 
   return {
     ...message,
     ...parseAlarmBody(message.body),
-  };
-};
+  }
+}
 
 export const messagesToAlarms = (messages: XenApiMessage<any>[]) => {
   return messages.reduce((acc, message) => {
-    const alarm = messageToAlarm(message);
+    const alarm = messageToAlarm(message)
 
     if (alarm !== undefined) {
-      acc.push(alarm);
+      acc.push(alarm)
     }
 
-    return acc;
-  }, [] as XenApiAlarm<any>[]);
-};
+    return acc
+  }, [] as XenApiAlarm<any>[])
+}
 
 const parseXml = (xml: string) => {
-  const parser = new DOMParser();
-  const dom = parser.parseFromString(xml, "text/xml");
+  const parser = new DOMParser()
+  const dom = parser.parseFromString(xml, 'text/xml')
 
-  if (dom.querySelector("parsererror") !== null) {
-    return {};
+  if (dom.querySelector('parsererror') !== null) {
+    return {}
   }
 
-  const variable = dom.querySelector("variable");
+  const variable = dom.querySelector('variable')
 
-  const type = variable
-    ?.querySelector("name")
-    ?.getAttribute("value") as XenApiAlarmType;
+  const type = variable?.querySelector('name')?.getAttribute('value') as XenApiAlarmType
 
-  const triggerLevel = variable
-    ?.querySelector("alarm_trigger_level")
-    ?.getAttribute("value");
+  const triggerLevel = variable?.querySelector('alarm_trigger_level')?.getAttribute('value')
 
   return {
     type,
     triggerLevel,
-  };
-};
+  }
+}
 
 // body is a string in the following form:
 // ```
@@ -63,17 +56,15 @@ const parseXml = (xml: string) => {
 //     <... />
 // </variable>
 // ```
-export const parseAlarmBody = (
-  body: string
-): { level: number; type: XenApiAlarmType; triggerLevel: number } => {
-  const lines = body.split("\n");
-  const level = parseFloat(lines[0].split(":")[1].trim());
+export const parseAlarmBody = (body: string): { level: number; type: XenApiAlarmType; triggerLevel: number } => {
+  const lines = body.split('\n')
+  const level = parseFloat(lines[0].split(':')[1].trim())
 
-  const document = parseXml(lines.slice(2).join("\n"));
+  const document = parseXml(lines.slice(2).join('\n'))
 
   return {
     level: isNaN(level) ? 0 : level,
-    type: document.type ?? "unknown",
-    triggerLevel: parseFloat(document.triggerLevel ?? "0"),
-  };
-};
+    type: document.type ?? 'unknown',
+    triggerLevel: parseFloat(document.triggerLevel ?? '0'),
+  }
+}
diff --git a/@xen-orchestra/lite/src/libs/complex-matcher.utils.ts b/@xen-orchestra/lite/src/libs/complex-matcher.utils.ts
index 4a11b0e9c0e..e613ddef12f 100644
--- a/@xen-orchestra/lite/src/libs/complex-matcher.utils.ts
+++ b/@xen-orchestra/lite/src/libs/complex-matcher.utils.ts
@@ -1,81 +1,68 @@
-import { escapeRegExp } from "@/libs/utils";
-import type { FilterComparisonType } from "@/types/filter";
-import type { ComparisonOperator, ComplexMatcherNode } from "complex-matcher";
-import * as CM from "complex-matcher";
+import { escapeRegExp } from '@/libs/utils'
+import type { FilterComparisonType } from '@/types/filter'
+import type { ComparisonOperator, ComplexMatcherNode } from 'complex-matcher'
+import * as CM from 'complex-matcher'
 
 function buildStringNode(property: string, value: string, negate = false) {
   if (!value) {
-    return;
+    return
   }
 
-  const node = new CM.Property(property, new CM.StringNode(value));
+  const node = new CM.Property(property, new CM.StringNode(value))
 
   if (negate) {
-    return new CM.Not(node);
+    return new CM.Not(node)
   }
 
-  return node;
+  return node
 }
 
-function buildRegexNode(
-  property: string,
-  value: string,
-  prefix = "",
-  suffix = "",
-  escape = false,
-  negate = false
-) {
+function buildRegexNode(property: string, value: string, prefix = '', suffix = '', escape = false, negate = false) {
   if (!value) {
-    return;
+    return
   }
 
   if (escape) {
-    value = escapeRegExp(value);
+    value = escapeRegExp(value)
   }
 
-  const node = new CM.Property(
-    property,
-    new CM.RegExpNode(`${prefix}${value}${suffix}`, "i")
-  );
+  const node = new CM.Property(property, new CM.RegExpNode(`${prefix}${value}${suffix}`, 'i'))
 
   if (negate) {
-    return new CM.Not(node);
+    return new CM.Not(node)
   }
 
-  return node;
+  return node
 }
 
 function buildNumberComparisonNode(
   property: string,
   value: string | number,
-  comparisonOperator: ComparisonOperator | "="
+  comparisonOperator: ComparisonOperator | '='
 ) {
-  if (typeof value === "string") {
-    value = parseInt(value, 10);
+  if (typeof value === 'string') {
+    value = parseInt(value, 10)
   }
 
   if (isNaN(value)) {
-    return;
+    return
   }
 
-  if (comparisonOperator === "=") {
-    return new CM.Property(property, new CM.Number(value));
+  if (comparisonOperator === '=') {
+    return new CM.Property(property, new CM.Number(value))
   }
 
-  return new CM.Property(
-    property,
-    new CM.Comparison(comparisonOperator, value)
-  );
+  return new CM.Property(property, new CM.Comparison(comparisonOperator, value))
 }
 
 function buildBooleanNode(property: string, value: boolean) {
-  const node = new CM.TruthyProperty(property);
+  const node = new CM.TruthyProperty(property)
 
   if (!value) {
-    return new CM.Not(node);
+    return new CM.Not(node)
   }
 
-  return node;
+  return node
 }
 
 export function buildComplexMatcherNode(
@@ -84,73 +71,48 @@ export function buildComplexMatcherNode(
   value: string
 ): ComplexMatcherNode | undefined {
   switch (comparisonType) {
-    case "stringContains":
-    case "stringDoesNotContains":
-      return buildStringNode(
-        property,
-        value,
-        comparisonType === "stringDoesNotContains"
-      );
-
-    case "stringStartsWith":
-    case "stringDoesNotStartWith":
-      return buildRegexNode(
-        property,
-        value,
-        "^",
-        "",
-        true,
-        comparisonType === "stringDoesNotStartWith"
-      );
-
-    case "stringEndsWith":
-    case "stringDoesNotEndWith":
+    case 'stringContains':
+    case 'stringDoesNotContains':
+      return buildStringNode(property, value, comparisonType === 'stringDoesNotContains')
+
+    case 'stringStartsWith':
+    case 'stringDoesNotStartWith':
+      return buildRegexNode(property, value, '^', '', true, comparisonType === 'stringDoesNotStartWith')
+
+    case 'stringEndsWith':
+    case 'stringDoesNotEndWith':
+      return buildRegexNode(property, value, '', '$', true, comparisonType === 'stringDoesNotEndWith')
+
+    case 'stringEquals':
+    case 'stringDoesNotEqual':
+    case 'enumIs':
+    case 'enumIsNot':
       return buildRegexNode(
         property,
         value,
-        "",
-        "$",
+        '^',
+        '$',
         true,
-        comparisonType === "stringDoesNotEndWith"
-      );
-
-    case "stringEquals":
-    case "stringDoesNotEqual":
-    case "enumIs":
-    case "enumIsNot":
-      return buildRegexNode(
-        property,
-        value,
-        "^",
-        "$",
-        true,
-        ["stringDoesNotEqual", "enumIsNot"].includes(comparisonType)
-      );
-
-    case "stringMatchesRegex":
-    case "stringDoesNotMatchRegex":
-      return buildRegexNode(
-        property,
-        value,
-        "",
-        "",
-        false,
-        comparisonType === "stringDoesNotMatchRegex"
-      );
-
-    case "numberLessThan":
-      return buildNumberComparisonNode(property, value, "<");
-    case "numberLessThanOrEquals":
-      return buildNumberComparisonNode(property, value, "<=");
-    case "numberEquals":
-      return buildNumberComparisonNode(property, value, "=");
-    case "numberGreaterThanOrEquals":
-      return buildNumberComparisonNode(property, value, ">=");
-    case "numberGreaterThan":
-      return buildNumberComparisonNode(property, value, ">");
-    case "booleanTrue":
-      return buildBooleanNode(property, true);
-    case "booleanFalse":
-      return buildBooleanNode(property, false);
+        ['stringDoesNotEqual', 'enumIsNot'].includes(comparisonType)
+      )
+
+    case 'stringMatchesRegex':
+    case 'stringDoesNotMatchRegex':
+      return buildRegexNode(property, value, '', '', false, comparisonType === 'stringDoesNotMatchRegex')
+
+    case 'numberLessThan':
+      return buildNumberComparisonNode(property, value, '<')
+    case 'numberLessThanOrEquals':
+      return buildNumberComparisonNode(property, value, '<=')
+    case 'numberEquals':
+      return buildNumberComparisonNode(property, value, '=')
+    case 'numberGreaterThanOrEquals':
+      return buildNumberComparisonNode(property, value, '>=')
+    case 'numberGreaterThan':
+      return buildNumberComparisonNode(property, value, '>')
+    case 'booleanTrue':
+      return buildBooleanNode(property, true)
+    case 'booleanFalse':
+      return buildBooleanNode(property, false)
   }
 }
diff --git a/@xen-orchestra/lite/src/libs/highlight.ts b/@xen-orchestra/lite/src/libs/highlight.ts
index 8b6d7b7c59d..e9e3eec3f48 100644
--- a/@xen-orchestra/lite/src/libs/highlight.ts
+++ b/@xen-orchestra/lite/src/libs/highlight.ts
@@ -1,27 +1,22 @@
-import type { HighlightResult } from "highlight.js";
-import HLJS from "highlight.js/lib/core";
-import cssLang from "highlight.js/lib/languages/css";
-import jsonLang from "highlight.js/lib/languages/json";
-import textLang from "highlight.js/lib/languages/plaintext";
-import tsLang from "highlight.js/lib/languages/typescript";
-import xmlLang from "highlight.js/lib/languages/xml";
-import "highlight.js/styles/github-dark.css";
+import type { HighlightResult } from 'highlight.js'
+import HLJS from 'highlight.js/lib/core'
+import cssLang from 'highlight.js/lib/languages/css'
+import jsonLang from 'highlight.js/lib/languages/json'
+import textLang from 'highlight.js/lib/languages/plaintext'
+import tsLang from 'highlight.js/lib/languages/typescript'
+import xmlLang from 'highlight.js/lib/languages/xml'
+import 'highlight.js/styles/github-dark.css'
 
-HLJS.registerLanguage("xml", xmlLang);
-HLJS.registerLanguage("css", cssLang);
-HLJS.registerLanguage("typescript", tsLang);
-HLJS.registerLanguage("json", jsonLang);
-HLJS.registerLanguage("plaintext", textLang);
+export type AcceptedLanguage = 'xml' | 'css' | 'typescript' | 'json' | 'plaintext'
+
+HLJS.registerLanguage('xml', xmlLang)
+HLJS.registerLanguage('css', cssLang)
+HLJS.registerLanguage('typescript', tsLang)
+HLJS.registerLanguage('json', jsonLang)
+HLJS.registerLanguage('plaintext', textLang)
 
 export const highlight: (
   code: string,
   options: { language: AcceptedLanguage },
   ignoreIllegals?: boolean
-) => HighlightResult = HLJS.highlight;
-
-export type AcceptedLanguage =
-  | "xml"
-  | "css"
-  | "typescript"
-  | "json"
-  | "plaintext";
+) => HighlightResult = HLJS.highlight
diff --git a/@xen-orchestra/lite/src/libs/markdown.ts b/@xen-orchestra/lite/src/libs/markdown.ts
index 40c173d07c9..03a2d44fe36 100644
--- a/@xen-orchestra/lite/src/libs/markdown.ts
+++ b/@xen-orchestra/lite/src/libs/markdown.ts
@@ -1,88 +1,88 @@
-import { type AcceptedLanguage, highlight } from "@/libs/highlight";
-import HLJS from "highlight.js/lib/core";
-import { marked } from "marked";
+import { type AcceptedLanguage, highlight } from '@/libs/highlight'
+import HLJS from 'highlight.js/lib/core'
+import { marked } from 'marked'
 
 enum VUE_TAG {
-  TEMPLATE = "vue-template",
-  SCRIPT = "vue-script",
-  STYLE = "vue-style",
+  TEMPLATE = 'vue-template',
+  SCRIPT = 'vue-script',
+  STYLE = 'vue-style',
 }
 
 function extractLang(lang: string | undefined): AcceptedLanguage | VUE_TAG {
   if (lang === undefined) {
-    return "plaintext";
+    return 'plaintext'
   }
 
   if (Object.values(VUE_TAG).includes(lang as VUE_TAG)) {
-    return lang as VUE_TAG;
+    return lang as VUE_TAG
   }
 
   if (HLJS.getLanguage(lang) !== undefined) {
-    return lang as AcceptedLanguage;
+    return lang as AcceptedLanguage
   }
 
-  return "plaintext";
+  return 'plaintext'
 }
 
 marked.use({
   renderer: {
     code(str, lang) {
-      const code = customHighlight(str, extractLang(lang));
-      return `<pre class="hljs"><button class="copy-button" type="button">Copy</button><code class="hljs-code">${code}</code></pre>`;
+      const code = customHighlight(str, extractLang(lang))
+      return `<pre class="hljs"><button class="copy-button" type="button">Copy</button><code class="hljs-code">${code}</code></pre>`
     },
   },
-});
+})
 
 function customHighlight(str: string, lang: AcceptedLanguage | VUE_TAG) {
   switch (lang) {
     case VUE_TAG.TEMPLATE: {
       const indented = str
         .trim()
-        .split("\n")
-        .map((s) => `  ${s}`)
-        .join("\n");
-      return wrap(indented, lang);
+        .split('\n')
+        .map(s => `  ${s}`)
+        .join('\n')
+      return wrap(indented, lang)
     }
     case VUE_TAG.SCRIPT:
     case VUE_TAG.STYLE:
-      return wrap(str.trim(), lang);
+      return wrap(str.trim(), lang)
     default: {
-      return copyable(highlight(str, { language: lang }).value);
+      return copyable(highlight(str, { language: lang }).value)
     }
   }
 }
 
 function wrap(str: string, lang: VUE_TAG) {
-  let openTag;
-  let closeTag;
-  let code;
+  let openTag
+  let closeTag
+  let code
 
   switch (lang) {
     case VUE_TAG.TEMPLATE:
-      openTag = "<template>";
-      closeTag = "</template>";
-      code = highlight(str, { language: "xml" }).value;
-      break;
+      openTag = '<template>'
+      closeTag = '</template>'
+      code = highlight(str, { language: 'xml' }).value
+      break
     case VUE_TAG.SCRIPT:
-      openTag = '<script lang="ts" setup>';
-      closeTag = "</script>";
-      code = highlight(str, { language: "typescript" }).value;
-      break;
+      openTag = '<script lang="ts" setup>'
+      closeTag = '</script>'
+      code = highlight(str, { language: 'typescript' }).value
+      break
     case VUE_TAG.STYLE:
-      openTag = '<style lang="postcss" scoped>';
-      closeTag = "</style>";
-      code = highlight(str, { language: "css" }).value;
-      break;
+      openTag = '<style lang="postcss" scoped>'
+      closeTag = '</style>'
+      code = highlight(str, { language: 'css' }).value
+      break
   }
 
-  const openTagHtml = highlight(openTag, { language: "xml" }).value;
-  const closeTagHtml = highlight(closeTag, { language: "xml" }).value;
+  const openTagHtml = highlight(openTag, { language: 'xml' }).value
+  const closeTagHtml = highlight(closeTag, { language: 'xml' }).value
 
-  return `${openTagHtml}${copyable(code)}${closeTagHtml}`;
+  return `${openTagHtml}${copyable(code)}${closeTagHtml}`
 }
 
 function copyable(code: string) {
-  return `<div class="copyable">${code}</div>`;
+  return `<div class="copyable">${code}</div>`
 }
 
-export default marked;
+export default marked
diff --git a/@xen-orchestra/lite/src/libs/mixin.ts b/@xen-orchestra/lite/src/libs/mixin.ts
index fdf47517259..1e0a2cd7f31 100644
--- a/@xen-orchestra/lite/src/libs/mixin.ts
+++ b/@xen-orchestra/lite/src/libs/mixin.ts
@@ -1,19 +1,13 @@
-type UnionToIntersection<T> = (T extends any ? (x: T) => any : never) extends (
-  x: infer R
-) => any
-  ? R
-  : never;
+type UnionToIntersection<T> = (T extends any ? (x: T) => any : never) extends (x: infer R) => any ? R : never
 
-export type MixinConstructor<T = unknown> = new (...args: any[]) => T;
+export type MixinConstructor<T = unknown> = new (...args: any[]) => T
 
-export type MixinAbstractConstructor<T = unknown> = abstract new (
-  ...args: any[]
-) => T;
+export type MixinAbstractConstructor<T = unknown> = abstract new (...args: any[]) => T
 
 export type MixinFunction<
   T extends MixinConstructor | MixinAbstractConstructor = MixinConstructor,
   R extends T = T & MixinConstructor,
-> = (Base: T) => R;
+> = (Base: T) => R
 
 export type MixinReturnValue<
   T extends MixinConstructor | MixinAbstractConstructor,
@@ -21,16 +15,13 @@ export type MixinReturnValue<
 > = UnionToIntersection<
   | T
   | {
-      [K in keyof M]: M[K] extends MixinFunction<any, infer U> ? U : never;
+      [K in keyof M]: M[K] extends MixinFunction<any, infer U> ? U : never
     }[number]
->;
+>
 
-export default function mixin<
-  T extends MixinConstructor | MixinAbstractConstructor,
-  M extends MixinFunction<T, any>[],
->(Base: T, ...mixins: M): MixinReturnValue<T, M> {
-  return mixins.reduce(
-    (mix, applyMixin) => applyMixin(mix),
-    Base
-  ) as MixinReturnValue<T, M>;
+export default function mixin<T extends MixinConstructor | MixinAbstractConstructor, M extends MixinFunction<T, any>[]>(
+  Base: T,
+  ...mixins: M
+): MixinReturnValue<T, M> {
+  return mixins.reduce((mix, applyMixin) => applyMixin(mix), Base) as MixinReturnValue<T, M>
 }
diff --git a/@xen-orchestra/lite/src/libs/story/story-param.ts b/@xen-orchestra/lite/src/libs/story/story-param.ts
index e572ca35839..b32f79f6580 100644
--- a/@xen-orchestra/lite/src/libs/story/story-param.ts
+++ b/@xen-orchestra/lite/src/libs/story/story-param.ts
@@ -1,451 +1,425 @@
-import {
-  faFloppyDisk,
-  faRocket,
-  faShip,
-  faTrash,
-} from "@fortawesome/free-solid-svg-icons";
-import mixin, { type MixinAbstractConstructor } from "@/libs/mixin";
-import type { Widget } from "@/libs/story/story-widget";
-import {
-  boolean,
-  choice,
-  number,
-  object,
-  text,
-} from "@/libs/story/story-widget";
+import { faFloppyDisk, faRocket, faShip, faTrash } from '@fortawesome/free-solid-svg-icons'
+import mixin, { type MixinAbstractConstructor } from '@/libs/mixin'
+import type { Widget } from '@/libs/story/story-widget'
+import { boolean, choice, number, object, text } from '@/libs/story/story-widget'
 
 function WithType(Base: MixinAbstractConstructor<BaseParam>) {
-  abstract class WithType extends Base /*implements HasType*/ {
-    #type: string | undefined;
+  abstract class WithType extends Base /* implements HasType */ {
+    #type: string | undefined
 
     type(type: string) {
-      this.#type = type;
+      this.#type = type
 
-      return this;
+      return this
     }
 
-    abstract getTypeLabel(): string;
+    abstract getTypeLabel(): string
 
     getType() {
-      return this.#type;
+      return this.#type
     }
   }
 
-  return WithType;
+  return WithType
 }
 
 function WithWidget(Base: MixinAbstractConstructor<BaseParam>) {
-  abstract class WithWidget extends Base /*implements HasWidget*/ {
-    #widget: Widget | undefined;
+  abstract class WithWidget extends Base /* implements HasWidget */ {
+    #widget: Widget | undefined
 
-    abstract guessWidget(): Widget | undefined;
+    abstract guessWidget(): Widget | undefined
 
     widget(widget?: Widget): this {
-      this.#widget = widget === undefined ? this.guessWidget() : widget;
+      this.#widget = widget === undefined ? this.guessWidget() : widget
 
-      return this;
+      return this
     }
 
     getWidget() {
-      return this.#widget;
+      return this.#widget
     }
 
     hasWidget() {
-      return this.#widget !== undefined;
+      return this.#widget !== undefined
     }
   }
 
-  return WithWidget;
+  return WithWidget
 }
 
 abstract class BaseParam {
-  #help: string | undefined;
-  readonly #name: string;
-  #presetValue: any;
+  #help: string | undefined
+  readonly #name: string
+  #presetValue: any
 
-  protected abstract getNamePrefix(): string;
+  protected abstract getNamePrefix(): string
 
-  protected abstract getNameSuffix(): string;
+  protected abstract getNameSuffix(): string
 
   constructor(name: string) {
-    this.#name = name;
+    this.#name = name
   }
 
   get name() {
-    return this.#name;
+    return this.#name
   }
 
   getFullName() {
-    return `${this.getNamePrefix()}${this.name}${this.getNameSuffix()}`;
+    return `${this.getNamePrefix()}${this.name}${this.getNameSuffix()}`
   }
 
   help(help: string) {
-    this.#help = help;
-    return this;
+    this.#help = help
+    return this
   }
 
   getHelp() {
-    return this.#help;
+    return this.#help
   }
 
   preset(presetValue: any) {
-    this.#presetValue = presetValue;
-    return this;
+    this.#presetValue = presetValue
+    return this
   }
 
   getPresetValue() {
-    return this.#presetValue;
+    return this.#presetValue
   }
 }
 
 export class PropParam extends mixin(BaseParam, WithWidget, WithType) {
-  #isRequired = false;
-  #defaultValue: any;
-  #isVModel: boolean;
+  #isRequired = false
+  #defaultValue: any
+  #isVModel: boolean
 
   constructor(name: string, isVModel = false) {
-    super(name);
-    this.#isVModel = isVModel;
+    super(name)
+    this.#isVModel = isVModel
   }
 
   isRequired() {
-    return this.#isRequired;
+    return this.#isRequired
   }
 
   isVModel() {
-    return this.#isVModel;
+    return this.#isVModel
   }
 
   getVModelDirective() {
-    return this.name === "modelValue" ? "v-model" : `v-model:${this.name}`;
+    return this.name === 'modelValue' ? 'v-model' : `v-model:${this.name}`
   }
 
   getNamePrefix() {
-    return this.getType() === "string" ? "" : ":";
+    return this.getType() === 'string' ? '' : ':'
   }
 
   getNameSuffix() {
-    return this.isRequired() ? "" : "?";
+    return this.isRequired() ? '' : '?'
   }
 
   getTypeLabel() {
-    const type = this.getType();
+    const type = this.getType()
 
     if (type !== undefined) {
-      return type;
+      return type
     }
 
     if (this.#isEnum) {
-      return this.#enumItems.map((item) => JSON.stringify(item)).join(" | ");
+      return this.#enumItems.map(item => JSON.stringify(item)).join(' | ')
     }
 
-    const presetValue = this.getPresetValue();
+    const presetValue = this.getPresetValue()
 
     if (presetValue !== undefined) {
-      return typeof presetValue;
+      return typeof presetValue
     }
 
-    return "unknown";
+    return 'unknown'
   }
 
   guessWidget() {
     if (this.#isEnum) {
-      return choice(...this.#enumItems);
+      return choice(...this.#enumItems)
     }
 
     if (this.#isObject) {
-      return object();
+      return object()
     }
 
     switch (this.getTypeLabel()) {
-      case "boolean":
-        return boolean();
-      case "number":
-        return number();
-      case "string":
-        return text();
+      case 'boolean':
+        return boolean()
+      case 'number':
+        return number()
+      case 'string':
+        return text()
     }
   }
 
   required() {
-    this.#isRequired = true;
-    return this;
+    this.#isRequired = true
+    return this
   }
 
   default(defaultValue: any) {
-    this.#defaultValue = defaultValue;
-    return this;
+    this.#defaultValue = defaultValue
+    return this
   }
 
   getDefaultValue() {
-    return this.#defaultValue;
+    return this.#defaultValue
   }
 
   bool() {
-    return this.default(false).type("boolean");
+    return this.default(false).type('boolean')
   }
 
   num() {
-    return this.type("number");
+    return this.type('number')
   }
 
   str() {
-    return this.type("string");
+    return this.type('string')
   }
 
-  arr(type = "any") {
-    return this.type(`${type}[]`);
+  arr(type = 'any') {
+    return this.type(`${type}[]`)
   }
 
-  #isEnum = false;
-  #enumItems: any[] = [];
+  #isEnum = false
+  #enumItems: any[] = []
 
   enum(...items: any[]) {
-    this.#isEnum = true;
-    this.#enumItems = items;
-    return this;
+    this.#isEnum = true
+    this.#enumItems = items
+    return this
   }
 
   any() {
-    return this.type("any");
+    return this.type('any')
   }
 
-  #isObject = false;
+  #isObject = false
 
-  obj(type = "object") {
-    this.#isObject = true;
-    return this.type(type);
+  obj(type = 'object') {
+    this.#isObject = true
+    return this.type(type)
   }
 
-  #isUsingContext = false;
+  #isUsingContext = false
 
   ctx() {
-    this.#isUsingContext = true;
-    return this;
+    this.#isUsingContext = true
+    return this
   }
 
   isUsingContext() {
-    return this.#isUsingContext;
+    return this.#isUsingContext
   }
 }
 
 export class EventParam extends mixin(BaseParam, WithType) {
-  #args: Record<string, string> = {};
-  #returnType: string | undefined;
-  readonly #isVModel: boolean;
+  #args: Record<string, string> = {}
+  #returnType: string | undefined
+  readonly #isVModel: boolean
 
   constructor(name: string, isVModel = false) {
-    super(name);
-    this.#isVModel = isVModel;
+    super(name)
+    this.#isVModel = isVModel
   }
 
   get name() {
     if (this.isVModel()) {
-      return `update:${super.name}`;
+      return `update:${super.name}`
     }
 
-    return super.name;
+    return super.name
   }
 
   get rawName() {
-    return super.name;
+    return super.name
   }
 
   isVModel() {
-    return this.#isVModel;
+    return this.#isVModel
   }
 
   getNamePrefix() {
-    return "@";
+    return '@'
   }
 
   getNameSuffix() {
-    return "";
+    return ''
   }
 
   args(args: Record<string, string>) {
-    this.#args = args;
-    return this;
+    this.#args = args
+    return this
   }
 
   getArguments() {
-    return this.#args;
+    return this.#args
   }
 
   return(returnType: string) {
-    this.#returnType = returnType;
-    return this;
+    this.#returnType = returnType
+    return this
   }
 
   getTypeLabel() {
-    const type = this.getType();
+    const type = this.getType()
 
     if (type !== undefined) {
-      return type;
+      return type
     }
 
-    const args: string[] = [];
+    const args: string[] = []
 
     Object.entries(this.#args).forEach(([name, type]) => {
-      args.push(`${name}: ${type}`);
-    });
+      args.push(`${name}: ${type}`)
+    })
 
-    return `(${args.join(", ")}) => ${this.#returnType ?? "void"}`;
+    return `(${args.join(', ')}) => ${this.#returnType ?? 'void'}`
   }
 }
 
 export class SlotParam extends BaseParam {
-  #props: { name: string; type: string }[] = [];
+  #props: { name: string; type: string }[] = []
 
   getNamePrefix() {
-    return "#";
+    return '#'
   }
 
   getNameSuffix() {
-    return "";
+    return ''
   }
 
   prop(name: string, type: string) {
-    this.#props.push({ name, type });
-    return this;
+    this.#props.push({ name, type })
+    return this
   }
 
   getPropsType() {
-    return `{ ${this.#props
-      .map((prop) => `${prop.name}: ${prop.type}`)
-      .join(", ")} }`;
+    return `{ ${this.#props.map(prop => `${prop.name}: ${prop.type}`).join(', ')} }`
   }
 
   hasProps() {
-    return this.#props.length > 0;
+    return this.#props.length > 0
   }
 
   get props() {
-    return this.#props;
+    return this.#props
   }
 
   preset(): never {
-    throw new Error("Cannot preset a slot");
+    throw new Error('Cannot preset a slot')
   }
 }
 
 export class SettingParam extends mixin(BaseParam, WithWidget) {
   getNamePrefix() {
-    return "";
+    return ''
   }
 
   getNameSuffix() {
-    return "";
+    return ''
   }
 
   guessWidget() {
-    const type = typeof this.getPresetValue();
+    const type = typeof this.getPresetValue()
 
     switch (type) {
-      case "string":
-        return text();
+      case 'string':
+        return text()
     }
   }
 }
 
 export class ModelParam extends BaseParam {
-  readonly #prop: PropParam;
-  readonly #event: EventParam;
+  readonly #prop: PropParam
+  readonly #event: EventParam
 
   protected getNameSuffix() {
-    return "";
+    return ''
   }
 
   protected getNamePrefix() {
-    return "";
+    return ''
   }
 
   constructor(name: string) {
-    super(name);
-    this.#prop = new PropParam(name, true);
+    super(name)
+    this.#prop = new PropParam(name, true)
     this.#event = new EventParam(name, true).args({
-      value: "unknown",
-    });
+      value: 'unknown',
+    })
   }
 
   prop(func: (param: PropParam) => void) {
-    func(this.#prop);
-    return this;
+    func(this.#prop)
+    return this
   }
 
   event(func: (param: EventParam) => void) {
-    func(this.#event);
-    return this;
+    func(this.#event)
+    return this
   }
 
   required() {
-    this.#prop.required();
-    return this;
+    this.#prop.required()
+    return this
   }
 
   type(type: string) {
-    this.#prop.type(type);
-    this.#event.args({ value: type });
-    return this;
+    this.#prop.type(type)
+    this.#event.args({ value: type })
+    return this
   }
 
   preset(presetValue: any) {
-    this.#prop.preset(presetValue);
-    return this;
+    this.#prop.preset(presetValue)
+    return this
   }
 
   help(help: string) {
-    this.#prop.help(help);
-    return this;
+    this.#prop.help(help)
+    return this
   }
 
   getPropParam() {
-    return this.#prop;
+    return this.#prop
   }
 
   getEventParam() {
-    return this.#event;
+    return this.#event
   }
 }
 
-export type Param =
-  | EventParam
-  | PropParam
-  | SlotParam
-  | ModelParam
-  | SettingParam;
-
-export const prop = (name: string) => new PropParam(name);
-export const event = (name: string) => new EventParam(name);
-export const slot = (name = "default") => new SlotParam(name);
-export const setting = (name: string) => new SettingParam(name);
-export const model = (name = "modelValue") => new ModelParam(name);
-
-export const isPropParam = (param: any): param is PropParam =>
-  param instanceof PropParam;
-export const isSettingParam = (param: any): param is SettingParam =>
-  param instanceof SettingParam;
-export const isEventParam = (param: any): param is EventParam =>
-  param instanceof EventParam;
-export const isSlotParam = (param: any): param is SlotParam =>
-  param instanceof SlotParam;
-export const isModelParam = (param: any): param is ModelParam =>
-  param instanceof ModelParam;
-
-export const colorProp = (name = "color") =>
-  prop(name)
-    .enum("info", "success", "warning", "error")
-    .default("info")
-    .widget();
+export type Param = EventParam | PropParam | SlotParam | ModelParam | SettingParam
+
+export const prop = (name: string) => new PropParam(name)
+export const event = (name: string) => new EventParam(name)
+export const slot = (name = 'default') => new SlotParam(name)
+export const setting = (name: string) => new SettingParam(name)
+export const model = (name = 'modelValue') => new ModelParam(name)
+
+export const isPropParam = (param: any): param is PropParam => param instanceof PropParam
+export const isSettingParam = (param: any): param is SettingParam => param instanceof SettingParam
+export const isEventParam = (param: any): param is EventParam => param instanceof EventParam
+export const isSlotParam = (param: any): param is SlotParam => param instanceof SlotParam
+export const isModelParam = (param: any): param is ModelParam => param instanceof ModelParam
+
+export const colorProp = (name = 'color') =>
+  prop(name).enum('info', 'success', 'warning', 'error').default('info').widget()
 
-export const iconProp = (name = "icon") =>
+export const iconProp = (name = 'icon') =>
   prop(name)
-    .type("IconDefinition")
+    .type('IconDefinition')
     .widget(
       choice(
-        { label: "Ship", value: faShip },
-        { label: "Rocket", value: faRocket },
-        { label: "Floppy", value: faFloppyDisk },
-        { label: "Trash", value: faTrash }
+        { label: 'Ship', value: faShip },
+        { label: 'Rocket', value: faRocket },
+        { label: 'Floppy', value: faFloppyDisk },
+        { label: 'Trash', value: faTrash }
       )
-    );
+    )
diff --git a/@xen-orchestra/lite/src/libs/story/story-widget.ts b/@xen-orchestra/lite/src/libs/story/story-widget.ts
index 26a44535341..2f6de8e7aaa 100644
--- a/@xen-orchestra/lite/src/libs/story/story-widget.ts
+++ b/@xen-orchestra/lite/src/libs/story/story-widget.ts
@@ -1,110 +1,95 @@
-export type WidgetType =
-  | "select"
-  | "radio"
-  | "boolean"
-  | "text"
-  | "object"
-  | "static"
-  | "number";
+export type WidgetType = 'select' | 'radio' | 'boolean' | 'text' | 'object' | 'static' | 'number'
 
 export abstract class Widget {
-  #type: WidgetType;
+  #type: WidgetType
 
   protected constructor(type: WidgetType) {
-    this.#type = type;
+    this.#type = type
   }
 
   get type() {
-    return this.#type;
+    return this.#type
   }
 
   protected set type(type: WidgetType) {
-    this.#type = type;
+    this.#type = type
   }
 }
 
 const hasOwn = (obj: object, ...properties: PropertyKey[]) => {
-  return properties.every((property) =>
-    Object.prototype.hasOwnProperty.call(obj, property)
-  );
-};
+  return properties.every(property => Object.prototype.hasOwnProperty.call(obj, property))
+}
 
 class ChoiceWidget extends Widget {
-  #choices: any[];
-  #isEnum = false;
+  #choices: any[]
+  #isEnum = false
 
   constructor(choices: any[]) {
-    super("select");
-    this.#choices = choices;
+    super('select')
+    this.#choices = choices
   }
 
   get choices(): { label: any; value: any }[] {
-    return this.#choices.map((choice) => {
-      if (hasOwn(choice, "label", "value")) {
-        return choice;
+    return this.#choices.map(choice => {
+      if (hasOwn(choice, 'label', 'value')) {
+        return choice
       }
 
-      return { label: choice, value: choice };
-    });
+      return { label: choice, value: choice }
+    })
   }
 
   enum() {
-    this.#isEnum = true;
+    this.#isEnum = true
   }
 
   radio() {
-    this.type = "radio";
-    return this;
+    this.type = 'radio'
+    return this
   }
 }
 
 class TextWidget extends Widget {
   constructor() {
-    super("text");
+    super('text')
   }
 }
 
 class NumberWidget extends Widget {
   constructor() {
-    super("number");
+    super('number')
   }
 }
 
 class BooleanWidget extends Widget {
   constructor() {
-    super("boolean");
+    super('boolean')
   }
 }
 
 class ObjectWidget extends Widget {
   constructor() {
-    super("object");
+    super('object')
   }
 }
 
-export const choice = (...choices: any[]) => new ChoiceWidget(choices);
-export const text = () => new TextWidget();
-export const number = () => new NumberWidget();
-export const boolean = () => new BooleanWidget();
-export const object = () => new ObjectWidget();
+export const choice = (...choices: any[]) => new ChoiceWidget(choices)
+export const text = () => new TextWidget()
+export const number = () => new NumberWidget()
+export const boolean = () => new BooleanWidget()
+export const object = () => new ObjectWidget()
 
-export const isSelectWidget = (widget: Widget): widget is ChoiceWidget =>
-  widget.type === "select";
+export const isSelectWidget = (widget: Widget): widget is ChoiceWidget => widget.type === 'select'
 
-export const isRadioWidget = (widget: Widget): widget is ChoiceWidget =>
-  widget.type === "radio";
+export const isRadioWidget = (widget: Widget): widget is ChoiceWidget => widget.type === 'radio'
 
 export const isChoiceWidget = (widget: Widget): widget is ChoiceWidget =>
-  isSelectWidget(widget) || isRadioWidget(widget);
+  isSelectWidget(widget) || isRadioWidget(widget)
 
-export const isBooleanWidget = (widget: Widget): widget is BooleanWidget =>
-  widget.type === "boolean";
+export const isBooleanWidget = (widget: Widget): widget is BooleanWidget => widget.type === 'boolean'
 
-export const isNumberWidget = (widget: Widget): widget is NumberWidget =>
-  widget.type === "number";
+export const isNumberWidget = (widget: Widget): widget is NumberWidget => widget.type === 'number'
 
-export const isTextWidget = (widget: Widget): widget is TextWidget =>
-  widget.type === "text";
+export const isTextWidget = (widget: Widget): widget is TextWidget => widget.type === 'text'
 
-export const isObjectWidget = (widget: Widget): widget is ObjectWidget =>
-  widget.type === "object";
+export const isObjectWidget = (widget: Widget): widget is ObjectWidget => widget.type === 'object'
diff --git a/@xen-orchestra/lite/src/libs/utils.ts b/@xen-orchestra/lite/src/libs/utils.ts
index 1ce7d692183..a0a5abda76f 100644
--- a/@xen-orchestra/lite/src/libs/utils.ts
+++ b/@xen-orchestra/lite/src/libs/utils.ts
@@ -1,22 +1,19 @@
-import type { Filter } from "@/types/filter";
-import { faSquareCheck } from "@fortawesome/free-regular-svg-icons";
-import { faFont, faHashtag, faList } from "@fortawesome/free-solid-svg-icons";
-import { utcParse } from "d3-time-format";
-import humanFormat from "human-format";
-import { find, forEach, round, size, sum } from "lodash-es";
-
-export function sortRecordsByNameLabel(
-  record1: { name_label: string },
-  record2: { name_label: string }
-) {
-  const label1 = record1.name_label.toLocaleLowerCase();
-  const label2 = record2.name_label.toLocaleLowerCase();
-
-  return label1.localeCompare(label2);
+import type { Filter } from '@/types/filter'
+import { faSquareCheck } from '@fortawesome/free-regular-svg-icons'
+import { faFont, faHashtag, faList } from '@fortawesome/free-solid-svg-icons'
+import { utcParse } from 'd3-time-format'
+import format from 'human-format'
+import { find, forEach, round, size, sum } from 'lodash-es'
+
+export function sortRecordsByNameLabel(record1: { name_label: string }, record2: { name_label: string }) {
+  const label1 = record1.name_label.toLocaleLowerCase()
+  const label2 = record2.name_label.toLocaleLowerCase()
+
+  return label1.localeCompare(label2)
 }
 
 export function escapeRegExp(string: string) {
-  return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
 }
 
 const iconsByType = {
@@ -24,86 +21,79 @@ const iconsByType = {
   number: faHashtag,
   boolean: faSquareCheck,
   enum: faList,
-};
+}
 
 export function formatSize(bytes: number) {
-  return bytes != null
-    ? humanFormat(bytes, { scale: "binary", unit: "B" })
-    : "N/D";
+  return bytes != null ? format(bytes, { scale: 'binary', unit: 'B' }) : 'N/D'
 }
 
 export function getFilterIcon(filter: Filter | undefined) {
   if (!filter) {
-    return;
+    return
   }
 
   if (filter.icon) {
-    return filter.icon;
+    return filter.icon
   }
 
-  return iconsByType[filter.type];
+  return iconsByType[filter.type]
 }
 
 export function parseDateTime(dateTime: Date | string | number): number {
-  if (typeof dateTime === "number") {
-    return dateTime;
+  if (typeof dateTime === 'number') {
+    return dateTime
   }
 
   if (dateTime instanceof Date) {
-    return dateTime.getTime();
+    return dateTime.getTime()
   }
 
-  dateTime = dateTime.replace(/(-|\.\d{3})/g, ""); // Allow toISOString() date-time format
-  const date = utcParse("%Y%m%dT%H:%M:%SZ")(dateTime);
+  dateTime = dateTime.replace(/(-|\.\d{3})/g, '') // Allow toISOString() date-time format
+  const date = utcParse('%Y%m%dT%H:%M:%SZ')(dateTime)
   if (date === null) {
-    throw new RangeError(
-      `unable to parse XAPI datetime ${JSON.stringify(dateTime)}`
-    );
+    throw new RangeError(`unable to parse XAPI datetime ${JSON.stringify(dateTime)}`)
   }
-  return date.getTime();
+  return date.getTime()
 }
 
-export const hasEllipsis = (
-  target: Element | undefined | null,
-  { vertical = false }: { vertical?: boolean } = {}
-) => {
+export const hasEllipsis = (target: Element | undefined | null, { vertical = false }: { vertical?: boolean } = {}) => {
   if (target == null) {
-    return false;
+    return false
   }
 
   if (vertical) {
-    return target.clientHeight < target.scrollHeight;
+    return target.clientHeight < target.scrollHeight
   }
 
-  return target.clientWidth < target.scrollWidth;
-};
+  return target.clientWidth < target.scrollWidth
+}
 
 export function percent(currentValue: number, maxValue: number, precision = 2) {
-  return round((currentValue / maxValue) * 100, precision);
+  return round((currentValue / maxValue) * 100, precision)
 }
 
 export function getAvgCpuUsage(cpus?: object | any[], { nSequence = 4 } = {}) {
-  const statsLength = getStatsLength(cpus);
+  const statsLength = getStatsLength(cpus)
   if (statsLength === undefined) {
-    return;
+    return
   }
-  const _nSequence = statsLength < nSequence ? statsLength : nSequence;
+  const _nSequence = statsLength < nSequence ? statsLength : nSequence
 
-  let totalCpusUsage = 0;
+  let totalCpusUsage = 0
   forEach(cpus, (cpuState: number[]) => {
-    totalCpusUsage += sum(cpuState.slice(cpuState.length - _nSequence));
-  });
-  const stackedValue = totalCpusUsage / _nSequence;
-  return stackedValue / size(cpus);
+    totalCpusUsage += sum(cpuState.slice(cpuState.length - _nSequence))
+  })
+  const stackedValue = totalCpusUsage / _nSequence
+  return stackedValue / size(cpus)
 }
 
 // stats can be null.
 // Return the size of the first non-null object.
 export function getStatsLength(stats?: object | any[]) {
   if (stats === undefined) {
-    return undefined;
+    return undefined
   }
-  return size(find(stats, (stat) => stat != null));
+  return size(find(stats, stat => stat != null))
 }
 
 export function parseRamUsage(
@@ -111,34 +101,32 @@ export function parseRamUsage(
     memory,
     memoryFree,
   }: {
-    memory: number[];
-    memoryFree?: number[];
+    memory: number[]
+    memoryFree?: number[]
   },
   { nSequence = 4 } = {}
 ) {
-  const _nSequence = Math.min(memory.length, nSequence);
+  const _nSequence = Math.min(memory.length, nSequence)
 
-  let total = 0;
-  let used = 0;
+  let total = 0
+  let used = 0
 
-  memory = memory.slice(memory.length - _nSequence);
-  memoryFree = memoryFree?.slice(memoryFree.length - _nSequence);
+  memory = memory.slice(memory.length - _nSequence)
+  memoryFree = memoryFree?.slice(memoryFree.length - _nSequence)
 
   memory.forEach((ram, key) => {
-    total += ram;
-    used += ram - (memoryFree?.[key] ?? 0);
-  });
+    total += ram
+    used += ram - (memoryFree?.[key] ?? 0)
+  })
 
-  const percentUsed = percent(used, total);
+  const percentUsed = percent(used, total)
   return {
     // In case `memoryFree` is not given by the xapi,
     // we won't be able to calculate the percentage of used memory properly.
-    percentUsed:
-      memoryFree === undefined || isNaN(percentUsed) ? 0 : percentUsed,
+    percentUsed: memoryFree === undefined || isNaN(percentUsed) ? 0 : percentUsed,
     total: total / _nSequence,
     used: memoryFree === undefined ? 0 : used / _nSequence,
-  };
+  }
 }
 
-export const getFirst = <T>(value: T | T[]): T | undefined =>
-  Array.isArray(value) ? value[0] : value;
+export const getFirst = <T>(value: T | T[]): T | undefined => (Array.isArray(value) ? value[0] : value)
diff --git a/@xen-orchestra/lite/src/libs/vm.ts b/@xen-orchestra/lite/src/libs/vm.ts
index d4d039fb925..003e8f4d844 100644
--- a/@xen-orchestra/lite/src/libs/vm.ts
+++ b/@xen-orchestra/lite/src/libs/vm.ts
@@ -1,41 +1,36 @@
-import { saveAs } from "file-saver";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
+import { saveAs } from 'file-saver'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
 
 function stringifyCsvValue(value: any) {
-  let res = "";
+  let res = ''
   if (Array.isArray(value)) {
-    res = value.join(";");
-  } else if (typeof value === "object") {
-    res = JSON.stringify(value);
+    res = value.join(';')
+  } else if (typeof value === 'object') {
+    res = JSON.stringify(value)
   } else {
-    res = String(value);
+    res = String(value)
   }
-  return `"${res.replace(/"/g, '""')}"`;
+  return `"${res.replace(/"/g, '""')}"`
 }
 
 export function exportVmsAsCsvFile(vms: XenApiVm[], fileName: string) {
-  const csvHeaders = Object.keys(vms[0]);
+  const csvHeaders = Object.keys(vms[0])
 
-  const csvRows = vms.map((vm) =>
-    csvHeaders.map((header) => stringifyCsvValue(vm[header as keyof XenApiVm]))
-  );
+  const csvRows = vms.map(vm => csvHeaders.map(header => stringifyCsvValue(vm[header as keyof XenApiVm])))
 
   saveAs(
-    new Blob(
-      [[csvHeaders, ...csvRows].map((row) => row.join(",")).join("\n")],
-      {
-        type: "text/csv;charset=utf-8",
-      }
-    ),
+    new Blob([[csvHeaders, ...csvRows].map(row => row.join(',')).join('\n')], {
+      type: 'text/csv;charset=utf-8',
+    }),
     fileName
-  );
+  )
 }
 
 export function exportVmsAsJsonFile(vms: XenApiVm[], fileName: string) {
   saveAs(
     new Blob([JSON.stringify(vms, null, 2)], {
-      type: "application/json",
+      type: 'application/json',
     }),
     fileName
-  );
+  )
 }
diff --git a/@xen-orchestra/lite/src/libs/xapi-stats.ts b/@xen-orchestra/lite/src/libs/xapi-stats.ts
index f8c3b8e688e..6069cd1a3dc 100644
--- a/@xen-orchestra/lite/src/libs/xapi-stats.ts
+++ b/@xen-orchestra/lite/src/libs/xapi-stats.ts
@@ -1,10 +1,11 @@
-import { synchronized } from "decorator-synchronized";
-import JSON5 from "json5";
-import { limitConcurrency } from "limit-concurrency-decorator";
-import { defaults, findKey, forEach, identity, map } from "lodash-es";
-import { BaseError } from "make-error";
-import type XenApi from "@/libs/xen-api/xen-api";
-import type { XenApiHost } from "@/libs/xen-api/xen-api.types";
+import type XenApi from '@/libs/xen-api/xen-api'
+import type { XenApiHost } from '@/libs/xen-api/xen-api.types'
+import { synchronized } from 'decorator-synchronized'
+// eslint-disable-next-line import/default -- https://github.com/json5/json5/issues/287
+import JSON5 from 'json5'
+import { limitConcurrency } from 'limit-concurrency-decorator'
+import { defaults, findKey, forEach, identity, map } from 'lodash-es'
+import { BaseError } from 'make-error'
 
 class FaultyGranularity extends BaseError {}
 
@@ -24,10 +25,10 @@ enum RRD_STEP {
 }
 
 export enum GRANULARITY {
-  Seconds = "seconds",
-  Minutes = "minutes",
-  Hours = "hours",
-  Days = "days",
+  Seconds = 'seconds',
+  Minutes = 'minutes',
+  Hours = 'hours',
+  Days = 'days',
 }
 
 export const RRD_STEP_FROM_STRING: { [key in GRANULARITY]: RRD_STEP } = {
@@ -35,7 +36,7 @@ export const RRD_STEP_FROM_STRING: { [key in GRANULARITY]: RRD_STEP } = {
   [GRANULARITY.Minutes]: RRD_STEP.Minutes,
   [GRANULARITY.Hours]: RRD_STEP.Hours,
   [GRANULARITY.Days]: RRD_STEP.Days,
-};
+}
 
 // points = intervalInSeconds / step
 const RRD_POINTS_PER_STEP: { [key in RRD_STEP]: number } = {
@@ -43,69 +44,52 @@ const RRD_POINTS_PER_STEP: { [key in RRD_STEP]: number } = {
   [RRD_STEP.Minutes]: 120,
   [RRD_STEP.Hours]: 168,
   [RRD_STEP.Days]: 366,
-};
+}
 
 // -------------------------------------------------------------------
 // Utils
 // -------------------------------------------------------------------
 
 function convertNanToNull(value: number) {
-  return isNaN(value) ? null : value;
+  return isNaN(value) ? null : value
 }
 
 // -------------------------------------------------------------------
 // Stats
 // -------------------------------------------------------------------
 
-const computeValues = (
-  dataRow: any,
-  legendIndex: number,
-  transformValue = identity
-) =>
-  map(dataRow, ({ values }) =>
-    transformValue(convertNanToNull(values[legendIndex]))
-  );
-
-const createGetProperty = (
-  obj: object,
-  property: string,
-  defaultValue: unknown
-) => defaults(obj, { [property]: defaultValue })[property] as any;
+const computeValues = (dataRow: any, legendIndex: number, transformValue = identity) =>
+  map(dataRow, ({ values }) => transformValue(convertNanToNull(values[legendIndex])))
+
+const createGetProperty = (obj: object, property: string, defaultValue: unknown) =>
+  defaults(obj, { [property]: defaultValue })[property] as any
 
 const testMetric = (
-  test:
-    | string
-    | { exec: (type: string) => boolean }
-    | { (type: string): boolean },
+  test: string | { exec: (type: string) => boolean } | { (type: string): boolean },
   type: string
-): boolean =>
-  typeof test === "string"
-    ? test === type
-    : typeof test === "function"
-      ? test(type)
-      : test.exec(type);
+): boolean => (typeof test === 'string' ? test === type : typeof test === 'function' ? test(type) : test.exec(type))
 
 const findMetric = (metrics: any, metricType: string) => {
-  let testResult;
-  let metric;
+  let testResult
+  let metric
 
-  forEach(metrics, (current) => {
+  forEach(metrics, current => {
     if (current.test === undefined) {
-      const newValues = findMetric(current, metricType);
+      const newValues = findMetric(current, metricType)
 
-      metric = newValues.metric;
+      metric = newValues.metric
       if (metric !== undefined) {
-        testResult = newValues.testResult;
-        return false;
+        testResult = newValues.testResult
+        return false
       }
     } else if ((testResult = testMetric(current.test, metricType))) {
-      metric = current;
-      return false;
+      metric = current
+      return false
     }
-  });
+  })
 
-  return { metric, testResult };
-};
+  return { metric, testResult }
+}
 
 // -------------------------------------------------------------------
 
@@ -116,115 +100,115 @@ const findMetric = (metrics: any, metricType: string) => {
 const STATS: { [key: string]: object } = {
   host: {
     load: {
-      test: "loadavg",
+      test: 'loadavg',
     },
     memoryFree: {
-      test: "memory_free_kib",
+      test: 'memory_free_kib',
       transformValue: (value: number) => value * 1024,
     },
     memory: {
-      test: "memory_total_kib",
+      test: 'memory_total_kib',
       transformValue: (value: number) => value * 1024,
     },
     cpus: {
       test: /^cpu(\d+)$/,
-      getPath: (matches: any) => ["cpus", matches[1]],
+      getPath: (matches: any) => ['cpus', matches[1]],
       transformValue: (value: number) => value * 1e2,
     },
     pifs: {
       rx: {
         test: /^pif_eth(\d+)_rx$/,
-        getPath: (matches: unknown[]) => ["pifs", "rx", matches[1]],
+        getPath: (matches: unknown[]) => ['pifs', 'rx', matches[1]],
       },
       tx: {
         test: /^pif_eth(\d+)_tx$/,
-        getPath: (matches: unknown[]) => ["pifs", "tx", matches[1]],
+        getPath: (matches: unknown[]) => ['pifs', 'tx', matches[1]],
       },
     },
     iops: {
       r: {
         test: /^iops_read_(\w+)$/,
-        getPath: (matches: unknown[]) => ["iops", "r", matches[1]],
+        getPath: (matches: unknown[]) => ['iops', 'r', matches[1]],
       },
       w: {
         test: /^iops_write_(\w+)$/,
-        getPath: (matches: unknown[]) => ["iops", "w", matches[1]],
+        getPath: (matches: unknown[]) => ['iops', 'w', matches[1]],
       },
     },
     ioThroughput: {
       r: {
         test: /^io_throughput_read_(\w+)$/,
-        getPath: (matches: unknown[]) => ["ioThroughput", "r", matches[1]],
+        getPath: (matches: unknown[]) => ['ioThroughput', 'r', matches[1]],
         transformValue: (value: number) => value * 2 ** 20,
       },
       w: {
         test: /^io_throughput_write_(\w+)$/,
-        getPath: (matches: unknown[]) => ["ioThroughput", "w", matches[1]],
+        getPath: (matches: unknown[]) => ['ioThroughput', 'w', matches[1]],
         transformValue: (value: number) => value * 2 ** 20,
       },
     },
     latency: {
       r: {
         test: /^read_latency_(\w+)$/,
-        getPath: (matches: unknown[]) => ["latency", "r", matches[1]],
+        getPath: (matches: unknown[]) => ['latency', 'r', matches[1]],
         transformValue: (value: number) => value / 1e3,
       },
       w: {
         test: /^write_latency_(\w+)$/,
-        getPath: (matches: unknown[]) => ["latency", "w", matches[1]],
+        getPath: (matches: unknown[]) => ['latency', 'w', matches[1]],
         transformValue: (value: number) => value / 1e3,
       },
     },
     iowait: {
       test: /^iowait_(\w+)$/,
-      getPath: (matches: unknown[]) => ["iowait", matches[1]],
+      getPath: (matches: unknown[]) => ['iowait', matches[1]],
     },
   },
   vm: {
     memoryFree: {
-      test: "memory_internal_free",
+      test: 'memory_internal_free',
       transformValue: (value: number) => value * 1024,
     },
     memory: {
-      test: (metricType: string) => metricType.endsWith("memory"),
+      test: (metricType: string) => metricType.endsWith('memory'),
     },
     cpus: {
       test: /^cpu(\d+)$/,
-      getPath: (matches: unknown[]) => ["cpus", matches[1]],
+      getPath: (matches: unknown[]) => ['cpus', matches[1]],
       transformValue: (value: number) => value * 1e2,
     },
     vifs: {
       rx: {
         test: /^vif_(\d+)_rx$/,
-        getPath: (matches: unknown[]) => ["vifs", "rx", matches[1]],
+        getPath: (matches: unknown[]) => ['vifs', 'rx', matches[1]],
       },
       tx: {
         test: /^vif_(\d+)_tx$/,
-        getPath: (matches: unknown[]) => ["vifs", "tx", matches[1]],
+        getPath: (matches: unknown[]) => ['vifs', 'tx', matches[1]],
       },
     },
     xvds: {
       r: {
         test: /^vbd_xvd(.)_read$/,
-        getPath: (matches: unknown[]) => ["xvds", "r", matches[1]],
+        getPath: (matches: unknown[]) => ['xvds', 'r', matches[1]],
       },
       w: {
         test: /^vbd_xvd(.)_write$/,
-        getPath: (matches: unknown[]) => ["xvds", "w", matches[1]],
+        getPath: (matches: unknown[]) => ['xvds', 'w', matches[1]],
       },
     },
     iops: {
       r: {
         test: /^vbd_xvd(.)_iops_read$/,
-        getPath: (matches: unknown[]) => ["iops", "r", matches[1]],
+        getPath: (matches: unknown[]) => ['iops', 'r', matches[1]],
       },
       w: {
         test: /^vbd_xvd(.)_iops_write$/,
-        getPath: (matches: unknown[]) => ["iops", "w", matches[1]],
+        getPath: (matches: unknown[]) => ['iops', 'w', matches[1]],
       },
     },
   },
-};
+}
 
 // -------------------------------------------------------------------
 
@@ -253,66 +237,66 @@ const STATS: { [key: string]: object } = {
 // }
 
 export type VmStats = {
-  cpus: Record<string, number[]>;
+  cpus: Record<string, number[]>
   iops: {
-    r: Record<string, number[]>;
-    w: Record<string, number[]>;
-  };
-  memory: number[];
-  memoryFree?: number[];
+    r: Record<string, number[]>
+    w: Record<string, number[]>
+  }
+  memory: number[]
+  memoryFree?: number[]
   vifs: {
-    rx: Record<string, number[]>;
-    tx: Record<string, number[]>;
-  };
+    rx: Record<string, number[]>
+    tx: Record<string, number[]>
+  }
   xvds: {
-    w: Record<string, number[]>;
-    r: Record<string, number[]>;
-  };
-};
+    w: Record<string, number[]>
+    r: Record<string, number[]>
+  }
+}
 
 export type HostStats = {
-  cpus: Record<string, number[]>;
+  cpus: Record<string, number[]>
   ioThroughput: {
-    r: Record<string, number[]>;
-    w: Record<string, number[]>;
-  };
+    r: Record<string, number[]>
+    w: Record<string, number[]>
+  }
   iops: {
-    r: Record<string, number[]>;
-    w: Record<string, number[]>;
-  };
-  iowait: Record<string, number[]>;
+    r: Record<string, number[]>
+    w: Record<string, number[]>
+  }
+  iowait: Record<string, number[]>
   latency: {
-    r: Record<string, number[]>;
-    w: Record<string, number[]>;
-  };
-  load: number[];
-  memory: number[];
-  memoryFree: number[];
+    r: Record<string, number[]>
+    w: Record<string, number[]>
+  }
+  load: number[]
+  memory: number[]
+  memoryFree: number[]
   pifs: {
-    rx: Record<string, number[]>;
-    tx: Record<string, number[]>;
-  };
-};
+    rx: Record<string, number[]>
+    tx: Record<string, number[]>
+  }
+}
 
 export type XapiStatsResponse<T> = {
-  canBeExpired: boolean;
-  endTimestamp: number;
-  interval: number;
-  stats: T;
-};
+  canBeExpired: boolean
+  endTimestamp: number
+  interval: number
+  stats: T
+}
 
 type StatsByObject = {
   [uuid: string]: {
-    [step: string]: XapiStatsResponse<HostStats | VmStats>;
-  };
-};
+    [step: string]: XapiStatsResponse<HostStats | VmStats>
+  }
+}
 
 export default class XapiStats {
-  #xapi;
-  #statsByObject: StatsByObject = {};
-  #cachedStatsByObject: StatsByObject = {};
+  #xapi
+  #statsByObject: StatsByObject = {}
+  #cachedStatsByObject: StatsByObject = {}
   constructor(xapi: XenApi) {
-    this.#xapi = xapi;
+    this.#xapi = xapi
   }
 
   // Execute one http request on a XenServer for get stats
@@ -324,45 +308,41 @@ export default class XapiStats {
     step: RRD_STEP,
     { abortSignal }: { abortSignal?: AbortSignal } = {}
   ) {
-    const resp = await this.#xapi.getResource("/rrd_updates", {
+    const resp = await this.#xapi.getResource('/rrd_updates', {
       host,
       query: {
-        cf: "AVERAGE",
-        host: "true",
+        cf: 'AVERAGE',
+        host: 'true',
         interval: step,
-        json: "true",
+        json: 'true',
         start: timestamp,
       },
       abortSignal,
-    });
-    return JSON5.parse(await resp.text());
+    })
+    // eslint-disable-next-line import/no-named-as-default-member -- https://github.com/json5/json5/issues/287
+    return JSON5.parse(await resp.text())
   }
 
   // To avoid multiple requests, we keep a cache for the stats and
   // only return it if we not exceed a step
-  #getCachedStats(
-    uuid: string,
-    step: RRD_STEP,
-    currentTimeStamp: number,
-    ignoreExpired = false
-  ) {
+  #getCachedStats(uuid: string, step: RRD_STEP, currentTimeStamp: number, ignoreExpired = false) {
     if (ignoreExpired) {
-      return this.#cachedStatsByObject[uuid]?.[step];
+      return this.#cachedStatsByObject[uuid]?.[step]
     }
 
-    const statsByObject = this.#statsByObject;
+    const statsByObject = this.#statsByObject
 
-    const stats = statsByObject[uuid]?.[step];
+    const stats = statsByObject[uuid]?.[step]
     if (stats === undefined) {
-      return;
+      return
     }
 
     if (stats.endTimestamp + step < currentTimeStamp) {
-      delete statsByObject[uuid][step];
-      return;
+      delete statsByObject[uuid][step]
+      return
     }
 
-    return stats;
+    return stats
   }
 
   @synchronized.withKey(({ host }: { host: XenApiHost }) => host.uuid)
@@ -373,145 +353,107 @@ export default class XapiStats {
     uuid,
     granularity,
   }: {
-    abortSignal?: AbortSignal;
-    host: XenApiHost;
-    ignoreExpired?: boolean;
-    uuid: any;
-    granularity: GRANULARITY;
+    abortSignal?: AbortSignal
+    host: XenApiHost
+    ignoreExpired?: boolean
+    uuid: any
+    granularity: GRANULARITY
   }) {
-    const step =
-      granularity === undefined
-        ? RRD_STEP.Seconds
-        : RRD_STEP_FROM_STRING[granularity];
+    const step = granularity === undefined ? RRD_STEP.Seconds : RRD_STEP_FROM_STRING[granularity]
     if (step === undefined) {
       throw new FaultyGranularity(
         `Unknown granularity: '${granularity}'. Use 'seconds', 'minutes', 'hours', or 'days'.`
-      );
+      )
     }
-    const currentTimeStamp = Math.floor(new Date().getTime() / 1000);
+    const currentTimeStamp = Math.floor(new Date().getTime() / 1000)
 
-    const stats = this.#getCachedStats(
-      uuid,
-      step,
-      currentTimeStamp,
-      ignoreExpired
-    ) as XapiStatsResponse<T>;
+    const stats = this.#getCachedStats(uuid, step, currentTimeStamp, ignoreExpired) as XapiStatsResponse<T>
 
     if (stats !== undefined) {
-      return stats;
+      return stats
     }
 
-    const maxDuration = step * RRD_POINTS_PER_STEP[step];
+    const maxDuration = step * RRD_POINTS_PER_STEP[step]
 
     // To avoid crossing over the boundary, we ask for one less step
-    const optimumTimestamp = currentTimeStamp - maxDuration + step;
+    const optimumTimestamp = currentTimeStamp - maxDuration + step
 
     try {
       const json = await this._getJson(host, optimumTimestamp, step, {
         abortSignal,
-      });
+      })
 
-      const actualStep = json.meta.step as number;
+      const actualStep = json.meta.step as number
 
       if (json.data.length > 0) {
         // fetched data is organized from the newest to the oldest
         // but this implementation requires it in the other direction
-        json.data.reverse();
+        json.data.reverse()
         json.meta.legend.forEach((legend: any, index: number) => {
-          const [, type, uuid, metricType] = /^AVERAGE:([^:]+):(.+):(.+)$/.exec(
-            legend
-          ) as any;
+          const [, type, uuid, metricType] = /^AVERAGE:([^:]+):(.+):(.+)$/.exec(legend) as any
 
-          const metrics = STATS[type] as any;
+          const metrics = STATS[type] as any
           if (metrics === undefined) {
-            return;
+            return
           }
 
-          const { metric, testResult } = findMetric(metrics, metricType) as any;
+          const { metric, testResult } = findMetric(metrics, metricType) as any
           if (metric === undefined) {
-            return;
+            return
           }
 
-          const xoObjectStats = createGetProperty(
-            this.#statsByObject,
-            uuid,
-            {}
-          );
-          const cacheXoObjectStats = createGetProperty(
-            this.#cachedStatsByObject,
-            uuid,
-            {}
-          );
-
-          let stepStats = xoObjectStats[actualStep];
-          let cacheStepStats = cacheXoObjectStats[actualStep];
-          if (
-            stepStats === undefined ||
-            stepStats.endTimestamp !== json.meta.end
-          ) {
+          const xoObjectStats = createGetProperty(this.#statsByObject, uuid, {})
+          const cacheXoObjectStats = createGetProperty(this.#cachedStatsByObject, uuid, {})
+
+          let stepStats = xoObjectStats[actualStep]
+          let cacheStepStats = cacheXoObjectStats[actualStep]
+          if (stepStats === undefined || stepStats.endTimestamp !== json.meta.end) {
             stepStats = xoObjectStats[actualStep] = {
               endTimestamp: json.meta.end,
               interval: actualStep,
               canBeExpired: false,
-            };
+            }
             cacheStepStats = cacheXoObjectStats[actualStep] = {
               endTimestamp: json.meta.end,
               interval: actualStep,
               canBeExpired: true,
-            };
+            }
           }
 
-          const path =
-            metric.getPath !== undefined
-              ? metric.getPath(testResult)
-              : [findKey(metrics, metric)];
+          const path = metric.getPath !== undefined ? metric.getPath(testResult) : [findKey(metrics, metric)]
 
-          const lastKey = path.length - 1;
-          let metricStats = createGetProperty(stepStats, "stats", {});
-          let cacheMetricStats = createGetProperty(cacheStepStats, "stats", {});
+          const lastKey = path.length - 1
+          let metricStats = createGetProperty(stepStats, 'stats', {})
+          let cacheMetricStats = createGetProperty(cacheStepStats, 'stats', {})
 
           path.forEach((property: any, key: number) => {
             if (key === lastKey) {
-              metricStats[property] = computeValues(
-                json.data,
-                index,
-                metric.transformValue
-              );
-              cacheMetricStats[property] = computeValues(
-                json.data,
-                index,
-                metric.transformValue
-              );
-              return;
+              metricStats[property] = computeValues(json.data, index, metric.transformValue)
+              cacheMetricStats[property] = computeValues(json.data, index, metric.transformValue)
+              return
             }
 
-            metricStats = createGetProperty(metricStats, property, {});
-            cacheMetricStats = createGetProperty(
-              cacheMetricStats,
-              property,
-              {}
-            );
-          });
-        });
+            metricStats = createGetProperty(metricStats, property, {})
+            cacheMetricStats = createGetProperty(cacheMetricStats, property, {})
+          })
+        })
       }
 
       if (actualStep !== step) {
-        throw new FaultyGranularity(
-          `Unable to get the true granularity: ${actualStep}`
-        );
+        throw new FaultyGranularity(`Unable to get the true granularity: ${actualStep}`)
       }
     } catch (error) {
-      if (error instanceof Error && error.name === "AbortError") {
-        return;
+      if (error instanceof Error && error.name === 'AbortError') {
+        return
       }
 
-      throw error;
+      throw error
     }
 
     return (this.#statsByObject[uuid]?.[step] ?? {
       endTimestamp: currentTimeStamp,
       interval: step,
       stats: {},
-    }) as XapiStatsResponse<T>;
+    }) as XapiStatsResponse<T>
   }
 }
diff --git a/@xen-orchestra/lite/src/libs/xen-api/xen-api.enums.ts b/@xen-orchestra/lite/src/libs/xen-api/xen-api.enums.ts
index 0a2f286001d..7b2dea9b32a 100644
--- a/@xen-orchestra/lite/src/libs/xen-api/xen-api.enums.ts
+++ b/@xen-orchestra/lite/src/libs/xen-api/xen-api.enums.ts
@@ -1,499 +1,499 @@
 export enum TASK_ALLOWED_OPERATION {
-  CANCEL = "cancel",
-  DESTROY = "destroy",
+  CANCEL = 'cancel',
+  DESTROY = 'destroy',
 }
 
 export enum TASK_STATUS_TYPE {
-  CANCELLED = "cancelled",
-  CANCELLING = "cancelling",
-  FAILURE = "failure",
-  PENDING = "pending",
-  SUCCESS = "success",
+  CANCELLED = 'cancelled',
+  CANCELLING = 'cancelling',
+  FAILURE = 'failure',
+  PENDING = 'pending',
+  SUCCESS = 'success',
 }
 
 export enum EVENT_OPERATION {
-  ADD = "add",
-  DEL = "del",
-  MOD = "mod",
+  ADD = 'add',
+  DEL = 'del',
+  MOD = 'mod',
 }
 
 export enum POOL_ALLOWED_OPERATION {
-  APPLY_UPDATES = "apply_updates",
-  CERT_REFRESH = "cert_refresh",
-  CLUSTER_CREATE = "cluster_create",
-  CONFIGURE_REPOSITORIES = "configure_repositories",
-  COPY_PRIMARY_HOST_CERTS = "copy_primary_host_certs",
-  DESIGNATE_NEW_MASTER = "designate_new_master",
-  EXCHANGE_CA_CERTIFICATES_ON_JOIN = "exchange_ca_certificates_on_join",
-  EXCHANGE_CERTIFICATES_ON_JOIN = "exchange_certificates_on_join",
-  GET_UPDATES = "get_updates",
-  HA_DISABLE = "ha_disable",
-  HA_ENABLE = "ha_enable",
-  SYNC_UPDATES = "sync_updates",
-  TLS_VERIFICATION_ENABLE = "tls_verification_enable",
+  APPLY_UPDATES = 'apply_updates',
+  CERT_REFRESH = 'cert_refresh',
+  CLUSTER_CREATE = 'cluster_create',
+  CONFIGURE_REPOSITORIES = 'configure_repositories',
+  COPY_PRIMARY_HOST_CERTS = 'copy_primary_host_certs',
+  DESIGNATE_NEW_MASTER = 'designate_new_master',
+  EXCHANGE_CA_CERTIFICATES_ON_JOIN = 'exchange_ca_certificates_on_join',
+  EXCHANGE_CERTIFICATES_ON_JOIN = 'exchange_certificates_on_join',
+  GET_UPDATES = 'get_updates',
+  HA_DISABLE = 'ha_disable',
+  HA_ENABLE = 'ha_enable',
+  SYNC_UPDATES = 'sync_updates',
+  TLS_VERIFICATION_ENABLE = 'tls_verification_enable',
 }
 
 export enum TELEMETRY_FREQUENCY {
-  DAILY = "daily",
-  MONTHLY = "monthly",
-  WEEKLY = "weekly",
+  DAILY = 'daily',
+  MONTHLY = 'monthly',
+  WEEKLY = 'weekly',
 }
 
 export enum UPDATE_SYNC_FREQUENCY {
-  DAILY = "daily",
-  WEEKLY = "weekly",
+  DAILY = 'daily',
+  WEEKLY = 'weekly',
 }
 
 export enum AFTER_APPLY_GUIDANCE {
-  RESTART_HOST = "restartHost",
-  RESTART_HVM = "restartHVM",
-  RESTART_PV = "restartPV",
-  RESTART_XAPI = "restartXAPI",
+  RESTART_HOST = 'restartHost',
+  RESTART_HVM = 'restartHVM',
+  RESTART_PV = 'restartPV',
+  RESTART_XAPI = 'restartXAPI',
 }
 
 export enum UPDATE_AFTER_APPLY_GUIDANCE {
-  RESTART_HOST = "restartHost",
-  RESTART_HVM = "restartHVM",
-  RESTART_PV = "restartPV",
-  RESTART_XAPI = "restartXAPI",
+  RESTART_HOST = 'restartHost',
+  RESTART_HVM = 'restartHVM',
+  RESTART_PV = 'restartPV',
+  RESTART_XAPI = 'restartXAPI',
 }
 
 export enum LIVEPATCH_STATUS {
-  OK = "ok",
-  OK_LIVEPATCH_COMPLETE = "ok_livepatch_complete",
-  OK_LIVEPATCH_INCOMPLETE = "ok_livepatch_incomplete",
+  OK = 'ok',
+  OK_LIVEPATCH_COMPLETE = 'ok_livepatch_complete',
+  OK_LIVEPATCH_INCOMPLETE = 'ok_livepatch_incomplete',
 }
 
 export enum VM_POWER_STATE {
-  HALTED = "Halted",
-  PAUSED = "Paused",
-  RUNNING = "Running",
-  SUSPENDED = "Suspended",
+  HALTED = 'Halted',
+  PAUSED = 'Paused',
+  RUNNING = 'Running',
+  SUSPENDED = 'Suspended',
 }
 
 export enum UPDATE_GUIDANCE {
-  REBOOT_HOST = "reboot_host",
-  REBOOT_HOST_ON_LIVEPATCH_FAILURE = "reboot_host_on_livepatch_failure",
-  RESTART_DEVICE_MODEL = "restart_device_model",
-  RESTART_TOOLSTACK = "restart_toolstack",
+  REBOOT_HOST = 'reboot_host',
+  REBOOT_HOST_ON_LIVEPATCH_FAILURE = 'reboot_host_on_livepatch_failure',
+  RESTART_DEVICE_MODEL = 'restart_device_model',
+  RESTART_TOOLSTACK = 'restart_toolstack',
 }
 
 export enum ON_SOFTREBOOT_BEHAVIOR {
-  DESTROY = "destroy",
-  PRESERVE = "preserve",
-  RESTART = "restart",
-  SOFT_REBOOT = "soft_reboot",
+  DESTROY = 'destroy',
+  PRESERVE = 'preserve',
+  RESTART = 'restart',
+  SOFT_REBOOT = 'soft_reboot',
 }
 
 export enum ON_NORMAL_EXIT {
-  DESTROY = "destroy",
-  RESTART = "restart",
+  DESTROY = 'destroy',
+  RESTART = 'restart',
 }
 
 export enum VM_OPERATION {
-  ASSERT_OPERATION_VALID = "assert_operation_valid",
-  AWAITING_MEMORY_LIVE = "awaiting_memory_live",
-  CALL_PLUGIN = "call_plugin",
-  CHANGING_DYNAMIC_RANGE = "changing_dynamic_range",
-  CHANGING_MEMORY_LIMITS = "changing_memory_limits",
-  CHANGING_MEMORY_LIVE = "changing_memory_live",
-  CHANGING_NVRAM = "changing_NVRAM",
-  CHANGING_SHADOW_MEMORY = "changing_shadow_memory",
-  CHANGING_SHADOW_MEMORY_LIVE = "changing_shadow_memory_live",
-  CHANGING_STATIC_RANGE = "changing_static_range",
-  CHANGING_VCPUS = "changing_VCPUs",
-  CHANGING_VCPUS_LIVE = "changing_VCPUs_live",
-  CHECKPOINT = "checkpoint",
-  CLEAN_REBOOT = "clean_reboot",
-  CLEAN_SHUTDOWN = "clean_shutdown",
-  CLONE = "clone",
-  COPY = "copy",
-  CREATE_TEMPLATE = "create_template",
-  CREATE_VTPM = "create_vtpm",
-  CSVM = "csvm",
-  DATA_SOURCE_OP = "data_source_op",
-  DESTROY = "destroy",
-  EXPORT = "export",
-  GET_BOOT_RECORD = "get_boot_record",
-  HARD_REBOOT = "hard_reboot",
-  HARD_SHUTDOWN = "hard_shutdown",
-  IMPORT = "import",
-  MAKE_INTO_TEMPLATE = "make_into_template",
-  METADATA_EXPORT = "metadata_export",
-  MIGRATE_SEND = "migrate_send",
-  PAUSE = "pause",
-  POOL_MIGRATE = "pool_migrate",
-  POWER_STATE_RESET = "power_state_reset",
-  PROVISION = "provision",
-  QUERY_SERVICES = "query_services",
-  RESUME = "resume",
-  RESUME_ON = "resume_on",
-  REVERT = "revert",
-  REVERTING = "reverting",
-  SEND_SYSRQ = "send_sysrq",
-  SEND_TRIGGER = "send_trigger",
-  SHUTDOWN = "shutdown",
-  SNAPSHOT = "snapshot",
-  SNAPSHOT_WITH_QUIESCE = "snapshot_with_quiesce",
-  START = "start",
-  START_ON = "start_on",
-  SUSPEND = "suspend",
-  UNPAUSE = "unpause",
-  UPDATE_ALLOWED_OPERATIONS = "update_allowed_operations",
+  ASSERT_OPERATION_VALID = 'assert_operation_valid',
+  AWAITING_MEMORY_LIVE = 'awaiting_memory_live',
+  CALL_PLUGIN = 'call_plugin',
+  CHANGING_DYNAMIC_RANGE = 'changing_dynamic_range',
+  CHANGING_MEMORY_LIMITS = 'changing_memory_limits',
+  CHANGING_MEMORY_LIVE = 'changing_memory_live',
+  CHANGING_NVRAM = 'changing_NVRAM',
+  CHANGING_SHADOW_MEMORY = 'changing_shadow_memory',
+  CHANGING_SHADOW_MEMORY_LIVE = 'changing_shadow_memory_live',
+  CHANGING_STATIC_RANGE = 'changing_static_range',
+  CHANGING_VCPUS = 'changing_VCPUs',
+  CHANGING_VCPUS_LIVE = 'changing_VCPUs_live',
+  CHECKPOINT = 'checkpoint',
+  CLEAN_REBOOT = 'clean_reboot',
+  CLEAN_SHUTDOWN = 'clean_shutdown',
+  CLONE = 'clone',
+  COPY = 'copy',
+  CREATE_TEMPLATE = 'create_template',
+  CREATE_VTPM = 'create_vtpm',
+  CSVM = 'csvm',
+  DATA_SOURCE_OP = 'data_source_op',
+  DESTROY = 'destroy',
+  EXPORT = 'export',
+  GET_BOOT_RECORD = 'get_boot_record',
+  HARD_REBOOT = 'hard_reboot',
+  HARD_SHUTDOWN = 'hard_shutdown',
+  IMPORT = 'import',
+  MAKE_INTO_TEMPLATE = 'make_into_template',
+  METADATA_EXPORT = 'metadata_export',
+  MIGRATE_SEND = 'migrate_send',
+  PAUSE = 'pause',
+  POOL_MIGRATE = 'pool_migrate',
+  POWER_STATE_RESET = 'power_state_reset',
+  PROVISION = 'provision',
+  QUERY_SERVICES = 'query_services',
+  RESUME = 'resume',
+  RESUME_ON = 'resume_on',
+  REVERT = 'revert',
+  REVERTING = 'reverting',
+  SEND_SYSRQ = 'send_sysrq',
+  SEND_TRIGGER = 'send_trigger',
+  SHUTDOWN = 'shutdown',
+  SNAPSHOT = 'snapshot',
+  SNAPSHOT_WITH_QUIESCE = 'snapshot_with_quiesce',
+  START = 'start',
+  START_ON = 'start_on',
+  SUSPEND = 'suspend',
+  UNPAUSE = 'unpause',
+  UPDATE_ALLOWED_OPERATIONS = 'update_allowed_operations',
 }
 
 export enum ON_CRASH_BEHAVIOUR {
-  COREDUMP_AND_DESTROY = "coredump_and_destroy",
-  COREDUMP_AND_RESTART = "coredump_and_restart",
-  DESTROY = "destroy",
-  PRESERVE = "preserve",
-  RENAME_RESTART = "rename_restart",
-  RESTART = "restart",
+  COREDUMP_AND_DESTROY = 'coredump_and_destroy',
+  COREDUMP_AND_RESTART = 'coredump_and_restart',
+  DESTROY = 'destroy',
+  PRESERVE = 'preserve',
+  RENAME_RESTART = 'rename_restart',
+  RESTART = 'restart',
 }
 
 export enum DOMAIN_TYPE {
-  HVM = "hvm",
-  PV = "pv",
-  PVH = "pvh",
-  PV_IN_PVH = "pv_in_pvh",
-  UNSPECIFIED = "unspecified",
+  HVM = 'hvm',
+  PV = 'pv',
+  PVH = 'pvh',
+  PV_IN_PVH = 'pv_in_pvh',
+  UNSPECIFIED = 'unspecified',
 }
 
 export enum TRISTATE_TYPE {
-  NO = "no",
-  UNSPECIFIED = "unspecified",
-  YES = "yes",
+  NO = 'no',
+  UNSPECIFIED = 'unspecified',
+  YES = 'yes',
 }
 
 export enum VMPP_BACKUP_TYPE {
-  CHECKPOINT = "checkpoint",
-  SNAPSHOT = "snapshot",
+  CHECKPOINT = 'checkpoint',
+  SNAPSHOT = 'snapshot',
 }
 
 export enum VMPP_BACKUP_FREQUENCY {
-  DAILY = "daily",
-  HOURLY = "hourly",
-  WEEKLY = "weekly",
+  DAILY = 'daily',
+  HOURLY = 'hourly',
+  WEEKLY = 'weekly',
 }
 
 export enum VMPP_ARCHIVE_FREQUENCY {
-  ALWAYS_AFTER_BACKUP = "always_after_backup",
-  DAILY = "daily",
-  NEVER = "never",
-  WEEKLY = "weekly",
+  ALWAYS_AFTER_BACKUP = 'always_after_backup',
+  DAILY = 'daily',
+  NEVER = 'never',
+  WEEKLY = 'weekly',
 }
 
 export enum VMPP_ARCHIVE_TARGET_TYPE {
-  CIFS = "cifs",
-  NFS = "nfs",
-  NONE = "none",
+  CIFS = 'cifs',
+  NFS = 'nfs',
+  NONE = 'none',
 }
 
 export enum VMSS_FREQUENCY {
-  DAILY = "daily",
-  HOURLY = "hourly",
-  WEEKLY = "weekly",
+  DAILY = 'daily',
+  HOURLY = 'hourly',
+  WEEKLY = 'weekly',
 }
 
 export enum VMSS_TYPE {
-  CHECKPOINT = "checkpoint",
-  SNAPSHOT = "snapshot",
-  SNAPSHOT_WITH_QUIESCE = "snapshot_with_quiesce",
+  CHECKPOINT = 'checkpoint',
+  SNAPSHOT = 'snapshot',
+  SNAPSHOT_WITH_QUIESCE = 'snapshot_with_quiesce',
 }
 
 export enum VM_APPLIANCE_OPERATION {
-  CLEAN_SHUTDOWN = "clean_shutdown",
-  HARD_SHUTDOWN = "hard_shutdown",
-  SHUTDOWN = "shutdown",
-  START = "start",
+  CLEAN_SHUTDOWN = 'clean_shutdown',
+  HARD_SHUTDOWN = 'hard_shutdown',
+  SHUTDOWN = 'shutdown',
+  START = 'start',
 }
 
 export enum HOST_ALLOWED_OPERATION {
-  APPLY_UPDATES = "apply_updates",
-  EVACUATE = "evacuate",
-  POWER_ON = "power_on",
-  PROVISION = "provision",
-  REBOOT = "reboot",
-  SHUTDOWN = "shutdown",
-  VM_MIGRATE = "vm_migrate",
-  VM_RESUME = "vm_resume",
-  VM_START = "vm_start",
+  APPLY_UPDATES = 'apply_updates',
+  EVACUATE = 'evacuate',
+  POWER_ON = 'power_on',
+  PROVISION = 'provision',
+  REBOOT = 'reboot',
+  SHUTDOWN = 'shutdown',
+  VM_MIGRATE = 'vm_migrate',
+  VM_RESUME = 'vm_resume',
+  VM_START = 'vm_start',
 }
 
 export enum LATEST_SYNCED_UPDATES_APPLIED_STATE {
-  NO = "no",
-  UNKNOWN = "unknown",
-  YES = "yes",
+  NO = 'no',
+  UNKNOWN = 'unknown',
+  YES = 'yes',
 }
 
 export enum HOST_DISPLAY {
-  DISABLED = "disabled",
-  DISABLE_ON_REBOOT = "disable_on_reboot",
-  ENABLED = "enabled",
-  ENABLE_ON_REBOOT = "enable_on_reboot",
+  DISABLED = 'disabled',
+  DISABLE_ON_REBOOT = 'disable_on_reboot',
+  ENABLED = 'enabled',
+  ENABLE_ON_REBOOT = 'enable_on_reboot',
 }
 
 export enum HOST_SCHED_GRAN {
-  CORE = "core",
-  CPU = "cpu",
-  SOCKET = "socket",
+  CORE = 'core',
+  CPU = 'cpu',
+  SOCKET = 'socket',
 }
 
 export enum NETWORK_OPERATION {
-  ATTACHING = "attaching",
+  ATTACHING = 'attaching',
 }
 
 export enum NETWORK_DEFAULT_LOCKING_MODE {
-  DISABLED = "disabled",
-  UNLOCKED = "unlocked",
+  DISABLED = 'disabled',
+  UNLOCKED = 'unlocked',
 }
 
 export enum NETWORK_PURPOSE {
-  INSECURE_NBD = "insecure_nbd",
-  NBD = "nbd",
+  INSECURE_NBD = 'insecure_nbd',
+  NBD = 'nbd',
 }
 
 export enum VIF_OPERATION {
-  ATTACH = "attach",
-  PLUG = "plug",
-  UNPLUG = "unplug",
+  ATTACH = 'attach',
+  PLUG = 'plug',
+  UNPLUG = 'unplug',
 }
 
 export enum VIF_LOCKING_MODE {
-  DISABLED = "disabled",
-  LOCKED = "locked",
-  NETWORK_DEFAULT = "network_default",
-  UNLOCKED = "unlocked",
+  DISABLED = 'disabled',
+  LOCKED = 'locked',
+  NETWORK_DEFAULT = 'network_default',
+  UNLOCKED = 'unlocked',
 }
 
 export enum VIF_IPV4_CONFIGURATION_MODE {
-  NONE = "None",
-  STATIC = "Static",
+  NONE = 'None',
+  STATIC = 'Static',
 }
 
 export enum VIF_IPV6_CONFIGURATION_MODE {
-  NONE = "None",
-  STATIC = "Static",
+  NONE = 'None',
+  STATIC = 'Static',
 }
 
 export enum PIF_IGMP_STATUS {
-  DISABLED = "disabled",
-  ENABLED = "enabled",
-  UNKNOWN = "unknown",
+  DISABLED = 'disabled',
+  ENABLED = 'enabled',
+  UNKNOWN = 'unknown',
 }
 
 export enum IP_CONFIGURATION_MODE {
-  DHCP = "DHCP",
-  NONE = "None",
-  STATIC = "Static",
+  DHCP = 'DHCP',
+  NONE = 'None',
+  STATIC = 'Static',
 }
 
 export enum IPV6_CONFIGURATION_MODE {
-  AUTOCONF = "Autoconf",
-  DHCP = "DHCP",
-  NONE = "None",
-  STATIC = "Static",
+  AUTOCONF = 'Autoconf',
+  DHCP = 'DHCP',
+  NONE = 'None',
+  STATIC = 'Static',
 }
 
 export enum PRIMARY_ADDRESS_TYPE {
-  IPV4 = "IPv4",
-  IPV6 = "IPv6",
+  IPV4 = 'IPv4',
+  IPV6 = 'IPv6',
 }
 
 export enum BOND_MODE {
-  ACTIVE_BACKUP = "active-backup",
-  BALANCE_SLB = "balance-slb",
-  LACP = "lacp",
+  ACTIVE_BACKUP = 'active-backup',
+  BALANCE_SLB = 'balance-slb',
+  LACP = 'lacp',
 }
 
 export enum STORAGE_OPERATION {
-  DESTROY = "destroy",
-  FORGET = "forget",
-  PBD_CREATE = "pbd_create",
-  PBD_DESTROY = "pbd_destroy",
-  PLUG = "plug",
-  SCAN = "scan",
-  UNPLUG = "unplug",
-  UPDATE = "update",
-  VDI_CLONE = "vdi_clone",
-  VDI_CREATE = "vdi_create",
-  VDI_DATA_DESTROY = "vdi_data_destroy",
-  VDI_DESTROY = "vdi_destroy",
-  VDI_DISABLE_CBT = "vdi_disable_cbt",
-  VDI_ENABLE_CBT = "vdi_enable_cbt",
-  VDI_INTRODUCE = "vdi_introduce",
-  VDI_LIST_CHANGED_BLOCKS = "vdi_list_changed_blocks",
-  VDI_MIRROR = "vdi_mirror",
-  VDI_RESIZE = "vdi_resize",
-  VDI_SET_ON_BOOT = "vdi_set_on_boot",
-  VDI_SNAPSHOT = "vdi_snapshot",
+  DESTROY = 'destroy',
+  FORGET = 'forget',
+  PBD_CREATE = 'pbd_create',
+  PBD_DESTROY = 'pbd_destroy',
+  PLUG = 'plug',
+  SCAN = 'scan',
+  UNPLUG = 'unplug',
+  UPDATE = 'update',
+  VDI_CLONE = 'vdi_clone',
+  VDI_CREATE = 'vdi_create',
+  VDI_DATA_DESTROY = 'vdi_data_destroy',
+  VDI_DESTROY = 'vdi_destroy',
+  VDI_DISABLE_CBT = 'vdi_disable_cbt',
+  VDI_ENABLE_CBT = 'vdi_enable_cbt',
+  VDI_INTRODUCE = 'vdi_introduce',
+  VDI_LIST_CHANGED_BLOCKS = 'vdi_list_changed_blocks',
+  VDI_MIRROR = 'vdi_mirror',
+  VDI_RESIZE = 'vdi_resize',
+  VDI_SET_ON_BOOT = 'vdi_set_on_boot',
+  VDI_SNAPSHOT = 'vdi_snapshot',
 }
 
 export enum SR_HEALTH {
-  HEALTHY = "healthy",
-  RECOVERING = "recovering",
+  HEALTHY = 'healthy',
+  RECOVERING = 'recovering',
 }
 
 export enum VDI_OPERATION {
-  BLOCKED = "blocked",
-  CLONE = "clone",
-  COPY = "copy",
-  DATA_DESTROY = "data_destroy",
-  DESTROY = "destroy",
-  DISABLE_CBT = "disable_cbt",
-  ENABLE_CBT = "enable_cbt",
-  FORCE_UNLOCK = "force_unlock",
-  FORGET = "forget",
-  GENERATE_CONFIG = "generate_config",
-  LIST_CHANGED_BLOCKS = "list_changed_blocks",
-  MIRROR = "mirror",
-  RESIZE = "resize",
-  RESIZE_ONLINE = "resize_online",
-  SET_ON_BOOT = "set_on_boot",
-  SNAPSHOT = "snapshot",
-  UPDATE = "update",
+  BLOCKED = 'blocked',
+  CLONE = 'clone',
+  COPY = 'copy',
+  DATA_DESTROY = 'data_destroy',
+  DESTROY = 'destroy',
+  DISABLE_CBT = 'disable_cbt',
+  ENABLE_CBT = 'enable_cbt',
+  FORCE_UNLOCK = 'force_unlock',
+  FORGET = 'forget',
+  GENERATE_CONFIG = 'generate_config',
+  LIST_CHANGED_BLOCKS = 'list_changed_blocks',
+  MIRROR = 'mirror',
+  RESIZE = 'resize',
+  RESIZE_ONLINE = 'resize_online',
+  SET_ON_BOOT = 'set_on_boot',
+  SNAPSHOT = 'snapshot',
+  UPDATE = 'update',
 }
 
 export enum VDI_TYPE {
-  CBT_METADATA = "cbt_metadata",
-  CRASHDUMP = "crashdump",
-  EPHEMERAL = "ephemeral",
-  HA_STATEFILE = "ha_statefile",
-  METADATA = "metadata",
-  PVS_CACHE = "pvs_cache",
-  REDO_LOG = "redo_log",
-  RRD = "rrd",
-  SUSPEND = "suspend",
-  SYSTEM = "system",
-  USER = "user",
+  CBT_METADATA = 'cbt_metadata',
+  CRASHDUMP = 'crashdump',
+  EPHEMERAL = 'ephemeral',
+  HA_STATEFILE = 'ha_statefile',
+  METADATA = 'metadata',
+  PVS_CACHE = 'pvs_cache',
+  REDO_LOG = 'redo_log',
+  RRD = 'rrd',
+  SUSPEND = 'suspend',
+  SYSTEM = 'system',
+  USER = 'user',
 }
 
 export enum ON_BOOT {
-  PERSIST = "persist",
-  RESET = "reset",
+  PERSIST = 'persist',
+  RESET = 'reset',
 }
 
 export enum VBD_OPERATION {
-  ATTACH = "attach",
-  EJECT = "eject",
-  INSERT = "insert",
-  PAUSE = "pause",
-  PLUG = "plug",
-  UNPAUSE = "unpause",
-  UNPLUG = "unplug",
-  UNPLUG_FORCE = "unplug_force",
+  ATTACH = 'attach',
+  EJECT = 'eject',
+  INSERT = 'insert',
+  PAUSE = 'pause',
+  PLUG = 'plug',
+  UNPAUSE = 'unpause',
+  UNPLUG = 'unplug',
+  UNPLUG_FORCE = 'unplug_force',
 }
 
 export enum VBD_TYPE {
-  CD = "CD",
-  DISK = "Disk",
-  FLOPPY = "Floppy",
+  CD = 'CD',
+  DISK = 'Disk',
+  FLOPPY = 'Floppy',
 }
 
 export enum VBD_MODE {
-  RO = "RO",
-  RW = "RW",
+  RO = 'RO',
+  RW = 'RW',
 }
 
 export enum VTPM_OPERATION {
-  DESTROY = "destroy",
+  DESTROY = 'destroy',
 }
 
 export enum PERSISTENCE_BACKEND {
-  XAPI = "xapi",
+  XAPI = 'xapi',
 }
 
 export enum CONSOLE_PROTOCOL {
-  RDP = "rdp",
-  RFB = "rfb",
-  VT100 = "vt100",
+  RDP = 'rdp',
+  RFB = 'rfb',
+  VT100 = 'vt100',
 }
 
 export enum CLS {
-  CERTIFICATE = "Certificate",
-  HOST = "Host",
-  POOL = "Pool",
-  PVS_PROXY = "PVS_proxy",
-  SR = "SR",
-  VDI = "VDI",
-  VM = "VM",
-  VMPP = "VMPP",
-  VMSS = "VMSS",
+  CERTIFICATE = 'Certificate',
+  HOST = 'Host',
+  POOL = 'Pool',
+  PVS_PROXY = 'PVS_proxy',
+  SR = 'SR',
+  VDI = 'VDI',
+  VM = 'VM',
+  VMPP = 'VMPP',
+  VMSS = 'VMSS',
 }
 
 export enum TUNNEL_PROTOCOL {
-  GRE = "gre",
-  VXLAN = "vxlan",
+  GRE = 'gre',
+  VXLAN = 'vxlan',
 }
 
 export enum SRIOV_CONFIGURATION_MODE {
-  MANUAL = "manual",
-  MODPROBE = "modprobe",
-  SYSFS = "sysfs",
-  UNKNOWN = "unknown",
+  MANUAL = 'manual',
+  MODPROBE = 'modprobe',
+  SYSFS = 'sysfs',
+  UNKNOWN = 'unknown',
 }
 
 export enum PGPU_DOM0_ACCESS {
-  DISABLED = "disabled",
-  DISABLE_ON_REBOOT = "disable_on_reboot",
-  ENABLED = "enabled",
-  ENABLE_ON_REBOOT = "enable_on_reboot",
+  DISABLED = 'disabled',
+  DISABLE_ON_REBOOT = 'disable_on_reboot',
+  ENABLED = 'enabled',
+  ENABLE_ON_REBOOT = 'enable_on_reboot',
 }
 
 export enum ALLOCATION_ALGORITHM {
-  BREADTH_FIRST = "breadth_first",
-  DEPTH_FIRST = "depth_first",
+  BREADTH_FIRST = 'breadth_first',
+  DEPTH_FIRST = 'depth_first',
 }
 
 export enum VGPU_TYPE_IMPLEMENTATION {
-  GVT_G = "gvt_g",
-  MXGPU = "mxgpu",
-  NVIDIA = "nvidia",
-  NVIDIA_SRIOV = "nvidia_sriov",
-  PASSTHROUGH = "passthrough",
+  GVT_G = 'gvt_g',
+  MXGPU = 'mxgpu',
+  NVIDIA = 'nvidia',
+  NVIDIA_SRIOV = 'nvidia_sriov',
+  PASSTHROUGH = 'passthrough',
 }
 
 export enum PVS_PROXY_STATUS {
-  CACHING = "caching",
-  INCOMPATIBLE_PROTOCOL_VERSION = "incompatible_protocol_version",
-  INCOMPATIBLE_WRITE_CACHE_MODE = "incompatible_write_cache_mode",
-  INITIALISED = "initialised",
-  STOPPED = "stopped",
+  CACHING = 'caching',
+  INCOMPATIBLE_PROTOCOL_VERSION = 'incompatible_protocol_version',
+  INCOMPATIBLE_WRITE_CACHE_MODE = 'incompatible_write_cache_mode',
+  INITIALISED = 'initialised',
+  STOPPED = 'stopped',
 }
 
 export enum SDN_CONTROLLER_PROTOCOL {
-  PSSL = "pssl",
-  SSL = "ssl",
+  PSSL = 'pssl',
+  SSL = 'ssl',
 }
 
 export enum VUSB_OPERATION {
-  ATTACH = "attach",
-  PLUG = "plug",
-  UNPLUG = "unplug",
+  ATTACH = 'attach',
+  PLUG = 'plug',
+  UNPLUG = 'unplug',
 }
 
 export enum CLUSTER_OPERATION {
-  ADD = "add",
-  DESTROY = "destroy",
-  DISABLE = "disable",
-  ENABLE = "enable",
-  REMOVE = "remove",
+  ADD = 'add',
+  DESTROY = 'destroy',
+  DISABLE = 'disable',
+  ENABLE = 'enable',
+  REMOVE = 'remove',
 }
 
 export enum CLUSTER_HOST_OPERATION {
-  DESTROY = "destroy",
-  DISABLE = "disable",
-  ENABLE = "enable",
+  DESTROY = 'destroy',
+  DISABLE = 'disable',
+  ENABLE = 'enable',
 }
 
 export enum CERTIFICATE_TYPE {
-  CA = "ca",
-  HOST = "host",
-  HOST_INTERNAL = "host_internal",
+  CA = 'ca',
+  HOST = 'host',
+  HOST_INTERNAL = 'host_internal',
 }
 
 export enum VM_COMPRESSION_TYPE {
-  DISABLED = "false",
-  GZIP = "true",
-  ZSTD = "zstd",
+  DISABLED = 'false',
+  GZIP = 'true',
+  ZSTD = 'zstd',
 }
diff --git a/@xen-orchestra/lite/src/libs/xen-api/xen-api.ts b/@xen-orchestra/lite/src/libs/xen-api/xen-api.ts
index b082670507f..54888a08521 100644
--- a/@xen-orchestra/lite/src/libs/xen-api/xen-api.ts
+++ b/@xen-orchestra/lite/src/libs/xen-api/xen-api.ts
@@ -14,406 +14,313 @@ import type {
   XenApiRecordLoadErrorEvent,
   XenApiRecordModEvent,
   XenApiVm,
-} from "@/libs/xen-api/xen-api.types";
-import { buildXoObject, typeToRawType } from "@/libs/xen-api/xen-api.utils";
-import { JSONRPCClient } from "json-rpc-2.0";
-import { castArray } from "lodash-es";
-import type { VM_COMPRESSION_TYPE } from "@/libs/xen-api/xen-api.enums";
-import { useModal } from "@/composables/modal.composable";
+} from '@/libs/xen-api/xen-api.types'
+import { buildXoObject, typeToRawType } from '@/libs/xen-api/xen-api.utils'
+import { JSONRPCClient } from 'json-rpc-2.0'
+import { castArray } from 'lodash-es'
+import type { VM_COMPRESSION_TYPE } from '@/libs/xen-api/xen-api.enums'
+import { useModal } from '@/composables/modal.composable'
 
 export default class XenApi {
-  private client: JSONRPCClient;
-  private sessionId: string | undefined;
-  private events = new Map<
-    XenApiRecordEvent<any>,
-    Set<(...args: any[]) => void>
-  >();
-  private fromToken: string | undefined;
-  private hostUrl: string;
+  private client: JSONRPCClient
+  private sessionId: string | undefined
+  private events = new Map<XenApiRecordEvent<any>, Set<(...args: any[]) => void>>()
+  private fromToken: string | undefined
+  private hostUrl: string
 
   constructor(hostUrl: string) {
-    this.hostUrl = hostUrl;
-    this.client = new JSONRPCClient(async (request) => {
+    this.hostUrl = hostUrl
+    this.client = new JSONRPCClient(async request => {
       const response = await fetch(`${this.hostUrl}/jsonrpc`, {
-        method: "POST",
-        headers: { "content-type": "application/json" },
+        method: 'POST',
+        headers: { 'content-type': 'application/json' },
         body: JSON.stringify(request),
-      });
+      })
 
       if (response.status === 200) {
-        const json = await response.json();
-        return this.client.receive(json);
+        const json = await response.json()
+        return this.client.receive(json)
       } else if (request.id !== undefined) {
-        return Promise.reject(new Error(response.statusText));
+        return Promise.reject(new Error(response.statusText))
       }
-    });
+    })
   }
 
   async connectWithPassword(username: string, password: string) {
-    this.sessionId = await this.request("session.login_with_password", [
-      username,
-      password,
-    ]);
+    this.sessionId = await this.request('session.login_with_password', [username, password])
 
-    return this.sessionId;
+    return this.sessionId
   }
 
   async connectWithSessionId(sessionId: string) {
     try {
-      this.sessionId = undefined;
+      this.sessionId = undefined
 
-      await this.request("session.get_all_subject_identifiers", [sessionId]);
+      await this.request('session.get_all_subject_identifiers', [sessionId])
 
-      this.sessionId = sessionId;
+      this.sessionId = sessionId
 
-      return true;
+      return true
     } catch (error: any) {
-      if (error?.message === "SESSION_INVALID") {
-        return false;
+      if (error?.message === 'SESSION_INVALID') {
+        return false
       } else {
-        throw error;
+        throw error
       }
     }
   }
 
   async disconnect() {
-    await this.call("session.logout");
-    this.sessionId = undefined;
-    this.fromToken = undefined;
+    await this.call('session.logout')
+    this.sessionId = undefined
+    this.fromToken = undefined
   }
 
   private request<T>(method: string, args: any[] = []): PromiseLike<T> {
-    return this.client.request(method, args);
+    return this.client.request(method, args)
   }
 
   call = <T>(method: string, args: any[] = []): PromiseLike<T> => {
-    return this.request(method, [this.sessionId, ...args]);
-  };
+    return this.request(method, [this.sessionId, ...args])
+  }
 
   async getResource(
     pathname: string,
-    {
-      abortSignal,
-      host,
-      query,
-    }: { abortSignal?: AbortSignal; host: XenApiHost; query: any }
+    { abortSignal, host, query }: { abortSignal?: AbortSignal; host: XenApiHost; query: any }
   ) {
-    const url = new URL("http://localhost");
-    url.protocol = window.location.protocol;
-    url.hostname = host.address;
-    url.pathname = pathname;
+    const url = new URL('http://localhost')
+    url.protocol = window.location.protocol
+    url.hostname = host.address
+    url.pathname = pathname
     url.search = new URLSearchParams({
       ...query,
       session_id: this.sessionId,
-    }).toString();
+    }).toString()
 
-    return fetch(url, { signal: abortSignal });
+    return fetch(url, { signal: abortSignal })
   }
 
-  async loadRecords<
-    Type extends ObjectType,
-    XRecord extends ObjectTypeToRecord<Type>,
-  >(type: Type): Promise<XRecord[]> {
-    this.emitEvent(`${type}.beforeLoad`);
+  async loadRecords<Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(type: Type): Promise<XRecord[]> {
+    this.emitEvent(`${type}.beforeLoad`)
 
     try {
-      const result = await this.call<
-        Record<XRecord["$ref"], RawXenApiRecord<XRecord>>
-      >(`${typeToRawType(type)}.get_all_records`);
+      const result = await this.call<Record<XRecord['$ref'], RawXenApiRecord<XRecord>>>(
+        `${typeToRawType(type)}.get_all_records`
+      )
 
       const records = Object.entries(result).map(([opaqueRef, record]) =>
         buildXoObject(record as RawXenApiRecord<XRecord>, {
-          opaqueRef: opaqueRef as XRecord["$ref"],
+          opaqueRef: opaqueRef as XRecord['$ref'],
         })
-      );
+      )
 
-      this.emitEvent(`${type}.afterLoad`, records);
+      this.emitEvent(`${type}.afterLoad`, records)
 
-      return records;
+      return records
     } catch (e) {
-      this.emitEvent(`${type}.loadError`, e);
-      return [];
+      this.emitEvent(`${type}.loadError`, e)
+      return []
     }
   }
 
-  addEventListener<
-    Type extends ObjectType,
-    XRecord extends ObjectTypeToRecord<Type>,
-  >(
+  addEventListener<Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(
     event: XenApiRecordAfterLoadEvent<Type>,
     callback: (records: XRecord[]) => void
-  ): void;
+  ): void
 
-  addEventListener<Type extends ObjectType>(
-    event: XenApiRecordBeforeLoadEvent<Type>,
-    callback: () => void
-  ): void;
+  addEventListener<Type extends ObjectType>(event: XenApiRecordBeforeLoadEvent<Type>, callback: () => void): void
 
   addEventListener<Type extends ObjectType>(
     event: XenApiRecordLoadErrorEvent<Type>,
     callback: (error: Error) => void
-  ): void;
+  ): void
 
-  addEventListener<
-    Type extends ObjectType,
-    XRecord extends ObjectTypeToRecord<Type>,
-  >(
+  addEventListener<Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(
     event: XenApiRecordAddEvent<Type> | XenApiRecordModEvent<Type>,
     callback: (record: XRecord) => void
-  ): void;
+  ): void
 
-  addEventListener<
-    Type extends ObjectType,
-    XRecord extends ObjectTypeToRecord<Type>,
-  >(
+  addEventListener<Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(
     event: XenApiRecordDelEvent<Type>,
-    callback: (opaqueRef: XRecord["$ref"]) => void
-  ): void;
+    callback: (opaqueRef: XRecord['$ref']) => void
+  ): void
 
-  addEventListener<Type extends ObjectType>(
-    event: XenApiRecordEvent<Type>,
-    callback: (...args: any[]) => void
-  ) {
+  addEventListener<Type extends ObjectType>(event: XenApiRecordEvent<Type>, callback: (...args: any[]) => void) {
     if (!this.events.has(event)) {
-      this.events.set(event, new Set());
+      this.events.set(event, new Set())
     }
 
-    this.events.get(event)!.add(callback);
+    this.events.get(event)!.add(callback)
   }
 
-  removeEventListener<Type extends ObjectType>(
-    event: XenApiRecordBeforeLoadEvent<Type>,
-    callback: () => void
-  ): void;
+  removeEventListener<Type extends ObjectType>(event: XenApiRecordBeforeLoadEvent<Type>, callback: () => void): void
 
   removeEventListener<Type extends ObjectType>(
     event: XenApiRecordLoadErrorEvent<Type>,
     callback: (error: Error) => void
-  ): void;
+  ): void
 
-  removeEventListener<
-    Type extends ObjectType,
-    XRecord extends ObjectTypeToRecord<Type>,
-  >(
+  removeEventListener<Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(
     event: XenApiRecordAfterLoadEvent<Type>,
     callback: (records: XRecord[]) => void
-  ): void;
+  ): void
 
-  removeEventListener<
-    Type extends ObjectType,
-    XRecord extends ObjectTypeToRecord<Type>,
-  >(
+  removeEventListener<Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(
     event: XenApiRecordAddEvent<any> | XenApiRecordModEvent<any>,
     callback: (record: XRecord) => void
-  ): void;
+  ): void
 
-  removeEventListener<
-    Type extends ObjectType,
-    XRecord extends ObjectTypeToRecord<Type>,
-  >(
+  removeEventListener<Type extends ObjectType, XRecord extends ObjectTypeToRecord<Type>>(
     event: XenApiRecordDelEvent<Type>,
-    callback: (opaqueRef: XRecord["$ref"]) => void
-  ): void;
+    callback: (opaqueRef: XRecord['$ref']) => void
+  ): void
 
-  removeEventListener<Type extends ObjectType>(
-    event: XenApiRecordEvent<Type>,
-    callback: (value: any) => void
-  ) {
-    this.events.get(event)?.delete(callback);
+  removeEventListener<Type extends ObjectType>(event: XenApiRecordEvent<Type>, callback: (value: any) => void) {
+    this.events.get(event)?.delete(callback)
   }
 
   get listenedTypes() {
-    const keys = new Set<ObjectType>();
+    const keys = new Set<ObjectType>()
 
     for (const event of this.events.keys()) {
-      keys.add(event.split(".")[0] as ObjectType);
+      keys.add(event.split('.')[0] as ObjectType)
     }
 
-    return Array.from(keys);
+    return Array.from(keys)
   }
 
-  private emitEvent<Type extends ObjectType>(
-    event: XenApiRecordEvent<Type>,
-    ...args: any[]
-  ) {
-    const callbacks = this.events.get(event);
+  private emitEvent<Type extends ObjectType>(event: XenApiRecordEvent<Type>, ...args: any[]) {
+    const callbacks = this.events.get(event)
 
     if (callbacks !== undefined) {
-      callbacks.forEach((callback) => {
-        callback(...args);
-      });
+      callbacks.forEach(callback => {
+        // eslint-disable-next-line n/no-callback-literal
+        callback(...args)
+      })
     }
   }
 
   private handleEvents(events: XenApiEvent<ObjectType, XenApiRecord<any>>[]) {
     events.forEach(({ class: cls, operation, ref, snapshot }) => {
-      const eventName = `${cls}.${operation}` as XenApiRecordEvent<any>;
+      const eventName = `${cls}.${operation}` as XenApiRecordEvent<any>
 
-      if (operation === "add" || operation === "mod") {
-        this.emitEvent(eventName, buildXoObject(snapshot, { opaqueRef: ref }));
-        return;
+      if (operation === 'add' || operation === 'mod') {
+        this.emitEvent(eventName, buildXoObject(snapshot, { opaqueRef: ref }))
+        return
       }
 
-      if (operation === "del") {
-        this.emitEvent(eventName, ref);
-        return;
+      if (operation === 'del') {
+        this.emitEvent(eventName, ref)
       }
-    });
+    })
   }
 
-  async startWatching(poolRef: XenApiPool["$ref"]) {
-    this.fromToken = await this.call("event.inject", ["pool", poolRef]);
-    return this.watch();
+  async startWatching(poolRef: XenApiPool['$ref']) {
+    this.fromToken = await this.call('event.inject', ['pool', poolRef])
+    return this.watch()
   }
 
-  private async watch() {
+  private async watch(): Promise<void> {
     if (this.fromToken === undefined || this.sessionId === undefined) {
-      return;
+      return
     }
 
-    await new Promise((resolve) => setTimeout(resolve, 2000));
+    await new Promise(resolve => setTimeout(resolve, 2000))
 
     if (this.listenedTypes.length === 0) {
-      void this.watch();
-      return;
+      return this.watch()
     }
 
     const result: {
-      token: string;
-      events: XenApiEvent<ObjectType, XenApiRecord<any>>[];
-    } = await this.call("event.from", [
-      this.listenedTypes,
-      this.fromToken,
-      5.001,
-    ]);
+      token: string
+      events: XenApiEvent<ObjectType, XenApiRecord<any>>[]
+    } = await this.call('event.from', [this.listenedTypes, this.fromToken, 5.001])
 
-    this.fromToken = result.token;
+    this.fromToken = result.token
 
-    this.handleEvents(result.events);
+    this.handleEvents(result.events)
 
-    void this.watch();
+    return this.watch()
   }
 
   get vm() {
-    type VmRefs = XenApiVm["$ref"] | XenApiVm["$ref"][];
-    type VmRefsWithPowerState = Record<
-      XenApiVm["$ref"],
-      XenApiVm["power_state"]
-    >;
-    type VmRefsWithNameLabel = Record<XenApiVm["$ref"], string>;
+    type VmRefs = XenApiVm['$ref'] | XenApiVm['$ref'][]
+    type VmRefsWithPowerState = Record<XenApiVm['$ref'], XenApiVm['power_state']>
+    type VmRefsWithNameLabel = Record<XenApiVm['$ref'], string>
 
     return {
-      delete: (vmRefs: VmRefs) =>
-        Promise.all(
-          castArray(vmRefs).map((vmRef) => this.call("VM.destroy", [vmRef]))
-        ),
+      delete: (vmRefs: VmRefs) => Promise.all(castArray(vmRefs).map(vmRef => this.call('VM.destroy', [vmRef]))),
       start: (vmRefs: VmRefs) =>
-        Promise.all(
-          castArray(vmRefs).map((vmRef) =>
-            this.call("VM.start", [vmRef, false, false])
-          )
-        ),
-      startOn: (vmRefs: VmRefs, hostRef: XenApiHost["$ref"]) =>
-        Promise.all(
-          castArray(vmRefs).map((vmRef) =>
-            this.call("VM.start_on", [vmRef, hostRef, false, false])
-          )
-        ),
-      pause: (vmRefs: VmRefs) =>
-        Promise.all(
-          castArray(vmRefs).map((vmRef) => this.call("VM.pause", [vmRef]))
-        ),
+        Promise.all(castArray(vmRefs).map(vmRef => this.call('VM.start', [vmRef, false, false]))),
+      startOn: (vmRefs: VmRefs, hostRef: XenApiHost['$ref']) =>
+        Promise.all(castArray(vmRefs).map(vmRef => this.call('VM.start_on', [vmRef, hostRef, false, false]))),
+      pause: (vmRefs: VmRefs) => Promise.all(castArray(vmRefs).map(vmRef => this.call('VM.pause', [vmRef]))),
       suspend: (vmRefs: VmRefs) => {
-        return Promise.all(
-          castArray(vmRefs).map((vmRef) => this.call("VM.suspend", [vmRef]))
-        );
+        return Promise.all(castArray(vmRefs).map(vmRef => this.call('VM.suspend', [vmRef])))
       },
       resume: (vmRefsWithPowerState: VmRefsWithPowerState) => {
-        const vmRefs = Object.keys(vmRefsWithPowerState) as XenApiVm["$ref"][];
+        const vmRefs = Object.keys(vmRefsWithPowerState) as XenApiVm['$ref'][]
 
         return Promise.all(
-          vmRefs.map((vmRef) => {
-            if (vmRefsWithPowerState[vmRef] === "Suspended") {
-              return this.call("VM.resume", [vmRef, false, false]);
+          vmRefs.map(vmRef => {
+            if (vmRefsWithPowerState[vmRef] === 'Suspended') {
+              return this.call('VM.resume', [vmRef, false, false])
             }
 
-            return this.call("VM.unpause", [vmRef]);
+            return this.call('VM.unpause', [vmRef])
           })
-        );
+        )
       },
       reboot: (vmRefs: VmRefs, force = false) => {
-        return Promise.all(
-          castArray(vmRefs).map((vmRef) =>
-            this.call(`VM.${force ? "hard" : "clean"}_reboot`, [vmRef])
-          )
-        );
+        return Promise.all(castArray(vmRefs).map(vmRef => this.call(`VM.${force ? 'hard' : 'clean'}_reboot`, [vmRef])))
       },
       shutdown: (vmRefs: VmRefs, force = false) => {
         return Promise.all(
-          castArray(vmRefs).map((vmRef) =>
-            this.call(`VM.${force ? "hard" : "clean"}_shutdown`, [vmRef])
-          )
-        );
+          castArray(vmRefs).map(vmRef => this.call(`VM.${force ? 'hard' : 'clean'}_shutdown`, [vmRef]))
+        )
       },
       clone: (vmRefsToClone: VmRefsWithNameLabel) => {
-        const vmRefs = Object.keys(vmRefsToClone) as XenApiVm["$ref"][];
+        const vmRefs = Object.keys(vmRefsToClone) as XenApiVm['$ref'][]
 
-        return Promise.all(
-          vmRefs.map((vmRef) =>
-            this.call("VM.clone", [vmRef, vmRefsToClone[vmRef]])
-          )
-        );
+        return Promise.all(vmRefs.map(vmRef => this.call('VM.clone', [vmRef, vmRefsToClone[vmRef]])))
       },
-      migrate: (vmRefs: VmRefs, destinationHostRef: XenApiHost["$ref"]) => {
+      migrate: (vmRefs: VmRefs, destinationHostRef: XenApiHost['$ref']) => {
         return Promise.all(
-          castArray(vmRefs).map((vmRef) =>
-            this.call("VM.pool_migrate", [
-              vmRef,
-              destinationHostRef,
-              { force: "false" },
-            ])
-          )
-        );
+          castArray(vmRefs).map(vmRef => this.call('VM.pool_migrate', [vmRef, destinationHostRef, { force: 'false' }]))
+        )
       },
       snapshot: (vmRefsToSnapshot: VmRefsWithNameLabel) => {
-        const vmRefs = Object.keys(vmRefsToSnapshot) as XenApiVm["$ref"][];
+        const vmRefs = Object.keys(vmRefsToSnapshot) as XenApiVm['$ref'][]
 
-        return Promise.all(
-          vmRefs.map((vmRef) =>
-            this.call("VM.snapshot", [vmRef, vmRefsToSnapshot[vmRef]])
-          )
-        );
+        return Promise.all(vmRefs.map(vmRef => this.call('VM.snapshot', [vmRef, vmRefsToSnapshot[vmRef]])))
       },
       export: (vmRefs: VmRefs, compression: VM_COMPRESSION_TYPE) => {
-        const blockedUrls: URL[] = [];
+        const blockedUrls: URL[] = []
 
-        castArray(vmRefs).forEach((vmRef) => {
-          const url = new URL(this.hostUrl);
-          url.pathname = "/export/";
+        castArray(vmRefs).forEach(vmRef => {
+          const url = new URL(this.hostUrl)
+          url.pathname = '/export/'
           url.search = new URLSearchParams({
             session_id: this.sessionId!,
             ref: vmRef,
             use_compression: compression,
-          }).toString();
+          }).toString()
 
-          const _window = window.open(url.href, "_blank");
+          const _window = window.open(url.href, '_blank')
           if (_window === null) {
-            blockedUrls.push(url);
+            blockedUrls.push(url)
           } else {
-            URL.revokeObjectURL(url.toString());
+            URL.revokeObjectURL(url.toString())
           }
-        });
+        })
 
         if (blockedUrls.length > 0) {
-          const { onClose } = useModal(
-            () => import("@/components/modals/VmExportBlockedUrlsModal.vue"),
-            { blockedUrls }
-          );
-          onClose(() =>
-            blockedUrls.forEach((url) => URL.revokeObjectURL(url.toString()))
-          );
+          const { onClose } = useModal(() => import('@/components/modals/VmExportBlockedUrlsModal.vue'), {
+            blockedUrls,
+          })
+          onClose(() => blockedUrls.forEach(url => URL.revokeObjectURL(url.toString())))
         }
       },
-    };
+    }
   }
 }
diff --git a/@xen-orchestra/lite/src/libs/xen-api/xen-api.types.ts b/@xen-orchestra/lite/src/libs/xen-api/xen-api.types.ts
index 66afcbc11aa..22075e4fe59 100644
--- a/@xen-orchestra/lite/src/libs/xen-api/xen-api.types.ts
+++ b/@xen-orchestra/lite/src/libs/xen-api/xen-api.types.ts
@@ -1,3 +1,5 @@
+/* eslint-disable no-use-before-define */
+
 import type {
   ALLOCATION_ALGORITHM,
   BOND_MODE,
@@ -39,600 +41,591 @@ import type {
   VMSS_TYPE,
   VTPM_OPERATION,
   VUSB_OPERATION,
-} from "@/libs/xen-api/xen-api.enums";
-import type { XEN_API_OBJECT_TYPES } from "@/libs/xen-api/xen-api.utils";
+} from '@/libs/xen-api/xen-api.enums'
+import type { XEN_API_OBJECT_TYPES } from '@/libs/xen-api/xen-api.utils'
 
-type TypeMapping = typeof XEN_API_OBJECT_TYPES;
-export type ObjectType = keyof TypeMapping;
-export type RawObjectType = TypeMapping[ObjectType];
+type TypeMapping = typeof XEN_API_OBJECT_TYPES
+export type ObjectType = keyof TypeMapping
+export type RawObjectType = TypeMapping[ObjectType]
 
-export type RawTypeToType<RawType extends RawObjectType> = Lowercase<RawType>;
-export type TypeToRawType<Type extends ObjectType> = TypeMapping[Type];
+export type RawTypeToType<RawType extends RawObjectType> = Lowercase<RawType>
+export type TypeToRawType<Type extends ObjectType> = TypeMapping[Type]
 
 type ObjectTypeToRecordMapping = {
-  console: XenApiConsole;
-  host: XenApiHost;
-  host_metrics: XenApiHostMetrics;
-  message: XenApiMessage<any>;
-  network: XenApiNetwork;
-  pool: XenApiPool;
-  sr: XenApiSr;
-  vm: XenApiVm;
-  vm_guest_metrics: XenApiVmGuestMetrics;
-  vm_metrics: XenApiVmMetrics;
-};
-
-export type ObjectTypeToRecord<Type extends ObjectType> =
-  Type extends keyof ObjectTypeToRecordMapping
-    ? ObjectTypeToRecordMapping[Type]
-    : never;
-
-export type XenApiRecordBeforeLoadEvent<Type extends ObjectType> =
-  `${Type}.beforeLoad`;
-export type XenApiRecordAfterLoadEvent<Type extends ObjectType> =
-  `${Type}.afterLoad`;
-export type XenApiRecordLoadErrorEvent<Type extends ObjectType> =
-  `${Type}.loadError`;
-export type XenApiRecordAddEvent<Type extends ObjectType> = `${Type}.add`;
-export type XenApiRecordModEvent<Type extends ObjectType> = `${Type}.mod`;
-export type XenApiRecordDelEvent<Type extends ObjectType> = `${Type}.del`;
+  console: XenApiConsole
+  host: XenApiHost
+  host_metrics: XenApiHostMetrics
+  message: XenApiMessage<any>
+  network: XenApiNetwork
+  pool: XenApiPool
+  sr: XenApiSr
+  vm: XenApiVm
+  vm_guest_metrics: XenApiVmGuestMetrics
+  vm_metrics: XenApiVmMetrics
+}
+
+export type ObjectTypeToRecord<Type extends ObjectType> = Type extends keyof ObjectTypeToRecordMapping
+  ? ObjectTypeToRecordMapping[Type]
+  : never
+
+export type XenApiRecordBeforeLoadEvent<Type extends ObjectType> = `${Type}.beforeLoad`
+export type XenApiRecordAfterLoadEvent<Type extends ObjectType> = `${Type}.afterLoad`
+export type XenApiRecordLoadErrorEvent<Type extends ObjectType> = `${Type}.loadError`
+export type XenApiRecordAddEvent<Type extends ObjectType> = `${Type}.add`
+export type XenApiRecordModEvent<Type extends ObjectType> = `${Type}.mod`
+export type XenApiRecordDelEvent<Type extends ObjectType> = `${Type}.del`
 export type XenApiRecordEvent<Type extends ObjectType> =
   | XenApiRecordBeforeLoadEvent<Type>
   | XenApiRecordAfterLoadEvent<Type>
   | XenApiRecordLoadErrorEvent<Type>
   | XenApiRecordAddEvent<Type>
   | XenApiRecordModEvent<Type>
-  | XenApiRecordDelEvent<Type>;
+  | XenApiRecordDelEvent<Type>
 
-declare const __brand: unique symbol;
+declare const __brand: unique symbol
 
 export interface XenApiRecord<Type extends ObjectType> {
-  $ref: string & { [__brand]: `${Type}Ref` };
-  uuid: string & { [__brand]: `${Type}Uuid` };
+  $ref: string & { [__brand]: `${Type}Ref` }
+  uuid: string & { [__brand]: `${Type}Uuid` }
 }
 
-export type RawXenApiRecord<T extends XenApiRecord<ObjectType>> = Omit<
-  T,
-  "$ref"
->;
+export type RawXenApiRecord<T extends XenApiRecord<ObjectType>> = Omit<T, '$ref'>
 
-export interface XenApiPool extends XenApiRecord<"pool"> {
+export interface XenApiPool extends XenApiRecord<'pool'> {
   cpu_info: {
-    cpu_count: string;
-  };
-  master: XenApiHost["$ref"];
-  name_label: string;
-}
-
-export interface XenApiHost extends XenApiRecord<"host"> {
-  address: string;
-  name_label: string;
-  metrics: XenApiHostMetrics["$ref"];
-  resident_VMs: XenApiVm["$ref"][];
-  cpu_info: { cpu_count: string };
-  software_version: { product_version: string };
-}
-
-export interface XenApiSr extends XenApiRecord<"sr"> {
-  content_type: string;
-  name_label: string;
-  physical_size: number;
-  physical_utilisation: number;
-  shared: boolean;
-}
-
-export interface XenApiVm extends XenApiRecord<"vm"> {
-  HVM_boot_params: Record<string, string>;
-  HVM_boot_policy: string;
-  HVM_shadow_multiplier: number;
-  NVRAM: Record<string, string>;
-  PCI_bus: string;
-  PV_args: string;
-  PV_bootloader: string;
-  PV_bootloader_args: string;
-  PV_kernel: string;
-  PV_legacy_args: string;
-  PV_ramdisk: string;
-  VBDs: XenApiVbd["$ref"][];
-  VCPUs_at_startup: number;
-  VCPUs_max: number;
-  VCPUs_params: Record<string, string>;
-  VGPUs: XenApiVgpu["$ref"][];
-  VIFs: XenApiVif["$ref"][];
-  VTPMs: XenApiVtpm["$ref"][];
-  VUSBs: XenApiVusb["$ref"][];
-  actions_after_crash: ON_CRASH_BEHAVIOUR;
-  actions_after_reboot: ON_NORMAL_EXIT;
-  actions_after_shutdown: ON_NORMAL_EXIT;
-  actions_after_softreboot: ON_SOFTREBOOT_BEHAVIOR;
-  affinity: XenApiHost["$ref"];
-  allowed_operations: VM_OPERATION[];
-  appliance: XenApiVmAppliance["$ref"];
-  attached_PCIs: XenApiPci["$ref"][];
-  bios_strings: Record<string, string>;
-  blobs: Record<string, XenApiBlob["$ref"]>;
-  blocked_operations: Record<VM_OPERATION, string>;
-  children: XenApiVm["$ref"][];
-  consoles: XenApiConsole["$ref"][];
-  crash_dumps: XenApiCrashdump["$ref"][];
-  current_operations: Record<string, VM_OPERATION>;
-  domain_type: DOMAIN_TYPE;
-  domarch: string;
-  domid: number;
-  generation_id: string;
-  guest_metrics: XenApiVmGuestMetrics["$ref"];
-  ha_always_run: boolean;
-  ha_restart_priority: string;
-  hardware_platform_version: number;
-  has_vendor_device: boolean;
-  is_a_snapshot: boolean;
-  is_a_template: boolean;
-  is_control_domain: boolean;
-  is_default_template: boolean;
-  is_snapshot_from_vmpp: boolean;
-  is_vmss_snapshot: boolean;
-  last_boot_CPU_flags: Record<string, string>;
-  last_booted_record: string;
-  memory_dynamic_max: number;
-  memory_dynamic_min: number;
-  memory_overhead: number;
-  memory_static_max: number;
-  memory_static_min: number;
-  memory_target: number;
-  metrics: XenApiVmMetrics["$ref"];
-  name_description: string;
-  name_label: string;
-  order: number;
-  other_config: Record<string, string>;
-  parent: XenApiVm["$ref"];
-  pending_guidances: UPDATE_GUIDANCE[];
-  platform: Record<string, string>;
-  power_state: VM_POWER_STATE;
-  protection_policy: XenApiVmpp["$ref"];
-  recommendations: string;
-  reference_label: string;
-  requires_reboot: boolean;
-  resident_on: XenApiHost["$ref"];
-  scheduled_to_be_resident_on: XenApiHost["$ref"];
-  shutdown_delay: number;
-  snapshot_info: Record<string, string>;
-  snapshot_metadata: string;
-  snapshot_of: XenApiVm["$ref"];
-  snapshot_schedule: XenApiVmss["$ref"];
-  snapshot_time: string;
-  snapshots: XenApiVm["$ref"][];
-  start_delay: number;
-  suspend_SR: XenApiSr["$ref"];
-  suspend_VDI: XenApiVdi["$ref"];
-  tags: string[];
-  transportable_snapshot_id: string;
-  user_version: number;
-  version: number;
-  xenstore_data: Record<string, string>;
-}
-
-export interface XenApiVtpm extends XenApiRecord<"vtpm"> {
-  VM: XenApiVm["$ref"];
-  allowed_operations: VTPM_OPERATION[];
-  backend: XenApiVm["$ref"];
-  current_operations: Record<string, VTPM_OPERATION>;
-  is_protected: boolean;
-  is_unique: boolean;
-  persistence_backend: PERSISTENCE_BACKEND;
-}
-
-export interface XenApiVusb extends XenApiRecord<"vusb"> {
-  USB_group: XenApiUsbGroup["$ref"];
-  VM: XenApiVm["$ref"];
-  allowed_operations: VUSB_OPERATION[];
-  current_operations: Record<string, VUSB_OPERATION>;
-  currently_attached: boolean;
-  other_config: Record<string, string>;
-}
-
-export interface XenApiUsbGroup extends XenApiRecord<"usb_group"> {
-  PUSBs: XenApiPusb["$ref"][];
-  VUSBs: XenApiVusb["$ref"][];
-  name_description: string;
-  name_label: string;
-  other_config: Record<string, string>;
-}
-
-export interface XenApiPusb extends XenApiRecord<"pusb"> {
-  USB_group: XenApiUsbGroup["$ref"];
-  description: string;
-  host: XenApiHost["$ref"];
-  other_config: Record<string, string>;
-  passthrough_enabled: boolean;
-  path: string;
-  product_desc: string;
-  product_id: string;
-  serial: string;
-  speed: number;
-  vendor_desc: string;
-  vendor_id: string;
-  version: string;
-}
-
-export interface XenApiVgpu extends XenApiRecord<"vgpu"> {
-  GPU_group: XenApiGpuGroup["$ref"];
-  PCI: XenApiPci["$ref"];
-  VM: XenApiVm["$ref"];
-  compatibility_metadata: Record<string, string>;
-  currently_attached: boolean;
-  device: string;
-  extra_args: string;
-  other_config: Record<string, string>;
-  resident_on: XenApiPgpu["$ref"];
-  scheduled_to_be_resident_on: XenApiPgpu["$ref"];
-  type: XenApiVgpuType["$ref"];
-}
-
-export interface XenApiGpuGroup extends XenApiRecord<"gpu_group"> {
-  GPU_types: string[];
-  PGPUs: XenApiPgpu["$ref"][];
-  VGPUs: XenApiVgpu["$ref"][];
-  allocation_algorithm: ALLOCATION_ALGORITHM;
-  enabled_VGPU_types: XenApiVgpuType["$ref"][];
-  name_description: string;
-  name_label: string;
-  other_config: Record<string, string>;
-  supported_VGPU_types: XenApiVgpuType["$ref"][];
-}
-
-export interface XenApiPgpu extends XenApiRecord<"pgpu"> {
-  GPU_group: XenApiGpuGroup["$ref"];
-  PCI: XenApiPci["$ref"];
-  compatibility_metadata: Record<string, string>;
-  dom0_access: PGPU_DOM0_ACCESS;
-  enabled_VGPU_types: XenApiVgpuType["$ref"][];
-  host: XenApiHost["$ref"];
-  is_system_display_device: boolean;
-  other_config: Record<string, string>;
-  resident_VGPUs: XenApiVgpu["$ref"][];
-  supported_VGPU_max_capacities: Record<XenApiVgpuType["$ref"], number>;
-  supported_VGPU_types: XenApiVgpuType["$ref"][];
-}
-
-export interface XenApiVgpuType extends XenApiRecord<"vgpu_type"> {
-  VGPUs: XenApiVgpu["$ref"][];
-  compatible_types_in_vm: XenApiVgpuType["$ref"][];
-  enabled_on_GPU_groups: XenApiGpuGroup["$ref"][];
-  enabled_on_PGPUs: XenApiPgpu["$ref"][];
-  experimental: boolean;
-  framebuffer_size: number;
-  identifier: string;
-  implementation: VGPU_TYPE_IMPLEMENTATION;
-  max_heads: number;
-  max_resolution_x: number;
-  max_resolution_y: number;
-  model_name: string;
-  supported_on_GPU_groups: XenApiGpuGroup["$ref"][];
-  supported_on_PGPUs: XenApiPgpu["$ref"][];
-  vendor_name: string;
-}
-
-export interface XenApiVmAppliance extends XenApiRecord<"vm_appliance"> {
-  VMs: XenApiVm["$ref"][];
-  allowed_operations: VM_APPLIANCE_OPERATION[];
-  current_operations: Record<string, VM_APPLIANCE_OPERATION>;
-  name_description: string;
-  name_label: string;
-}
-
-export interface XenApiVmpp extends XenApiRecord<"vmpp"> {
-  VMs: XenApiVm["$ref"][];
-  alarm_config: Record<string, string>;
-  archive_frequency: VMPP_ARCHIVE_FREQUENCY;
-  archive_last_run_time: string;
-  archive_schedule: Record<string, string>;
-  archive_target_config: Record<string, string>;
-  archive_target_type: VMPP_ARCHIVE_TARGET_TYPE;
-  backup_frequency: VMPP_BACKUP_FREQUENCY;
-  backup_last_run_time: string;
-  backup_retention_value: number;
-  backup_schedule: Record<string, string>;
-  backup_type: VMPP_BACKUP_TYPE;
-  is_alarm_enabled: boolean;
-  is_archive_running: boolean;
-  is_backup_running: boolean;
-  is_policy_enabled: boolean;
-  name_description: string;
-  name_label: string;
-  recent_alerts: string[];
-}
-
-export interface XenApiVmss extends XenApiRecord<"vmss"> {
-  VMs: XenApiVm["$ref"][];
-  enabled: boolean;
-  frequency: VMSS_FREQUENCY;
-  last_run_time: string;
-  name_description: string;
-  name_label: string;
-  retained_snapshots: number;
-  schedule: Record<string, string>;
-  type: VMSS_TYPE;
-}
-
-export interface XenApiConsole extends XenApiRecord<"console"> {
-  protocol: string;
-  location: string;
-}
-
-export interface XenApiHostMetrics extends XenApiRecord<"host_metrics"> {
-  live: boolean;
-  memory_free: number;
-  memory_total: number;
-}
-
-export interface XenApiVmMetrics extends XenApiRecord<"vm_metrics"> {
-  VCPUs_number: number;
-}
-
-export type XenApiVmGuestMetrics = XenApiRecord<"vm_guest_metrics">;
-
-export interface XenApiTask extends XenApiRecord<"task"> {
-  name_label: string;
-  resident_on: XenApiHost["$ref"];
-  created: string;
-  finished: string;
-  status: string;
-  progress: number;
-}
-
-export interface XenApiMessage<RelationType extends RawObjectType>
-  extends XenApiRecord<"message"> {
-  body: string;
-  cls: RelationType;
-  name: string;
-  obj_uuid: ObjectTypeToRecord<RawTypeToType<RelationType>>["uuid"];
-  priority: number;
-  timestamp: string;
-}
-
-export interface XenApiVbd extends XenApiRecord<"vbd"> {
-  VDI: XenApiVdi["$ref"];
-  VM: XenApiVm["$ref"];
-  allowed_operations: VBD_OPERATION[];
-  bootable: boolean;
-  current_operations: Record<string, VBD_OPERATION>;
-  currently_attached: boolean;
-  device: string;
-  empty: boolean;
-  metrics: XenApiVbdMetrics["$ref"];
-  mode: VBD_MODE;
-  other_config: Record<string, string>;
-  qos_algorithm_params: Record<string, string>;
-  qos_algorithm_type: string;
-  qos_supported_algorithms: string[];
-  runtime_properties: Record<string, string>;
-  status_code: number;
-  status_detail: string;
-  storage_lock: boolean;
-  type: VBD_TYPE;
-  unpluggable: boolean;
-  userdevice: string;
-}
-
-export interface XenApiVbdMetrics extends XenApiRecord<"vbd_metrics"> {
-  io_read_kbs: number;
-  io_write_kbs: number;
-  last_updated: string;
-  other_config: Record<string, string>;
-}
-
-export interface XenApiVdi extends XenApiRecord<"vdi"> {
-  SR: XenApiSr["$ref"];
-  VBDs: XenApiVbd["$ref"][];
-  allow_caching: boolean;
-  allowed_operations: VDI_OPERATION[];
-  cbt_enabled: boolean;
-  crash_dumps: XenApiCrashdump["$ref"][];
-  current_operations: Record<string, VDI_OPERATION>;
-  is_a_snapshot: boolean;
-  is_tools_iso: boolean;
-  location: string;
-  managed: boolean;
-  metadata_latest: boolean;
-  metadata_of_pool: XenApiPool["$ref"];
-  missing: boolean;
-  name_description: string;
-  name_label: string;
-  on_boot: ON_BOOT;
-  other_config: Record<string, string>;
-  parent: XenApiVdi["$ref"];
-  physical_utilisation: number;
-  read_only: boolean;
-  sharable: boolean;
-  sm_config: Record<string, string>;
-  snapshot_of: XenApiVdi["$ref"];
-  snapshot_time: string;
-  snapshots: XenApiVdi["$ref"][];
-  storage_lock: boolean;
-  tags: string[];
-  type: VDI_TYPE;
-  virtual_size: number;
-  xenstore_data: Record<string, string>;
-}
-
-export interface XenApiCrashdump extends XenApiRecord<"crashdump"> {
-  VDI: XenApiVdi["$ref"];
-  VM: XenApiVm["$ref"];
-  other_config: Record<string, string>;
-}
-
-export interface XenApiNetwork extends XenApiRecord<"network"> {
-  MTU: number;
-  PIFs: XenApiPif["$ref"][];
-  VIFs: XenApiVif["$ref"][];
-  allowed_operations: NETWORK_OPERATION[];
-  assigned_ips: Record<XenApiVif["$ref"], string>;
-  blobs: Record<string, XenApiBlob["$ref"]>;
-  bridge: string;
-  current_operations: Record<string, NETWORK_OPERATION>;
-  default_locking_mode: NETWORK_DEFAULT_LOCKING_MODE;
-  managed: boolean;
-  name_description: string;
-  name_label: string;
-  other_config: Record<string, string>;
-  purpose: NETWORK_PURPOSE[];
-  tags: string[];
-}
-
-export interface XenApiBlob extends XenApiRecord<"blob"> {
-  last_updated: string;
-  mime_type: string;
-  name_description: string;
-  name_label: string;
-  public: boolean;
-  size: number;
-}
-
-export interface XenApiVif extends XenApiRecord<"vif"> {
-  MAC: string;
-  MAC_autogenerated: boolean;
-  MTU: number;
-  VM: XenApiVm["$ref"];
-  allowed_operations: VIF_OPERATION[];
-  current_operations: Record<string, VIF_OPERATION>;
-  currently_attached: boolean;
-  device: string;
-  ipv4_addresses: string[];
-  ipv4_allowed: string[];
-  ipv4_configuration_mode: VIF_IPV4_CONFIGURATION_MODE;
-  ipv4_gateway: string;
-  ipv6_addresses: string[];
-  ipv6_allowed: string[];
-  ipv6_configuration_mode: VIF_IPV6_CONFIGURATION_MODE;
-  ipv6_gateway: string;
-  locking_mode: VIF_LOCKING_MODE;
-  metrics: XenApiVifMetrics["$ref"];
-  network: XenApiNetwork["$ref"];
-  other_config: Record<string, string>;
-  qos_algorithm_params: Record<string, string>;
-  qos_algorithm_type: string;
-  qos_supported_algorithms: string[];
-  runtime_properties: Record<string, string>;
-  status_code: number;
-  status_detail: string;
-}
-
-export interface XenApiVifMetrics extends XenApiRecord<"vif_metrics"> {
-  io_read_kbs: number;
-  io_write_kbs: number;
-  last_updated: string;
-  other_config: Record<string, string>;
-}
-
-export interface XenApiPif extends XenApiRecord<"pif"> {
-  DNS: string;
-  IP: string;
-  IPv6: string[];
-  MAC: string;
-  MTU: number;
-  PCI: XenApiPci["$ref"];
-  VLAN: number;
-  VLAN_master_of: XenApiVlan["$ref"];
-  VLAN_slave_of: XenApiVlan["$ref"][];
-  bond_master_of: XenApiBond["$ref"][];
-  bond_slave_of: XenApiBond["$ref"];
-  capabilities: string[];
-  currently_attached: boolean;
-  device: string;
-  disallow_unplug: boolean;
-  gateway: string;
-  host: XenApiHost["$ref"];
-  igmp_snooping_status: PIF_IGMP_STATUS;
-  ip_configuration_mode: IP_CONFIGURATION_MODE;
-  ipv6_configuration_mode: IPV6_CONFIGURATION_MODE;
-  ipv6_gateway: string;
-  managed: boolean;
-  management: boolean;
-  metrics: XenApiPifMetrics["$ref"];
-  netmask: string;
-  network: XenApiNetwork["$ref"];
-  other_config: Record<string, string>;
-  physical: boolean;
-  primary_address_type: PRIMARY_ADDRESS_TYPE;
-  properties: Record<string, string>;
-  sriov_logical_PIF_of: XenApiNetworkSriov["$ref"][];
-  sriov_physical_PIF_of: XenApiNetworkSriov["$ref"][];
-  tunnel_access_PIF_of: XenApiTunnel["$ref"][];
-  tunnel_transport_PIF_of: XenApiTunnel["$ref"][];
-}
-
-export interface XenApiNetworkSriov extends XenApiRecord<"network_sriov"> {
-  configuration_mode: SRIOV_CONFIGURATION_MODE;
-  logical_PIF: XenApiPif["$ref"];
-  physical_PIF: XenApiPif["$ref"];
-  requires_reboot: boolean;
-}
-
-export interface XenApiVlan extends XenApiRecord<"vlan"> {
-  other_config: Record<string, string>;
-  tag: number;
-  tagged_PIF: XenApiPif["$ref"];
-  untagged_PIF: XenApiPif["$ref"];
-}
-
-export interface XenApiTunnel extends XenApiRecord<"tunnel"> {
-  access_PIF: XenApiPif["$ref"];
-  other_config: Record<string, string>;
-  protocol: TUNNEL_PROTOCOL;
-  status: Record<string, string>;
-  transport_PIF: XenApiPif["$ref"];
-}
-
-export interface XenApiPci extends XenApiRecord<"pci"> {
-  class_name: string;
-  dependencies: XenApiPci["$ref"][];
-  device_name: string;
-  driver_name: string;
-  host: XenApiHost["$ref"];
-  other_config: Record<string, string>;
-  pci_id: string;
-  subsystem_device_name: string;
-  subsystem_vendor_name: string;
-  vendor_name: string;
-}
-
-export interface XenApiPifMetrics extends XenApiRecord<"pif_metrics"> {
-  carrier: boolean;
-  device_id: string;
-  device_name: string;
-  duplex: boolean;
-  io_read_kbs: number;
-  io_write_kbs: number;
-  last_updated: string;
-  other_config: Record<string, string>;
-  pci_bus_path: string;
-  speed: number;
-  vendor_id: string;
-  vendor_name: string;
-}
-
-export interface XenApiBond extends XenApiRecord<"bond"> {
-  auto_update_mac: boolean;
-  links_up: number;
-  master: XenApiPif["$ref"];
-  mode: BOND_MODE;
-  other_config: Record<string, string>;
-  primary_slave: XenApiPif["$ref"];
-  properties: Record<string, string>;
-  slaves: XenApiPif["$ref"][];
-}
-
-export type XenApiEvent<
-  RelationType extends ObjectType,
-  XRecord extends ObjectTypeToRecord<RelationType>,
-> = {
-  id: string;
-  class: RelationType;
-  operation: "add" | "mod" | "del";
-  ref: XRecord["$ref"];
-  snapshot: RawXenApiRecord<XRecord>;
-};
+    cpu_count: string
+  }
+  master: XenApiHost['$ref']
+  name_label: string
+}
+
+export interface XenApiHost extends XenApiRecord<'host'> {
+  address: string
+  name_label: string
+  metrics: XenApiHostMetrics['$ref']
+  resident_VMs: XenApiVm['$ref'][]
+  cpu_info: { cpu_count: string }
+  software_version: { product_version: string }
+}
+
+export interface XenApiSr extends XenApiRecord<'sr'> {
+  content_type: string
+  name_label: string
+  physical_size: number
+  physical_utilisation: number
+  shared: boolean
+}
+
+export interface XenApiVm extends XenApiRecord<'vm'> {
+  HVM_boot_params: Record<string, string>
+  HVM_boot_policy: string
+  HVM_shadow_multiplier: number
+  NVRAM: Record<string, string>
+  PCI_bus: string
+  PV_args: string
+  PV_bootloader: string
+  PV_bootloader_args: string
+  PV_kernel: string
+  PV_legacy_args: string
+  PV_ramdisk: string
+  VBDs: XenApiVbd['$ref'][]
+  VCPUs_at_startup: number
+  VCPUs_max: number
+  VCPUs_params: Record<string, string>
+  VGPUs: XenApiVgpu['$ref'][]
+  VIFs: XenApiVif['$ref'][]
+  VTPMs: XenApiVtpm['$ref'][]
+  VUSBs: XenApiVusb['$ref'][]
+  actions_after_crash: ON_CRASH_BEHAVIOUR
+  actions_after_reboot: ON_NORMAL_EXIT
+  actions_after_shutdown: ON_NORMAL_EXIT
+  actions_after_softreboot: ON_SOFTREBOOT_BEHAVIOR
+  affinity: XenApiHost['$ref']
+  allowed_operations: VM_OPERATION[]
+  appliance: XenApiVmAppliance['$ref']
+  attached_PCIs: XenApiPci['$ref'][]
+  bios_strings: Record<string, string>
+  blobs: Record<string, XenApiBlob['$ref']>
+  blocked_operations: Record<VM_OPERATION, string>
+  children: XenApiVm['$ref'][]
+  consoles: XenApiConsole['$ref'][]
+  crash_dumps: XenApiCrashdump['$ref'][]
+  current_operations: Record<string, VM_OPERATION>
+  domain_type: DOMAIN_TYPE
+  domarch: string
+  domid: number
+  generation_id: string
+  guest_metrics: XenApiVmGuestMetrics['$ref']
+  ha_always_run: boolean
+  ha_restart_priority: string
+  hardware_platform_version: number
+  has_vendor_device: boolean
+  is_a_snapshot: boolean
+  is_a_template: boolean
+  is_control_domain: boolean
+  is_default_template: boolean
+  is_snapshot_from_vmpp: boolean
+  is_vmss_snapshot: boolean
+  last_boot_CPU_flags: Record<string, string>
+  last_booted_record: string
+  memory_dynamic_max: number
+  memory_dynamic_min: number
+  memory_overhead: number
+  memory_static_max: number
+  memory_static_min: number
+  memory_target: number
+  metrics: XenApiVmMetrics['$ref']
+  name_description: string
+  name_label: string
+  order: number
+  other_config: Record<string, string>
+  parent: XenApiVm['$ref']
+  pending_guidances: UPDATE_GUIDANCE[]
+  platform: Record<string, string>
+  power_state: VM_POWER_STATE
+  protection_policy: XenApiVmpp['$ref']
+  recommendations: string
+  reference_label: string
+  requires_reboot: boolean
+  resident_on: XenApiHost['$ref']
+  scheduled_to_be_resident_on: XenApiHost['$ref']
+  shutdown_delay: number
+  snapshot_info: Record<string, string>
+  snapshot_metadata: string
+  snapshot_of: XenApiVm['$ref']
+  snapshot_schedule: XenApiVmss['$ref']
+  snapshot_time: string
+  snapshots: XenApiVm['$ref'][]
+  start_delay: number
+  suspend_SR: XenApiSr['$ref']
+  suspend_VDI: XenApiVdi['$ref']
+  tags: string[]
+  transportable_snapshot_id: string
+  user_version: number
+  version: number
+  xenstore_data: Record<string, string>
+}
+
+export interface XenApiVtpm extends XenApiRecord<'vtpm'> {
+  VM: XenApiVm['$ref']
+  allowed_operations: VTPM_OPERATION[]
+  backend: XenApiVm['$ref']
+  current_operations: Record<string, VTPM_OPERATION>
+  is_protected: boolean
+  is_unique: boolean
+  persistence_backend: PERSISTENCE_BACKEND
+}
+
+export interface XenApiVusb extends XenApiRecord<'vusb'> {
+  USB_group: XenApiUsbGroup['$ref']
+  VM: XenApiVm['$ref']
+  allowed_operations: VUSB_OPERATION[]
+  current_operations: Record<string, VUSB_OPERATION>
+  currently_attached: boolean
+  other_config: Record<string, string>
+}
+
+export interface XenApiUsbGroup extends XenApiRecord<'usb_group'> {
+  PUSBs: XenApiPusb['$ref'][]
+  VUSBs: XenApiVusb['$ref'][]
+  name_description: string
+  name_label: string
+  other_config: Record<string, string>
+}
+
+export interface XenApiPusb extends XenApiRecord<'pusb'> {
+  USB_group: XenApiUsbGroup['$ref']
+  description: string
+  host: XenApiHost['$ref']
+  other_config: Record<string, string>
+  passthrough_enabled: boolean
+  path: string
+  product_desc: string
+  product_id: string
+  serial: string
+  speed: number
+  vendor_desc: string
+  vendor_id: string
+  version: string
+}
+
+export interface XenApiVgpu extends XenApiRecord<'vgpu'> {
+  GPU_group: XenApiGpuGroup['$ref']
+  PCI: XenApiPci['$ref']
+  VM: XenApiVm['$ref']
+  compatibility_metadata: Record<string, string>
+  currently_attached: boolean
+  device: string
+  extra_args: string
+  other_config: Record<string, string>
+  resident_on: XenApiPgpu['$ref']
+  scheduled_to_be_resident_on: XenApiPgpu['$ref']
+  type: XenApiVgpuType['$ref']
+}
+
+export interface XenApiGpuGroup extends XenApiRecord<'gpu_group'> {
+  GPU_types: string[]
+  PGPUs: XenApiPgpu['$ref'][]
+  VGPUs: XenApiVgpu['$ref'][]
+  allocation_algorithm: ALLOCATION_ALGORITHM
+  enabled_VGPU_types: XenApiVgpuType['$ref'][]
+  name_description: string
+  name_label: string
+  other_config: Record<string, string>
+  supported_VGPU_types: XenApiVgpuType['$ref'][]
+}
+
+export interface XenApiPgpu extends XenApiRecord<'pgpu'> {
+  GPU_group: XenApiGpuGroup['$ref']
+  PCI: XenApiPci['$ref']
+  compatibility_metadata: Record<string, string>
+  dom0_access: PGPU_DOM0_ACCESS
+  enabled_VGPU_types: XenApiVgpuType['$ref'][]
+  host: XenApiHost['$ref']
+  is_system_display_device: boolean
+  other_config: Record<string, string>
+  resident_VGPUs: XenApiVgpu['$ref'][]
+  supported_VGPU_max_capacities: Record<XenApiVgpuType['$ref'], number>
+  supported_VGPU_types: XenApiVgpuType['$ref'][]
+}
+
+export interface XenApiVgpuType extends XenApiRecord<'vgpu_type'> {
+  VGPUs: XenApiVgpu['$ref'][]
+  compatible_types_in_vm: XenApiVgpuType['$ref'][]
+  enabled_on_GPU_groups: XenApiGpuGroup['$ref'][]
+  enabled_on_PGPUs: XenApiPgpu['$ref'][]
+  experimental: boolean
+  framebuffer_size: number
+  identifier: string
+  implementation: VGPU_TYPE_IMPLEMENTATION
+  max_heads: number
+  max_resolution_x: number
+  max_resolution_y: number
+  model_name: string
+  supported_on_GPU_groups: XenApiGpuGroup['$ref'][]
+  supported_on_PGPUs: XenApiPgpu['$ref'][]
+  vendor_name: string
+}
+
+export interface XenApiVmAppliance extends XenApiRecord<'vm_appliance'> {
+  VMs: XenApiVm['$ref'][]
+  allowed_operations: VM_APPLIANCE_OPERATION[]
+  current_operations: Record<string, VM_APPLIANCE_OPERATION>
+  name_description: string
+  name_label: string
+}
+
+export interface XenApiVmpp extends XenApiRecord<'vmpp'> {
+  VMs: XenApiVm['$ref'][]
+  alarm_config: Record<string, string>
+  archive_frequency: VMPP_ARCHIVE_FREQUENCY
+  archive_last_run_time: string
+  archive_schedule: Record<string, string>
+  archive_target_config: Record<string, string>
+  archive_target_type: VMPP_ARCHIVE_TARGET_TYPE
+  backup_frequency: VMPP_BACKUP_FREQUENCY
+  backup_last_run_time: string
+  backup_retention_value: number
+  backup_schedule: Record<string, string>
+  backup_type: VMPP_BACKUP_TYPE
+  is_alarm_enabled: boolean
+  is_archive_running: boolean
+  is_backup_running: boolean
+  is_policy_enabled: boolean
+  name_description: string
+  name_label: string
+  recent_alerts: string[]
+}
+
+export interface XenApiVmss extends XenApiRecord<'vmss'> {
+  VMs: XenApiVm['$ref'][]
+  enabled: boolean
+  frequency: VMSS_FREQUENCY
+  last_run_time: string
+  name_description: string
+  name_label: string
+  retained_snapshots: number
+  schedule: Record<string, string>
+  type: VMSS_TYPE
+}
+
+export interface XenApiConsole extends XenApiRecord<'console'> {
+  protocol: string
+  location: string
+}
+
+export interface XenApiHostMetrics extends XenApiRecord<'host_metrics'> {
+  live: boolean
+  memory_free: number
+  memory_total: number
+}
+
+export interface XenApiVmMetrics extends XenApiRecord<'vm_metrics'> {
+  VCPUs_number: number
+}
+
+export type XenApiVmGuestMetrics = XenApiRecord<'vm_guest_metrics'>
+
+export interface XenApiTask extends XenApiRecord<'task'> {
+  name_label: string
+  resident_on: XenApiHost['$ref']
+  created: string
+  finished: string
+  status: string
+  progress: number
+}
+
+export interface XenApiMessage<RelationType extends RawObjectType> extends XenApiRecord<'message'> {
+  body: string
+  cls: RelationType
+  name: string
+  obj_uuid: ObjectTypeToRecord<RawTypeToType<RelationType>>['uuid']
+  priority: number
+  timestamp: string
+}
+
+export interface XenApiVbd extends XenApiRecord<'vbd'> {
+  VDI: XenApiVdi['$ref']
+  VM: XenApiVm['$ref']
+  allowed_operations: VBD_OPERATION[]
+  bootable: boolean
+  current_operations: Record<string, VBD_OPERATION>
+  currently_attached: boolean
+  device: string
+  empty: boolean
+  metrics: XenApiVbdMetrics['$ref']
+  mode: VBD_MODE
+  other_config: Record<string, string>
+  qos_algorithm_params: Record<string, string>
+  qos_algorithm_type: string
+  qos_supported_algorithms: string[]
+  runtime_properties: Record<string, string>
+  status_code: number
+  status_detail: string
+  storage_lock: boolean
+  type: VBD_TYPE
+  unpluggable: boolean
+  userdevice: string
+}
+
+export interface XenApiVbdMetrics extends XenApiRecord<'vbd_metrics'> {
+  io_read_kbs: number
+  io_write_kbs: number
+  last_updated: string
+  other_config: Record<string, string>
+}
+
+export interface XenApiVdi extends XenApiRecord<'vdi'> {
+  SR: XenApiSr['$ref']
+  VBDs: XenApiVbd['$ref'][]
+  allow_caching: boolean
+  allowed_operations: VDI_OPERATION[]
+  cbt_enabled: boolean
+  crash_dumps: XenApiCrashdump['$ref'][]
+  current_operations: Record<string, VDI_OPERATION>
+  is_a_snapshot: boolean
+  is_tools_iso: boolean
+  location: string
+  managed: boolean
+  metadata_latest: boolean
+  metadata_of_pool: XenApiPool['$ref']
+  missing: boolean
+  name_description: string
+  name_label: string
+  on_boot: ON_BOOT
+  other_config: Record<string, string>
+  parent: XenApiVdi['$ref']
+  physical_utilisation: number
+  read_only: boolean
+  sharable: boolean
+  sm_config: Record<string, string>
+  snapshot_of: XenApiVdi['$ref']
+  snapshot_time: string
+  snapshots: XenApiVdi['$ref'][]
+  storage_lock: boolean
+  tags: string[]
+  type: VDI_TYPE
+  virtual_size: number
+  xenstore_data: Record<string, string>
+}
+
+export interface XenApiCrashdump extends XenApiRecord<'crashdump'> {
+  VDI: XenApiVdi['$ref']
+  VM: XenApiVm['$ref']
+  other_config: Record<string, string>
+}
+
+export interface XenApiNetwork extends XenApiRecord<'network'> {
+  MTU: number
+  PIFs: XenApiPif['$ref'][]
+  VIFs: XenApiVif['$ref'][]
+  allowed_operations: NETWORK_OPERATION[]
+  assigned_ips: Record<XenApiVif['$ref'], string>
+  blobs: Record<string, XenApiBlob['$ref']>
+  bridge: string
+  current_operations: Record<string, NETWORK_OPERATION>
+  default_locking_mode: NETWORK_DEFAULT_LOCKING_MODE
+  managed: boolean
+  name_description: string
+  name_label: string
+  other_config: Record<string, string>
+  purpose: NETWORK_PURPOSE[]
+  tags: string[]
+}
+
+export interface XenApiBlob extends XenApiRecord<'blob'> {
+  last_updated: string
+  mime_type: string
+  name_description: string
+  name_label: string
+  public: boolean
+  size: number
+}
+
+export interface XenApiVif extends XenApiRecord<'vif'> {
+  MAC: string
+  MAC_autogenerated: boolean
+  MTU: number
+  VM: XenApiVm['$ref']
+  allowed_operations: VIF_OPERATION[]
+  current_operations: Record<string, VIF_OPERATION>
+  currently_attached: boolean
+  device: string
+  ipv4_addresses: string[]
+  ipv4_allowed: string[]
+  ipv4_configuration_mode: VIF_IPV4_CONFIGURATION_MODE
+  ipv4_gateway: string
+  ipv6_addresses: string[]
+  ipv6_allowed: string[]
+  ipv6_configuration_mode: VIF_IPV6_CONFIGURATION_MODE
+  ipv6_gateway: string
+  locking_mode: VIF_LOCKING_MODE
+  metrics: XenApiVifMetrics['$ref']
+  network: XenApiNetwork['$ref']
+  other_config: Record<string, string>
+  qos_algorithm_params: Record<string, string>
+  qos_algorithm_type: string
+  qos_supported_algorithms: string[]
+  runtime_properties: Record<string, string>
+  status_code: number
+  status_detail: string
+}
+
+export interface XenApiVifMetrics extends XenApiRecord<'vif_metrics'> {
+  io_read_kbs: number
+  io_write_kbs: number
+  last_updated: string
+  other_config: Record<string, string>
+}
+
+export interface XenApiPif extends XenApiRecord<'pif'> {
+  DNS: string
+  IP: string
+  IPv6: string[]
+  MAC: string
+  MTU: number
+  PCI: XenApiPci['$ref']
+  VLAN: number
+  VLAN_master_of: XenApiVlan['$ref']
+  VLAN_slave_of: XenApiVlan['$ref'][]
+  bond_master_of: XenApiBond['$ref'][]
+  bond_slave_of: XenApiBond['$ref']
+  capabilities: string[]
+  currently_attached: boolean
+  device: string
+  disallow_unplug: boolean
+  gateway: string
+  host: XenApiHost['$ref']
+  igmp_snooping_status: PIF_IGMP_STATUS
+  ip_configuration_mode: IP_CONFIGURATION_MODE
+  ipv6_configuration_mode: IPV6_CONFIGURATION_MODE
+  ipv6_gateway: string
+  managed: boolean
+  management: boolean
+  metrics: XenApiPifMetrics['$ref']
+  netmask: string
+  network: XenApiNetwork['$ref']
+  other_config: Record<string, string>
+  physical: boolean
+  primary_address_type: PRIMARY_ADDRESS_TYPE
+  properties: Record<string, string>
+  sriov_logical_PIF_of: XenApiNetworkSriov['$ref'][]
+  sriov_physical_PIF_of: XenApiNetworkSriov['$ref'][]
+  tunnel_access_PIF_of: XenApiTunnel['$ref'][]
+  tunnel_transport_PIF_of: XenApiTunnel['$ref'][]
+}
+
+export interface XenApiNetworkSriov extends XenApiRecord<'network_sriov'> {
+  configuration_mode: SRIOV_CONFIGURATION_MODE
+  logical_PIF: XenApiPif['$ref']
+  physical_PIF: XenApiPif['$ref']
+  requires_reboot: boolean
+}
+
+export interface XenApiVlan extends XenApiRecord<'vlan'> {
+  other_config: Record<string, string>
+  tag: number
+  tagged_PIF: XenApiPif['$ref']
+  untagged_PIF: XenApiPif['$ref']
+}
+
+export interface XenApiTunnel extends XenApiRecord<'tunnel'> {
+  access_PIF: XenApiPif['$ref']
+  other_config: Record<string, string>
+  protocol: TUNNEL_PROTOCOL
+  status: Record<string, string>
+  transport_PIF: XenApiPif['$ref']
+}
+
+export interface XenApiPci extends XenApiRecord<'pci'> {
+  class_name: string
+  dependencies: XenApiPci['$ref'][]
+  device_name: string
+  driver_name: string
+  host: XenApiHost['$ref']
+  other_config: Record<string, string>
+  pci_id: string
+  subsystem_device_name: string
+  subsystem_vendor_name: string
+  vendor_name: string
+}
+
+export interface XenApiPifMetrics extends XenApiRecord<'pif_metrics'> {
+  carrier: boolean
+  device_id: string
+  device_name: string
+  duplex: boolean
+  io_read_kbs: number
+  io_write_kbs: number
+  last_updated: string
+  other_config: Record<string, string>
+  pci_bus_path: string
+  speed: number
+  vendor_id: string
+  vendor_name: string
+}
+
+export interface XenApiBond extends XenApiRecord<'bond'> {
+  auto_update_mac: boolean
+  links_up: number
+  master: XenApiPif['$ref']
+  mode: BOND_MODE
+  other_config: Record<string, string>
+  primary_slave: XenApiPif['$ref']
+  properties: Record<string, string>
+  slaves: XenApiPif['$ref'][]
+}
+
+export type XenApiEvent<RelationType extends ObjectType, XRecord extends ObjectTypeToRecord<RelationType>> = {
+  id: string
+  class: RelationType
+  operation: 'add' | 'mod' | 'del'
+  ref: XRecord['$ref']
+  snapshot: RawXenApiRecord<XRecord>
+}
 
 export interface XenApiError extends Error {
-  data?: any;
+  data?: any
 }
+
+/* eslint-enable no-use-before-define */
diff --git a/@xen-orchestra/lite/src/libs/xen-api/xen-api.utils.ts b/@xen-orchestra/lite/src/libs/xen-api/xen-api.utils.ts
index ca939091cfa..6f4d7387c6b 100644
--- a/@xen-orchestra/lite/src/libs/xen-api/xen-api.utils.ts
+++ b/@xen-orchestra/lite/src/libs/xen-api/xen-api.utils.ts
@@ -5,81 +5,78 @@ import type {
   RawXenApiRecord,
   TypeToRawType,
   XenApiRecord,
-} from "@/libs/xen-api/xen-api.types";
+} from '@/libs/xen-api/xen-api.types'
 
 export const XEN_API_OBJECT_TYPES = {
-  bond: "Bond",
-  certificate: "Certificate",
-  cluster: "Cluster",
-  cluster_host: "Cluster_host",
-  dr_task: "DR_task",
-  feature: "Feature",
-  gpu_group: "GPU_group",
-  pbd: "PBD",
-  pci: "PCI",
-  pgpu: "PGPU",
-  pif: "PIF",
-  pif_metrics: "PIF_metrics",
-  pusb: "PUSB",
-  pvs_cache_storage: "PVS_cache_storage",
-  pvs_proxy: "PVS_proxy",
-  pvs_server: "PVS_server",
-  pvs_site: "PVS_site",
-  sdn_controller: "SDN_controller",
-  sm: "SM",
-  sr: "SR",
-  usb_group: "USB_group",
-  vbd: "VBD",
-  vbd_metrics: "VBD_metrics",
-  vdi: "VDI",
-  vgpu: "VGPU",
-  vgpu_type: "VGPU_type",
-  vif: "VIF",
-  vif_metrics: "VIF_metrics",
-  vlan: "VLAN",
-  vm: "VM",
-  vmpp: "VMPP",
-  vmss: "VMSS",
-  vm_appliance: "VM_appliance",
-  vm_guest_metrics: "VM_guest_metrics",
-  vm_metrics: "VM_metrics",
-  vusb: "VUSB",
-  blob: "blob",
-  console: "console",
-  crashdump: "crashdump",
-  host: "host",
-  host_cpu: "host_cpu",
-  host_crashdump: "host_crashdump",
-  host_metrics: "host_metrics",
-  host_patch: "host_patch",
-  message: "message",
-  network: "network",
-  network_sriov: "network_sriov",
-  pool: "pool",
-  pool_patch: "pool_patch",
-  pool_update: "pool_update",
-  role: "role",
-  secret: "secret",
-  subject: "subject",
-  task: "task",
-  tunnel: "tunnel",
-  vtpm: "VTPM",
-} as const;
+  bond: 'Bond',
+  certificate: 'Certificate',
+  cluster: 'Cluster',
+  cluster_host: 'Cluster_host',
+  dr_task: 'DR_task',
+  feature: 'Feature',
+  gpu_group: 'GPU_group',
+  pbd: 'PBD',
+  pci: 'PCI',
+  pgpu: 'PGPU',
+  pif: 'PIF',
+  pif_metrics: 'PIF_metrics',
+  pusb: 'PUSB',
+  pvs_cache_storage: 'PVS_cache_storage',
+  pvs_proxy: 'PVS_proxy',
+  pvs_server: 'PVS_server',
+  pvs_site: 'PVS_site',
+  sdn_controller: 'SDN_controller',
+  sm: 'SM',
+  sr: 'SR',
+  usb_group: 'USB_group',
+  vbd: 'VBD',
+  vbd_metrics: 'VBD_metrics',
+  vdi: 'VDI',
+  vgpu: 'VGPU',
+  vgpu_type: 'VGPU_type',
+  vif: 'VIF',
+  vif_metrics: 'VIF_metrics',
+  vlan: 'VLAN',
+  vm: 'VM',
+  vmpp: 'VMPP',
+  vmss: 'VMSS',
+  vm_appliance: 'VM_appliance',
+  vm_guest_metrics: 'VM_guest_metrics',
+  vm_metrics: 'VM_metrics',
+  vusb: 'VUSB',
+  blob: 'blob',
+  console: 'console',
+  crashdump: 'crashdump',
+  host: 'host',
+  host_cpu: 'host_cpu',
+  host_crashdump: 'host_crashdump',
+  host_metrics: 'host_metrics',
+  host_patch: 'host_patch',
+  message: 'message',
+  network: 'network',
+  network_sriov: 'network_sriov',
+  pool: 'pool',
+  pool_patch: 'pool_patch',
+  pool_update: 'pool_update',
+  role: 'role',
+  secret: 'secret',
+  subject: 'subject',
+  task: 'task',
+  tunnel: 'tunnel',
+  vtpm: 'VTPM',
+} as const
 
-export const rawTypeToType = <RawType extends RawObjectType>(
-  rawType: RawType
-): RawTypeToType<RawType> => rawType.toLowerCase() as Lowercase<RawType>;
+export const rawTypeToType = <RawType extends RawObjectType>(rawType: RawType): RawTypeToType<RawType> =>
+  rawType.toLowerCase() as Lowercase<RawType>
 
-export const typeToRawType = <Type extends ObjectType>(
-  type: Type
-): TypeToRawType<Type> => XEN_API_OBJECT_TYPES[type];
+export const typeToRawType = <Type extends ObjectType>(type: Type): TypeToRawType<Type> => XEN_API_OBJECT_TYPES[type]
 
 export const buildXoObject = <T extends XenApiRecord<ObjectType>>(
   record: RawXenApiRecord<T>,
-  params: { opaqueRef: T["$ref"] }
+  params: { opaqueRef: T['$ref'] }
 ) => {
   return {
     ...record,
     $ref: params.opaqueRef,
-  } as T;
-};
+  } as T
+}
diff --git a/@xen-orchestra/lite/src/main.ts b/@xen-orchestra/lite/src/main.ts
index b76098227d4..777105d19e4 100644
--- a/@xen-orchestra/lite/src/main.ts
+++ b/@xen-orchestra/lite/src/main.ts
@@ -1,13 +1,13 @@
-import { createPinia } from "pinia";
-import { createApp } from "vue";
-import App from "@/App.vue";
-import i18n from "@/i18n";
-import router from "@/router";
+import { createPinia } from 'pinia'
+import { createApp } from 'vue'
+import App from '@/App.vue'
+import i18n from '@/i18n'
+import router from '@/router'
 
-const app = createApp(App);
+const app = createApp(App)
 
-app.use(i18n);
-app.use(createPinia());
-app.use(router);
+app.use(i18n)
+app.use(createPinia())
+app.use(router)
 
-app.mount("#root");
+app.mount('#root')
diff --git a/@xen-orchestra/lite/src/router/index.ts b/@xen-orchestra/lite/src/router/index.ts
index c68f341355c..8d1633b53f4 100644
--- a/@xen-orchestra/lite/src/router/index.ts
+++ b/@xen-orchestra/lite/src/router/index.ts
@@ -1,47 +1,47 @@
-import pool from "@/router/pool";
-import story from "@/router/story";
-import vm from "@/router/vm";
-import HomeView from "@/views/HomeView.vue";
-import { createRouter, createWebHashHistory } from "vue-router";
+import pool from '@/router/pool'
+import story from '@/router/story'
+import vm from '@/router/vm'
+import HomeView from '@/views/HomeView.vue'
+import { createRouter, createWebHashHistory } from 'vue-router'
 
 const router = createRouter({
   history: createWebHashHistory(),
   routes: [
     {
-      path: "/",
-      name: "home",
+      path: '/',
+      name: 'home',
       component: HomeView,
     },
     {
-      path: "/xoa-deploy",
-      name: "xoa.deploy",
-      component: () => import("@/views/xoa-deploy/XoaDeployView.vue"),
+      path: '/xoa-deploy',
+      name: 'xoa.deploy',
+      component: () => import('@/views/xoa-deploy/XoaDeployView.vue'),
     },
     {
-      path: "/settings",
-      name: "settings",
-      component: () => import("@/views/settings/SettingsView.vue"),
+      path: '/settings',
+      name: 'settings',
+      component: () => import('@/views/settings/SettingsView.vue'),
     },
     story,
     pool,
     vm,
     {
-      path: "/host/:uuid",
-      component: () => import("@/views/host/HostRootView.vue"),
+      path: '/host/:uuid',
+      component: () => import('@/views/host/HostRootView.vue'),
       children: [
         {
-          path: "",
-          name: "host.dashboard",
-          component: () => import("@/views/host/HostDashboardView.vue"),
+          path: '',
+          name: 'host.dashboard',
+          component: () => import('@/views/host/HostDashboardView.vue'),
         },
       ],
     },
     {
-      path: "/:pathMatch(.*)*",
-      name: "not-found",
-      component: () => import("@/views/PageNotFoundView.vue"),
+      path: '/:pathMatch(.*)*',
+      name: 'not-found',
+      component: () => import('@/views/PageNotFoundView.vue'),
     },
   ],
-});
+})
 
-export default router;
+export default router
diff --git a/@xen-orchestra/lite/src/router/pool.ts b/@xen-orchestra/lite/src/router/pool.ts
index a02d50cdfc9..d10ebb08542 100644
--- a/@xen-orchestra/lite/src/router/pool.ts
+++ b/@xen-orchestra/lite/src/router/pool.ts
@@ -1,55 +1,55 @@
-import PoolDashboardView from "@/views/pool/PoolDashboardView.vue";
-import PoolRootView from "@/views/pool/PoolRootView.vue";
+import PoolDashboardView from '@/views/pool/PoolDashboardView.vue'
+import PoolRootView from '@/views/pool/PoolRootView.vue'
 
 export default {
-  path: "/pool/:uuid",
+  path: '/pool/:uuid',
   component: PoolRootView,
-  redirect: { name: "pool.dashboard" },
+  redirect: { name: 'pool.dashboard' },
   children: [
     {
-      path: "dashboard",
-      name: "pool.dashboard",
+      path: 'dashboard',
+      name: 'pool.dashboard',
       component: PoolDashboardView,
     },
     {
-      path: "alarms",
-      name: "pool.alarms",
-      component: () => import("@/views/pool/PoolAlarmsView.vue"),
+      path: 'alarms',
+      name: 'pool.alarms',
+      component: () => import('@/views/pool/PoolAlarmsView.vue'),
     },
     {
-      path: "stats",
-      name: "pool.stats",
-      component: () => import("@/views/pool/PoolStatsView.vue"),
+      path: 'stats',
+      name: 'pool.stats',
+      component: () => import('@/views/pool/PoolStatsView.vue'),
     },
     {
-      path: "system",
-      name: "pool.system",
-      component: () => import("@/views/pool/PoolSystemView.vue"),
+      path: 'system',
+      name: 'pool.system',
+      component: () => import('@/views/pool/PoolSystemView.vue'),
     },
     {
-      path: "network",
-      name: "pool.network",
-      component: () => import("@/views/pool/PoolNetworkView.vue"),
+      path: 'network',
+      name: 'pool.network',
+      component: () => import('@/views/pool/PoolNetworkView.vue'),
     },
     {
-      path: "storage",
-      name: "pool.storage",
-      component: () => import("@/views/pool/PoolStorageView.vue"),
+      path: 'storage',
+      name: 'pool.storage',
+      component: () => import('@/views/pool/PoolStorageView.vue'),
     },
     {
-      path: "tasks",
-      name: "pool.tasks",
-      component: () => import("@/views/pool/PoolTasksView.vue"),
+      path: 'tasks',
+      name: 'pool.tasks',
+      component: () => import('@/views/pool/PoolTasksView.vue'),
     },
     {
-      path: "hosts",
-      name: "pool.hosts",
-      component: () => import("@/views/pool/PoolHostsView.vue"),
+      path: 'hosts',
+      name: 'pool.hosts',
+      component: () => import('@/views/pool/PoolHostsView.vue'),
     },
     {
-      path: "vms",
-      name: "pool.vms",
-      component: () => import("@/views/pool/PoolVmsView.vue"),
+      path: 'vms',
+      name: 'pool.vms',
+      component: () => import('@/views/pool/PoolVmsView.vue'),
     },
   ],
-};
+}
diff --git a/@xen-orchestra/lite/src/router/story.ts b/@xen-orchestra/lite/src/router/story.ts
index 23712941f5f..accab08d65f 100644
--- a/@xen-orchestra/lite/src/router/story.ts
+++ b/@xen-orchestra/lite/src/router/story.ts
@@ -1,42 +1,40 @@
-import type { RouteRecordRaw } from "vue-router";
+import type { RouteRecordRaw } from 'vue-router'
 
-const componentLoaders = import.meta.glob("@/stories/**/*.story.vue");
-const docLoaders = import.meta.glob("@/stories/**/*.story.md", { as: "raw" });
+const componentLoaders = import.meta.glob('@/stories/**/*.story.vue')
+const docLoaders = import.meta.glob('@/stories/**/*.story.md', { as: 'raw' })
 
-const children: RouteRecordRaw[] = Object.entries(componentLoaders).map(
-  ([path, componentLoader]) => {
-    const basePath = path.replace(/^\/src\/stories\/(.*)\.story.vue$/, "$1");
-    const docPath = path.replace(/\.vue$/, ".md");
-    const routeName = `story-${basePath}`;
+const children: RouteRecordRaw[] = Object.entries(componentLoaders).map(([path, componentLoader]) => {
+  const basePath = path.replace(/^\/src\/stories\/(.*)\.story.vue$/, '$1')
+  const docPath = path.replace(/\.vue$/, '.md')
+  const routeName = `story-${basePath}`
 
-    return {
-      name: routeName,
-      path: basePath,
-      component: componentLoader,
-      meta: {
-        isStory: true,
-        storyTitle: basePathToStoryTitle(basePath),
-        storyMdLoader: docLoaders[docPath],
-      },
-    };
+  return {
+    name: routeName,
+    path: basePath,
+    component: componentLoader,
+    meta: {
+      isStory: true,
+      storyTitle: basePathToStoryTitle(basePath),
+      storyMdLoader: docLoaders[docPath],
+    },
   }
-);
+})
 
 if (import.meta.env.DEV) {
   children.push({
-    path: "",
-    name: "story-home",
-    component: () => import("@/views/story/HomeView.vue"),
-  });
+    path: '',
+    name: 'story-home',
+    component: () => import('@/views/story/HomeView.vue'),
+  })
 }
 
 export default {
-  path: "/story",
-  name: "story",
-  component: () => import("@/views/StoryView.vue"),
+  path: '/story',
+  name: 'story',
+  component: () => import('@/views/StoryView.vue'),
   children,
   meta: { hasStoryNav: true },
-};
+}
 
 /**
  * Transform the route basename to a page title.
@@ -48,9 +46,9 @@ export default {
  */
 function basePathToStoryTitle(basePath: string) {
   return basePath
-    .split("/")
+    .split('/')
     .pop()!
-    .split("-")
-    .map((s) => `${s.charAt(0).toUpperCase()}${s.substring(1)}`)
-    .join(" ");
+    .split('-')
+    .map(s => `${s.charAt(0).toUpperCase()}${s.substring(1)}`)
+    .join(' ')
 }
diff --git a/@xen-orchestra/lite/src/router/vm.ts b/@xen-orchestra/lite/src/router/vm.ts
index 3f8ff1f4a29..ac3381f2249 100644
--- a/@xen-orchestra/lite/src/router/vm.ts
+++ b/@xen-orchestra/lite/src/router/vm.ts
@@ -1,47 +1,47 @@
 export default {
-  path: "/vm/:uuid",
-  component: () => import("@/views/vm/VmRootView.vue"),
-  redirect: { name: "vm.console" },
+  path: '/vm/:uuid',
+  component: () => import('@/views/vm/VmRootView.vue'),
+  redirect: { name: 'vm.console' },
   children: [
     {
-      path: "dashboard",
-      name: "vm.dashboard",
-      component: () => import("@/views/vm/VmDashboardView.vue"),
+      path: 'dashboard',
+      name: 'vm.dashboard',
+      component: () => import('@/views/vm/VmDashboardView.vue'),
     },
     {
-      path: "console",
-      name: "vm.console",
-      component: () => import("@/views/vm/VmConsoleView.vue"),
+      path: 'console',
+      name: 'vm.console',
+      component: () => import('@/views/vm/VmConsoleView.vue'),
     },
     {
-      path: "alarms",
-      name: "vm.alarms",
-      component: () => import("@/views/vm/VmAlarmsView.vue"),
+      path: 'alarms',
+      name: 'vm.alarms',
+      component: () => import('@/views/vm/VmAlarmsView.vue'),
     },
     {
-      path: "stats",
-      name: "vm.stats",
-      component: () => import("@/views/vm/VmStatsView.vue"),
+      path: 'stats',
+      name: 'vm.stats',
+      component: () => import('@/views/vm/VmStatsView.vue'),
     },
     {
-      path: "system",
-      name: "vm.system",
-      component: () => import("@/views/vm/VmSystemView.vue"),
+      path: 'system',
+      name: 'vm.system',
+      component: () => import('@/views/vm/VmSystemView.vue'),
     },
     {
-      path: "network",
-      name: "vm.network",
-      component: () => import("@/views/vm/VmNetworkView.vue"),
+      path: 'network',
+      name: 'vm.network',
+      component: () => import('@/views/vm/VmNetworkView.vue'),
     },
     {
-      path: "storage",
-      name: "vm.storage",
-      component: () => import("@/views/vm/VmStorageView.vue"),
+      path: 'storage',
+      name: 'vm.storage',
+      component: () => import('@/views/vm/VmStorageView.vue'),
     },
     {
-      path: "tasks",
-      name: "vm.tasks",
-      component: () => import("@/views/vm/VmTasksView.vue"),
+      path: 'tasks',
+      name: 'vm.tasks',
+      component: () => import('@/views/vm/VmTasksView.vue'),
     },
   ],
-};
+}
diff --git a/@xen-orchestra/lite/src/stores/closing-confirmation.store.ts b/@xen-orchestra/lite/src/stores/closing-confirmation.store.ts
index 8313f08deeb..186d96d5726 100644
--- a/@xen-orchestra/lite/src/stores/closing-confirmation.store.ts
+++ b/@xen-orchestra/lite/src/stores/closing-confirmation.store.ts
@@ -1,39 +1,34 @@
-import { defineStore } from "pinia";
-import { onBeforeUnmount, ref, watch } from "vue";
+import { defineStore } from 'pinia'
+import { onBeforeUnmount, ref, watch } from 'vue'
 
 const beforeUnloadListener = function (e: BeforeUnloadEvent) {
-  e.preventDefault();
-  e.returnValue = ""; // Required to trigger the modal on some browser. https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event#browser_compatibility
-};
-
-export const useClosingConfirmationStore = defineStore(
-  "closing-confirmation",
-  () => {
-    const registeredIds = ref(new Set<symbol>());
-    watch(
-      () => registeredIds.value.size > 0,
-      (isConfirmationNeeded) => {
-        const eventMethod = isConfirmationNeeded
-          ? "addEventListener"
-          : "removeEventListener";
-
-        window[eventMethod]("beforeunload", beforeUnloadListener);
-      }
-    );
-
-    const register = () => {
-      const id = Symbol();
-      registeredIds.value.add(id);
-
-      const unregister = () => registeredIds.value.delete(id);
-
-      onBeforeUnmount(unregister);
-
-      return unregister;
-    };
-
-    return {
-      register,
-    };
+  e.preventDefault()
+  e.returnValue = '' // Required to trigger the modal on some browser. https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event#browser_compatibility
+}
+
+export const useClosingConfirmationStore = defineStore('closing-confirmation', () => {
+  const registeredIds = ref(new Set<symbol>())
+  watch(
+    () => registeredIds.value.size > 0,
+    isConfirmationNeeded => {
+      const eventMethod = isConfirmationNeeded ? 'addEventListener' : 'removeEventListener'
+
+      window[eventMethod]('beforeunload', beforeUnloadListener)
+    }
+  )
+
+  const register = () => {
+    const id = Symbol('CLOSING_CONFIRMATION_ID')
+    registeredIds.value.add(id)
+
+    const unregister = () => registeredIds.value.delete(id)
+
+    onBeforeUnmount(unregister)
+
+    return unregister
+  }
+
+  return {
+    register,
   }
-);
+})
diff --git a/@xen-orchestra/lite/src/stores/modal.store.ts b/@xen-orchestra/lite/src/stores/modal.store.ts
index af77904a1bd..600b2afb535 100644
--- a/@xen-orchestra/lite/src/stores/modal.store.ts
+++ b/@xen-orchestra/lite/src/stores/modal.store.ts
@@ -1,52 +1,45 @@
-import type { ModalController } from "@/types";
-import { createEventHook } from "@vueuse/core";
-import { defineStore } from "pinia";
-import {
-  type AsyncComponentLoader,
-  computed,
-  defineAsyncComponent,
-  markRaw,
-  reactive,
-  ref,
-} from "vue";
+import type { ModalController } from '@/types'
+import { createEventHook } from '@vueuse/core'
+import { defineStore } from 'pinia'
+import { type AsyncComponentLoader, computed, defineAsyncComponent, markRaw, reactive, ref } from 'vue'
 
-export const useModalStore = defineStore("modal", () => {
-  const modals = ref(new Map<symbol, ModalController>());
+export const useModalStore = defineStore('modal', () => {
+  const modals = ref(new Map<symbol, ModalController>())
 
   const open = <T>(loader: AsyncComponentLoader, props: object) => {
-    const id = Symbol();
-    const isBusy = ref(false);
-    const component = defineAsyncComponent(loader);
+    const id = Symbol('MODAL_ID')
+    const isBusy = ref(false)
+    const component = defineAsyncComponent(loader)
 
-    const approveEvent = createEventHook<T>();
-    const declineEvent = createEventHook();
-    const closeEvent = createEventHook();
+    const approveEvent = createEventHook<T>()
+    const declineEvent = createEventHook()
+    const closeEvent = createEventHook()
 
     const close = async () => {
-      await closeEvent.trigger(undefined);
-      modals.value.delete(id);
-    };
+      await closeEvent.trigger(undefined)
+      modals.value.delete(id)
+    }
 
     const approve = async (payload: any) => {
       try {
-        isBusy.value = true;
-        const result = await payload;
-        await approveEvent.trigger(result);
-        void close();
+        isBusy.value = true
+        const result = await payload
+        await approveEvent.trigger(result)
+        await close()
       } finally {
-        isBusy.value = false;
+        isBusy.value = false
       }
-    };
+    }
 
     const decline = async () => {
       try {
-        isBusy.value = true;
-        await declineEvent.trigger(undefined);
-        void close();
+        isBusy.value = true
+        await declineEvent.trigger(undefined)
+        await close()
       } finally {
-        isBusy.value = false;
+        isBusy.value = false
       }
-    };
+    }
 
     modals.value.set(
       id,
@@ -58,18 +51,18 @@ export const useModalStore = defineStore("modal", () => {
         decline,
         isBusy,
       })
-    );
+    )
 
     return {
       onApprove: approveEvent.on,
       onDecline: declineEvent.on,
       onClose: closeEvent.on,
       id,
-    };
-  };
+    }
+  }
 
   return {
     open,
     modals: computed(() => modals.value.values()),
-  };
-});
+  }
+})
diff --git a/@xen-orchestra/lite/src/stores/navigation.store.ts b/@xen-orchestra/lite/src/stores/navigation.store.ts
index 417aace4530..5e9ef23ab47 100644
--- a/@xen-orchestra/lite/src/stores/navigation.store.ts
+++ b/@xen-orchestra/lite/src/stores/navigation.store.ts
@@ -1,32 +1,32 @@
-import { useUiStore } from "@/stores/ui.store";
-import { useEventListener, whenever } from "@vueuse/core";
-import { defineStore } from "pinia";
-import { ref } from "vue";
-import { useRouter } from "vue-router";
+import { useUiStore } from '@/stores/ui.store'
+import { useEventListener, whenever } from '@vueuse/core'
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
 
-export const useNavigationStore = defineStore("navigation", () => {
-  const router = useRouter();
-  const uiStore = useUiStore();
+export const useNavigationStore = defineStore('navigation', () => {
+  const router = useRouter()
+  const uiStore = useUiStore()
 
-  const trigger = ref();
-  const isOpen = ref(false);
-  const toggle = () => (isOpen.value = !isOpen.value);
+  const trigger = ref()
+  const isOpen = ref(false)
+  const toggle = () => (isOpen.value = !isOpen.value)
 
   // Close the menu when the user navigates to a new page
   router.afterEach(() => {
-    isOpen.value = false;
-  });
+    isOpen.value = false
+  })
 
-  useEventListener(trigger, "click", toggle);
+  useEventListener(trigger, 'click', toggle)
 
   whenever(
     () => uiStore.isDesktop,
     () => (isOpen.value = false)
-  );
+  )
 
   return {
     trigger,
     toggle,
     isOpen,
-  };
-});
+  }
+})
diff --git a/@xen-orchestra/lite/src/stores/page-title.store.ts b/@xen-orchestra/lite/src/stores/page-title.store.ts
index 7f1a7fa9f91..f477ebbe381 100644
--- a/@xen-orchestra/lite/src/stores/page-title.store.ts
+++ b/@xen-orchestra/lite/src/stores/page-title.store.ts
@@ -1,92 +1,75 @@
-import { useTitle } from "@vueuse/core";
-import { defineStore } from "pinia";
-import {
-  computed,
-  type MaybeRefOrGetter,
-  onBeforeUnmount,
-  reactive,
-  toRef,
-  watch,
-} from "vue";
+import { useTitle } from '@vueuse/core'
+import { defineStore } from 'pinia'
+import { computed, type MaybeRefOrGetter, onBeforeUnmount, reactive, toRef, watch } from 'vue'
 
-const PAGE_TITLE_SUFFIX = "XO Lite";
+const PAGE_TITLE_SUFFIX = 'XO Lite'
 
 interface PageTitleConfig {
-  object: { name_label: string } | undefined;
-  title: string | undefined;
-  count: number | undefined;
+  object: { name_label: string } | undefined
+  title: string | undefined
+  count: number | undefined
 }
 
-export const usePageTitleStore = defineStore("page-title", () => {
+export const usePageTitleStore = defineStore('page-title', () => {
   const pageTitleConfig = reactive<PageTitleConfig>({
     count: undefined,
     title: undefined,
     object: undefined,
-  });
+  })
 
   const generatedPageTitle = computed(() => {
-    const { object, title, count } = pageTitleConfig;
-    const parts = [];
+    const { object, title, count } = pageTitleConfig
+    const parts = []
 
     if (count !== undefined && count > 0) {
-      parts.push(`(${count})`);
+      parts.push(`(${count})`)
     }
 
     if (title !== undefined && object !== undefined) {
-      parts.push(`${title} - ${object.name_label}`);
+      parts.push(`${title} - ${object.name_label}`)
     } else if (title !== undefined) {
-      parts.push(title);
+      parts.push(title)
     } else if (object !== undefined) {
-      parts.push(object.name_label);
+      parts.push(object.name_label)
     }
 
     if (parts.length === 0) {
-      return undefined;
+      return undefined
     }
 
-    return parts.join(" ");
-  });
+    return parts.join(' ')
+  })
 
   useTitle(generatedPageTitle, {
     titleTemplate: computed(() =>
-      generatedPageTitle.value === undefined
-        ? PAGE_TITLE_SUFFIX
-        : `%s - ${PAGE_TITLE_SUFFIX}`
+      generatedPageTitle.value === undefined ? PAGE_TITLE_SUFFIX : `%s - ${PAGE_TITLE_SUFFIX}`
     ),
-  });
+  })
 
   const setPageTitleConfig = <T extends keyof PageTitleConfig>(
     configKey: T,
     value: MaybeRefOrGetter<PageTitleConfig[T]>
   ) => {
-    const stop = watch(
-      toRef(value),
-      (newValue) =>
-        (pageTitleConfig[configKey] = newValue as PageTitleConfig[T]),
-      {
-        immediate: true,
-      }
-    );
+    const stop = watch(toRef(value), newValue => (pageTitleConfig[configKey] = newValue as PageTitleConfig[T]), {
+      immediate: true,
+    })
 
     onBeforeUnmount(() => {
-      stop();
-      pageTitleConfig[configKey] = undefined;
-    });
-  };
+      stop()
+      pageTitleConfig[configKey] = undefined
+    })
+  }
 
-  const setObject = (
-    object: MaybeRefOrGetter<{ name_label: string } | undefined>
-  ) => setPageTitleConfig("object", object);
+  const setObject = (object: MaybeRefOrGetter<{ name_label: string } | undefined>) =>
+    setPageTitleConfig('object', object)
 
-  const setTitle = (title: MaybeRefOrGetter<string | undefined>) =>
-    setPageTitleConfig("title", title);
+  const setTitle = (title: MaybeRefOrGetter<string | undefined>) => setPageTitleConfig('title', title)
 
-  const setCount = (count: MaybeRefOrGetter<number | undefined>) =>
-    setPageTitleConfig("count", count);
+  const setCount = (count: MaybeRefOrGetter<number | undefined>) => setPageTitleConfig('count', count)
 
   return {
     setObject,
     setTitle,
     setCount,
-  };
-});
+  }
+})
diff --git a/@xen-orchestra/lite/src/stores/tooltip.store.ts b/@xen-orchestra/lite/src/stores/tooltip.store.ts
index 88ea9e51799..707ae441d66 100644
--- a/@xen-orchestra/lite/src/stores/tooltip.store.ts
+++ b/@xen-orchestra/lite/src/stores/tooltip.store.ts
@@ -1,75 +1,71 @@
-import { uniqueId } from "lodash-es";
-import { defineStore } from "pinia";
-import type { Options } from "placement.js";
-import { type EffectScope, computed, effectScope, ref } from "vue";
-import { type WindowEventName, useEventListener } from "@vueuse/core";
+import { uniqueId } from 'lodash-es'
+import { defineStore } from 'pinia'
+import type { Options } from 'placement.js'
+import { type EffectScope, computed, effectScope, ref } from 'vue'
+import { type WindowEventName, useEventListener } from '@vueuse/core'
 
 export type TooltipOptions = {
-  content: string | false;
-  placement: Options["placement"];
-};
+  content: string | false
+  placement: Options['placement']
+}
 
-export type TooltipEvents = { on: WindowEventName; off: WindowEventName };
+export type TooltipEvents = { on: WindowEventName; off: WindowEventName }
 
-export const useTooltipStore = defineStore("tooltip", () => {
-  const targetsScopes = new WeakMap<HTMLElement, EffectScope>();
-  const targets = ref(new Set<HTMLElement>());
-  const targetsOptions = ref(new Map<HTMLElement, TooltipOptions>());
-  const targetsIds = ref(new Map<HTMLElement, string>());
+export const useTooltipStore = defineStore('tooltip', () => {
+  const targetsScopes = new WeakMap<HTMLElement, EffectScope>()
+  const targets = ref(new Set<HTMLElement>())
+  const targetsOptions = ref(new Map<HTMLElement, TooltipOptions>())
+  const targetsIds = ref(new Map<HTMLElement, string>())
 
-  const register = (
-    target: HTMLElement,
-    options: TooltipOptions,
-    events: TooltipEvents
-  ) => {
-    const scope = effectScope();
+  const register = (target: HTMLElement, options: TooltipOptions, events: TooltipEvents) => {
+    const scope = effectScope()
 
-    targetsScopes.set(target, scope);
-    targetsOptions.value.set(target, options);
-    targetsIds.value.set(target, uniqueId("tooltip-"));
+    targetsScopes.set(target, scope)
+    targetsOptions.value.set(target, options)
+    targetsIds.value.set(target, uniqueId('tooltip-'))
 
     scope.run(() => {
       useEventListener(target, events.on, () => {
-        targets.value.add(target);
+        targets.value.add(target)
 
         scope.run(() => {
           useEventListener(
             target,
             events.off,
             () => {
-              targets.value.delete(target);
+              targets.value.delete(target)
             },
             { once: true }
-          );
-        });
-      });
-    });
-  };
+          )
+        })
+      })
+    })
+  }
 
   const updateOptions = (target: HTMLElement, options: TooltipOptions) => {
-    targetsOptions.value.set(target, options);
-  };
+    targetsOptions.value.set(target, options)
+  }
 
   const unregister = (target: HTMLElement) => {
-    targets.value.delete(target);
-    targetsOptions.value.delete(target);
-    targetsScopes.get(target)?.stop();
-    targetsScopes.delete(target);
-    targetsIds.value.delete(target);
-  };
+    targets.value.delete(target)
+    targetsOptions.value.delete(target)
+    targetsScopes.get(target)?.stop()
+    targetsScopes.delete(target)
+    targetsIds.value.delete(target)
+  }
 
   return {
     register,
     unregister,
     updateOptions,
     tooltips: computed(() => {
-      return Array.from(targets.value.values()).map((target) => {
+      return Array.from(targets.value.values()).map(target => {
         return {
           target,
           options: targetsOptions.value.get(target)!,
           key: targetsIds.value.get(target)!,
-        };
-      });
+        }
+      })
     }),
-  };
-});
+  }
+})
diff --git a/@xen-orchestra/lite/src/stores/ui.store.ts b/@xen-orchestra/lite/src/stores/ui.store.ts
index 9ff30ba95fb..4b2265e9b8f 100644
--- a/@xen-orchestra/lite/src/stores/ui.store.ts
+++ b/@xen-orchestra/lite/src/stores/ui.store.ts
@@ -1,28 +1,28 @@
-import { useBreakpoints, useColorMode } from "@vueuse/core";
-import { defineStore } from "pinia";
-import { computed, ref } from "vue";
-import { useRoute, useRouter } from "vue-router";
+import { useBreakpoints, useColorMode } from '@vueuse/core'
+import { defineStore } from 'pinia'
+import { computed, ref } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
 
-export const useUiStore = defineStore("ui", () => {
-  const currentHostOpaqueRef = ref();
+export const useUiStore = defineStore('ui', () => {
+  const currentHostOpaqueRef = ref()
 
-  const { store: colorMode } = useColorMode({ initialValue: "dark" });
+  const { store: colorMode } = useColorMode({ initialValue: 'dark' })
 
   const { desktop: isDesktop } = useBreakpoints({
     desktop: 1024,
-  });
+  })
 
-  const isMobile = computed(() => !isDesktop.value);
+  const isMobile = computed(() => !isDesktop.value)
 
-  const router = useRouter();
-  const route = useRoute();
+  const router = useRouter()
+  const route = useRoute()
 
   const hasUi = computed<boolean>({
-    get: () => route.query.ui !== "0",
+    get: () => route.query.ui !== '0',
     set: (value: boolean) => {
-      void router.replace({ query: { ui: value ? undefined : "0" } });
+      void router.replace({ query: { ui: value ? undefined : '0' } })
     },
-  });
+  })
 
   return {
     colorMode,
@@ -30,5 +30,5 @@ export const useUiStore = defineStore("ui", () => {
     isDesktop,
     isMobile,
     hasUi,
-  };
-});
+  }
+})
diff --git a/@xen-orchestra/lite/src/stores/xen-api.store.ts b/@xen-orchestra/lite/src/stores/xen-api.store.ts
index 0467613ae65..355fccafe47 100644
--- a/@xen-orchestra/lite/src/stores/xen-api.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api.store.ts
@@ -1,14 +1,11 @@
-import XapiStats from "@/libs/xapi-stats";
-import XenApi from "@/libs/xen-api/xen-api";
-import { useLocalStorage, useSessionStorage, whenever } from "@vueuse/core";
-import { defineStore } from "pinia";
-import { computed, ref, watchEffect } from "vue";
-import { useRouter } from "vue-router";
-import { useRoute } from "vue-router";
+import XapiStats from '@/libs/xapi-stats'
+import XenApi from '@/libs/xen-api/xen-api'
+import { useLocalStorage, useSessionStorage, whenever } from '@vueuse/core'
+import { defineStore } from 'pinia'
+import { computed, ref, watchEffect } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
 
-const HOST_URL = import.meta.env.PROD
-  ? window.origin
-  : import.meta.env.VITE_XO_HOST;
+const HOST_URL = import.meta.env.PROD ? window.origin : import.meta.env.VITE_XO_HOST
 
 enum STATUS {
   DISCONNECTED,
@@ -16,90 +13,82 @@ enum STATUS {
   CONNECTED,
 }
 
-export const useXenApiStore = defineStore("xen-api", () => {
+export const useXenApiStore = defineStore('xen-api', () => {
   // undefined not correctly handled. See https://github.com/vueuse/vueuse/issues/3595
-  const masterSessionStorage = useSessionStorage<null | string>("master", null);
-  const router = useRouter();
-  const route = useRoute();
+  const masterSessionStorage = useSessionStorage<null | string>('master', null)
+  const router = useRouter()
+  const route = useRoute()
 
   whenever(
     () => route.query.master,
-    async (newMaster) => {
-      masterSessionStorage.value = newMaster as string;
-      await router.replace({ query: { ...route.query, master: undefined } });
-      window.location.reload();
+    async newMaster => {
+      masterSessionStorage.value = newMaster as string
+      await router.replace({ query: { ...route.query, master: undefined } })
+      window.location.reload()
     }
-  );
+  )
 
-  const hostUrl = new URL(HOST_URL);
+  const hostUrl = new URL(HOST_URL)
   if (masterSessionStorage.value !== null) {
-    hostUrl.hostname = masterSessionStorage.value;
+    hostUrl.hostname = masterSessionStorage.value
   }
 
-  const isPoolOverridden = hostUrl.origin !== new URL(HOST_URL).origin;
-  const xenApi = new XenApi(hostUrl.origin);
-  const xapiStats = new XapiStats(xenApi);
-  const storedSessionId = useLocalStorage<string | undefined>(
-    "sessionId",
-    undefined
-  );
-  const currentSessionId = ref(storedSessionId.value);
-  const rememberMe = useLocalStorage("rememberMe", false);
-  const status = ref(STATUS.DISCONNECTED);
-  const isConnected = computed(() => status.value === STATUS.CONNECTED);
-  const isConnecting = computed(() => status.value === STATUS.CONNECTING);
-  const getXapi = () => xenApi;
-  const getXapiStats = () => xapiStats;
+  const isPoolOverridden = hostUrl.origin !== new URL(HOST_URL).origin
+  const xenApi = new XenApi(hostUrl.origin)
+  const xapiStats = new XapiStats(xenApi)
+  const storedSessionId = useLocalStorage<string | undefined>('sessionId', undefined)
+  const currentSessionId = ref(storedSessionId.value)
+  const rememberMe = useLocalStorage('rememberMe', false)
+  const status = ref(STATUS.DISCONNECTED)
+  const isConnected = computed(() => status.value === STATUS.CONNECTED)
+  const isConnecting = computed(() => status.value === STATUS.CONNECTING)
+  const getXapi = () => xenApi
+  const getXapiStats = () => xapiStats
 
   watchEffect(() => {
-    storedSessionId.value = rememberMe.value
-      ? currentSessionId.value
-      : undefined;
-  });
+    storedSessionId.value = rememberMe.value ? currentSessionId.value : undefined
+  })
 
   const connect = async (username: string, password: string) => {
-    status.value = STATUS.CONNECTING;
+    status.value = STATUS.CONNECTING
 
     try {
-      currentSessionId.value = await xenApi.connectWithPassword(
-        username,
-        password
-      );
-      const success = currentSessionId.value !== undefined;
-      status.value = success ? STATUS.CONNECTED : STATUS.DISCONNECTED;
-      return success;
+      currentSessionId.value = await xenApi.connectWithPassword(username, password)
+      const success = currentSessionId.value !== undefined
+      status.value = success ? STATUS.CONNECTED : STATUS.DISCONNECTED
+      return success
     } catch (error) {
-      status.value = STATUS.DISCONNECTED;
-      throw error;
+      status.value = STATUS.DISCONNECTED
+      throw error
     }
-  };
+  }
 
   const reconnect = async () => {
     if (currentSessionId.value === undefined) {
-      return false;
+      return false
     }
 
-    status.value = STATUS.CONNECTING;
+    status.value = STATUS.CONNECTING
 
     try {
-      const success = await xenApi.connectWithSessionId(currentSessionId.value);
-      status.value = success ? STATUS.CONNECTED : STATUS.DISCONNECTED;
-      return success;
+      const success = await xenApi.connectWithSessionId(currentSessionId.value)
+      status.value = success ? STATUS.CONNECTED : STATUS.DISCONNECTED
+      return success
     } catch (error) {
-      status.value = STATUS.DISCONNECTED;
-      throw error;
+      status.value = STATUS.DISCONNECTED
+      throw error
     }
-  };
+  }
 
   async function disconnect() {
-    await xenApi.disconnect();
-    currentSessionId.value = undefined;
-    status.value = STATUS.DISCONNECTED;
+    await xenApi.disconnect()
+    currentSessionId.value = undefined
+    status.value = STATUS.DISCONNECTED
   }
 
   function resetPoolMasterIp() {
-    masterSessionStorage.value = null;
-    window.location.reload();
+    masterSessionStorage.value = null
+    window.location.reload()
   }
 
   return {
@@ -113,5 +102,5 @@ export const useXenApiStore = defineStore("xen-api", () => {
     getXapiStats,
     currentSessionId,
     resetPoolMasterIp,
-  };
-});
+  }
+})
diff --git a/@xen-orchestra/lite/src/stores/xen-api/alarm.store.ts b/@xen-orchestra/lite/src/stores/xen-api/alarm.store.ts
index c2a2c173981..8b7fb38cf58 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/alarm.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/alarm.store.ts
@@ -1,66 +1,66 @@
-import { useSubscriber } from "@/composables/subscriber.composable";
-import { useXenApiStoreBaseContext } from "@/composables/xen-api-store-base-context.composable";
-import { messagesToAlarms, messageToAlarm } from "@/libs/alarm";
-import type { XenApiMessage } from "@/libs/xen-api/xen-api.types";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { useMessageStore } from "@/stores/xen-api/message.store";
-import type { XenApiAlarm } from "@/types/xen-api";
-import { defineStore } from "pinia";
+import { useSubscriber } from '@/composables/subscriber.composable'
+import { useXenApiStoreBaseContext } from '@/composables/xen-api-store-base-context.composable'
+import { messagesToAlarms, messageToAlarm } from '@/libs/alarm'
+import type { XenApiMessage } from '@/libs/xen-api/xen-api.types'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { useMessageStore } from '@/stores/xen-api/message.store'
+import type { XenApiAlarm } from '@/types/xen-api'
+import { defineStore } from 'pinia'
 
-export const useAlarmStore = defineStore("xen-api-alarm", () => {
-  const context = useXenApiStoreBaseContext<XenApiAlarm<any>>();
-  const xenApiStore = useXenApiStore();
-  const xenApi = xenApiStore.getXapi();
-  const messageStore = useMessageStore();
+export const useAlarmStore = defineStore('xen-api-alarm', () => {
+  const context = useXenApiStoreBaseContext<XenApiAlarm<any>>()
+  const xenApiStore = useXenApiStore()
+  const xenApi = xenApiStore.getXapi()
+  const messageStore = useMessageStore()
 
-  const onBeforeLoad = () => (context.isFetching.value = true);
+  const onBeforeLoad = () => (context.isFetching.value = true)
 
   const onAfterLoad = (records: XenApiMessage<any>[]) => {
-    const alarms = messagesToAlarms(records);
-    alarms.forEach((alarm) => context.add(alarm));
-    context.isFetching.value = false;
-    context.isReady.value = true;
-  };
+    const alarms = messagesToAlarms(records)
+    alarms.forEach(alarm => context.add(alarm))
+    context.isFetching.value = false
+    context.isReady.value = true
+  }
 
   const onAdd = (record: XenApiMessage<any>) => {
-    const alarm = messageToAlarm(record);
+    const alarm = messageToAlarm(record)
 
     if (alarm !== undefined) {
-      context.add(alarm);
+      context.add(alarm)
     }
-  };
+  }
 
-  const onRemove = (opaqueRef: XenApiMessage<any>["$ref"]) => {
-    context.remove(opaqueRef);
-  };
+  const onRemove = (opaqueRef: XenApiMessage<any>['$ref']) => {
+    context.remove(opaqueRef)
+  }
 
-  const subscriptionId = Symbol();
+  const subscriptionId = Symbol('SUBSCRIPTION_ID')
 
   const subscriber = useSubscriber({
     enabled: () => xenApiStore.isConnected,
     onSubscriptionStart: () => {
-      xenApi.addEventListener("message.beforeLoad", onBeforeLoad);
-      xenApi.addEventListener("message.afterLoad", onAfterLoad);
-      xenApi.addEventListener("message.add", onAdd);
-      xenApi.addEventListener("message.mod", onAdd);
-      xenApi.addEventListener("message.del", onRemove);
-      messageStore.subscribe(subscriptionId);
+      xenApi.addEventListener('message.beforeLoad', onBeforeLoad)
+      xenApi.addEventListener('message.afterLoad', onAfterLoad)
+      xenApi.addEventListener('message.add', onAdd)
+      xenApi.addEventListener('message.mod', onAdd)
+      xenApi.addEventListener('message.del', onRemove)
+      messageStore.subscribe(subscriptionId)
     },
     onSubscriptionEnd: () => {
-      xenApi.removeEventListener("message.beforeLoad", onBeforeLoad);
-      xenApi.removeEventListener("message.afterLoad", onAfterLoad);
-      xenApi.removeEventListener("message.add", onAdd);
-      xenApi.removeEventListener("message.mod", onAdd);
-      xenApi.removeEventListener("message.del", onRemove);
-      messageStore.unsubscribe(subscriptionId);
+      xenApi.removeEventListener('message.beforeLoad', onBeforeLoad)
+      xenApi.removeEventListener('message.afterLoad', onAfterLoad)
+      xenApi.removeEventListener('message.add', onAdd)
+      xenApi.removeEventListener('message.mod', onAdd)
+      xenApi.removeEventListener('message.del', onRemove)
+      messageStore.unsubscribe(subscriptionId)
     },
-  });
+  })
 
   return {
     ...context,
     ...subscriber,
-  };
-});
+  }
+})
 
-export const useAlarmCollection = createUseCollection(useAlarmStore);
+export const useAlarmCollection = createUseCollection(useAlarmStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/console.store.ts b/@xen-orchestra/lite/src/stores/xen-api/console.store.ts
index 55343bb1946..de3c34e7f55 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/console.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/console.store.ts
@@ -1,9 +1,9 @@
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { defineStore } from "pinia";
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { defineStore } from 'pinia'
 
-export const useConsoleStore = defineStore("xen-api-console", () => {
-  return useXenApiStoreSubscribableContext("console");
-});
+export const useConsoleStore = defineStore('xen-api-console', () => {
+  return useXenApiStoreSubscribableContext('console')
+})
 
-export const useConsoleCollection = createUseCollection(useConsoleStore);
+export const useConsoleCollection = createUseCollection(useConsoleStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/create-use-collection.ts b/@xen-orchestra/lite/src/stores/xen-api/create-use-collection.ts
index 1ae40c7d334..b9c6071f2ae 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/create-use-collection.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/create-use-collection.ts
@@ -1,71 +1,52 @@
-import type {
-  PiniaCustomStateProperties,
-  Store,
-  StoreDefinition,
-  StoreGetters,
-  StoreState,
-} from "pinia";
-import { storeToRefs } from "pinia";
-import type { ComputedRef, Ref, ToRef, ToRefs } from "vue";
-import { computed, onUnmounted } from "vue";
+import type { PiniaCustomStateProperties, Store, StoreDefinition, StoreGetters, StoreState } from 'pinia'
+import { storeToRefs } from 'pinia'
+import type { ComputedRef, Ref, ToRef, ToRefs } from 'vue'
+import { computed, onUnmounted } from 'vue'
 
 type IgnoredProperties =
-  | "_customProperties"
-  | "$id"
-  | "$dispose"
-  | "$state"
-  | "$patch"
-  | "$reset"
-  | "$subscribe"
-  | "$unsubscribe"
-  | "$onAction"
-  | "add"
-  | "remove"
-  | "subscribe"
-  | "hasSubscribers"
-  | "unsubscribe";
+  | '_customProperties'
+  | '$id'
+  | '$dispose'
+  | '$state'
+  | '$patch'
+  | '$reset'
+  | '$subscribe'
+  | '$unsubscribe'
+  | '$onAction'
+  | 'add'
+  | 'remove'
+  | 'subscribe'
+  | 'hasSubscribers'
+  | 'unsubscribe'
 
 type ToComputedRefs<T> = {
-  [K in keyof T]: ToRef<T[K]> extends Ref<infer U>
-    ? ComputedRef<U>
-    : ToRef<T[K]>;
-};
+  [K in keyof T]: ToRef<T[K]> extends Ref<infer U> ? ComputedRef<U> : ToRef<T[K]>
+}
 
 type StoreToRefs<SS extends Store<any, any, any, any>> = ToRefs<
   StoreState<SS> & PiniaCustomStateProperties<StoreState<SS>>
 > &
-  ToComputedRefs<StoreGetters<SS>>;
+  ToComputedRefs<StoreGetters<SS>>
 
-type Output<
-  S extends StoreDefinition<any, any, any, any>,
-  Defer extends boolean,
-> = Omit<S, keyof StoreToRefs<S> | IgnoredProperties> &
+type Output<S extends StoreDefinition<any, any, any, any>, Defer extends boolean> = Omit<
+  S,
+  keyof StoreToRefs<S> | IgnoredProperties
+> &
   StoreToRefs<S> &
-  (Defer extends true
-    ? { start: () => void; isStarted: ComputedRef<boolean> }
-    : object);
+  (Defer extends true ? { start: () => void; isStarted: ComputedRef<boolean> } : object)
 
 export const createUseCollection = <
   SD extends StoreDefinition<any, any, any, any>,
-  UseStore extends SD extends StoreDefinition<
-    infer Id,
-    infer S,
-    infer G,
-    infer A
-  >
-    ? Store<Id, S, G, A>
-    : never,
+  UseStore extends SD extends StoreDefinition<infer Id, infer S, infer G, infer A> ? Store<Id, S, G, A> : never,
 >(
   useStore: SD
 ) => {
-  return <Defer extends boolean>(options?: {
-    defer: Defer;
-  }): Output<UseStore, Defer> => {
-    const store = useStore();
+  return <Defer extends boolean>(options?: { defer: Defer }): Output<UseStore, Defer> => {
+    const store = useStore()
 
-    const id = Symbol(store.$id);
-    onUnmounted(() => store.unsubscribe(id));
-    const start = () => store.subscribe(id);
+    const id = Symbol(store.$id)
+    onUnmounted(() => store.unsubscribe(id))
+    const start = () => store.subscribe(id)
 
     if (options?.defer) {
       return {
@@ -73,14 +54,14 @@ export const createUseCollection = <
         ...storeToRefs(store),
         start,
         isStarted: computed(() => store.hasSubscribers),
-      } as unknown as Output<UseStore, Defer>;
+      } as unknown as Output<UseStore, Defer>
     }
 
-    start();
+    start()
 
     return {
       ...store,
       ...storeToRefs(store),
-    } as unknown as Output<UseStore, Defer>;
-  };
-};
+    } as unknown as Output<UseStore, Defer>
+  }
+}
diff --git a/@xen-orchestra/lite/src/stores/xen-api/host-metrics.store.ts b/@xen-orchestra/lite/src/stores/xen-api/host-metrics.store.ts
index d85caeb2792..ed3d8b61f83 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/host-metrics.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/host-metrics.store.ts
@@ -1,33 +1,32 @@
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import type { XenApiHost } from "@/libs/xen-api/xen-api.types";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { defineStore } from "pinia";
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import type { XenApiHost } from '@/libs/xen-api/xen-api.types'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { defineStore } from 'pinia'
 
-export const useHostMetricsStore = defineStore("xen-api-host-metrics", () => {
-  const context = useXenApiStoreSubscribableContext("host_metrics");
+export const useHostMetricsStore = defineStore('xen-api-host-metrics', () => {
+  const context = useXenApiStoreSubscribableContext('host_metrics')
 
   const getHostMemory = (host: XenApiHost) => {
-    const hostMetrics = context.getByOpaqueRef(host.metrics);
+    const hostMetrics = context.getByOpaqueRef(host.metrics)
 
     if (hostMetrics !== undefined) {
-      const total = +hostMetrics.memory_total;
+      const total = +hostMetrics.memory_total
       return {
         usage: total - +hostMetrics.memory_free,
         size: total,
-      };
+      }
     }
-  };
+  }
 
   const isHostRunning = (host: XenApiHost) => {
-    return context.getByOpaqueRef(host.metrics)?.live === true;
-  };
+    return context.getByOpaqueRef(host.metrics)?.live === true
+  }
 
   return {
     ...context,
     getHostMemory,
     isHostRunning,
-  };
-});
+  }
+})
 
-export const useHostMetricsCollection =
-  createUseCollection(useHostMetricsStore);
+export const useHostMetricsCollection = createUseCollection(useHostMetricsStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/host.store.ts b/@xen-orchestra/lite/src/stores/xen-api/host.store.ts
index a1dc47ce42c..4dda5028e17 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/host.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/host.store.ts
@@ -1,38 +1,29 @@
-import type { GetStats } from "@/composables/fetch-stats.composable";
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import type { XenApiHost } from "@/libs/xen-api/xen-api.types";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { useHostMetricsStore } from "@/stores/xen-api/host-metrics.store";
-import type { XenApiPatch } from "@/types/xen-api";
-import { defineStore } from "pinia";
-import { computed } from "vue";
+import type { GetStats } from '@/composables/fetch-stats.composable'
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import type { XenApiHost } from '@/libs/xen-api/xen-api.types'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { useHostMetricsStore } from '@/stores/xen-api/host-metrics.store'
+import type { XenApiPatch } from '@/types/xen-api'
+import { defineStore } from 'pinia'
+import { computed } from 'vue'
 
-export const useHostStore = defineStore("xen-api-host", () => {
-  const hostMetricsStore = useHostMetricsStore();
+export const useHostStore = defineStore('xen-api-host', () => {
+  const hostMetricsStore = useHostMetricsStore()
 
-  const context = useXenApiStoreSubscribableContext("host", [hostMetricsStore]);
+  const context = useXenApiStoreSubscribableContext('host', [hostMetricsStore])
 
-  const runningHosts = computed(() =>
-    context.records.value.filter((host) => hostMetricsStore.isHostRunning(host))
-  );
+  const runningHosts = computed(() => context.records.value.filter(host => hostMetricsStore.isHostRunning(host)))
 
-  const getStats = ((
-    hostUuid,
-    granularity,
-    ignoreExpired = false,
-    { abortSignal }
-  ) => {
-    const xenApiStore = useXenApiStore();
-    const host = context.getByUuid(hostUuid);
+  const getStats = ((hostUuid, granularity, ignoreExpired = false, { abortSignal }) => {
+    const xenApiStore = useXenApiStore()
+    const host = context.getByUuid(hostUuid)
 
     if (host === undefined) {
-      throw new Error(`Host ${hostUuid} could not be found.`);
+      throw new Error(`Host ${hostUuid} could not be found.`)
     }
 
-    const xapiStats = xenApiStore.isConnected
-      ? xenApiStore.getXapiStats()
-      : undefined;
+    const xapiStats = xenApiStore.isConnected ? xenApiStore.getXapiStats() : undefined
 
     return xapiStats?._getAndUpdateStats({
       abortSignal,
@@ -40,40 +31,30 @@ export const useHostStore = defineStore("xen-api-host", () => {
       ignoreExpired,
       uuid: host.uuid,
       granularity,
-    });
-  }) as GetStats<XenApiHost>;
+    })
+  }) as GetStats<XenApiHost>
 
-  const fetchMissingPatches = async (
-    hostRef: XenApiHost["$ref"]
-  ): Promise<XenApiPatch[]> => {
-    const xenApiStore = useXenApiStore();
+  const fetchMissingPatches = async (hostRef: XenApiHost['$ref']): Promise<XenApiPatch[]> => {
+    const xenApiStore = useXenApiStore()
 
     const rawPatchesAsString = await xenApiStore
       .getXapi()
-      .call<string>("host.call_plugin", [
-        hostRef,
-        "updater.py",
-        "check_update",
-        {},
-      ]);
+      .call<string>('host.call_plugin', [hostRef, 'updater.py', 'check_update', {}])
 
-    const rawPatches = JSON.parse(rawPatchesAsString) as Omit<
-      XenApiPatch,
-      "$id"
-    >[];
+    const rawPatches = JSON.parse(rawPatchesAsString) as Omit<XenApiPatch, '$id'>[]
 
-    return rawPatches.map((rawPatch) => ({
+    return rawPatches.map(rawPatch => ({
       ...rawPatch,
       $id: `${rawPatch.name}-${rawPatch.version}`,
-    }));
-  };
+    }))
+  }
 
   return {
     ...context,
     runningHosts,
     getStats,
     fetchMissingPatches,
-  };
-});
+  }
+})
 
-export const useHostCollection = createUseCollection(useHostStore);
+export const useHostCollection = createUseCollection(useHostStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/message.store.ts b/@xen-orchestra/lite/src/stores/xen-api/message.store.ts
index f421e4a9877..cac9eee09a1 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/message.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/message.store.ts
@@ -1,14 +1,14 @@
-import { useSubscriber } from "@/composables/subscriber.composable";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { defineStore } from "pinia";
+import { useSubscriber } from '@/composables/subscriber.composable'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { defineStore } from 'pinia'
 
-export const useMessageStore = defineStore("xen-api-message", () => {
-  const xenApiStore = useXenApiStore();
+export const useMessageStore = defineStore('xen-api-message', () => {
+  const xenApiStore = useXenApiStore()
 
   return useSubscriber({
     enabled: () => xenApiStore.isConnected,
     onSubscriptionStart: () => {
-      void xenApiStore.getXapi().loadRecords("message");
+      void xenApiStore.getXapi().loadRecords('message')
     },
-  });
-});
+  })
+})
diff --git a/@xen-orchestra/lite/src/stores/xen-api/network.store.ts b/@xen-orchestra/lite/src/stores/xen-api/network.store.ts
index 460aa279a56..662e73ae45e 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/network.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/network.store.ts
@@ -1,9 +1,9 @@
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { defineStore } from "pinia";
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { defineStore } from 'pinia'
 
-export const useNetworkStore = defineStore("xen-api-network", () => {
-  return useXenApiStoreSubscribableContext("network");
-});
+export const useNetworkStore = defineStore('xen-api-network', () => {
+  return useXenApiStoreSubscribableContext('network')
+})
 
-export const useNetworkCollection = createUseCollection(useNetworkStore);
+export const useNetworkCollection = createUseCollection(useNetworkStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/pool.store.ts b/@xen-orchestra/lite/src/stores/xen-api/pool.store.ts
index 46869d01097..b81cb10ba57 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/pool.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/pool.store.ts
@@ -1,18 +1,18 @@
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import type { XenApiPool } from "@/libs/xen-api/xen-api.types";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { defineStore } from "pinia";
-import { computed } from "vue";
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import type { XenApiPool } from '@/libs/xen-api/xen-api.types'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { defineStore } from 'pinia'
+import { computed } from 'vue'
 
-export const usePoolStore = defineStore("xen-api-pool", () => {
-  const context = useXenApiStoreSubscribableContext("pool");
+export const usePoolStore = defineStore('xen-api-pool', () => {
+  const context = useXenApiStoreSubscribableContext('pool')
 
-  const pool = computed<XenApiPool | undefined>(() => context.records.value[0]);
+  const pool = computed<XenApiPool | undefined>(() => context.records.value[0])
 
   return {
     ...context,
     pool,
-  };
-});
+  }
+})
 
-export const usePoolCollection = createUseCollection(usePoolStore);
+export const usePoolCollection = createUseCollection(usePoolStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/sr.store.ts b/@xen-orchestra/lite/src/stores/xen-api/sr.store.ts
index ac401961547..dfa9e08d75f 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/sr.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/sr.store.ts
@@ -1,9 +1,9 @@
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { defineStore } from "pinia";
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { defineStore } from 'pinia'
 
-export const useSrStore = defineStore("xen-api-sr", () => {
-  return useXenApiStoreSubscribableContext("sr");
-});
+export const useSrStore = defineStore('xen-api-sr', () => {
+  return useXenApiStoreSubscribableContext('sr')
+})
 
-export const useSrCollection = createUseCollection(useSrStore);
+export const useSrCollection = createUseCollection(useSrStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/task.store.ts b/@xen-orchestra/lite/src/stores/xen-api/task.store.ts
index c7b63102ffb..ca74743736e 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/task.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/task.store.ts
@@ -1,52 +1,42 @@
-import useArrayRemovedItemsHistory from "@/composables/array-removed-items-history.composable";
-import useCollectionFilter from "@/composables/collection-filter.composable";
-import useCollectionSorter from "@/composables/collection-sorter.composable";
-import useFilteredCollection from "@/composables/filtered-collection.composable";
-import useSortedCollection from "@/composables/sorted-collection.composable";
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import type { XenApiTask } from "@/libs/xen-api/xen-api.types";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { defineStore } from "pinia";
-
-export const useTaskStore = defineStore("xen-api-task", () => {
-  const context = useXenApiStoreSubscribableContext("task");
+import useArrayRemovedItemsHistory from '@/composables/array-removed-items-history.composable'
+import useCollectionFilter from '@/composables/collection-filter.composable'
+import useCollectionSorter from '@/composables/collection-sorter.composable'
+import useFilteredCollection from '@/composables/filtered-collection.composable'
+import useSortedCollection from '@/composables/sorted-collection.composable'
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import type { XenApiTask } from '@/libs/xen-api/xen-api.types'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { defineStore } from 'pinia'
+
+export const useTaskStore = defineStore('xen-api-task', () => {
+  const context = useXenApiStoreSubscribableContext('task')
 
   const { compareFn } = useCollectionSorter<XenApiTask>({
-    initialSorts: ["-created"],
-  });
+    initialSorts: ['-created'],
+  })
 
   const { predicate } = useCollectionFilter({
-    initialFilters: [
-      "!name_label:|(SR.scan host.call_plugin)",
-      "status:pending",
-    ],
-  });
-
-  const sortedTasks = useSortedCollection(context.records, compareFn);
-
-  const pendingTasks = useFilteredCollection<XenApiTask>(
-    sortedTasks,
-    predicate
-  );
-
-  const finishedTasks = useArrayRemovedItemsHistory(
-    sortedTasks,
-    (task) => task.uuid,
-    {
-      limit: 50,
-      onRemove: (tasks) =>
-        tasks.map((task) => ({
-          ...task,
-          finished: new Date().toISOString(),
-        })),
-    }
-  );
+    initialFilters: ['!name_label:|(SR.scan host.call_plugin)', 'status:pending'],
+  })
+
+  const sortedTasks = useSortedCollection(context.records, compareFn)
+
+  const pendingTasks = useFilteredCollection<XenApiTask>(sortedTasks, predicate)
+
+  const finishedTasks = useArrayRemovedItemsHistory(sortedTasks, task => task.uuid, {
+    limit: 50,
+    onRemove: tasks =>
+      tasks.map(task => ({
+        ...task,
+        finished: new Date().toISOString(),
+      })),
+  })
 
   return {
     ...context,
     pendingTasks,
     finishedTasks: useSortedCollection(finishedTasks, compareFn),
-  };
-});
+  }
+})
 
-export const useTaskCollection = createUseCollection(useTaskStore);
+export const useTaskCollection = createUseCollection(useTaskStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/vm-metrics.store.ts b/@xen-orchestra/lite/src/stores/xen-api/vm-metrics.store.ts
index 163266b6a15..2c735037fba 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/vm-metrics.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/vm-metrics.store.ts
@@ -1,9 +1,9 @@
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { defineStore } from "pinia";
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { defineStore } from 'pinia'
 
-export const useVmMetricsStore = defineStore("xen-api-vm-metrics", () => {
-  return useXenApiStoreSubscribableContext("vm_metrics");
-});
+export const useVmMetricsStore = defineStore('xen-api-vm-metrics', () => {
+  return useXenApiStoreSubscribableContext('vm_metrics')
+})
 
-export const useVmMetricsCollection = createUseCollection(useVmMetricsStore);
+export const useVmMetricsCollection = createUseCollection(useVmMetricsStore)
diff --git a/@xen-orchestra/lite/src/stores/xen-api/vm.store.ts b/@xen-orchestra/lite/src/stores/xen-api/vm.store.ts
index 4ccfbf0c678..cca01e16e2d 100644
--- a/@xen-orchestra/lite/src/stores/xen-api/vm.store.ts
+++ b/@xen-orchestra/lite/src/stores/xen-api/vm.store.ts
@@ -1,93 +1,71 @@
-import type { GetStats } from "@/composables/fetch-stats.composable";
-import { useXenApiStoreSubscribableContext } from "@/composables/xen-api-store-subscribable-context.composable";
-import { sortRecordsByNameLabel } from "@/libs/utils";
-import type { VmStats } from "@/libs/xapi-stats";
-import type { XenApiHost, XenApiVm } from "@/libs/xen-api/xen-api.types";
-import {
-  type VM_OPERATION,
-  VM_POWER_STATE,
-} from "@/libs/xen-api/xen-api.enums";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import { createUseCollection } from "@/stores/xen-api/create-use-collection";
-import { useHostStore } from "@/stores/xen-api/host.store";
-import { castArray } from "lodash-es";
-import { defineStore } from "pinia";
-import { computed } from "vue";
-
-export const useVmStore = defineStore("xen-api-vm", () => {
-  const context = useXenApiStoreSubscribableContext("vm");
+import type { GetStats } from '@/composables/fetch-stats.composable'
+import { useXenApiStoreSubscribableContext } from '@/composables/xen-api-store-subscribable-context.composable'
+import { sortRecordsByNameLabel } from '@/libs/utils'
+import type { VmStats } from '@/libs/xapi-stats'
+import type { XenApiHost, XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { type VM_OPERATION, VM_POWER_STATE } from '@/libs/xen-api/xen-api.enums'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import { createUseCollection } from '@/stores/xen-api/create-use-collection'
+import { useHostStore } from '@/stores/xen-api/host.store'
+import { castArray } from 'lodash-es'
+import { defineStore } from 'pinia'
+import { computed } from 'vue'
+
+export const useVmStore = defineStore('xen-api-vm', () => {
+  const context = useXenApiStoreSubscribableContext('vm')
 
   const records = computed(() =>
     context.records.value
-      .filter(
-        (vm) => !vm.is_a_snapshot && !vm.is_a_template && !vm.is_control_domain
-      )
+      .filter(vm => !vm.is_a_snapshot && !vm.is_a_template && !vm.is_control_domain)
       .sort(sortRecordsByNameLabel)
-  );
-
-  const isOperationPending = (
-    vm: XenApiVm,
-    operations: VM_OPERATION[] | VM_OPERATION
-  ) => {
-    const currentOperations = Object.values(vm.current_operations);
-
-    return castArray(operations).some((operation) =>
-      currentOperations.includes(operation)
-    );
-  };
-
-  const areSomeOperationAllowed = (
-    vm: XenApiVm,
-    operations: VM_OPERATION[] | VM_OPERATION
-  ) => {
-    const allowedOperations = Object.values(vm.allowed_operations);
-
-    return castArray(operations).some((operation) =>
-      allowedOperations.includes(operation)
-    );
-  };
-
-  const runningVms = computed(() =>
-    records.value.filter((vm) => vm.power_state === VM_POWER_STATE.RUNNING)
-  );
+  )
+
+  const isOperationPending = (vm: XenApiVm, operations: VM_OPERATION[] | VM_OPERATION) => {
+    const currentOperations = Object.values(vm.current_operations)
+
+    return castArray(operations).some(operation => currentOperations.includes(operation))
+  }
+
+  const areSomeOperationAllowed = (vm: XenApiVm, operations: VM_OPERATION[] | VM_OPERATION) => {
+    const allowedOperations = Object.values(vm.allowed_operations)
+
+    return castArray(operations).some(operation => allowedOperations.includes(operation))
+  }
+
+  const runningVms = computed(() => records.value.filter(vm => vm.power_state === VM_POWER_STATE.RUNNING))
 
   const recordsByHostRef = computed(() => {
-    const vmsByHostOpaqueRef = new Map<XenApiHost["$ref"], XenApiVm[]>();
+    const vmsByHostOpaqueRef = new Map<XenApiHost['$ref'], XenApiVm[]>()
 
-    records.value.forEach((vm) => {
+    records.value.forEach(vm => {
       if (!vmsByHostOpaqueRef.has(vm.resident_on)) {
-        vmsByHostOpaqueRef.set(vm.resident_on, []);
+        vmsByHostOpaqueRef.set(vm.resident_on, [])
       }
 
-      vmsByHostOpaqueRef.get(vm.resident_on)?.push(vm);
-    });
+      vmsByHostOpaqueRef.get(vm.resident_on)?.push(vm)
+    })
 
-    return vmsByHostOpaqueRef;
-  });
-  const getStats = ((
-    id,
-    granularity,
-    ignoreExpired = false,
-    { abortSignal }
-  ) => {
-    const xenApiStore = useXenApiStore();
+    return vmsByHostOpaqueRef
+  })
+  const getStats = ((id, granularity, ignoreExpired = false, { abortSignal }) => {
+    const xenApiStore = useXenApiStore()
 
     if (!xenApiStore.isConnected) {
-      return undefined;
+      return undefined
     }
 
-    const vm = context.getByUuid(id);
+    const vm = context.getByUuid(id)
 
     if (vm === undefined) {
-      throw new Error(`VM ${id} could not be found.`);
+      throw new Error(`VM ${id} could not be found.`)
     }
 
-    const hostStore = useHostStore();
+    const hostStore = useHostStore()
 
-    const host = hostStore.getByOpaqueRef(vm.resident_on);
+    const host = hostStore.getByOpaqueRef(vm.resident_on)
 
     if (host === undefined) {
-      throw new Error(`VM ${id} is halted or host could not be found.`);
+      throw new Error(`VM ${id} is halted or host could not be found.`)
     }
 
     return xenApiStore.getXapiStats()._getAndUpdateStats<VmStats>({
@@ -96,8 +74,8 @@ export const useVmStore = defineStore("xen-api-vm", () => {
       ignoreExpired,
       uuid: vm.uuid,
       granularity,
-    });
-  }) as GetStats<XenApiVm>;
+    })
+  }) as GetStats<XenApiVm>
 
   return {
     ...context,
@@ -107,7 +85,7 @@ export const useVmStore = defineStore("xen-api-vm", () => {
     runningVms,
     recordsByHostRef,
     getStats,
-  };
-});
+  }
+})
 
-export const useVmCollection = createUseCollection(useVmStore);
+export const useVmCollection = createUseCollection(useVmStore)
diff --git a/@xen-orchestra/lite/src/stories/button/ui-button-group.story.vue b/@xen-orchestra/lite/src/stories/button/ui-button-group.story.vue
index 517c15749d2..3e9ebd57e21 100644
--- a/@xen-orchestra/lite/src/stories/button/ui-button-group.story.vue
+++ b/@xen-orchestra/lite/src/stories/button/ui-button-group.story.vue
@@ -1,5 +1,6 @@
 <template>
   <ComponentStory
+    v-slot="{ properties }"
     :params="[
       prop('busy').type('boolean').widget(),
       prop('disabled').type('boolean').widget().ctx(),
@@ -9,7 +10,6 @@
       prop('merge').type('boolean').widget(),
       slot().help('Meant to receive UiButton components'),
     ]"
-    v-slot="{ properties }"
   >
     <UiButtonGroup v-bind="properties">
       <UiButton>Button 1</UiButton>
@@ -20,10 +20,10 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import UiButtonGroup from "@/components/ui/UiButtonGroup.vue";
-import { colorProp, prop, slot } from "@/libs/story/story-param";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import UiButtonGroup from '@/components/ui/UiButtonGroup.vue'
+import { colorProp, prop, slot } from '@/libs/story/story-param'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/button/ui-button.story.vue b/@xen-orchestra/lite/src/stories/button/ui-button.story.vue
index 6b89fba21a3..dab07da595b 100644
--- a/@xen-orchestra/lite/src/stories/button/ui-button.story.vue
+++ b/@xen-orchestra/lite/src/stories/button/ui-button.story.vue
@@ -38,10 +38,10 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import { colorProp, iconProp, prop, setting } from "@/libs/story/story-param";
-import { faFloppyDisk, faTrash } from "@fortawesome/free-solid-svg-icons";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import { colorProp, iconProp, prop, setting } from '@/libs/story/story-param'
+import { faFloppyDisk, faTrash } from '@fortawesome/free-solid-svg-icons'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/form/form-byte-size.story.vue b/@xen-orchestra/lite/src/stories/form/form-byte-size.story.vue
index 6df2d16e75e..c065f3a0ddc 100644
--- a/@xen-orchestra/lite/src/stories/form/form-byte-size.story.vue
+++ b/@xen-orchestra/lite/src/stories/form/form-byte-size.story.vue
@@ -1,16 +1,14 @@
 <template>
   <ComponentStory
     v-slot="{ properties }"
-    :params="[
-      model().type('number').required().preset(4096).help('The size in bytes'),
-    ]"
+    :params="[model().type('number').required().preset(4096).help('The size in bytes')]"
   >
     <FormByteSize v-bind="properties" />
   </ComponentStory>
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import FormByteSize from "@/components/form/FormByteSize.vue";
-import { model } from "@/libs/story/story-param";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import FormByteSize from '@/components/form/FormByteSize.vue'
+import { model } from '@/libs/story/story-param'
 </script>
diff --git a/@xen-orchestra/lite/src/stories/form/form-input-group.story.vue b/@xen-orchestra/lite/src/stories/form/form-input-group.story.vue
index 26b9dbb78a8..5c4bf5ff2ea 100644
--- a/@xen-orchestra/lite/src/stories/form/form-input-group.story.vue
+++ b/@xen-orchestra/lite/src/stories/form/form-input-group.story.vue
@@ -1,7 +1,5 @@
 <template>
-  <ComponentStory
-    :params="[slot().help('Can contain multiple FormInput and FormSelect')]"
-  >
+  <ComponentStory :params="[slot().help('Can contain multiple FormInput and FormSelect')]">
     <FormInputGroup>
       <FormInput />
       <FormInput />
@@ -15,9 +13,9 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import FormInput from "@/components/form/FormInput.vue";
-import FormInputGroup from "@/components/form/FormInputGroup.vue";
-import FormSelect from "@/components/form/FormSelect.vue";
-import { slot } from "@/libs/story/story-param";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import FormInput from '@/components/form/FormInput.vue'
+import FormInputGroup from '@/components/form/FormInputGroup.vue'
+import FormSelect from '@/components/form/FormSelect.vue'
+import { slot } from '@/libs/story/story-param'
 </script>
diff --git a/@xen-orchestra/lite/src/stories/form/form-input-wrapper.story.vue b/@xen-orchestra/lite/src/stories/form/form-input-wrapper.story.vue
index 9aeb67cb6c9..78e57a3b6a8 100644
--- a/@xen-orchestra/lite/src/stories/form/form-input-wrapper.story.vue
+++ b/@xen-orchestra/lite/src/stories/form/form-input-wrapper.story.vue
@@ -20,11 +20,11 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import FormInput from "@/components/form/FormInput.vue";
-import FormInputWrapper from "@/components/form/FormInputWrapper.vue";
-import { iconProp, prop, slot } from "@/libs/story/story-param";
-import { ref } from "vue";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import FormInput from '@/components/form/FormInput.vue'
+import FormInputWrapper from '@/components/form/FormInputWrapper.vue'
+import { iconProp, prop, slot } from '@/libs/story/story-param'
+import { ref } from 'vue'
 
-const modelValue = ref("");
+const modelValue = ref('')
 </script>
diff --git a/@xen-orchestra/lite/src/stories/form/form-input.story.vue b/@xen-orchestra/lite/src/stories/form/form-input.story.vue
index 328160e0a1d..3a644b5d539 100644
--- a/@xen-orchestra/lite/src/stories/form/form-input.story.vue
+++ b/@xen-orchestra/lite/src/stories/form/form-input.story.vue
@@ -1,5 +1,6 @@
 <template>
   <ComponentStory
+    v-slot="{ properties }"
     :params="[
       colorProp().ctx(),
       iconProp('before').type('IconDefinition | string'),
@@ -7,34 +8,30 @@
       model().type('string').required(),
       prop('right').bool().widget(),
       prop('disabled').bool().widget().ctx(),
-      prop('wrapper-attrs')
-        .obj('HTMLAttributes')
-        .widget()
-        .preset({ foo: 'bar' }),
+      prop('wrapper-attrs').obj('HTMLAttributes').widget().preset({ foo: 'bar' }),
       prop('before-width').str().widget(),
       prop('after-width').str().widget(),
     ]"
     :presets="presets"
-    v-slot="{ properties }"
   >
     <FormInput v-bind="properties" />
   </ComponentStory>
 </template>
 
 <script lang="ts" setup>
-import { faDollarSign } from "@fortawesome/free-solid-svg-icons";
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import FormInput from "@/components/form/FormInput.vue";
-import { colorProp, iconProp, model, prop } from "@/libs/story/story-param";
+import { faDollarSign } from '@fortawesome/free-solid-svg-icons'
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import FormInput from '@/components/form/FormInput.vue'
+import { colorProp, iconProp, model, prop } from '@/libs/story/story-param'
 
 const presets = {
   $100: {
     props: {
-      modelValue: "100",
+      modelValue: '100',
       before: faDollarSign,
     },
   },
-};
+}
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/form/form-section.story.vue b/@xen-orchestra/lite/src/stories/form/form-section.story.vue
index c002503d085..739c5e8378d 100644
--- a/@xen-orchestra/lite/src/stories/form/form-section.story.vue
+++ b/@xen-orchestra/lite/src/stories/form/form-section.story.vue
@@ -4,7 +4,7 @@
     :params="[
       prop('label').required().str().preset('Install settings').widget(),
       prop('collapsible').bool().widget(),
-      model('collapsed').prop((p) => p.bool()),
+      model('collapsed').prop(p => p.bool()),
       slot(),
     ]"
   >
@@ -15,10 +15,10 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import FormInput from "@/components/form/FormInput.vue";
-import FormSection from "@/components/form/FormSection.vue";
-import { model, prop, slot } from "@/libs/story/story-param";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import FormInput from '@/components/form/FormInput.vue'
+import FormSection from '@/components/form/FormSection.vue'
+import { model, prop, slot } from '@/libs/story/story-param'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/linear-chart.story.md b/@xen-orchestra/lite/src/stories/linear-chart.story.md
index d601a529cb7..1953a0fbcc2 100644
--- a/@xen-orchestra/lite/src/stories/linear-chart.story.md
+++ b/@xen-orchestra/lite/src/stories/linear-chart.story.md
@@ -4,12 +4,12 @@
 
 ```typescript
 type LinearChartData = {
-  label: string;
+  label: string
   data: {
-    timestamp: number;
-    value: number;
-  }[];
-}[];
+    timestamp: number
+    value: number
+  }[]
+}[]
 ```
 
 ### Example
diff --git a/@xen-orchestra/lite/src/stories/linear-chart.story.vue b/@xen-orchestra/lite/src/stories/linear-chart.story.vue
index 0c89cf2dc73..7840b37f4f9 100644
--- a/@xen-orchestra/lite/src/stories/linear-chart.story.vue
+++ b/@xen-orchestra/lite/src/stories/linear-chart.story.vue
@@ -1,38 +1,34 @@
 <template>
   <ComponentStory
+    v-slot="{ properties }"
     :params="[
-      prop('data')
-        .preset(data)
-        .required()
-        .obj('LinearChartData')
-        .help('See doc for typing')
-        .widget(),
+      prop('data').preset(data).required().obj('LinearChartData').help('See doc for typing').widget(),
       prop('value-formatter').type('(value: number) => string'),
       prop('max-value').type('number').widget().default(200),
     ]"
     :presets="presets"
-    v-slot="{ properties }"
   >
     <LinearChart v-bind="properties" />
   </ComponentStory>
 </template>
 
 <script lang="ts" setup>
-import humanFormat from "human-format";
-import type { LinearChartData } from "@/types/chart";
-import LinearChart from "@/components/charts/LinearChart.vue";
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import { prop } from "@/libs/story/story-param";
+// eslint-disable-next-line import/no-named-as-default
+import humanFormat from 'human-format'
+import type { LinearChartData } from '@/types/chart'
+import LinearChart from '@/components/charts/LinearChart.vue'
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import { prop } from '@/libs/story/story-param'
 
-const byteFormatter = (value: number) => humanFormat.bytes(value);
+const byteFormatter = (value: number) => humanFormat.bytes(value)
 
-let time = 0;
-const firstDay = () => (time = 1640995200000);
-const nextDay = () => (time += 86400000);
+let time = 0
+const firstDay = () => (time = 1640995200000)
+const nextDay = () => (time += 86400000)
 
 const data: LinearChartData = [
   {
-    label: "Foo",
+    label: 'Foo',
     data: [
       { timestamp: firstDay(), value: 50 },
       { timestamp: nextDay(), value: 20 },
@@ -42,7 +38,7 @@ const data: LinearChartData = [
     ],
   },
   {
-    label: "Bar",
+    label: 'Bar',
     data: [
       { timestamp: firstDay(), value: 10 },
       { timestamp: nextDay(), value: 80 },
@@ -51,16 +47,16 @@ const data: LinearChartData = [
       { timestamp: nextDay(), value: 20 },
     ],
   },
-];
+]
 
 const presets = {
-  "Network bandwidth": {
+  'Network bandwidth': {
     props: {
-      "value-formatter": byteFormatter,
-      "max-value": 500000000,
+      'value-formatter': byteFormatter,
+      'max-value': 500000000,
       data: [
         {
-          label: "Download",
+          label: 'Download',
           data: [
             {
               timestamp: firstDay(),
@@ -93,7 +89,7 @@ const presets = {
           ],
         },
         {
-          label: "Upload",
+          label: 'Upload',
           data: [
             {
               timestamp: firstDay(),
@@ -128,7 +124,7 @@ const presets = {
       ],
     },
   },
-};
+}
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/modals/layouts/basic-modal-layout.story.vue b/@xen-orchestra/lite/src/stories/modals/layouts/basic-modal-layout.story.vue
index 610952092df..1685911b2cd 100644
--- a/@xen-orchestra/lite/src/stories/modals/layouts/basic-modal-layout.story.vue
+++ b/@xen-orchestra/lite/src/stories/modals/layouts/basic-modal-layout.story.vue
@@ -1,12 +1,7 @@
 <template>
   <ComponentStory
     v-slot="{ settings }"
-    :params="[
-      slot(),
-      setting('defaultSlotContent')
-        .preset('Here is a basic modal...')
-        .widget(text()),
-    ]"
+    :params="[slot(), setting('defaultSlotContent').preset('Here is a basic modal...').widget(text())]"
   >
     <BasicModalLayout>
       {{ settings.defaultSlotContent }}
@@ -15,10 +10,10 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import BasicModalLayout from "@/components/ui/modals/layouts/BasicModalLayout.vue";
-import { setting, slot } from "@/libs/story/story-param";
-import { text } from "@/libs/story/story-widget";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import BasicModalLayout from '@/components/ui/modals/layouts/BasicModalLayout.vue'
+import { setting, slot } from '@/libs/story/story-param'
+import { text } from '@/libs/story/story-widget'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/modals/layouts/confirm-modal-layout.story.vue b/@xen-orchestra/lite/src/stories/modals/layouts/confirm-modal-layout.story.vue
index 44d8a593606..b86e2aa5302 100644
--- a/@xen-orchestra/lite/src/stories/modals/layouts/confirm-modal-layout.story.vue
+++ b/@xen-orchestra/lite/src/stories/modals/layouts/confirm-modal-layout.story.vue
@@ -23,9 +23,9 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import ConfirmModalLayout from "@/components/ui/modals/layouts/ConfirmModalLayout.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import { iconProp, setting, slot } from "@/libs/story/story-param";
-import { faShip } from "@fortawesome/free-solid-svg-icons";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import ConfirmModalLayout from '@/components/ui/modals/layouts/ConfirmModalLayout.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import { iconProp, setting, slot } from '@/libs/story/story-param'
+import { faShip } from '@fortawesome/free-solid-svg-icons'
 </script>
diff --git a/@xen-orchestra/lite/src/stories/modals/layouts/form-modal-layout.story.vue b/@xen-orchestra/lite/src/stories/modals/layouts/form-modal-layout.story.vue
index f82f024c385..3f5681b4ae9 100644
--- a/@xen-orchestra/lite/src/stories/modals/layouts/form-modal-layout.story.vue
+++ b/@xen-orchestra/lite/src/stories/modals/layouts/form-modal-layout.story.vue
@@ -1,25 +1,14 @@
 <template>
-  <ComponentStory
-    v-slot="{ properties }"
-    :params="[iconProp(), slot('title'), slot('default'), slot('buttons')]"
-  >
+  <ComponentStory v-slot="{ properties }" :params="[iconProp(), slot('title'), slot('default'), slot('buttons')]">
     <FormModalLayout :icon="faRoute" v-bind="properties">
       <template #title>Migrate 3 VMs</template>
 
       <div>
-        <FormInputWrapper
-          label="Select a destination host"
-          learn-more-url="http://..."
-          light
-        >
+        <FormInputWrapper label="Select a destination host" learn-more-url="http://..." light>
           <FormInput />
         </FormInputWrapper>
 
-        <FormInputWrapper
-          label="Select a migration network (optional)"
-          learn-more-url="http://..."
-          light
-        >
+        <FormInputWrapper label="Select a migration network (optional)" learn-more-url="http://..." light>
           <FormInput />
         </FormInputWrapper>
 
@@ -42,13 +31,13 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import FormInput from "@/components/form/FormInput.vue";
-import FormInputWrapper from "@/components/form/FormInputWrapper.vue";
-import FormModalLayout from "@/components/ui/modals/layouts/FormModalLayout.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import { iconProp, slot } from "@/libs/story/story-param";
-import { faRoute } from "@fortawesome/free-solid-svg-icons";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import FormInput from '@/components/form/FormInput.vue'
+import FormInputWrapper from '@/components/form/FormInputWrapper.vue'
+import FormModalLayout from '@/components/ui/modals/layouts/FormModalLayout.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import { iconProp, slot } from '@/libs/story/story-param'
+import { faRoute } from '@fortawesome/free-solid-svg-icons'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/modals/modal-container.story.vue b/@xen-orchestra/lite/src/stories/modals/modal-container.story.vue
index cf7ee47fbd3..5737fc062dd 100644
--- a/@xen-orchestra/lite/src/stories/modals/modal-container.story.vue
+++ b/@xen-orchestra/lite/src/stories/modals/modal-container.story.vue
@@ -6,22 +6,10 @@
       slot('header'),
       slot(),
       slot('footer'),
-      setting('headerSlotContent')
-        .preset('Header')
-        .widget(text())
-        .help('Content for default slot'),
-      setting('defaultSlotContent')
-        .preset('Content')
-        .widget(text())
-        .help('Content for default slot'),
-      setting('footerSlotContent')
-        .preset('Footer')
-        .widget(text())
-        .help('Content for default slot'),
-      setting('showNested')
-        .preset(false)
-        .widget(boolean())
-        .help('Show nested modal'),
+      setting('headerSlotContent').preset('Header').widget(text()).help('Content for default slot'),
+      setting('defaultSlotContent').preset('Content').widget(text()).help('Content for default slot'),
+      setting('footerSlotContent').preset('Footer').widget(text()).help('Content for default slot'),
+      setting('showNested').preset(false).widget(boolean()).help('Show nested modal'),
     ]"
   >
     <ModalContainer v-bind="properties">
@@ -31,9 +19,7 @@
 
       <template #default>
         {{ settings.defaultSlotContent }}
-        <ModalContainer v-if="settings.showNested" color="error">
-          Nested modal
-        </ModalContainer>
+        <ModalContainer v-if="settings.showNested" color="error"> Nested modal </ModalContainer>
       </template>
 
       <template #footer>
@@ -44,8 +30,8 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import ModalContainer from "@/components/ui/modals/ModalContainer.vue";
-import { colorProp, setting, slot } from "@/libs/story/story-param";
-import { boolean, text } from "@/libs/story/story-widget";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import ModalContainer from '@/components/ui/modals/ModalContainer.vue'
+import { colorProp, setting, slot } from '@/libs/story/story-param'
+import { boolean, text } from '@/libs/story/story-widget'
 </script>
diff --git a/@xen-orchestra/lite/src/stories/power-state-icon.story.vue b/@xen-orchestra/lite/src/stories/power-state-icon.story.vue
index 8606b1d792e..5b65cff6e8c 100644
--- a/@xen-orchestra/lite/src/stories/power-state-icon.story.vue
+++ b/@xen-orchestra/lite/src/stories/power-state-icon.story.vue
@@ -1,5 +1,6 @@
 <template>
   <ComponentStory
+    v-slot="{ properties }"
     :params="[
       prop('state')
         .enum(...Object.values(VM_POWER_STATE))
@@ -7,17 +8,16 @@
         .preset(VM_POWER_STATE.RUNNING)
         .widget(),
     ]"
-    v-slot="{ properties }"
   >
     <PowerStateIcon style="font-size: 10rem" v-bind="properties" />
   </ComponentStory>
 </template>
 
 <script lang="ts" setup>
-import PowerStateIcon from "@/components/PowerStateIcon.vue";
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import { prop } from "@/libs/story/story-param";
-import { VM_POWER_STATE } from "@/libs/xen-api/xen-api.enums";
+import PowerStateIcon from '@/components/PowerStateIcon.vue'
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import { prop } from '@/libs/story/story-param'
+import { VM_POWER_STATE } from '@/libs/xen-api/xen-api.enums'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/progress-circle.story.vue b/@xen-orchestra/lite/src/stories/progress-circle.story.vue
index 2229ddd40d1..7e468ea2d60 100644
--- a/@xen-orchestra/lite/src/stories/progress-circle.story.vue
+++ b/@xen-orchestra/lite/src/stories/progress-circle.story.vue
@@ -1,35 +1,32 @@
 <template>
   <ComponentStory
-    :params="[
-      prop('value').num().preset(25).required().widget(),
-      prop('max-value').num().default(100).widget(),
-    ]"
-    :presets="presets"
     v-slot="{ properties }"
+    :params="[prop('value').num().preset(25).required().widget(), prop('max-value').num().default(100).widget()]"
+    :presets="presets"
   >
     <ProgressCircle v-bind="properties" />
   </ComponentStory>
 </template>
 
 <script lang="ts" setup>
-import ProgressCircle from "@/components/ProgressCircle.vue";
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import { prop } from "@/libs/story/story-param";
+import ProgressCircle from '@/components/ProgressCircle.vue'
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import { prop } from '@/libs/story/story-param'
 
 const presets = {
-  "Half of 500": {
+  'Half of 500': {
     props: {
-      "max-value": 500,
+      'max-value': 500,
       value: 250,
     },
   },
-  "75% of 300": {
+  '75% of 300': {
     props: {
-      "max-value": 300,
+      'max-value': 300,
       value: 225,
     },
   },
-};
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/stories/story-example.story.vue b/@xen-orchestra/lite/src/stories/story-example.story.vue
index c53fb9ae7ab..60fe1a631e9 100644
--- a/@xen-orchestra/lite/src/stories/story-example.story.vue
+++ b/@xen-orchestra/lite/src/stories/story-example.story.vue
@@ -3,51 +3,23 @@
     v-slot="{ properties, settings }"
     :presets="presets"
     :params="[
-      prop('imString')
-        .str()
-        .required()
-        .preset('Example')
-        .widget()
-        .help('This is a required string prop'),
-      prop('imNumber')
-        .num()
-        .required()
-        .preset(42)
-        .widget()
-        .help('This is a required number prop'),
+      prop('imString').str().required().preset('Example').widget().help('This is a required string prop'),
+      prop('imNumber').num().required().preset(42).widget().help('This is a required number prop'),
       prop('imOptional').str().widget().help('This is an optional string prop'),
-      prop('imOptionalWithDefault')
-        .str()
-        .default('Hi World')
-        .widget()
-        .default('My default value'),
-      model().prop((p) => p.str()),
-      model('customModel').prop((p) => p.num()),
+      prop('imOptionalWithDefault').str().default('Hi World').widget().default('My default value'),
+      model().prop(p => p.str()),
+      model('customModel').prop(p => p.num()),
       event('click').help('Emitted when the user click the first button'),
-      event('clickWithArg')
-        .args({ id: 'string' })
-        .help('Emitted when the user click the second button'),
+      event('clickWithArg').args({ id: 'string' }).help('Emitted when the user click the second button'),
       slot().help('This is the default slot'),
       slot('named-slot').help('This is a named slot'),
-      slot('named-scoped-slot')
-        .prop('moon-distance', 'number')
-        .help('This is a named slot'),
-      setting('defaultSlotContent')
-        .widget(text())
-        .preset('Content for default slot'),
-      setting('namedSlotContent')
-        .widget(text())
-        .preset('Content for named slot'),
-      setting('namedScopedSlotContent')
-        .widget(text())
-        .preset('Content for named scoped slot'),
+      slot('named-scoped-slot').prop('moon-distance', 'number').help('This is a named slot'),
+      setting('defaultSlotContent').widget(text()).preset('Content for default slot'),
+      setting('namedSlotContent').widget(text()).preset('Content for named slot'),
+      setting('namedScopedSlotContent').widget(text()).preset('Content for named scoped slot'),
     ]"
   >
-    <StoryExampleComponent
-      v-bind="properties"
-      v-model="defaultModel"
-      v-model:customModel="customModel"
-    >
+    <StoryExampleComponent v-bind="properties" v-model="defaultModel" v-model:customModel="customModel">
       {{ settings.defaultSlotContent }}
       <div>Default model value: {{ defaultModel }}</div>
       <div>Custom model value: {{ customModel }}</div>
@@ -62,32 +34,32 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import StoryExampleComponent from "@/components/component-story/StoryExampleComponent.vue";
-import { event, model, prop, setting, slot } from "@/libs/story/story-param";
-import { text } from "@/libs/story/story-widget";
-import { ref } from "vue";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import StoryExampleComponent from '@/components/component-story/StoryExampleComponent.vue'
+import { event, model, prop, setting, slot } from '@/libs/story/story-param'
+import { text } from '@/libs/story/story-widget'
+import { ref } from 'vue'
 
-const defaultModel = ref("");
-const customModel = ref("");
+const defaultModel = ref('')
+const customModel = ref('')
 
 const presets: Record<
   string,
   {
-    props?: Record<string, any>;
-    settings?: Record<string, any>;
+    props?: Record<string, any>
+    settings?: Record<string, any>
   }
 > = {
-  "Demo preset": {
+  'Demo preset': {
     props: {
-      imString: "Text from preset",
+      imString: 'Text from preset',
       imNumber: 1000,
     },
     settings: {
-      defaultSlotContent: "Preset content for default slot",
-      namedSlotContent: "Preset content for named slot",
-      namedScopedSlotContent: "Preset content for named scoped slot",
+      defaultSlotContent: 'Preset content for default slot',
+      namedSlotContent: 'Preset content for named slot',
+      namedScopedSlotContent: 'Preset content for named scoped slot',
     },
   },
-};
+}
 </script>
diff --git a/@xen-orchestra/lite/src/stories/tab-bar/router-tab.story.vue b/@xen-orchestra/lite/src/stories/tab-bar/router-tab.story.vue
index 510e979d473..ea71aefd9df 100644
--- a/@xen-orchestra/lite/src/stories/tab-bar/router-tab.story.vue
+++ b/@xen-orchestra/lite/src/stories/tab-bar/router-tab.story.vue
@@ -15,11 +15,11 @@
 </template>
 
 <script lang="ts" setup>
-import RouterTab from "@/components/RouterTab.vue";
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiTabBar from "@/components/ui/UiTabBar.vue";
-import { prop, setting, slot } from "@/libs/story/story-param";
-import { text } from "@/libs/story/story-widget";
+import RouterTab from '@/components/RouterTab.vue'
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiTabBar from '@/components/ui/UiTabBar.vue'
+import { prop, setting, slot } from '@/libs/story/story-param'
+import { text } from '@/libs/story/story-widget'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/tab-bar/ui-tab-bar.story.vue b/@xen-orchestra/lite/src/stories/tab-bar/ui-tab-bar.story.vue
index 783fb4b397a..4c25328a427 100644
--- a/@xen-orchestra/lite/src/stories/tab-bar/ui-tab-bar.story.vue
+++ b/@xen-orchestra/lite/src/stories/tab-bar/ui-tab-bar.story.vue
@@ -1,10 +1,7 @@
 <template>
   <ComponentStory
     v-slot="{ properties }"
-    :params="[
-      prop('disabled').bool().widget().ctx(),
-      slot().help('Contains <RouterTab> or <UiTab>'),
-    ]"
+    :params="[prop('disabled').bool().widget().ctx(), slot().help('Contains <RouterTab> or <UiTab>')]"
   >
     <UiTabBar v-bind="properties">
       <UiTab>Foo</UiTab>
@@ -15,10 +12,10 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiTab from "@/components/ui/UiTab.vue";
-import UiTabBar from "@/components/ui/UiTabBar.vue";
-import { prop, slot } from "@/libs/story/story-param";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiTab from '@/components/ui/UiTab.vue'
+import UiTabBar from '@/components/ui/UiTabBar.vue'
+import { prop, slot } from '@/libs/story/story-param'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/tab-bar/ui-tab.story.vue b/@xen-orchestra/lite/src/stories/tab-bar/ui-tab.story.vue
index 524d27e3dd2..a389cc574ec 100644
--- a/@xen-orchestra/lite/src/stories/tab-bar/ui-tab.story.vue
+++ b/@xen-orchestra/lite/src/stories/tab-bar/ui-tab.story.vue
@@ -16,11 +16,11 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiTab from "@/components/ui/UiTab.vue";
-import UiTabBar from "@/components/ui/UiTabBar.vue";
-import { prop, setting, slot } from "@/libs/story/story-param";
-import { text } from "@/libs/story/story-widget";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiTab from '@/components/ui/UiTab.vue'
+import UiTabBar from '@/components/ui/UiTabBar.vue'
+import { prop, setting, slot } from '@/libs/story/story-param'
+import { text } from '@/libs/story/story-widget'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/ui-badge.story.vue b/@xen-orchestra/lite/src/stories/ui-badge.story.vue
index 8af9c5b32cd..bbfdfe179bd 100644
--- a/@xen-orchestra/lite/src/stories/ui-badge.story.vue
+++ b/@xen-orchestra/lite/src/stories/ui-badge.story.vue
@@ -1,14 +1,14 @@
 <template>
   <ComponentStory
-    :params="[iconProp(), setting('label').preset('65%').widget(), slot()]"
     v-slot="{ properties, settings }"
+    :params="[iconProp(), setting('label').preset('65%').widget(), slot()]"
   >
     <UiBadge v-bind="properties">{{ settings.label }}</UiBadge>
   </ComponentStory>
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiBadge from "@/components/ui/UiBadge.vue";
-import { iconProp, setting, slot } from "@/libs/story/story-param";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiBadge from '@/components/ui/UiBadge.vue'
+import { iconProp, setting, slot } from '@/libs/story/story-param'
 </script>
diff --git a/@xen-orchestra/lite/src/stories/ui-filter.story.vue b/@xen-orchestra/lite/src/stories/ui-filter.story.vue
index e0d63d3f084..3d57b2a37ae 100644
--- a/@xen-orchestra/lite/src/stories/ui-filter.story.vue
+++ b/@xen-orchestra/lite/src/stories/ui-filter.story.vue
@@ -1,22 +1,17 @@
 <template>
   <ComponentStory
     v-slot="{ properties, settings }"
-    :params="[
-      event('edit'),
-      event('remove'),
-      slot(),
-      setting('label').widget(text()).preset('Some filter'),
-    ]"
+    :params="[event('edit'), event('remove'), slot(), setting('label').widget(text()).preset('Some filter')]"
   >
     <UiFilter v-bind="properties">{{ settings.label }}</UiFilter>
   </ComponentStory>
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiFilter from "@/components/ui/UiFilter.vue";
-import { event, setting, slot } from "@/libs/story/story-param";
-import { text } from "@/libs/story/story-widget";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiFilter from '@/components/ui/UiFilter.vue'
+import { event, setting, slot } from '@/libs/story/story-param'
+import { text } from '@/libs/story/story-widget'
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/stories/ui-resources/ui-resource.story.vue b/@xen-orchestra/lite/src/stories/ui-resources/ui-resource.story.vue
index a96731cff46..fed9fb590b7 100644
--- a/@xen-orchestra/lite/src/stories/ui-resources/ui-resource.story.vue
+++ b/@xen-orchestra/lite/src/stories/ui-resources/ui-resource.story.vue
@@ -4,11 +4,7 @@
     :params="[
       iconProp().preset(faRocket),
       prop('label').required().str().widget().preset('Rockets'),
-      prop('count')
-        .required()
-        .type('string | number')
-        .widget(text())
-        .preset('175'),
+      prop('count').required().type('string | number').widget(text()).preset('175'),
     ]"
     :presets="presets"
   >
@@ -17,10 +13,10 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiResource from "@/components/ui/resources/UiResource.vue";
-import { iconProp, prop } from "@/libs/story/story-param";
-import { text } from "@/libs/story/story-widget";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiResource from '@/components/ui/resources/UiResource.vue'
+import { iconProp, prop } from '@/libs/story/story-param'
+import { text } from '@/libs/story/story-widget'
 import {
   faDatabase,
   faDisplay,
@@ -28,43 +24,43 @@ import {
   faMicrochip,
   faNetworkWired,
   faRocket,
-} from "@fortawesome/free-solid-svg-icons";
+} from '@fortawesome/free-solid-svg-icons'
 
 const presets = {
   VMs: {
     props: {
       icon: faDisplay,
       count: 1,
-      label: "VMs",
+      label: 'VMs',
     },
   },
   vCPUs: {
     props: {
       icon: faMicrochip,
       count: 4,
-      label: "vCPUs",
+      label: 'vCPUs',
     },
   },
   RAM: {
     props: {
       icon: faMemory,
       count: 2,
-      label: "RAM",
+      label: 'RAM',
     },
   },
   SR: {
     props: {
       icon: faDatabase,
       count: 1,
-      label: "SR",
+      label: 'SR',
     },
   },
   Interfaces: {
     props: {
       icon: faNetworkWired,
       count: 2,
-      label: "Interfaces",
+      label: 'Interfaces',
     },
   },
-};
+}
 </script>
diff --git a/@xen-orchestra/lite/src/stories/ui-resources/ui-resources.story.vue b/@xen-orchestra/lite/src/stories/ui-resources/ui-resources.story.vue
index 3864cccb55a..67ccb022548 100644
--- a/@xen-orchestra/lite/src/stories/ui-resources/ui-resources.story.vue
+++ b/@xen-orchestra/lite/src/stories/ui-resources/ui-resources.story.vue
@@ -1,8 +1,5 @@
 <template>
-  <ComponentStory
-    :params="[slot().help('One or multiple `UiResource`')]"
-    full-width-component
-  >
+  <ComponentStory :params="[slot().help('One or multiple `UiResource`')]" full-width-component>
     <UiResources>
       <UiResource :icon="faDisplay" count="1" label="VMs" />
       <UiResource :icon="faMicrochip" count="4" label="vCPUs" />
@@ -14,15 +11,9 @@
 </template>
 
 <script lang="ts" setup>
-import ComponentStory from "@/components/component-story/ComponentStory.vue";
-import UiResource from "@/components/ui/resources/UiResource.vue";
-import UiResources from "@/components/ui/resources/UiResources.vue";
-import { slot } from "@/libs/story/story-param";
-import {
-  faDatabase,
-  faDisplay,
-  faMemory,
-  faMicrochip,
-  faNetworkWired,
-} from "@fortawesome/free-solid-svg-icons";
+import ComponentStory from '@/components/component-story/ComponentStory.vue'
+import UiResource from '@/components/ui/resources/UiResource.vue'
+import UiResources from '@/components/ui/resources/UiResources.vue'
+import { slot } from '@/libs/story/story-param'
+import { faDatabase, faDisplay, faMemory, faMicrochip, faNetworkWired } from '@fortawesome/free-solid-svg-icons'
 </script>
diff --git a/@xen-orchestra/lite/src/types/chart.ts b/@xen-orchestra/lite/src/types/chart.ts
index 6958af099f7..f9fb8673343 100644
--- a/@xen-orchestra/lite/src/types/chart.ts
+++ b/@xen-orchestra/lite/src/types/chart.ts
@@ -1,9 +1,9 @@
 export type LinearChartData = {
-  label: string;
+  label: string
   data: {
-    timestamp: number;
-    value: number;
-  }[];
-}[];
+    timestamp: number
+    value: number
+  }[]
+}[]
 
-export type ValueFormatter = (value: number) => string;
+export type ValueFormatter = (value: number) => string
diff --git a/@xen-orchestra/lite/src/types/complex-matcher.d.ts b/@xen-orchestra/lite/src/types/complex-matcher.d.ts
index a5da63a699e..7632c2161c0 100644
--- a/@xen-orchestra/lite/src/types/complex-matcher.d.ts
+++ b/@xen-orchestra/lite/src/types/complex-matcher.d.ts
@@ -1,89 +1,85 @@
-declare module "complex-matcher" {
-  type ComparisonOperator = ">" | ">=" | "<" | "<=";
+declare module 'complex-matcher' {
+  type ComparisonOperator = '>' | '>=' | '<' | '<='
 
   class ComplexMatcherNode {
-    createPredicate(): (value) => boolean;
+    createPredicate(): (value) => boolean
   }
 
   class Null extends ComplexMatcherNode {
-    match(): true;
-    toString(): "";
+    match(): true
+    toString(): ''
   }
 
   class And extends ComplexMatcherNode {
-    constructor(children: ComplexMatcherNode[]);
-    match(value: any): boolean;
-    toString(isNested?: boolean): string;
-    children: ComplexMatcherNode[];
+    constructor(children: ComplexMatcherNode[])
+    match(value: any): boolean
+    toString(isNested?: boolean): string
+    children: ComplexMatcherNode[]
   }
 
   class Comparison extends ComplexMatcherNode {
-    constructor(operator: ComparisonOperator, value: number);
-    match(value: any): boolean;
-    toString(): string;
-    _operator: ComparisonOperator;
-    _value: number;
+    constructor(operator: ComparisonOperator, value: number)
+    match(value: any): boolean
+    toString(): string
+    _operator: ComparisonOperator
+    _value: number
   }
 
   class Or extends ComplexMatcherNode {
-    constructor(children: ComplexMatcherNode[]);
-    match(value: any): boolean;
-    toString(): string;
-    children: ComplexMatcherNode[];
+    constructor(children: ComplexMatcherNode[])
+    match(value: any): boolean
+    toString(): string
+    children: ComplexMatcherNode[]
   }
 
   class Not extends ComplexMatcherNode {
-    constructor(child: ComplexMatcherNode);
-    match(value: any): boolean;
-    toString(): string;
-    child: ComplexMatcherNode;
+    constructor(child: ComplexMatcherNode)
+    match(value: any): boolean
+    toString(): string
+    child: ComplexMatcherNode
   }
 
   class Number extends ComplexMatcherNode {
-    constructor(value: number);
-    match(value: any): boolean;
-    toString(): string;
-    value: number;
+    constructor(value: number)
+    match(value: any): boolean
+    toString(): string
+    value: number
   }
 
   class Property extends ComplexMatcherNode {
-    constructor(name: string, child: ComplexMatcherNode);
-    match(value: any): boolean;
-    toString(): string;
-    name: string;
-    child: ComplexMatcherNode;
+    constructor(name: string, child: ComplexMatcherNode)
+    match(value: any): boolean
+    toString(): string
+    name: string
+    child: ComplexMatcherNode
   }
 
   class GlobPattern extends ComplexMatcherNode {
-    constructor(value: string);
-    match(re: RegExp, value: any): boolean;
-    toString(): string;
-    value: string;
+    constructor(value: string)
+    match(re: RegExp, value: any): boolean
+    toString(): string
+    value: string
   }
 
   class RegExpNode extends ComplexMatcherNode {
-    constructor(pattern: string, flags: string);
-    match(value: any): boolean;
-    toString(): string;
-    re: RegExp;
+    constructor(pattern: string, flags: string)
+    match(value: any): boolean
+    toString(): string
+    re: RegExp
   }
 
   class StringNode extends ComplexMatcherNode {
-    constructor(value: string);
-    match(lcValue: string, value: any): boolean;
-    toString(): string;
-    value: string;
+    constructor(value: string)
+    match(lcValue: string, value: any): boolean
+    toString(): string
+    value: string
   }
 
   class TruthyProperty extends ComplexMatcherNode {
-    constructor(name: string);
-    match(value: any): boolean;
-    toString(): string;
+    constructor(name: string)
+    match(value: any): boolean
+    toString(): string
   }
 
-  function parse(
-    input: string,
-    pos? = 0,
-    end?: input.length
-  ): ComplexMatcherNode;
+  function parse(input: string, pos? = 0, end?: input.length): ComplexMatcherNode
 }
diff --git a/@xen-orchestra/lite/src/types/decorator-synchronized.d.ts b/@xen-orchestra/lite/src/types/decorator-synchronized.d.ts
index fd246e7ff8f..3e0fca0d457 100644
--- a/@xen-orchestra/lite/src/types/decorator-synchronized.d.ts
+++ b/@xen-orchestra/lite/src/types/decorator-synchronized.d.ts
@@ -1,3 +1,3 @@
-declare module "decorator-synchronized" {
-  export const synchronized: any;
+declare module 'decorator-synchronized' {
+  export const synchronized: any
 }
diff --git a/@xen-orchestra/lite/src/types/filter.ts b/@xen-orchestra/lite/src/types/filter.ts
index eb1cfcde6ca..88622b20b49 100644
--- a/@xen-orchestra/lite/src/types/filter.ts
+++ b/@xen-orchestra/lite/src/types/filter.ts
@@ -1,58 +1,58 @@
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
-export type FilterType = "string" | "boolean" | "number" | "enum";
+export type FilterType = 'string' | 'boolean' | 'number' | 'enum'
 
 export type FilterComparisonType =
-  | "stringContains"
-  | "stringDoesNotContains"
-  | "stringEquals"
-  | "stringDoesNotEqual"
-  | "stringStartsWith"
-  | "stringDoesNotStartWith"
-  | "stringEndsWith"
-  | "stringDoesNotEndWith"
-  | "stringMatchesRegex"
-  | "stringDoesNotMatchRegex"
-  | "numberLessThan"
-  | "numberLessThanOrEquals"
-  | "numberEquals"
-  | "numberGreaterThanOrEquals"
-  | "numberGreaterThan"
-  | "booleanTrue"
-  | "booleanFalse"
-  | "enumIs"
-  | "enumIsNot";
+  | 'stringContains'
+  | 'stringDoesNotContains'
+  | 'stringEquals'
+  | 'stringDoesNotEqual'
+  | 'stringStartsWith'
+  | 'stringDoesNotStartWith'
+  | 'stringEndsWith'
+  | 'stringDoesNotEndWith'
+  | 'stringMatchesRegex'
+  | 'stringDoesNotMatchRegex'
+  | 'numberLessThan'
+  | 'numberLessThanOrEquals'
+  | 'numberEquals'
+  | 'numberGreaterThanOrEquals'
+  | 'numberGreaterThan'
+  | 'booleanTrue'
+  | 'booleanFalse'
+  | 'enumIs'
+  | 'enumIsNot'
 
 export type FilterComparisons = {
-  [key in FilterComparisonType]?: string;
-};
+  [key in FilterComparisonType]?: string
+}
 
 interface FilterCommon {
-  label?: string;
-  icon?: IconDefinition;
+  label?: string
+  icon?: IconDefinition
 }
 
 export interface FilterEnum extends FilterCommon {
-  type: "enum";
-  choices: string[];
+  type: 'enum'
+  choices: string[]
 }
 
 interface FilterOther extends FilterCommon {
-  type: Exclude<FilterType, "enum">;
+  type: Exclude<FilterType, 'enum'>
 }
 
-export type Filter = FilterEnum | FilterOther;
+export type Filter = FilterEnum | FilterOther
 
-export type Filters = { [key: string]: Filter };
+export type Filters = { [key: string]: Filter }
 
 export interface NewFilter {
-  id: number;
-  content: string;
-  isAdvanced: boolean;
+  id: number
+  content: string
+  isAdvanced: boolean
   builder: {
-    property: string;
-    comparison: FilterComparisonType | "";
-    value: string;
-    negate: boolean;
-  };
+    property: string
+    comparison: FilterComparisonType | ''
+    value: string
+    negate: boolean
+  }
 }
diff --git a/@xen-orchestra/lite/src/types/index.ts b/@xen-orchestra/lite/src/types/index.ts
index 48052e40128..50851579b80 100644
--- a/@xen-orchestra/lite/src/types/index.ts
+++ b/@xen-orchestra/lite/src/types/index.ts
@@ -1,10 +1,10 @@
-export type Color = "info" | "error" | "warning" | "success";
+export type Color = 'info' | 'error' | 'warning' | 'success'
 
 export type ModalController = {
-  id: symbol;
-  component: any;
-  props: object;
-  approve: <P>(payload?: P) => void;
-  decline: () => void;
-  isBusy: boolean;
-};
+  id: symbol
+  component: any
+  props: object
+  approve: <P>(payload?: P) => void
+  decline: () => void
+  isBusy: boolean
+}
diff --git a/@xen-orchestra/lite/src/types/injection-keys.ts b/@xen-orchestra/lite/src/types/injection-keys.ts
index d9c830c2a79..da475d5a335 100644
--- a/@xen-orchestra/lite/src/types/injection-keys.ts
+++ b/@xen-orchestra/lite/src/types/injection-keys.ts
@@ -1,56 +1,42 @@
-import type { FetchedStats, Stat } from "@/composables/fetch-stats.composable";
-import type { HostStats, VmStats } from "@/libs/xapi-stats";
-import type { XenApiHost } from "@/libs/xen-api/xen-api.types";
-import type { ValueFormatter } from "@/types/chart";
-import type { ModalController } from "@/types/index";
-import type { ComputedRef, InjectionKey } from "vue";
+import type { FetchedStats, Stat } from '@/composables/fetch-stats.composable'
+import type { HostStats, VmStats } from '@/libs/xapi-stats'
+import type { XenApiHost } from '@/libs/xen-api/xen-api.types'
+import type { ValueFormatter } from '@/types/chart'
+import type { ModalController } from '@/types/index'
+import type { ComputedRef, InjectionKey } from 'vue'
 
-export const IK_MENU_TELEPORTED = Symbol() as InjectionKey<boolean>;
+export const IK_MENU_TELEPORTED = Symbol('IK_MENU_TELEPORTED') as InjectionKey<boolean>
 
-export const IK_CHART_VALUE_FORMATTER = Symbol() as InjectionKey<
-  ComputedRef<ValueFormatter>
->;
+export const IK_CHART_VALUE_FORMATTER = Symbol('IK_CHART_VALUE_FORMATTER') as InjectionKey<ComputedRef<ValueFormatter>>
 
-export const IK_INPUT_TYPE = Symbol() as InjectionKey<"select" | "textarea">;
+export const IK_INPUT_TYPE = Symbol('IK_INPUT_TYPE') as InjectionKey<'select' | 'textarea'>
 
-export const IK_CHECKBOX_TYPE = Symbol() as InjectionKey<
-  "checkbox" | "radio" | "toggle"
->;
+export const IK_CHECKBOX_TYPE = Symbol('IK_CHECKBOX_TYPE') as InjectionKey<'checkbox' | 'radio' | 'toggle'>
 
-export const IK_FORM_HAS_LABEL = Symbol() as InjectionKey<ComputedRef<boolean>>;
+export const IK_FORM_HAS_LABEL = Symbol('IK_FORM_HAS_LABEL') as InjectionKey<ComputedRef<boolean>>
 
-export const IK_MENU_HORIZONTAL = Symbol() as InjectionKey<
-  ComputedRef<boolean>
->;
+export const IK_MENU_HORIZONTAL = Symbol('IK_MENU_HORIZONTAL') as InjectionKey<ComputedRef<boolean>>
 
-export const IK_CLOSE_MENU = Symbol() as InjectionKey<() => void>;
+export const IK_CLOSE_MENU = Symbol('IK_CLOSE_MENU') as InjectionKey<() => void>
 
-export const IK_HOST_STATS = Symbol() as InjectionKey<
-  ComputedRef<Stat<HostStats>[]>
->;
+export const IK_HOST_STATS = Symbol('IK_HOST_STATS') as InjectionKey<ComputedRef<Stat<HostStats>[]>>
 
-export const IK_VM_STATS = Symbol() as InjectionKey<
-  ComputedRef<Stat<VmStats>[]>
->;
+export const IK_VM_STATS = Symbol('IK_VM_STATS') as InjectionKey<ComputedRef<Stat<VmStats>[]>>
 
-export const IK_HOST_LAST_WEEK_STATS = Symbol() as InjectionKey<
+export const IK_HOST_LAST_WEEK_STATS = Symbol('IK_HOST_LAST_WEEK_STATS') as InjectionKey<
   FetchedStats<XenApiHost, HostStats>
->;
+>
 
-export const IK_BUTTON_GROUP_OUTLINED = Symbol() as InjectionKey<
-  ComputedRef<boolean>
->;
+export const IK_BUTTON_GROUP_OUTLINED = Symbol('IK_BUTTON_GROUP_OUTLINED') as InjectionKey<ComputedRef<boolean>>
 
-export const IK_BUTTON_GROUP_TRANSPARENT = Symbol() as InjectionKey<
-  ComputedRef<boolean>
->;
+export const IK_BUTTON_GROUP_TRANSPARENT = Symbol('IK_BUTTON_GROUP_TRANSPARENT') as InjectionKey<ComputedRef<boolean>>
 
-export const IK_CARD_GROUP_VERTICAL = Symbol() as InjectionKey<boolean>;
+export const IK_CARD_GROUP_VERTICAL = Symbol('IK_CARD_GROUP_VERTICAL') as InjectionKey<boolean>
 
-export const IK_INPUT_ID = Symbol() as InjectionKey<ComputedRef<string>>;
+export const IK_INPUT_ID = Symbol('IK_INPUT_ID') as InjectionKey<ComputedRef<string>>
 
-export const IK_MODAL_CLOSE = Symbol() as InjectionKey<() => void>;
+export const IK_MODAL_CLOSE = Symbol('IK_MODAL_CLOSE') as InjectionKey<() => void>
 
-export const IK_MODAL_NESTED = Symbol() as InjectionKey<boolean>;
+export const IK_MODAL_NESTED = Symbol('IK_MODAL_NESTED') as InjectionKey<boolean>
 
-export const IK_MODAL = Symbol() as InjectionKey<ModalController>;
+export const IK_MODAL = Symbol('IK_MODAL') as InjectionKey<ModalController>
diff --git a/@xen-orchestra/lite/src/types/iterable-backoff.d.ts b/@xen-orchestra/lite/src/types/iterable-backoff.d.ts
index d19a804e468..f25af5b37e3 100644
--- a/@xen-orchestra/lite/src/types/iterable-backoff.d.ts
+++ b/@xen-orchestra/lite/src/types/iterable-backoff.d.ts
@@ -1 +1 @@
-declare module "iterable-backoff";
+declare module 'iterable-backoff'
diff --git a/@xen-orchestra/lite/src/types/limit-concurrency-decorator.d.ts b/@xen-orchestra/lite/src/types/limit-concurrency-decorator.d.ts
index 9dc88bdb356..e316b4c44c4 100644
--- a/@xen-orchestra/lite/src/types/limit-concurrency-decorator.d.ts
+++ b/@xen-orchestra/lite/src/types/limit-concurrency-decorator.d.ts
@@ -1,3 +1,3 @@
-declare module "limit-concurrency-decorator" {
-  export const limitConcurrency: any;
+declare module 'limit-concurrency-decorator' {
+  export const limitConcurrency: any
 }
diff --git a/@xen-orchestra/lite/src/types/novnc.d.ts b/@xen-orchestra/lite/src/types/novnc.d.ts
index 81afe7b4da7..3f1f77f7617 100644
--- a/@xen-orchestra/lite/src/types/novnc.d.ts
+++ b/@xen-orchestra/lite/src/types/novnc.d.ts
@@ -4,17 +4,19 @@
 //                 Maksim Ovcharik <https://github.com/ovcharik>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 
-declare module "@novnc/novnc/core/rfb" {
+/* eslint-disable no-use-before-define */
+
+declare module '@novnc/novnc/core/rfb' {
   /**
    * An `object` specifying the credentials to provide to the server when authenticating.
    */
   interface NoVncCredentials {
     /** The user that authenticates */
-    username: string;
+    username: string
     /** Password for the user */
-    password: string;
+    password: string
     /** Target machine or session */
-    target: string;
+    target: string
   }
 
   /**
@@ -25,20 +27,20 @@ declare module "@novnc/novnc/core/rfb" {
      * A `boolean` indicating if the remote server should be shared or if any other connected
      * clients should be disconnected. Enabled by default.
      */
-    shared?: boolean;
+    shared?: boolean
     /**
      * An `object` specifying the credentials to provide to the server when authenticating.
      */
-    credentials?: NoVncCredentials;
+    credentials?: NoVncCredentials
     /**
      * A `string` specifying the ID to provide to any VNC repeater encountered.
      */
-    repeaterID?: string;
+    repeaterID?: string
     /**
      * An `Array` of `string`s specifying the sub-protocols to use in the WebSocket connection.
      * Empty by default.
      */
-    wsProtocols?: string[];
+    wsProtocols?: string[]
   }
 
   interface NoVncEvents {
@@ -47,7 +49,7 @@ declare module "@novnc/novnc/core/rfb" {
      * connection is fully established. After this event the `NoVncClient` object is ready to
      * receive graphics updates and to send input.
      */
-    connect: CustomEvent<Record<string, never>>;
+    connect: CustomEvent<Record<string, never>>
 
     /**
      * The `disconnect` event is fired when the connection has been terminated. The `detail`
@@ -55,14 +57,14 @@ declare module "@novnc/novnc/core/rfb" {
      * if the termination was clean or not. In the event of an unexpected termination or an error
      * `clean` will be set to false.
      */
-    disconnect: CustomEvent<{ clean: boolean }>;
+    disconnect: CustomEvent<{ clean: boolean }>
 
     /**
      * The `credentialsrequired` event is fired when the server requests more credentials than were
      * specified to {@link NoVncClient}. The `detail` property is an `object` containing the
      * property `types` which is an `Array` of `string` listing the credentials that are required.
      */
-    credentialsrequired: CustomEvent<{ types: Array<keyof NoVncCredentials> }>;
+    credentialsrequired: CustomEvent<{ types: Array<keyof NoVncCredentials> }>
 
     /**
      * The `securityfailure` event is fired when the handshaking process with the server fails
@@ -82,58 +84,46 @@ declare module "@novnc/novnc/core/rfb" {
      * will probably send English strings. The server can choose to not send a reason and in these
      * cases the `reason` property will be omitted.
      */
-    securityfailure: CustomEvent<{ status: number; reason?: string }>;
+    securityfailure: CustomEvent<{ status: number; reason?: string }>
 
     /**
      * The `clipboard` event is fired when the server has sent clipboard data. The `detail` property
      * is an `object` containing the property `text` which is a `string` with the clipboard data.
      */
-    clipboard: CustomEvent<{ text: string }>;
+    clipboard: CustomEvent<{ text: string }>
 
     /**
      * The `bell` event is fired when the server has requested an audible bell.
      */
-    bell: CustomEvent<Record<string, never>>;
+    bell: CustomEvent<Record<string, never>>
 
     /**
      * The `desktopname` event is fired when the name of the remote desktop changes. The `detail`
      * property is an `object` with the property `name` which is a `string` specifying the new name.
      */
-    desktopname: CustomEvent<{ name: string }>;
+    desktopname: CustomEvent<{ name: string }>
 
     /**
      * The `capabilities` event is fired whenever an entry is added or removed from `capabilities`.
      * The `detail` property is an `object` with the property `capabilities` containing the new
      * value of `capabilities`.
      */
-    capabilities: CustomEvent<{ capabilities: NoVncClient["capabilities"] }>;
+    capabilities: CustomEvent<{ capabilities: NoVncClient['capabilities'] }>
   }
 
-  type NoVncEventType = keyof NoVncEvents;
-  type NoVncEvent = NoVncEvents[NoVncEventType];
+  type NoVncEventType = keyof NoVncEvents
+  type NoVncEvent = NoVncEvents[NoVncEventType]
 
   class NoVncEventTarget extends EventTarget {
-    protected _listeners: Map<NoVncEventType, (event: Event) => void>;
-
-    addEventListener<T extends NoVncEventType>(
-      type: T,
-      listener: (event: NoVncEvents[T]) => void
-    ): void;
-    addEventListener(
-      type: string,
-      listener: (event: CustomEvent) => void
-    ): void;
-
-    removeEventListener<T extends NoVncEventType>(
-      type: T,
-      listener: (event: NoVncEvents[T]) => void
-    ): void;
-    removeEventListener(
-      type: string,
-      listener: (event: CustomEvent) => void
-    ): void;
-
-    dispatchEvent(event: NoVncEvent | CustomEvent): boolean;
+    protected _listeners: Map<NoVncEventType, (event: Event) => void>
+
+    addEventListener<T extends NoVncEventType>(type: T, listener: (event: NoVncEvents[T]) => void): void
+    addEventListener(type: string, listener: (event: CustomEvent) => void): void
+
+    removeEventListener<T extends NoVncEventType>(type: T, listener: (event: NoVncEvents[T]) => void): void
+    removeEventListener(type: string, listener: (event: CustomEvent) => void): void
+
+    dispatchEvent(event: NoVncEvent | CustomEvent): boolean
   }
 
   /**
@@ -141,9 +131,9 @@ declare module "@novnc/novnc/core/rfb" {
    * a WebSocket that must provide a standard NoVncClient protocol stream.
    */
   export default class NoVncClient extends NoVncEventTarget {
-    readonly _rfbConnectionState: string;
-    readonly _target: Element;
-    readonly _url: string | null;
+    readonly _rfbConnectionState: string
+    readonly _target: Element
+    readonly _url: string | null
 
     /**
      * Returns a new `NoVncClient` object and initiates a new connection to a specified VNC server.
@@ -156,67 +146,63 @@ declare module "@novnc/novnc/core/rfb" {
      * @param options - An {@link NoVncOptions} specifying extra details about how the connection
      * should be made.
      */
-    constructor(
-      target: Element,
-      url: string | WebSocket | RTCDataChannel,
-      options?: NoVncOptions
-    );
+    constructor(target: Element, url: string | WebSocket | RTCDataChannel, options?: NoVncOptions)
 
     /**
      * Is a `boolean` indicating if any events (e.g. key presses or mouse movement) should be
      * prevented from being sent to the server. Disabled by default.
      */
-    viewOnly: boolean;
+    viewOnly: boolean
 
     /**
      * Is a `boolean` indicating if keyboard focus should automatically be moved to the remote
      * session when a `mousedown` or `touchstart` event is received. Enabled by default.
      */
-    focusOnClick: boolean;
+    focusOnClick: boolean
 
     /**
      * Is a `boolean` indicating if the remote session should be clipped to its container. When
      * disabled scrollbars will be shown to handle the resulting overflow. Disabled by default.
      */
-    clipViewport: boolean;
+    clipViewport: boolean
 
     /**
      * Is a `boolean` indicating if mouse events should control the relative position of a clipped
      * remote session. Only relevant if `clipViewport` is enabled. Disabled by default.
      */
-    dragViewport: boolean;
+    dragViewport: boolean
 
     /**
      * Is a `boolean` indicating if the remote session should be scaled locally so it fits its
      * container. When disabled it will be centered if the remote session is smaller than its
      * container, or handled according to `clipViewport` if it is larger. Disabled by default.
      */
-    scaleViewport: boolean;
+    scaleViewport: boolean
 
     /**
      * Is a `boolean` indicating if a request to resize the remote session should be sent whenever
      * the container changes dimensions. Disabled by default.
      */
-    resizeSession: boolean;
+    resizeSession: boolean
 
     /**
      * Is a `boolean` indicating whether a dot cursor should be shown instead of a zero-sized or
      * fully-transparent cursor if the server sets such invisible cursor. Disabled by default.
      */
-    showDotCursor: boolean;
+    showDotCursor: boolean
 
     /**
      * Is a valid CSS [background](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
      * style value indicating which background style should be applied to the element containing the
      * remote session screen. The default value is `rgb(40, 40, 40)` (solid gray color).
      */
-    background: string;
+    background: string
 
     /**
      * Is an `int` in range `[0-9]` controlling the desired JPEG quality. Value `0` implies low
      * quality and `9` implies high quality. Default value is `6`.
      */
-    qualityLevel: number;
+    qualityLevel: number
 
     /**
      * Is an `int` in range `[0-9]` controlling the desired compression level. Value `0` means no
@@ -224,7 +210,7 @@ declare module "@novnc/novnc/core/rfb" {
      * while level 9 offers best compression but is slow in terms of CPU consumption on the server
      * side. Use high levels with very slow network connections. Default value is `2`.
      */
-    compressionLevel: number;
+    compressionLevel: number
 
     /**
      * Is an `object` indicating which optional extensions are available on the server. Some methods
@@ -237,13 +223,13 @@ declare module "@novnc/novnc/core/rfb" {
      */
     readonly capabilities: {
       /** Machine power control is available */
-      power: boolean;
-    };
+      power: boolean
+    }
 
     /**
      * Disconnect from the server.
      */
-    disconnect(): void;
+    disconnect(): void
 
     /**
      * Send credentials to server. Should be called after the
@@ -252,7 +238,7 @@ declare module "@novnc/novnc/core/rfb" {
      * @param credentials An {@link NoVncCredentials} specifying the credentials to provide to the
      * server when authenticating.
      */
-    sendCredentials(credentials: NoVncCredentials): void;
+    sendCredentials(credentials: NoVncCredentials): void
 
     /**
      * Send a key event to the server.
@@ -265,13 +251,13 @@ declare module "@novnc/novnc/core/rfb" {
      * @param down A `boolean` specifying if a press or a release event should be sent. If omitted
      * then both a press and release event are sent.
      */
-    sendKey(keysym: number, code: string | null, down?: boolean): void;
+    sendKey(keysym: number, code: string | null, down?: boolean): void
 
     /**
      * Send the key sequence *left Control*, *left Alt*, *Delete*. This is a convenience wrapper
      * around {@link sendKey}.
      */
-    sendCtrlAltDel(): void;
+    sendCtrlAltDel(): void
 
     /**
      * Sets the keyboard focus on the remote session. Keyboard events will be sent to the remote
@@ -280,67 +266,69 @@ declare module "@novnc/novnc/core/rfb" {
      * @param options A {@link FocusOptions} providing options to control how the focus will be
      * performed. Please see {@link HTMLElement.focus} for available options.
      */
-    focus(options?: FocusOptions): void;
+    focus(options?: FocusOptions): void
 
     /**
      * Remove keyboard focus on the remote session. Keyboard events will no longer be sent to the
      * remote server after this point.
      */
-    blur(): void;
+    blur(): void
 
     /**
      * Request to shut down the remote machine. The capability `power` must be set for this method
      * to have any effect.
      */
-    machineShutdown(): void;
+    machineShutdown(): void
 
     /**
      * Request a clean reboot of the remote machine. The capability `power` must be set for this
      * method to have any effect.
      */
-    machineReboot(): void;
+    machineReboot(): void
 
     /**
      * Request a forced reset of the remote machine. The capability `power` must be set for this
      * method to have any effect.
      */
-    machineReset(): void;
+    machineReset(): void
 
     /**
      * Send clipboard data to the remote server.
      *
      * @param text A `string` specifying the clipboard data to send.
      */
-    clipboardPasteFrom(text: string): void;
+    clipboardPasteFrom(text: string): void
   }
 }
 
-declare module "@novnc/novnc/core/util/browser" {
-  let isTouchDevice: boolean;
-  let dragThreshold: number;
+declare module '@novnc/novnc/core/util/browser' {
+  let isTouchDevice: boolean
+  let dragThreshold: number
 
-  const supportsCursorURIs: boolean;
-  const hasScrollbarGutter: boolean;
+  const supportsCursorURIs: boolean
+  const hasScrollbarGutter: boolean
 
-  function isMac(): boolean;
-  function isWindows(): boolean;
-  function isIOS(): boolean;
-  function isSafari(): boolean;
-  function isFirefox(): boolean;
+  function isMac(): boolean
+  function isWindows(): boolean
+  function isIOS(): boolean
+  function isSafari(): boolean
+  function isFirefox(): boolean
 }
 
-declare module "@novnc/novnc/core/input/util" {
+declare module '@novnc/novnc/core/input/util' {
   interface KeyboardEventBase {
-    char?: string;
-    charCode?: number;
-    code: string;
-    key: string;
-    keyCode?: number;
-    location?: number;
-    type?: string;
+    char?: string
+    charCode?: number
+    code: string
+    key: string
+    keyCode?: number
+    location?: number
+    type?: string
   }
 
-  function getKeycode(event: KeyboardEventBase): string;
-  function getKey(event: KeyboardEventBase): string;
-  function getKeysym(event: KeyboardEventBase): number;
+  function getKeycode(event: KeyboardEventBase): string
+  function getKey(event: KeyboardEventBase): string
+  function getKeysym(event: KeyboardEventBase): number
 }
+
+/* eslint-enable no-use-before-define */
diff --git a/@xen-orchestra/lite/src/types/router.d.ts b/@xen-orchestra/lite/src/types/router.d.ts
index 6a4107cc9a8..71a72c1a631 100644
--- a/@xen-orchestra/lite/src/types/router.d.ts
+++ b/@xen-orchestra/lite/src/types/router.d.ts
@@ -1,9 +1,9 @@
-declare module "vue-router" {
+declare module 'vue-router' {
   interface RouteMeta {
-    hasStoryNav?: boolean;
-    isStory?: boolean;
-    storyTitle?: string;
-    storyMdLoader?: () => Promise<string>;
+    hasStoryNav?: boolean
+    isStory?: boolean
+    storyTitle?: string
+    storyMdLoader?: () => Promise<string>
   }
 }
-export {};
+export {}
diff --git a/@xen-orchestra/lite/src/types/sort.ts b/@xen-orchestra/lite/src/types/sort.ts
index ab3b29b616e..abf4180deac 100644
--- a/@xen-orchestra/lite/src/types/sort.ts
+++ b/@xen-orchestra/lite/src/types/sort.ts
@@ -1,24 +1,24 @@
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+import type { IconDefinition } from '@fortawesome/fontawesome-common-types'
 
 interface Sort {
-  label?: string;
-  icon?: IconDefinition;
+  label?: string
+  icon?: IconDefinition
 }
 
 export interface Sorts {
-  [key: string]: Sort;
+  [key: string]: Sort
 }
 
-export type ActiveSorts<T> = Map<keyof T, boolean>;
+export type ActiveSorts<T> = Map<keyof T, boolean>
 
-export type InitialSorts<T> = `${"-" | ""}${Extract<keyof T, string>}`[];
+export type InitialSorts<T> = `${'-' | ''}${Extract<keyof T, string>}`[]
 
 export interface SortConfig<T> {
-  queryStringParam?: string;
-  initialSorts?: InitialSorts<T>;
+  queryStringParam?: string
+  initialSorts?: InitialSorts<T>
 }
 
 export type NewSort = {
-  property: string;
-  isAscending: boolean;
-};
+  property: string
+  isAscending: boolean
+}
diff --git a/@xen-orchestra/lite/src/types/stat.ts b/@xen-orchestra/lite/src/types/stat.ts
index ff6ea4fd927..15570292fac 100644
--- a/@xen-orchestra/lite/src/types/stat.ts
+++ b/@xen-orchestra/lite/src/types/stat.ts
@@ -1,7 +1,7 @@
 export interface StatData {
-  id: string;
-  value: number;
-  label?: string;
-  badgeLabel?: string;
-  maxValue?: number;
+  id: string
+  value: number
+  label?: string
+  badgeLabel?: string
+  maxValue?: number
 }
diff --git a/@xen-orchestra/lite/src/types/stories.d.ts b/@xen-orchestra/lite/src/types/stories.d.ts
index 06e78ca2877..569f7af4d1b 100644
--- a/@xen-orchestra/lite/src/types/stories.d.ts
+++ b/@xen-orchestra/lite/src/types/stories.d.ts
@@ -1,5 +1,5 @@
-declare module "virtual:stories" {
-  import type { RouteRecordRaw } from "vue-router";
-  const routes: RouteRecordRaw[];
-  export default routes;
+declare module 'virtual:stories' {
+  import type { RouteRecordRaw } from 'vue-router'
+  const routes: RouteRecordRaw[]
+  export default routes
 }
diff --git a/@xen-orchestra/lite/src/types/xen-api.ts b/@xen-orchestra/lite/src/types/xen-api.ts
index f25ad24499f..eb72d2b0000 100644
--- a/@xen-orchestra/lite/src/types/xen-api.ts
+++ b/@xen-orchestra/lite/src/types/xen-api.ts
@@ -1,42 +1,38 @@
-import type {
-  RawObjectType,
-  XenApiMessage,
-} from "@/libs/xen-api/xen-api.types";
+import type { RawObjectType, XenApiMessage } from '@/libs/xen-api/xen-api.types'
 
 export type XenApiAlarmType =
-  | "cpu_usage"
-  | "network_usage"
-  | "disk_usage"
-  | "fs_usage"
-  | "log_fs_usage"
-  | "mem_usage"
-  | "physical_utilisation"
-  | "sr_io_throughput_total_per_host"
-  | "memory_free_kib"
-  | "unknown";
+  | 'cpu_usage'
+  | 'network_usage'
+  | 'disk_usage'
+  | 'fs_usage'
+  | 'log_fs_usage'
+  | 'mem_usage'
+  | 'physical_utilisation'
+  | 'sr_io_throughput_total_per_host'
+  | 'memory_free_kib'
+  | 'unknown'
 
-export interface XenApiAlarm<RelationType extends RawObjectType>
-  extends XenApiMessage<RelationType> {
-  level: number;
-  triggerLevel: number;
-  type: XenApiAlarmType;
+export interface XenApiAlarm<RelationType extends RawObjectType> extends XenApiMessage<RelationType> {
+  level: number
+  triggerLevel: number
+  type: XenApiAlarmType
 }
 
 export type XenApiPatch = {
-  $id: string;
-  name: string;
-  description: string;
-  license: string;
-  release: string;
-  size: number;
-  url: string;
-  version: string;
+  $id: string
+  name: string
+  description: string
+  license: string
+  release: string
+  size: number
+  url: string
+  version: string
   changelog:
     | null
     | undefined
     | {
-        date: number;
-        description: string;
-        author: string;
-      };
-};
+        date: number
+        description: string
+        author: string
+      }
+}
diff --git a/@xen-orchestra/lite/src/views/HomeView.vue b/@xen-orchestra/lite/src/views/HomeView.vue
index 97555e08f64..c97a1410eef 100644
--- a/@xen-orchestra/lite/src/views/HomeView.vue
+++ b/@xen-orchestra/lite/src/views/HomeView.vue
@@ -1,21 +1,21 @@
 <template>Chargement en cours...</template>
 
 <script lang="ts" setup>
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
-import { whenever } from "@vueuse/core";
-import { useRouter } from "vue-router";
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
+import { whenever } from '@vueuse/core'
+import { useRouter } from 'vue-router'
 
-const router = useRouter();
+const router = useRouter()
 
-const { pool } = usePoolCollection();
+const { pool } = usePoolCollection()
 
 whenever(
   () => pool.value?.uuid,
-  (poolUuid) =>
+  poolUuid =>
     router.push({
-      name: "pool.dashboard",
+      name: 'pool.dashboard',
       params: { uuid: poolUuid },
     }),
   { immediate: true }
-);
+)
 </script>
diff --git a/@xen-orchestra/lite/src/views/ObjectNotFoundView.vue b/@xen-orchestra/lite/src/views/ObjectNotFoundView.vue
index a109ffda353..8246642d618 100644
--- a/@xen-orchestra/lite/src/views/ObjectNotFoundView.vue
+++ b/@xen-orchestra/lite/src/views/ObjectNotFoundView.vue
@@ -1,26 +1,24 @@
 <template>
   <div>
     <img alt="Not found" src="../assets/object-not-found.svg" />
-    <p class="text">{{ $t("object-not-found", { id }) }}</p>
-    <UiButton @click="router.push({ name: 'home' })">{{
-      $t("back-pool-dashboard")
-    }}</UiButton>
+    <p class="text">{{ $t('object-not-found', { id }) }}</p>
+    <UiButton @click="router.push({ name: 'home' })">{{ $t('back-pool-dashboard') }}</UiButton>
   </div>
 </template>
 
 <script setup lang="ts">
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
-import { useRouter } from "vue-router";
-import UiButton from "@/components/ui/UiButton.vue";
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
+import UiButton from '@/components/ui/UiButton.vue'
 
 defineProps<{
-  id: string;
-}>();
+  id: string
+}>()
 
-usePageTitleStore().setTitle(useI18n().t("not-found"));
+usePageTitleStore().setTitle(useI18n().t('not-found'))
 
-const router = useRouter();
+const router = useRouter()
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/views/PageNotFoundView.vue b/@xen-orchestra/lite/src/views/PageNotFoundView.vue
index ba570b7925a..807961d7259 100644
--- a/@xen-orchestra/lite/src/views/PageNotFoundView.vue
+++ b/@xen-orchestra/lite/src/views/PageNotFoundView.vue
@@ -2,21 +2,19 @@
   <div>
     <img alt="Not found" src="../assets/page-not-found.svg" />
     <p class="numeric">404</p>
-    <p class="text">{{ $t("page-not-found") }}</p>
-    <UiButton @click="router.push({ name: 'home' })">{{
-      $t("back-pool-dashboard")
-    }}</UiButton>
+    <p class="text">{{ $t('page-not-found') }}</p>
+    <UiButton @click="router.push({ name: 'home' })">{{ $t('back-pool-dashboard') }}</UiButton>
   </div>
 </template>
 
 <script setup lang="ts">
-import UiButton from "@/components/ui/UiButton.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
-import { useRouter } from "vue-router";
+import UiButton from '@/components/ui/UiButton.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
+import { useRouter } from 'vue-router'
 
-const router = useRouter();
-usePageTitleStore().setTitle(useI18n().t("not-found"));
+const router = useRouter()
+usePageTitleStore().setTitle(useI18n().t('not-found'))
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/views/StoryView.vue b/@xen-orchestra/lite/src/views/StoryView.vue
index 87e286c2503..83fbb9d333b 100644
--- a/@xen-orchestra/lite/src/views/StoryView.vue
+++ b/@xen-orchestra/lite/src/views/StoryView.vue
@@ -6,23 +6,23 @@
 </template>
 
 <script lang="ts" setup>
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { computed } from "vue";
-import { useRouter } from "vue-router";
-import { faBook } from "@fortawesome/free-solid-svg-icons";
-import TitleBar from "@/components/TitleBar.vue";
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { computed } from 'vue'
+import { useRouter } from 'vue-router'
+import { faBook } from '@fortawesome/free-solid-svg-icons'
+import TitleBar from '@/components/TitleBar.vue'
 
-const { currentRoute } = useRouter();
+const { currentRoute } = useRouter()
 
 const title = computed(() => {
   if (!currentRoute.value.meta.isStory) {
-    return "Components Stories";
+    return 'Components Stories'
   }
 
-  return `${currentRoute.value.meta.storyTitle} Story`;
-});
+  return `${currentRoute.value.meta.storyTitle} Story`
+})
 
-usePageTitleStore().setTitle(title);
+usePageTitleStore().setTitle(title)
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/views/host/HostDashboardView.vue b/@xen-orchestra/lite/src/views/host/HostDashboardView.vue
index 1c4e6b75ab4..9617c404933 100644
--- a/@xen-orchestra/lite/src/views/host/HostDashboardView.vue
+++ b/@xen-orchestra/lite/src/views/host/HostDashboardView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("dashboard"));
+usePageTitleStore().setTitle(useI18n().t('dashboard'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/host/HostRootView.vue b/@xen-orchestra/lite/src/views/host/HostRootView.vue
index 53ab265df9a..62b9860857c 100644
--- a/@xen-orchestra/lite/src/views/host/HostRootView.vue
+++ b/@xen-orchestra/lite/src/views/host/HostRootView.vue
@@ -5,25 +5,23 @@
 </template>
 
 <script lang="ts" setup>
-import ObjectNotFoundWrapper from "@/components/ObjectNotFoundWrapper.vue";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import type { XenApiHost } from "@/libs/xen-api/xen-api.types";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useUiStore } from "@/stores/ui.store";
-import { computed, watchEffect } from "vue";
-import { useRoute } from "vue-router";
+import ObjectNotFoundWrapper from '@/components/ObjectNotFoundWrapper.vue'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import type { XenApiHost } from '@/libs/xen-api/xen-api.types'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useUiStore } from '@/stores/ui.store'
+import { computed, watchEffect } from 'vue'
+import { useRoute } from 'vue-router'
 
-const { hasUuid, isReady, getByUuid } = useHostCollection();
-const route = useRoute();
-const uiStore = useUiStore();
+const { hasUuid, isReady, getByUuid } = useHostCollection()
+const route = useRoute()
+const uiStore = useUiStore()
 
-const currentHost = computed(() =>
-  getByUuid(route.params.uuid as XenApiHost["uuid"])
-);
+const currentHost = computed(() => getByUuid(route.params.uuid as XenApiHost['uuid']))
 
 watchEffect(() => {
-  uiStore.currentHostOpaqueRef = currentHost.value?.$ref;
-});
+  uiStore.currentHostOpaqueRef = currentHost.value?.$ref
+})
 
-usePageTitleStore().setObject(currentHost);
+usePageTitleStore().setObject(currentHost)
 </script>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolAlarmsView.vue b/@xen-orchestra/lite/src/views/pool/PoolAlarmsView.vue
index 5300c397e24..fda3d54ec55 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolAlarmsView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolAlarmsView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("alarms"));
+usePageTitleStore().setTitle(useI18n().t('alarms'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolDashboardView.vue b/@xen-orchestra/lite/src/views/pool/PoolDashboardView.vue
index b2940c03aa4..136c03392c0 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolDashboardView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolDashboardView.vue
@@ -26,92 +26,85 @@
   </div>
 </template>
 
-<script lang="ts">
-export const N_ITEMS = 5;
-</script>
-
 <script lang="ts" setup>
-import PoolDashboardAlarms from "@/components/pool/dashboard/PoolDashboardAlarms.vue";
-import PoolDashboardTasks from "@/components/pool/dashboard/PoolDashboardTasks.vue";
-import PoolCpuUsageChart from "@/components/pool/dashboard/cpuUsage/PoolCpuUsageChart.vue";
-import PoolDashboardCpuProvisioning from "@/components/pool/dashboard/PoolDashboardCpuProvisioning.vue";
-import PoolDashboardCpuUsage from "@/components/pool/dashboard/PoolDashboardCpuUsage.vue";
-import PoolDashboardHostsPatches from "@/components/pool/dashboard/PoolDashboardHostsPatches.vue";
-import PoolDashboardNetworkChart from "@/components/pool/dashboard/PoolDashboardNetworkChart.vue";
-import PoolDashboardRamUsage from "@/components/pool/dashboard/PoolDashboardRamUsage.vue";
-import PoolDashboardStatus from "@/components/pool/dashboard/PoolDashboardStatus.vue";
-import PoolDashboardStorageUsage from "@/components/pool/dashboard/PoolDashboardStorageUsage.vue";
-import PoolDashboardRamUsageChart from "@/components/pool/dashboard/ramUsage/PoolRamUsage.vue";
-import UiCardGroup from "@/components/ui/UiCardGroup.vue";
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import useFetchStats from "@/composables/fetch-stats.composable";
-import { GRANULARITY } from "@/libs/xapi-stats";
-import type { XenApiHost, XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import {
-  IK_HOST_LAST_WEEK_STATS,
-  IK_HOST_STATS,
-  IK_VM_STATS,
-} from "@/types/injection-keys";
-import { differenceBy } from "lodash-es";
-import { provide, watch } from "vue";
-import { useI18n } from "vue-i18n";
-
-usePageTitleStore().setTitle(useI18n().t("dashboard"));
-
-const { getStats: getHostStats, runningHosts } = useHostCollection();
-const { getStats: getVmStats, runningVms } = useVmCollection();
+import PoolDashboardAlarms from '@/components/pool/dashboard/PoolDashboardAlarms.vue'
+import PoolDashboardTasks from '@/components/pool/dashboard/PoolDashboardTasks.vue'
+import PoolCpuUsageChart from '@/components/pool/dashboard/cpuUsage/PoolCpuUsageChart.vue'
+import PoolDashboardCpuProvisioning from '@/components/pool/dashboard/PoolDashboardCpuProvisioning.vue'
+import PoolDashboardCpuUsage from '@/components/pool/dashboard/PoolDashboardCpuUsage.vue'
+import PoolDashboardHostsPatches from '@/components/pool/dashboard/PoolDashboardHostsPatches.vue'
+import PoolDashboardNetworkChart from '@/components/pool/dashboard/PoolDashboardNetworkChart.vue'
+import PoolDashboardRamUsage from '@/components/pool/dashboard/PoolDashboardRamUsage.vue'
+import PoolDashboardStatus from '@/components/pool/dashboard/PoolDashboardStatus.vue'
+import PoolDashboardStorageUsage from '@/components/pool/dashboard/PoolDashboardStorageUsage.vue'
+import PoolDashboardRamUsageChart from '@/components/pool/dashboard/ramUsage/PoolRamUsage.vue'
+import UiCardGroup from '@/components/ui/UiCardGroup.vue'
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import useFetchStats from '@/composables/fetch-stats.composable'
+import { GRANULARITY } from '@/libs/xapi-stats'
+import type { XenApiHost, XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { IK_HOST_LAST_WEEK_STATS, IK_HOST_STATS, IK_VM_STATS } from '@/types/injection-keys'
+import { differenceBy } from 'lodash-es'
+import { provide, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+
+usePageTitleStore().setTitle(useI18n().t('dashboard'))
+
+const { getStats: getHostStats, runningHosts } = useHostCollection()
+const { getStats: getVmStats, runningVms } = useVmCollection()
 
 const {
   register: hostRegister,
   unregister: hostUnregister,
   stats: hostStats,
-} = useFetchStats<XenApiHost>(getHostStats, GRANULARITY.Seconds);
+} = useFetchStats<XenApiHost>(getHostStats, GRANULARITY.Seconds)
 
 const {
   register: vmRegister,
   unregister: vmUnregister,
   stats: vmStats,
-} = useFetchStats<XenApiVm>(getVmStats, GRANULARITY.Seconds);
+} = useFetchStats<XenApiVm>(getVmStats, GRANULARITY.Seconds)
 
-const hostLastWeekStats = useFetchStats<XenApiHost>(
-  getHostStats,
-  GRANULARITY.Hours
-);
+const hostLastWeekStats = useFetchStats<XenApiHost>(getHostStats, GRANULARITY.Hours)
 
-provide(IK_HOST_STATS, hostStats);
-provide(IK_VM_STATS, vmStats);
-provide(IK_HOST_LAST_WEEK_STATS, hostLastWeekStats);
+provide(IK_HOST_STATS, hostStats)
+provide(IK_VM_STATS, vmStats)
+provide(IK_HOST_LAST_WEEK_STATS, hostLastWeekStats)
 
 watch(runningHosts, (hosts, previousHosts) => {
   // turned On
-  differenceBy(hosts, previousHosts ?? [], "uuid").forEach((host) => {
-    hostRegister(host);
-    hostLastWeekStats.register(host);
-  });
+  differenceBy(hosts, previousHosts ?? [], 'uuid').forEach(host => {
+    hostRegister(host)
+    hostLastWeekStats.register(host)
+  })
 
   // turned Off
-  differenceBy(previousHosts, hosts, "uuid").forEach((host) => {
-    hostUnregister(host);
-    hostLastWeekStats.unregister(host);
-  });
-});
+  differenceBy(previousHosts, hosts, 'uuid').forEach(host => {
+    hostUnregister(host)
+    hostLastWeekStats.unregister(host)
+  })
+})
 
 watch(runningVms, (vms, previousVms) => {
   // turned On
-  differenceBy(vms, previousVms ?? [], "uuid").forEach((vm) => vmRegister(vm));
+  differenceBy(vms, previousVms ?? [], 'uuid').forEach(vm => vmRegister(vm))
 
   // turned Off
-  differenceBy(previousVms, vms, "uuid").forEach((vm) => vmUnregister(vm));
-});
+  differenceBy(previousVms, vms, 'uuid').forEach(vm => vmUnregister(vm))
+})
 
-runningHosts.value.forEach((host) => {
-  hostRegister(host);
-  hostLastWeekStats.register(host);
-});
+runningHosts.value.forEach(host => {
+  hostRegister(host)
+  hostLastWeekStats.register(host)
+})
 
-runningVms.value.forEach((vm) => vmRegister(vm));
+runningVms.value.forEach(vm => vmRegister(vm))
+</script>
+
+<script lang="ts">
+export const N_ITEMS = 5
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolHostsView.vue b/@xen-orchestra/lite/src/views/pool/PoolHostsView.vue
index 947bede106e..216bc0de7b7 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolHostsView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolHostsView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("hosts"));
+usePageTitleStore().setTitle(useI18n().t('hosts'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolNetworkView.vue b/@xen-orchestra/lite/src/views/pool/PoolNetworkView.vue
index 888dcb081d1..4a52297b68a 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolNetworkView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolNetworkView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("network"));
+usePageTitleStore().setTitle(useI18n().t('network'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolRootView.vue b/@xen-orchestra/lite/src/views/pool/PoolRootView.vue
index 6169c4e4b5d..47a5e47a10c 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolRootView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolRootView.vue
@@ -8,14 +8,14 @@
 </template>
 
 <script lang="ts" setup>
-import PoolHeader from "@/components/pool/PoolHeader.vue";
-import PoolTabBar from "@/components/pool/PoolTabBar.vue";
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
-import { usePageTitleStore } from "@/stores/page-title.store";
+import PoolHeader from '@/components/pool/PoolHeader.vue'
+import PoolTabBar from '@/components/pool/PoolTabBar.vue'
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
+import { usePageTitleStore } from '@/stores/page-title.store'
 
-const { pool } = usePoolCollection();
+const { pool } = usePoolCollection()
 
-usePageTitleStore().setObject(pool);
+usePageTitleStore().setObject(pool)
 </script>
 
 <style lang="postcss" scoped></style>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolStatsView.vue b/@xen-orchestra/lite/src/views/pool/PoolStatsView.vue
index 3f0fc3be7da..1ac842fa2b0 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolStatsView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolStatsView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("stats"));
+usePageTitleStore().setTitle(useI18n().t('stats'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolStorageView.vue b/@xen-orchestra/lite/src/views/pool/PoolStorageView.vue
index 52fcc877b50..043bc3d21e5 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolStorageView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolStorageView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("storage"));
+usePageTitleStore().setTitle(useI18n().t('storage'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolSystemView.vue b/@xen-orchestra/lite/src/views/pool/PoolSystemView.vue
index 2405b8e1bef..e57718e175d 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolSystemView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolSystemView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("system"));
+usePageTitleStore().setTitle(useI18n().t('system'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolTasksView.vue b/@xen-orchestra/lite/src/views/pool/PoolTasksView.vue
index 668fa0a36d0..77169e0deea 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolTasksView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolTasksView.vue
@@ -1,7 +1,7 @@
 <template>
   <UiCard :color="hasError ? 'error' : undefined">
     <UiTitle class="title-with-counter" type="h4">
-      {{ $t("tasks") }}
+      {{ $t('tasks') }}
       <UiCounter :value="pendingTasks.length" color="info" />
     </UiTitle>
     <TasksTable :finished-tasks="finishedTasks" :pending-tasks="pendingTasks" />
@@ -10,22 +10,22 @@
 </template>
 
 <script lang="ts" setup>
-import TasksTable from "@/components/tasks/TasksTable.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardSpinner from "@/components/ui/UiCardSpinner.vue";
-import UiCounter from "@/components/ui/UiCounter.vue";
-import UiTitle from "@/components/ui/UiTitle.vue";
-import { useTaskCollection } from "@/stores/xen-api/task.store";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import TasksTable from '@/components/tasks/TasksTable.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
+import UiCounter from '@/components/ui/UiCounter.vue'
+import UiTitle from '@/components/ui/UiTitle.vue'
+import { useTaskCollection } from '@/stores/xen-api/task.store'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-const { pendingTasks, finishedTasks, isReady, hasError } = useTaskCollection();
+const { pendingTasks, finishedTasks, isReady, hasError } = useTaskCollection()
 
-const { t } = useI18n();
+const { t } = useI18n()
 
-const titleStore = usePageTitleStore();
-titleStore.setTitle(t("tasks"));
-titleStore.setCount(() => pendingTasks.value.length);
+const titleStore = usePageTitleStore()
+titleStore.setTitle(t('tasks'))
+titleStore.setCount(() => pendingTasks.value.length)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/views/pool/PoolVmsView.vue b/@xen-orchestra/lite/src/views/pool/PoolVmsView.vue
index aa366154456..e081905f699 100644
--- a/@xen-orchestra/lite/src/views/pool/PoolVmsView.vue
+++ b/@xen-orchestra/lite/src/views/pool/PoolVmsView.vue
@@ -15,8 +15,8 @@
     >
       <template #head-row>
         <ColumnHeader :icon="faPowerOff" />
-        <ColumnHeader>{{ $t("name") }}</ColumnHeader>
-        <ColumnHeader>{{ $t("description") }}</ColumnHeader>
+        <ColumnHeader>{{ $t('name') }}</ColumnHeader>
+        <ColumnHeader>{{ $t('description') }}</ColumnHeader>
       </template>
       <template #body-row="{ item: vm }">
         <td>
@@ -24,10 +24,7 @@
         </td>
         <td>
           <div class="vm-name">
-            <UiSpinner
-              v-if="isMigrating(vm)"
-              v-tooltip="'This VM is being migrated'"
-            />
+            <UiSpinner v-if="isMigrating(vm)" v-tooltip="'This VM is being migrated'" />
             {{ vm.name_label }}
           </div>
         </td>
@@ -38,50 +35,49 @@
 </template>
 
 <script lang="ts" setup>
-import CollectionTable from "@/components/CollectionTable.vue";
-import ColumnHeader from "@/components/ColumnHeader.vue";
-import PowerStateIcon from "@/components/PowerStateIcon.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UiSpinner from "@/components/ui/UiSpinner.vue";
-import VmsActionsBar from "@/components/vm/VmsActionsBar.vue";
-import { vTooltip } from "@/directives/tooltip.directive";
-import { VM_OPERATION, VM_POWER_STATE } from "@/libs/xen-api/xen-api.enums";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useUiStore } from "@/stores/ui.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import type { Filters } from "@/types/filter";
-import { faPowerOff } from "@fortawesome/free-solid-svg-icons";
-import { storeToRefs } from "pinia";
-import { ref } from "vue";
-import { useI18n } from "vue-i18n";
+import CollectionTable from '@/components/CollectionTable.vue'
+import ColumnHeader from '@/components/ColumnHeader.vue'
+import PowerStateIcon from '@/components/PowerStateIcon.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UiSpinner from '@/components/ui/UiSpinner.vue'
+import VmsActionsBar from '@/components/vm/VmsActionsBar.vue'
+import { vTooltip } from '@/directives/tooltip.directive'
+import { VM_OPERATION, VM_POWER_STATE } from '@/libs/xen-api/xen-api.enums'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useUiStore } from '@/stores/ui.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import type { Filters } from '@/types/filter'
+import { faPowerOff } from '@fortawesome/free-solid-svg-icons'
+import { storeToRefs } from 'pinia'
+import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
 
-const { t } = useI18n();
+const { t } = useI18n()
 
-const titleStore = usePageTitleStore();
-titleStore.setTitle(t("vms"));
+const titleStore = usePageTitleStore()
+titleStore.setTitle(t('vms'))
 
-const { records: vms, isOperationPending } = useVmCollection();
-const { isMobile, isDesktop } = storeToRefs(useUiStore());
+const { records: vms, isOperationPending } = useVmCollection()
+const { isMobile, isDesktop } = storeToRefs(useUiStore())
 
 const filters: Filters = {
-  name_label: { label: t("name"), type: "string" },
-  name_description: { label: t("description"), type: "string" },
+  name_label: { label: t('name'), type: 'string' },
+  name_description: { label: t('description'), type: 'string' },
   power_state: {
-    label: t("power-state"),
+    label: t('power-state'),
     icon: faPowerOff,
-    type: "enum",
+    type: 'enum',
     choices: Object.values(VM_POWER_STATE),
   },
-};
+}
 
-const selectedVmsRefs = ref([]);
+const selectedVmsRefs = ref([])
 
-titleStore.setCount(() => selectedVmsRefs.value.length);
+titleStore.setCount(() => selectedVmsRefs.value.length)
 
-const isMigrating = (vm: XenApiVm) =>
-  isOperationPending(vm, VM_OPERATION.POOL_MIGRATE);
+const isMigrating = (vm: XenApiVm) => isOperationPending(vm, VM_OPERATION.POOL_MIGRATE)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/views/settings/SettingsView.vue b/@xen-orchestra/lite/src/views/settings/SettingsView.vue
index a2d4b32997f..004185a5d45 100644
--- a/@xen-orchestra/lite/src/views/settings/SettingsView.vue
+++ b/@xen-orchestra/lite/src/views/settings/SettingsView.vue
@@ -1,42 +1,32 @@
 <template>
-  <TitleBar :icon="faGear">{{ $t("settings") }}</TitleBar>
+  <TitleBar :icon="faGear">{{ $t('settings') }}</TitleBar>
   <div class="card-view">
     <UiCard class="group about">
-      <UiCardTitle>{{ $t("about") }}</UiCardTitle>
+      <UiCardTitle>{{ $t('about') }}</UiCardTitle>
       <div class="sections">
         <div>
           <h5>Xen Orchestra Lite</h5>
           <UiKeyValueList>
             <UiKeyValueRow>
-              <template #key>{{ $t("version") }}</template>
+              <template #key>{{ $t('version') }}</template>
               <template #value>
                 v{{ xoLiteVersion }}
-                <code v-if="xoLiteGitHead">
-                  ({{ xoLiteGitHead.slice(0, 5) }})
-                </code>
+                <code v-if="xoLiteGitHead"> ({{ xoLiteGitHead.slice(0, 5) }}) </code>
               </template>
             </UiKeyValueRow>
             <UiKeyValueRow>
-              <template #key>{{ $t("news") }}</template>
+              <template #key>{{ $t('news') }}</template>
               <template #value>
-                <a
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  href="https://xen-orchestra.com/blog/"
-                >
-                  {{ $t("news-name", { name: "Xen Orchestra" }) }}
+                <a target="_blank" rel="noopener noreferrer" href="https://xen-orchestra.com/blog/">
+                  {{ $t('news-name', { name: 'Xen Orchestra' }) }}
                 </a>
               </template>
             </UiKeyValueRow>
             <UiKeyValueRow>
-              <template #key>{{ $t("community") }}</template>
+              <template #key>{{ $t('community') }}</template>
               <template #value>
-                <a
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  href="https://xcp-ng.org/forum/category/12/xen-orchestra"
-                >
-                  {{ $t("community-name", { name: "Xen Orchestra" }) }}
+                <a target="_blank" rel="noopener noreferrer" href="https://xcp-ng.org/forum/category/12/xen-orchestra">
+                  {{ $t('community-name', { name: 'Xen Orchestra' }) }}
                 </a>
               </template>
             </UiKeyValueRow>
@@ -46,54 +36,38 @@
           <h5>XCP-ng</h5>
           <UiKeyValueList>
             <UiKeyValueRow>
-              <template #key>{{ $t("version") }}</template>
+              <template #key>{{ $t('version') }}</template>
               <template #value>v{{ xcpVersion }}</template>
             </UiKeyValueRow>
             <UiKeyValueRow>
-              <template #key>{{ $t("news") }}</template>
+              <template #key>{{ $t('news') }}</template>
               <template #value>
-                <a
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  href="https://xcp-ng.org/blog/"
-                >
-                  {{ $t("news-name", { name: "XCP-ng" }) }}
+                <a target="_blank" rel="noopener noreferrer" href="https://xcp-ng.org/blog/">
+                  {{ $t('news-name', { name: 'XCP-ng' }) }}
                 </a>
               </template>
             </UiKeyValueRow>
             <UiKeyValueRow>
-              <template #key>{{ $t("community") }}</template>
+              <template #key>{{ $t('community') }}</template>
               <template #value>
-                <a
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  href="https://xcp-ng.org/forum"
-                >
-                  {{ $t("community-name", { name: "XCP-ng" }) }}
+                <a target="_blank" rel="noopener noreferrer" href="https://xcp-ng.org/forum">
+                  {{ $t('community-name', { name: 'XCP-ng' }) }}
                 </a>
               </template>
             </UiKeyValueRow>
             <UiKeyValueRow>
-              <template #key>{{ $t("documentation") }}</template>
+              <template #key>{{ $t('documentation') }}</template>
               <template #value>
-                <a
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  href="https://xcp-ng.org/docs/"
-                >
-                  {{ $t("documentation-name", { name: "XCP-ng" }) }}
+                <a target="_blank" rel="noopener noreferrer" href="https://xcp-ng.org/docs/">
+                  {{ $t('documentation-name', { name: 'XCP-ng' }) }}
                 </a>
               </template>
             </UiKeyValueRow>
             <UiKeyValueRow>
-              <template #key>{{ $t("support") }}</template>
+              <template #key>{{ $t('support') }}</template>
               <template #value>
-                <a
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  href="https://xcp-ng.com/"
-                >
-                  {{ $t("support-name", { name: "XCP-ng" }) }}
+                <a target="_blank" rel="noopener noreferrer" href="https://xcp-ng.com/">
+                  {{ $t('support-name', { name: 'XCP-ng' }) }}
                 </a>
               </template>
             </UiKeyValueRow>
@@ -102,7 +76,7 @@
       </div>
     </UiCard>
     <UiCard class="group appearance">
-      <UiCardTitle>{{ $t("appearance") }}</UiCardTitle>
+      <UiCardTitle>{{ $t('appearance') }}</UiCardTitle>
       <div class="options">
         <div
           v-for="colorModeOption in colorModeOptions"
@@ -111,21 +85,9 @@
           :class="{ selected: colorMode === colorModeOption }"
           @click="colorMode = colorModeOption"
         >
-          <img
-            v-if="colorModeOption === 'light'"
-            src="@/assets/color-mode-light.svg"
-            alt="Color mode light"
-          />
-          <img
-            v-else-if="colorModeOption === 'dark'"
-            src="@/assets/color-mode-dark.svg"
-            alt="Color mode dark"
-          />
-          <img
-            v-else
-            src="@/assets/color-mode-auto.svg"
-            alt="Color mode auto"
-          />
+          <img v-if="colorModeOption === 'light'" src="@/assets/color-mode-light.svg" alt="Color mode light" />
+          <img v-else-if="colorModeOption === 'dark'" src="@/assets/color-mode-dark.svg" alt="Color mode dark" />
+          <img v-else src="@/assets/color-mode-auto.svg" alt="Color mode auto" />
           <span>
             <UiIcon v-if="colorMode === colorModeOption" :icon="faCheck" />
             {{ $t(`theme-${colorModeOption}`) }}
@@ -134,14 +96,10 @@
       </div>
     </UiCard>
     <UiCard class="group">
-      <UiCardTitle>{{ $t("language") }}</UiCardTitle>
-      <FormSelect :before="faEarthAmericas" v-model="$i18n.locale">
-        <option
-          :value="locale"
-          v-for="locale in $i18n.availableLocales"
-          :key="locale"
-        >
-          {{ locales[locale].name ?? locale }}
+      <UiCardTitle>{{ $t('language') }}</UiCardTitle>
+      <FormSelect v-model="$i18n.locale" :before="faEarthAmericas">
+        <option v-for="availableLocale in $i18n.availableLocales" :key="availableLocale" :value="availableLocale">
+          {{ locales[availableLocale].name ?? availableLocale }}
         </option>
       </FormSelect>
     </UiCard>
@@ -149,54 +107,45 @@
 </template>
 
 <script lang="ts" setup>
-import { useHostCollection } from "@/stores/xen-api/host.store";
-import { usePoolCollection } from "@/stores/xen-api/pool.store";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { computed } from "vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import type { BasicColorSchema } from "@vueuse/core";
-import { useUiStore } from "@/stores/ui.store";
-import { storeToRefs } from "pinia";
-import { watch } from "vue";
-import { useI18n } from "vue-i18n";
-import { locales } from "@/i18n";
-import {
-  faEarthAmericas,
-  faGear,
-  faCheck,
-} from "@fortawesome/free-solid-svg-icons";
-import FormSelect from "@/components/form/FormSelect.vue";
-import TitleBar from "@/components/TitleBar.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiKeyValueList from "@/components/ui/UiKeyValueList.vue";
-import UiKeyValueRow from "@/components/ui/UiKeyValueRow.vue";
+import { useHostCollection } from '@/stores/xen-api/host.store'
+import { usePoolCollection } from '@/stores/xen-api/pool.store'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { computed, watch } from 'vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import type { BasicColorSchema } from '@vueuse/core'
+import { useUiStore } from '@/stores/ui.store'
+import { storeToRefs } from 'pinia'
+import { useI18n } from 'vue-i18n'
+import { locales } from '@/i18n'
+import { faEarthAmericas, faGear, faCheck } from '@fortawesome/free-solid-svg-icons'
+import FormSelect from '@/components/form/FormSelect.vue'
+import TitleBar from '@/components/TitleBar.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiKeyValueList from '@/components/ui/UiKeyValueList.vue'
+import UiKeyValueRow from '@/components/ui/UiKeyValueRow.vue'
 
-const xoLiteVersion = XO_LITE_VERSION;
-const xoLiteGitHead = XO_LITE_GIT_HEAD;
-const { t, locale } = useI18n();
+const xoLiteVersion = XO_LITE_VERSION
+const xoLiteGitHead = XO_LITE_GIT_HEAD
+const { t, locale } = useI18n()
 
-usePageTitleStore().setTitle(() => t("settings"));
+usePageTitleStore().setTitle(() => t('settings'))
 
-const { pool } = usePoolCollection();
+const { pool } = usePoolCollection()
 
-const { getByOpaqueRef: getHost } = useHostCollection();
+const { getByOpaqueRef: getHost } = useHostCollection()
 
-const poolMaster = computed(() =>
-  pool.value ? getHost(pool.value.master) : undefined
-);
-const xcpVersion = computed(
-  () => poolMaster.value?.software_version.product_version
-);
+const poolMaster = computed(() => (pool.value ? getHost(pool.value.master) : undefined))
+const xcpVersion = computed(() => poolMaster.value?.software_version.product_version)
 
-watch(locale, (newLocale) => localStorage.setItem("lang", newLocale));
+watch(locale, newLocale => localStorage.setItem('lang', newLocale))
 
-const colorModeOptions = ["light", "dark", "auto"] as BasicColorSchema[];
-const { colorMode } = storeToRefs(useUiStore());
+const colorModeOptions = ['light', 'dark', 'auto'] as BasicColorSchema[]
+const { colorMode } = storeToRefs(useUiStore())
 </script>
 
 <style lang="postcss" scoped>
-@import "@/assets/_responsive.pcss";
+@import '@/assets/_responsive.pcss';
 
 .card-view {
   flex-direction: column;
diff --git a/@xen-orchestra/lite/src/views/story/HomeView.vue b/@xen-orchestra/lite/src/views/story/HomeView.vue
index 65876de8884..b45a8206fd1 100644
--- a/@xen-orchestra/lite/src/views/story/HomeView.vue
+++ b/@xen-orchestra/lite/src/views/story/HomeView.vue
@@ -26,65 +26,53 @@
       {{ warning }}
     </p>
 
-    <CodeHighlight
-      class="code-highlight"
-      v-if="componentPath"
-      :code="template"
-    />
+    <CodeHighlight v-if="componentPath" class="code-highlight" :code="template" />
   </UiCard>
 </template>
 
 <script lang="ts" setup>
-import CodeHighlight from "@/components/CodeHighlight.vue";
-import FormInput from "@/components/form/FormInput.vue";
-import FormSelect from "@/components/form/FormSelect.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiCardTitle from "@/components/ui/UiCardTitle.vue";
-import { faWarning } from "@fortawesome/free-solid-svg-icons";
-import { castArray } from "lodash-es";
-import { type ComponentOptions, computed, ref, watch } from "vue";
-
-const componentPath = ref("");
-
-const components = import.meta.glob<{ default: ComponentOptions }>(
-  "/src/components/**/*.vue",
-  {
-    eager: true,
-  }
-);
+import CodeHighlight from '@/components/CodeHighlight.vue'
+import FormInput from '@/components/form/FormInput.vue'
+import FormSelect from '@/components/form/FormSelect.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiCardTitle from '@/components/ui/UiCardTitle.vue'
+import { faWarning } from '@fortawesome/free-solid-svg-icons'
+import { castArray } from 'lodash-es'
+import { type ComponentOptions, computed, ref, watch } from 'vue'
+
+const componentPath = ref('')
+
+const components = import.meta.glob<{ default: ComponentOptions }>('/src/components/**/*.vue', {
+  eager: true,
+})
 
 const componentsWithProps = Object.fromEntries(
-  Object.entries(components).filter(
-    ([, component]) => component.default.props || component.default.emits
-  )
-);
+  Object.entries(components).filter(([, component]) => component.default.props || component.default.emits)
+)
 
-const componentPaths = Object.keys(componentsWithProps);
+const componentPaths = Object.keys(componentsWithProps)
 
-const lines = ref<string[]>([]);
-const slots = ref("");
+const lines = ref<string[]>([])
+const slots = ref('')
 
-const quote = (str: string) => `'${str}'`;
-const camel = (str: string) =>
-  str.replace(/-([a-z])/g, (match, letter) => letter.toUpperCase());
-const paramsToImport = ref(new Set<string>());
-const widgetsToImport = ref(new Set<string>());
+const quote = (str: string) => `'${str}'`
+const camel = (str: string) => str.replace(/-([a-z])/g, (match, letter) => letter.toUpperCase())
+const paramsToImport = ref(new Set<string>())
+const widgetsToImport = ref(new Set<string>())
 
 const template = computed(() => {
-  const componentName = componentPath.value.replace(/.*\/([^/]+)\.vue$/, "$1");
-  const path = componentPath.value.replace(/^\/src/, "@");
-  const paramsLines = [...lines.value];
+  const componentName = componentPath.value.replace(/.*\/([^/]+)\.vue$/, '$1')
+  const path = componentPath.value.replace(/^\/src/, '@')
+  const paramsLines = [...lines.value]
   const slotsNames = slots.value
-    .split(",")
-    .map((s) => s.trim())
-    .filter((name) => name !== "");
+    .split(',')
+    .map(s => s.trim())
+    .filter(name => name !== '')
 
   for (const slotName of slotsNames) {
-    paramsLines.push(
-      `slot(${slotName === "default" ? "" : quote(camel(slotName))})`
-    );
+    paramsLines.push(`slot(${slotName === 'default' ? '' : quote(camel(slotName))})`)
   }
 
   for (const slotName of slotsNames) {
@@ -92,16 +80,16 @@ const template = computed(() => {
       `setting(${quote(
         `${camel(slotName)}SlotContent`
       )}).preset('Example content for ${slotName} slot').widget(text()).help('Content for ${slotName} slot')`
-    );
+    )
   }
 
   if (slotsNames.length > 0) {
-    paramsToImport.value.add("slot").add("setting");
-    widgetsToImport.value.add("text");
+    paramsToImport.value.add('slot').add('setting')
+    widgetsToImport.value.add('text')
   }
 
-  const paramsStr = paramsLines.join(",\n      ");
-  const scriptEndTag = "</" + "script>";
+  const paramsStr = paramsLines.join(',\n      ')
+  const scriptEndTag = '</' + 'script>'
   return `<template>
   <ComponentStory
     v-slot="{ properties, settings }"
@@ -112,14 +100,12 @@ const template = computed(() => {
     <${componentName} v-bind="properties"${
       slotsNames.length > 0
         ? `>\n      ${slotsNames
-            .map((name) =>
-              name === "default"
+            .map(name =>
+              name === 'default'
                 ? `{{ settings.${camel(name)}SlotContent }}`
-                : `<template #${name}>{{ settings.${camel(
-                    name
-                  )}SlotContent }}</template>`
+                : `<template #${name}>{{ settings.${camel(name)}SlotContent }}</template>`
             )
-            .join("\n      ")}
+            .join('\n      ')}
     </${componentName}>`
         : ` />`
     }
@@ -131,113 +117,100 @@ import ComponentStory from "@/components/component-story/ComponentStory.vue";
 import ${componentName} from "${path}";
 ${
   paramsToImport.value.size > 0
-    ? `import { ${Array.from(paramsToImport.value.values()).join(
-        ", "
-      )} } from "@/libs/story/story-param"`
-    : ""
+    ? `import { ${Array.from(paramsToImport.value.values()).join(', ')} } from "@/libs/story/story-param"`
+    : ''
 }
 ${
   widgetsToImport.value.size > 0
-    ? `import { ${Array.from(widgetsToImport.value.values()).join(
-        ", "
-      )} } from "@/libs/story/story-widget"`
-    : ""
+    ? `import { ${Array.from(widgetsToImport.value.values()).join(', ')} } from "@/libs/story/story-widget"`
+    : ''
 }
 ${scriptEndTag}
-`;
-});
+`
+})
 
-const warnings = ref(new Set<string>());
+const warnings = ref(new Set<string>())
 
-const extractTypeFromConstructor = (
-  ctor: null | (new () => unknown),
-  propName: string
-) => {
+const extractTypeFromConstructor = (ctor: null | (new () => unknown), propName: string) => {
   if (ctor == null) {
-    warnings.value.add(
-      `An unknown type has been detected for prop "${propName}"`
-    );
-    return "unknown";
+    warnings.value.add(`An unknown type has been detected for prop "${propName}"`)
+    return 'unknown'
   }
 
   if (ctor === Date) {
-    return "Date";
+    return 'Date'
   }
 
-  return ctor.name.toLocaleLowerCase();
-};
+  return ctor.name.toLocaleLowerCase()
+}
 
 watch(
   componentPath,
   (path: string) => {
     if (!(path in components)) {
-      return;
+      return
     }
-    const component = components[path].default;
+    const component = components[path].default
 
-    slots.value = "";
-    widgetsToImport.value = new Set();
-    paramsToImport.value = new Set();
-    warnings.value = new Set();
-    lines.value = [];
+    slots.value = ''
+    widgetsToImport.value = new Set()
+    paramsToImport.value = new Set()
+    warnings.value = new Set()
+    lines.value = []
 
     for (const propName in component.props) {
-      const current = [];
-      const prop = component.props[propName];
+      const current = []
+      const prop = component.props[propName]
 
       if (prop.required) {
-        current.push("required()");
+        current.push('required()')
       }
 
       if (prop.default) {
-        current.push(`default(${quote(prop.default)})`);
+        current.push(`default(${quote(prop.default)})`)
       }
 
       if (prop.type !== undefined) {
         const type = castArray(prop.type)
-          .map((ctor) => extractTypeFromConstructor(ctor, propName))
-          .join(" | ");
+          .map(ctor => extractTypeFromConstructor(ctor, propName))
+          .join(' | ')
 
-        if (type !== "unknown") {
-          current.push(`type(${quote(type)})`);
+        if (type !== 'unknown') {
+          current.push(`type(${quote(type)})`)
         }
       }
 
-      const isModel = component.emits?.includes(`update:${propName}`);
-      paramsToImport.value.add(isModel ? "model" : "prop");
+      const isModel = component.emits?.includes(`update:${propName}`)
+      paramsToImport.value.add(isModel ? 'model' : 'prop')
 
-      current.unshift(
-        `${isModel ? "model" : "prop"}(${
-          propName === "modelValue" ? "" : quote(propName)
-        })`
-      );
+      current.unshift(`${isModel ? 'model' : 'prop'}(${propName === 'modelValue' ? '' : quote(propName)})`)
 
       if (!isModel) {
-        current.push("widget()");
+        current.push('widget()')
       }
 
-      lines.value.push(current.join("."));
+      lines.value.push(current.join('.'))
     }
 
-    let shouldImportEvent = false;
+    let shouldImportEvent = false
 
     if (component.emits) {
       for (const eventName of component.emits) {
-        if (eventName.startsWith("update:")) {
-          continue;
+        if (eventName.startsWith('update:')) {
+          continue
         }
 
-        shouldImportEvent = true;
-        lines.value.push(`event(${quote(eventName)})`);
+        shouldImportEvent = true
+        lines.value.push(`event(${quote(eventName)})`)
       }
     }
 
     if (shouldImportEvent) {
-      paramsToImport.value.add("event");
+      paramsToImport.value.add('event')
     }
   },
   { immediate: true }
-);
+)
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/views/vm/VmAlarmsView.vue b/@xen-orchestra/lite/src/views/vm/VmAlarmsView.vue
index 5300c397e24..fda3d54ec55 100644
--- a/@xen-orchestra/lite/src/views/vm/VmAlarmsView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmAlarmsView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("alarms"));
+usePageTitleStore().setTitle(useI18n().t('alarms'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/vm/VmConsoleView.vue b/@xen-orchestra/lite/src/views/vm/VmConsoleView.vue
index 6c4210accb5..6a453940814 100644
--- a/@xen-orchestra/lite/src/views/vm/VmConsoleView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmConsoleView.vue
@@ -1,37 +1,21 @@
 <template>
   <div :class="{ 'no-ui': !uiStore.hasUi }" class="vm-console-view">
-    <div v-if="hasError">{{ $t("error-occurred") }}</div>
+    <div v-if="hasError">{{ $t('error-occurred') }}</div>
     <UiSpinner v-else-if="!isReady" class="spinner" />
-    <UiStatusPanel
-      v-else-if="!isVmRunning"
-      :image-source="monitor"
-      :title="$t('power-on-for-console')"
-    />
+    <UiStatusPanel v-else-if="!isVmRunning" :image-source="monitor" :title="$t('power-on-for-console')" />
     <template v-else-if="vm && vmConsole">
       <AppMenu horizontal>
-        <MenuItem
-          v-if="uiStore.hasUi"
-          :icon="faArrowUpRightFromSquare"
-          @click="openInNewTab"
-        >
-          {{ $t("open-console-in-new-tab") }}
+        <MenuItem v-if="uiStore.hasUi" :icon="faArrowUpRightFromSquare" @click="openInNewTab">
+          {{ $t('open-console-in-new-tab') }}
         </MenuItem>
         <MenuItem
-          :icon="
-            uiStore.hasUi
-              ? faUpRightAndDownLeftFromCenter
-              : faDownLeftAndUpRightToCenter
-          "
+          :icon="uiStore.hasUi ? faUpRightAndDownLeftFromCenter : faDownLeftAndUpRightToCenter"
           @click="toggleFullScreen"
         >
-          {{ $t(uiStore.hasUi ? "fullscreen" : "fullscreen-leave") }}
+          {{ $t(uiStore.hasUi ? 'fullscreen' : 'fullscreen-leave') }}
         </MenuItem>
-        <MenuItem
-          :disabled="!consoleElement"
-          :icon="faKeyboard"
-          @click="sendCtrlAltDel"
-        >
-          {{ $t("send-ctrl-alt-del") }}
+        <MenuItem :disabled="!consoleElement" :icon="faKeyboard" @click="sendCtrlAltDel">
+          {{ $t('send-ctrl-alt-del') }}
         </MenuItem>
       </AppMenu>
       <RemoteConsole
@@ -45,27 +29,27 @@
 </template>
 
 <script lang="ts" setup>
-import monitor from "@/assets/monitor.svg";
-import AppMenu from "@/components/menu/AppMenu.vue";
-import MenuItem from "@/components/menu/MenuItem.vue";
-import RemoteConsole from "@/components/RemoteConsole.vue";
-import UiSpinner from "@/components/ui/UiSpinner.vue";
-import UiStatusPanel from "@/components/ui/UiStatusPanel.vue";
-import { VM_OPERATION, VM_POWER_STATE } from "@/libs/xen-api/xen-api.enums";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useUiStore } from "@/stores/ui.store";
-import { useConsoleCollection } from "@/stores/xen-api/console.store";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
+import monitor from '@/assets/monitor.svg'
+import AppMenu from '@/components/menu/AppMenu.vue'
+import MenuItem from '@/components/menu/MenuItem.vue'
+import RemoteConsole from '@/components/RemoteConsole.vue'
+import UiSpinner from '@/components/ui/UiSpinner.vue'
+import UiStatusPanel from '@/components/ui/UiStatusPanel.vue'
+import { VM_OPERATION, VM_POWER_STATE } from '@/libs/xen-api/xen-api.enums'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useUiStore } from '@/stores/ui.store'
+import { useConsoleCollection } from '@/stores/xen-api/console.store'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
 import {
   faArrowUpRightFromSquare,
   faDownLeftAndUpRightToCenter,
   faKeyboard,
   faUpRightAndDownLeftFromCenter,
-} from "@fortawesome/free-solid-svg-icons";
-import { computed, ref } from "vue";
-import { useI18n } from "vue-i18n";
-import { useRoute, useRouter } from "vue-router";
+} from '@fortawesome/free-solid-svg-icons'
+import { computed, ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useRoute, useRouter } from 'vue-router'
 
 const STOP_OPERATIONS = [
   VM_OPERATION.SHUTDOWN,
@@ -75,65 +59,56 @@ const STOP_OPERATIONS = [
   VM_OPERATION.HARD_REBOOT,
   VM_OPERATION.PAUSE,
   VM_OPERATION.SUSPEND,
-];
+]
 
-usePageTitleStore().setTitle(useI18n().t("console"));
+usePageTitleStore().setTitle(useI18n().t('console'))
 
-const router = useRouter();
-const route = useRoute();
-const uiStore = useUiStore();
+const router = useRouter()
+const route = useRoute()
+const uiStore = useUiStore()
 
-const {
-  isReady: isVmReady,
-  getByUuid: getVmByUuid,
-  hasError: hasVmError,
-  isOperationPending,
-} = useVmCollection();
+const { isReady: isVmReady, getByUuid: getVmByUuid, hasError: hasVmError, isOperationPending } = useVmCollection()
 
 const {
   isReady: isConsoleReady,
   getByOpaqueRef: getConsoleByOpaqueRef,
   hasError: hasConsoleError,
-} = useConsoleCollection();
+} = useConsoleCollection()
 
-const isReady = computed(() => isVmReady.value && isConsoleReady.value);
+const isReady = computed(() => isVmReady.value && isConsoleReady.value)
 
-const hasError = computed(() => hasVmError.value || hasConsoleError.value);
+const hasError = computed(() => hasVmError.value || hasConsoleError.value)
 
-const vm = computed(() => getVmByUuid(route.params.uuid as XenApiVm["uuid"]));
+const vm = computed(() => getVmByUuid(route.params.uuid as XenApiVm['uuid']))
 
-const isVmRunning = computed(
-  () => vm.value?.power_state === VM_POWER_STATE.RUNNING
-);
+const isVmRunning = computed(() => vm.value?.power_state === VM_POWER_STATE.RUNNING)
 
 const vmConsole = computed(() => {
-  const consoleOpaqueRef = vm.value?.consoles[0];
+  const consoleOpaqueRef = vm.value?.consoles[0]
 
   if (consoleOpaqueRef === undefined) {
-    return;
+    return
   }
 
-  return getConsoleByOpaqueRef(consoleOpaqueRef);
-});
+  return getConsoleByOpaqueRef(consoleOpaqueRef)
+})
 
 const isConsoleAvailable = computed(() =>
-  vm.value !== undefined
-    ? !isOperationPending(vm.value, STOP_OPERATIONS)
-    : false
-);
+  vm.value !== undefined ? !isOperationPending(vm.value, STOP_OPERATIONS) : false
+)
 
-const consoleElement = ref();
+const consoleElement = ref()
 
-const sendCtrlAltDel = () => consoleElement.value?.sendCtrlAltDel();
+const sendCtrlAltDel = () => consoleElement.value?.sendCtrlAltDel()
 
 const toggleFullScreen = () => {
-  uiStore.hasUi = !uiStore.hasUi;
-};
+  uiStore.hasUi = !uiStore.hasUi
+}
 
 const openInNewTab = () => {
-  const routeData = router.resolve({ query: { ui: "0" } });
-  window.open(routeData.href, "_blank");
-};
+  const routeData = router.resolve({ query: { ui: '0' } })
+  window.open(routeData.href, '_blank')
+}
 </script>
 
 <style lang="postcss" scoped>
diff --git a/@xen-orchestra/lite/src/views/vm/VmDashboardView.vue b/@xen-orchestra/lite/src/views/vm/VmDashboardView.vue
index 1c4e6b75ab4..9617c404933 100644
--- a/@xen-orchestra/lite/src/views/vm/VmDashboardView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmDashboardView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("dashboard"));
+usePageTitleStore().setTitle(useI18n().t('dashboard'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/vm/VmNetworkView.vue b/@xen-orchestra/lite/src/views/vm/VmNetworkView.vue
index 888dcb081d1..4a52297b68a 100644
--- a/@xen-orchestra/lite/src/views/vm/VmNetworkView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmNetworkView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("network"));
+usePageTitleStore().setTitle(useI18n().t('network'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/vm/VmRootView.vue b/@xen-orchestra/lite/src/views/vm/VmRootView.vue
index 04ed387d7e1..f8fe6f4e71c 100644
--- a/@xen-orchestra/lite/src/views/vm/VmRootView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmRootView.vue
@@ -9,21 +9,21 @@
 </template>
 
 <script lang="ts" setup>
-import ObjectNotFoundWrapper from "@/components/ObjectNotFoundWrapper.vue";
-import VmHeader from "@/components/vm/VmHeader.vue";
-import VmTabBar from "@/components/vm/VmTabBar.vue";
-import { useVmCollection } from "@/stores/xen-api/vm.store";
-import type { XenApiVm } from "@/libs/xen-api/xen-api.types";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useUiStore } from "@/stores/ui.store";
-import { whenever } from "@vueuse/core";
-import { computed } from "vue";
-import { useRoute } from "vue-router";
+import ObjectNotFoundWrapper from '@/components/ObjectNotFoundWrapper.vue'
+import VmHeader from '@/components/vm/VmHeader.vue'
+import VmTabBar from '@/components/vm/VmTabBar.vue'
+import { useVmCollection } from '@/stores/xen-api/vm.store'
+import type { XenApiVm } from '@/libs/xen-api/xen-api.types'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useUiStore } from '@/stores/ui.store'
+import { whenever } from '@vueuse/core'
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
 
-const route = useRoute();
-const { getByUuid, hasUuid, isReady } = useVmCollection();
-const uiStore = useUiStore();
-const vm = computed(() => getByUuid(route.params.uuid as XenApiVm["uuid"]));
-whenever(vm, (vm) => (uiStore.currentHostOpaqueRef = vm.resident_on));
-usePageTitleStore().setObject(vm);
+const route = useRoute()
+const { getByUuid, hasUuid, isReady } = useVmCollection()
+const uiStore = useUiStore()
+const vm = computed(() => getByUuid(route.params.uuid as XenApiVm['uuid']))
+whenever(vm, vm => (uiStore.currentHostOpaqueRef = vm.resident_on))
+usePageTitleStore().setObject(vm)
 </script>
diff --git a/@xen-orchestra/lite/src/views/vm/VmStatsView.vue b/@xen-orchestra/lite/src/views/vm/VmStatsView.vue
index 3f0fc3be7da..1ac842fa2b0 100644
--- a/@xen-orchestra/lite/src/views/vm/VmStatsView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmStatsView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("stats"));
+usePageTitleStore().setTitle(useI18n().t('stats'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/vm/VmStorageView.vue b/@xen-orchestra/lite/src/views/vm/VmStorageView.vue
index 52fcc877b50..043bc3d21e5 100644
--- a/@xen-orchestra/lite/src/views/vm/VmStorageView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmStorageView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("storage"));
+usePageTitleStore().setTitle(useI18n().t('storage'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/vm/VmSystemView.vue b/@xen-orchestra/lite/src/views/vm/VmSystemView.vue
index 2405b8e1bef..e57718e175d 100644
--- a/@xen-orchestra/lite/src/views/vm/VmSystemView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmSystemView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("system"));
+usePageTitleStore().setTitle(useI18n().t('system'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/vm/VmTasksView.vue b/@xen-orchestra/lite/src/views/vm/VmTasksView.vue
index 43b2fa13137..7aa5cafa90f 100644
--- a/@xen-orchestra/lite/src/views/vm/VmTasksView.vue
+++ b/@xen-orchestra/lite/src/views/vm/VmTasksView.vue
@@ -3,9 +3,9 @@
 </template>
 
 <script lang="ts" setup>
-import PageUnderConstruction from "@/components/PageUnderConstruction.vue";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useI18n } from "vue-i18n";
+import PageUnderConstruction from '@/components/PageUnderConstruction.vue'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useI18n } from 'vue-i18n'
 
-usePageTitleStore().setTitle(useI18n().t("tasks"));
+usePageTitleStore().setTitle(useI18n().t('tasks'))
 </script>
diff --git a/@xen-orchestra/lite/src/views/xoa-deploy/XoaDeployView.vue b/@xen-orchestra/lite/src/views/xoa-deploy/XoaDeployView.vue
index b7a119d33bd..3a5f2f1bb9e 100644
--- a/@xen-orchestra/lite/src/views/xoa-deploy/XoaDeployView.vue
+++ b/@xen-orchestra/lite/src/views/xoa-deploy/XoaDeployView.vue
@@ -1,58 +1,53 @@
 <template>
-  <TitleBar :icon="faDownload">{{ $t("deploy-xoa") }}</TitleBar>
+  <TitleBar :icon="faDownload">{{ $t('deploy-xoa') }}</TitleBar>
   <div v-if="deploying" class="status">
     <img src="@/assets/xo.svg" width="300" alt="Xen Orchestra" />
 
     <!-- Error -->
     <template v-if="error !== undefined">
       <div>
-        <h2>{{ $t("xoa-deploy-failed") }}</h2>
+        <h2>{{ $t('xoa-deploy-failed') }}</h2>
         <UiIcon :icon="faExclamationCircle" class="danger" />
       </div>
       <div class="error">
-        <strong>{{ $t("check-errors") }}</strong>
+        <strong>{{ $t('check-errors') }}</strong>
         <UiRaw>{{ error }}</UiRaw>
       </div>
       <UiButton :icon="faDownload" @click="resetValues()">
-        {{ $t("xoa-deploy-retry") }}
+        {{ $t('xoa-deploy-retry') }}
       </UiButton>
     </template>
 
     <!-- Success -->
     <template v-else-if="url !== undefined">
       <div>
-        <h2>{{ $t("xoa-deploy-successful") }}</h2>
+        <h2>{{ $t('xoa-deploy-successful') }}</h2>
         <UiIcon :icon="faCircleCheck" class="success" />
       </div>
       <UiButton :icon="faArrowUpRightFromSquare" @click="openXoa">
-        {{ $t("access-xoa") }}
+        {{ $t('access-xoa') }}
       </UiButton>
     </template>
 
     <!-- Deploying -->
     <template v-else>
       <div>
-        <h2>{{ $t("xoa-deploy") }}</h2>
+        <h2>{{ $t('xoa-deploy') }}</h2>
         <!-- TODO: add progress bar -->
         <p>{{ status }}</p>
       </div>
       <p class="warning">
         <UiIcon :icon="faExclamationCircle" />
-        {{ $t("keep-page-open") }}
+        {{ $t('keep-page-open') }}
       </p>
-      <UiButton
-        :disabled="vmRef === undefined"
-        color="error"
-        outlined
-        @click="cancel()"
-      >
-        {{ $t("cancel") }}
+      <UiButton :disabled="vmRef === undefined" color="error" outlined @click="cancel()">
+        {{ $t('cancel') }}
       </UiButton>
     </template>
   </div>
 
   <div v-else-if="isMobile" class="not-available">
-    <p>{{ $t("deploy-xoa-available-on-desktop") }}</p>
+    <p>{{ $t('deploy-xoa-available-on-desktop') }}</p>
   </div>
 
   <div v-else class="card-view">
@@ -60,40 +55,24 @@
       <form @submit.prevent="deploy">
         <FormSection :label="$t('configuration')">
           <div class="row">
-            <FormInputWrapper
-              :label="$t('storage')"
-              :help="$t('n-gb-required', { n: REQUIRED_GB })"
-            >
+            <FormInputWrapper :label="$t('storage')" :help="$t('n-gb-required', { n: REQUIRED_GB })">
               <FormSelect v-model="selectedSr" required>
                 <option disabled :value="undefined">
-                  {{ $t("select.storage") }}
+                  {{ $t('select.storage') }}
                 </option>
                 <option
                   v-for="sr in filteredSrs"
-                  :value="sr"
                   :key="sr.uuid"
-                  :class="
-                    sr.physical_size - sr.physical_utilisation <
-                    REQUIRED_GB * 1024 ** 3
-                      ? 'warning'
-                      : 'success'
-                  "
+                  :value="sr"
+                  :class="sr.physical_size - sr.physical_utilisation < REQUIRED_GB * 1024 ** 3 ? 'warning' : 'success'"
                 >
                   {{ sr.name_label }} -
                   {{
-                    $t("n-gb-left", {
-                      n: Math.round(
-                        (sr.physical_size - sr.physical_utilisation) / 1024 ** 3
-                      ),
+                    $t('n-gb-left', {
+                      n: Math.round((sr.physical_size - sr.physical_utilisation) / 1024 ** 3),
                     })
                   }}
-                  <span
-                    v-if="
-                      sr.physical_size - sr.physical_utilisation <
-                      REQUIRED_GB * 1024 ** 3
-                    "
-                    >⚠️</span
-                  >
+                  <span v-if="sr.physical_size - sr.physical_utilisation < REQUIRED_GB * 1024 ** 3">⚠️</span>
                 </option>
               </FormSelect>
             </FormInputWrapper>
@@ -102,13 +81,9 @@
             <FormInputWrapper :label="$t('network')" required>
               <FormSelect v-model="selectedNetwork" required>
                 <option disabled :value="undefined">
-                  {{ $t("select.network") }}
+                  {{ $t('select.network') }}
                 </option>
-                <option
-                  v-for="network in filteredNetworks"
-                  :value="network"
-                  :key="network.uuid"
-                >
+                <option v-for="network in filteredNetworks" :key="network.uuid" :value="network">
                   {{ network.name_label }}
                 </option>
               </FormSelect>
@@ -117,61 +92,37 @@
           <div class="row">
             <FormInputWrapper>
               <div class="radio-group">
-                <label
-                  ><FormRadio value="static" v-model="ipStrategy" />{{
-                    $t("static-ip")
-                  }}</label
-                >
-                <label
-                  ><FormRadio value="dhcp" v-model="ipStrategy" />{{
-                    $t("dhcp")
-                  }}</label
-                >
+                <label><FormRadio v-model="ipStrategy" value="static" />{{ $t('static-ip') }}</label>
+                <label><FormRadio v-model="ipStrategy" value="dhcp" />{{ $t('dhcp') }}</label>
               </div>
             </FormInputWrapper>
           </div>
           <div class="row">
             <FormInputWrapper
               :label="$t('xoa-ip')"
-              learnMoreUrl="https://xen-orchestra.com/docs/xoa.html#network-configuration"
+              learn-more-url="https://xen-orchestra.com/docs/xoa.html#network-configuration"
             >
-              <FormInput
-                v-model="ip"
-                :disabled="!requireIpConf"
-                placeholder="xxx.xxx.xxx.xxx"
-              />
+              <FormInput v-model="ip" :disabled="!requireIpConf" placeholder="xxx.xxx.xxx.xxx" />
             </FormInputWrapper>
             <FormInputWrapper
               :label="$t('netmask')"
-              learnMoreUrl="https://xen-orchestra.com/docs/xoa.html#network-configuration"
+              learn-more-url="https://xen-orchestra.com/docs/xoa.html#network-configuration"
             >
-              <FormInput
-                v-model="netmask"
-                :disabled="!requireIpConf"
-                placeholder="255.255.255.0"
-              />
+              <FormInput v-model="netmask" :disabled="!requireIpConf" placeholder="255.255.255.0" />
             </FormInputWrapper>
           </div>
           <div class="row">
             <FormInputWrapper
               :label="$t('dns')"
-              learnMoreUrl="https://xen-orchestra.com/docs/xoa.html#network-configuration"
+              learn-more-url="https://xen-orchestra.com/docs/xoa.html#network-configuration"
             >
-              <FormInput
-                v-model="dns"
-                :disabled="!requireIpConf"
-                placeholder="8.8.8.8"
-              />
+              <FormInput v-model="dns" :disabled="!requireIpConf" placeholder="8.8.8.8" />
             </FormInputWrapper>
             <FormInputWrapper
               :label="$t('gateway')"
-              learnMoreUrl="https://xen-orchestra.com/docs/xoa.html#network-configuration"
+              learn-more-url="https://xen-orchestra.com/docs/xoa.html#network-configuration"
             >
-              <FormInput
-                v-model="gateway"
-                :disabled="!requireIpConf"
-                placeholder="xxx.xxx.xxx.xxx"
-              />
+              <FormInput v-model="gateway" :disabled="!requireIpConf" placeholder="xxx.xxx.xxx.xxx" />
             </FormInputWrapper>
           </div>
         </FormSection>
@@ -180,37 +131,23 @@
           <div class="row">
             <FormInputWrapper
               :label="$t('admin-login')"
-              learnMoreUrl="https://xen-orchestra.com/docs/xoa.html#default-xo-account"
+              learn-more-url="https://xen-orchestra.com/docs/xoa.html#default-xo-account"
             >
-              <FormInput
-                v-model="xoaUser"
-                required
-                placeholder="email@example.com"
-              />
+              <FormInput v-model="xoaUser" required placeholder="email@example.com" />
             </FormInputWrapper>
           </div>
           <div class="row">
             <FormInputWrapper
               :label="$t('admin-password')"
-              learnMoreUrl="https://xen-orchestra.com/docs/xoa.html#default-xo-account"
+              learn-more-url="https://xen-orchestra.com/docs/xoa.html#default-xo-account"
             >
-              <FormInput
-                type="password"
-                v-model="xoaPwd"
-                required
-                :placeholder="$t('password')"
-              />
+              <FormInput v-model="xoaPwd" type="password" required :placeholder="$t('password')" />
             </FormInputWrapper>
             <FormInputWrapper
               :label="$t('admin-password-confirm')"
-              learnMoreUrl="https://xen-orchestra.com/docs/xoa.html#default-xo-account"
+              learn-more-url="https://xen-orchestra.com/docs/xoa.html#default-xo-account"
             >
-              <FormInput
-                type="password"
-                v-model="xoaPwdConfirm"
-                required
-                :placeholder="$t('password')"
-              />
+              <FormInput v-model="xoaPwdConfirm" type="password" required :placeholder="$t('password')" />
             </FormInputWrapper>
           </div>
         </FormSection>
@@ -219,10 +156,8 @@
           <div class="row">
             <FormInputWrapper :label="$t('ssh-account')">
               <label
-                ><span>{{ $t("disabled") }}</span
-                ><FormToggle v-model="enableSshAccount" /><span>{{
-                  $t("enabled")
-                }}</span></label
+                ><span>{{ $t('disabled') }}</span
+                ><FormToggle v-model="enableSshAccount" /><span>{{ $t('enabled') }}</span></label
               >
             </FormInputWrapper>
           </div>
@@ -234,8 +169,8 @@
           <div class="row">
             <FormInputWrapper :label="$t('ssh-password')">
               <FormInput
-                type="password"
                 v-model="sshPwd"
+                type="password"
                 :placeholder="$t('password')"
                 :disabled="!enableSshAccount"
                 :required="enableSshAccount"
@@ -243,8 +178,8 @@
             </FormInputWrapper>
             <FormInputWrapper :label="$t('ssh-password-confirm')">
               <FormInput
-                type="password"
                 v-model="sshPwdConfirm"
+                type="password"
                 :placeholder="$t('password')"
                 :disabled="!enableSshAccount"
                 :required="enableSshAccount"
@@ -255,10 +190,10 @@
 
         <UiButtonGroup>
           <UiButton outlined @click="router.back()">
-            {{ $t("cancel") }}
+            {{ $t('cancel') }}
           </UiButton>
           <UiButton type="submit">
-            {{ $t("deploy") }}
+            {{ $t('deploy') }}
           </UiButton>
         </UiButtonGroup>
       </form>
@@ -267,317 +202,273 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, ref } from "vue";
+import { computed, ref } from 'vue'
 import {
   faArrowUpRightFromSquare,
   faCircleCheck,
   faDownload,
   faExclamationCircle,
-} from "@fortawesome/free-solid-svg-icons";
-import { storeToRefs } from "pinia";
-import { useI18n } from "vue-i18n";
-import { useModal } from "@/composables/modal.composable";
-import { useNetworkCollection } from "@/stores/xen-api/network.store";
-import { usePageTitleStore } from "@/stores/page-title.store";
-import { useRouter } from "vue-router";
-import { useSrCollection } from "@/stores/xen-api/sr.store";
-import { useUiStore } from "@/stores/ui.store";
-import { useXenApiStore } from "@/stores/xen-api.store";
-import type { XenApiNetwork, XenApiSr } from "@/libs/xen-api/xen-api.types";
-import FormInput from "@/components/form/FormInput.vue";
-import FormInputWrapper from "@/components/form/FormInputWrapper.vue";
-import FormRadio from "@/components/form/FormRadio.vue";
-import FormSection from "@/components/form/FormSection.vue";
-import FormSelect from "@/components/form/FormSelect.vue";
-import FormToggle from "@/components/form/FormToggle.vue";
-import TitleBar from "@/components/TitleBar.vue";
-import UiButton from "@/components/ui/UiButton.vue";
-import UiButtonGroup from "@/components/ui/UiButtonGroup.vue";
-import UiCard from "@/components/ui/UiCard.vue";
-import UiIcon from "@/components/ui/icon/UiIcon.vue";
-import UiRaw from "@/components/ui/UiRaw.vue";
-
-const REQUIRED_GB = 20;
-
-const { t } = useI18n();
-const router = useRouter();
-
-usePageTitleStore().setTitle(() => t("deploy-xoa"));
+} from '@fortawesome/free-solid-svg-icons'
+import { storeToRefs } from 'pinia'
+import { useI18n } from 'vue-i18n'
+import { useModal } from '@/composables/modal.composable'
+import { useNetworkCollection } from '@/stores/xen-api/network.store'
+import { usePageTitleStore } from '@/stores/page-title.store'
+import { useRouter } from 'vue-router'
+import { useSrCollection } from '@/stores/xen-api/sr.store'
+import { useUiStore } from '@/stores/ui.store'
+import { useXenApiStore } from '@/stores/xen-api.store'
+import type { XenApiNetwork, XenApiSr } from '@/libs/xen-api/xen-api.types'
+import FormInput from '@/components/form/FormInput.vue'
+import FormInputWrapper from '@/components/form/FormInputWrapper.vue'
+import FormRadio from '@/components/form/FormRadio.vue'
+import FormSection from '@/components/form/FormSection.vue'
+import FormSelect from '@/components/form/FormSelect.vue'
+import FormToggle from '@/components/form/FormToggle.vue'
+import TitleBar from '@/components/TitleBar.vue'
+import UiButton from '@/components/ui/UiButton.vue'
+import UiButtonGroup from '@/components/ui/UiButtonGroup.vue'
+import UiCard from '@/components/ui/UiCard.vue'
+import UiIcon from '@/components/ui/icon/UiIcon.vue'
+import UiRaw from '@/components/ui/UiRaw.vue'
+
+const REQUIRED_GB = 20
+
+const { t } = useI18n()
+const router = useRouter()
+
+usePageTitleStore().setTitle(() => t('deploy-xoa'))
 
 const invalidField = (message: string) =>
-  useModal(() => import("@/components/modals/InvalidFieldModal.vue"), {
+  useModal(() => import('@/components/modals/InvalidFieldModal.vue'), {
     message,
-  });
+  })
 
-const uiStore = useUiStore();
-const { isMobile } = storeToRefs(uiStore);
+const uiStore = useUiStore()
+const { isMobile } = storeToRefs(uiStore)
 
-const xapi = useXenApiStore().getXapi();
+const xapi = useXenApiStore().getXapi()
 
-const { records: srs } = useSrCollection();
+const { records: srs } = useSrCollection()
 const filteredSrs = computed(() =>
   srs.value
-    .filter((sr) => sr.content_type !== "iso" && sr.physical_size > 0)
+    .filter(sr => sr.content_type !== 'iso' && sr.physical_size > 0)
     // Sort: shared first then largest free space first
     .sort((sr1, sr2) => {
       if (sr1.shared === sr2.shared) {
-        return (
-          sr2.physical_size -
-          sr2.physical_utilisation -
-          (sr1.physical_size - sr1.physical_utilisation)
-        );
+        return sr2.physical_size - sr2.physical_utilisation - (sr1.physical_size - sr1.physical_utilisation)
       } else {
-        return sr1.shared ? -1 : 1;
+        return sr1.shared ? -1 : 1
       }
     })
-);
+)
 
-const { records: networks } = useNetworkCollection();
+const { records: networks } = useNetworkCollection()
 const filteredNetworks = computed(() =>
-  [...networks.value].sort((network1, network2) =>
-    network1.name_label < network2.name_label ? -1 : 1
-  )
-);
+  [...networks.value].sort((network1, network2) => (network1.name_label < network2.name_label ? -1 : 1))
+)
 
-const deploying = ref(false);
-const status = ref<string | undefined>();
-const error = ref<string | undefined>();
-const url = ref<string | undefined>();
-const vmRef = ref<string | undefined>();
+const deploying = ref(false)
+const status = ref<string | undefined>()
+const error = ref<string | undefined>()
+const url = ref<string | undefined>()
+const vmRef = ref<string | undefined>()
 
 const resetValues = () => {
-  deploying.value = false;
-  status.value = undefined;
-  error.value = undefined;
-  url.value = undefined;
-  vmRef.value = undefined;
-};
+  deploying.value = false
+  status.value = undefined
+  error.value = undefined
+  url.value = undefined
+  vmRef.value = undefined
+}
 
 const openXoa = () => {
-  window.open(url.value, "_blank", "noopener");
-};
-
-const selectedSr = ref<XenApiSr>();
-const selectedNetwork = ref<XenApiNetwork>();
-const ipStrategy = ref<"static" | "dhcp">("dhcp");
-const requireIpConf = computed(() => ipStrategy.value === "static");
-
-const ip = ref("");
-const netmask = ref("");
-const dns = ref("");
-const gateway = ref("");
-const xoaUser = ref("");
-const xoaPwd = ref("");
-const xoaPwdConfirm = ref("");
-const enableSshAccount = ref(true);
-const sshPwd = ref("");
-const sshPwdConfirm = ref("");
+  window.open(url.value, '_blank', 'noopener')
+}
+
+const selectedSr = ref<XenApiSr>()
+const selectedNetwork = ref<XenApiNetwork>()
+const ipStrategy = ref<'static' | 'dhcp'>('dhcp')
+const requireIpConf = computed(() => ipStrategy.value === 'static')
+
+const ip = ref('')
+const netmask = ref('')
+const dns = ref('')
+const gateway = ref('')
+const xoaUser = ref('')
+const xoaPwd = ref('')
+const xoaPwdConfirm = ref('')
+const enableSshAccount = ref(true)
+const sshPwd = ref('')
+const sshPwdConfirm = ref('')
 
 async function deploy() {
   if (selectedSr.value === undefined || selectedNetwork.value === undefined) {
     // Should not happen
-    console.error("SR or network is undefined");
-    return;
+    console.error('SR or network is undefined')
+    return
   }
 
   if (
-    ipStrategy.value === "static" &&
-    (ip.value === "" ||
-      netmask.value === "" ||
-      dns.value === "" ||
-      gateway.value === "")
+    ipStrategy.value === 'static' &&
+    (ip.value === '' || netmask.value === '' || dns.value === '' || gateway.value === '')
   ) {
     // Should not happen
-    console.error("Missing IP config");
-    return;
+    console.error('Missing IP config')
+    return
   }
 
-  if (xoaUser.value === "" || xoaPwd.value === "") {
+  if (xoaUser.value === '' || xoaPwd.value === '') {
     // Should not happen
-    console.error("Missing XOA credentials");
-    return;
+    console.error('Missing XOA credentials')
+    return
   }
 
   if (xoaPwd.value !== xoaPwdConfirm.value) {
     // TODO: use formal validation system
-    invalidField(t("xoa-password-confirm-different"));
-    return;
+    invalidField(t('xoa-password-confirm-different'))
+    return
   }
 
-  if (enableSshAccount.value && sshPwd.value === "") {
+  if (enableSshAccount.value && sshPwd.value === '') {
     // Should not happen
-    console.error("Missing XOA credentials");
-    return;
+    console.error('Missing XOA credentials')
+    return
   }
 
   if (enableSshAccount.value && sshPwd.value !== sshPwdConfirm.value) {
     // TODO: use form validation system
-    invalidField(t("xoa-ssh-password-confirm-different"));
-    return;
+    invalidField(t('xoa-ssh-password-confirm-different'))
+    return
   }
 
-  deploying.value = true;
+  deploying.value = true
 
   try {
-    status.value = t("deploy-xoa-status.importing");
+    status.value = t('deploy-xoa-status.importing')
 
     vmRef.value = (
-      (await xapi.call("VM.import", [
-        "http://xoa.io:8888/",
+      (await xapi.call('VM.import', [
+        'http://xoa.io:8888/',
         selectedSr.value.$ref,
         false, // full_restore
         false, // force
       ])) as string[]
-    )[0];
+    )[0]
 
-    status.value = t("deploy-xoa-status.configuring");
+    status.value = t('deploy-xoa-status.configuring')
 
-    const [vifRef] = (await xapi.call("VM.get_VIFs", [
-      vmRef.value,
-    ])) as string[];
-    await xapi.call("VIF.destroy", [vifRef]);
+    const [vifRef] = (await xapi.call('VM.get_VIFs', [vmRef.value])) as string[]
+    await xapi.call('VIF.destroy', [vifRef])
 
     if (!deploying.value) {
-      return;
+      return
     }
 
-    const [device] = (await xapi.call("VM.get_allowed_VIF_devices", [
-      vmRef.value,
-    ])) as string[];
-    await xapi.call("VIF.create", [
+    const [device] = (await xapi.call('VM.get_allowed_VIF_devices', [vmRef.value])) as string[]
+    await xapi.call('VIF.create', [
       {
         device,
-        MAC: "",
+        MAC: '',
         MTU: selectedNetwork.value.MTU,
         network: selectedNetwork.value.$ref,
         other_config: {},
         qos_algorithm_params: {},
-        qos_algorithm_type: "",
+        qos_algorithm_type: '',
         VM: vmRef.value,
       },
-    ]);
+    ])
 
     if (!deploying.value) {
-      return;
+      return
     }
 
     const promises = [
-      xapi.call("VM.add_to_xenstore_data", [
+      xapi.call('VM.add_to_xenstore_data', [
         vmRef.value,
-        "vm-data/admin-account",
+        'vm-data/admin-account',
         JSON.stringify({ email: xoaUser.value, password: xoaPwd.value }),
       ]),
-    ];
+    ]
 
     // TODO: add host to servers with session token?
 
-    if (ipStrategy.value === "static") {
+    if (ipStrategy.value === 'static') {
       promises.push(
-        xapi.call("VM.add_to_xenstore_data", [
-          vmRef.value,
-          "vm-data/ip",
-          ip.value,
-        ]),
-        xapi.call("VM.add_to_xenstore_data", [
-          vmRef.value,
-          "vm-data/netmask",
-          netmask.value,
-        ]),
-        xapi.call("VM.add_to_xenstore_data", [
-          vmRef.value,
-          "vm-data/gateway",
-          gateway.value,
-        ]),
-        xapi.call("VM.add_to_xenstore_data", [
-          vmRef.value,
-          "vm-data/dns",
-          dns.value,
-        ])
-      );
+        xapi.call('VM.add_to_xenstore_data', [vmRef.value, 'vm-data/ip', ip.value]),
+        xapi.call('VM.add_to_xenstore_data', [vmRef.value, 'vm-data/netmask', netmask.value]),
+        xapi.call('VM.add_to_xenstore_data', [vmRef.value, 'vm-data/gateway', gateway.value]),
+        xapi.call('VM.add_to_xenstore_data', [vmRef.value, 'vm-data/dns', dns.value])
+      )
     }
 
     if (enableSshAccount.value) {
       promises.push(
-        xapi.call("VM.add_to_xenstore_data", [
-          vmRef.value,
-          "vm-data/system-account-xoa-password",
-          sshPwd.value,
-        ])
-      );
+        xapi.call('VM.add_to_xenstore_data', [vmRef.value, 'vm-data/system-account-xoa-password', sshPwd.value])
+      )
     }
 
-    await Promise.all(promises);
+    await Promise.all(promises)
 
     if (!deploying.value) {
-      return;
+      return
     }
 
-    status.value = t("deploy-xoa-status.starting");
+    status.value = t('deploy-xoa-status.starting')
 
-    await xapi.call("VM.start", [
+    await xapi.call('VM.start', [
       vmRef.value,
       false, // start_paused
       false, // force
-    ]);
+    ])
 
     if (!deploying.value) {
-      return;
+      return
     }
 
-    status.value = t("deploy-xoa-status.waiting");
+    status.value = t('deploy-xoa-status.waiting')
 
-    const metricsRef = await xapi.call("VM.get_guest_metrics", [vmRef.value]);
-    let attempts = 120;
-    let networks: { "0/ip": string } | undefined;
-    await new Promise((resolve) => setTimeout(resolve, 10e3)); // Sleep 10s
+    const metricsRef = await xapi.call('VM.get_guest_metrics', [vmRef.value])
+    let attempts = 120
+    let networks: { '0/ip': string } | undefined
+    await new Promise(resolve => setTimeout(resolve, 10e3)) // Sleep 10s
     do {
-      await new Promise((resolve) => setTimeout(resolve, 1e3)); // Sleep 1s
-      networks = await xapi.call("VM_guest_metrics.get_networks", [metricsRef]);
+      await new Promise(resolve => setTimeout(resolve, 1e3)) // Sleep 1s
+      networks = await xapi.call('VM_guest_metrics.get_networks', [metricsRef])
       if (!deploying.value) {
-        return;
+        return
       }
-    } while (--attempts > 0 && networks?.["0/ip"] === undefined);
+    } while (--attempts > 0 && networks?.['0/ip'] === undefined)
 
     if (attempts === 0 || networks === undefined) {
-      status.value = t("deploy-xoa-status.not-responding");
-      return;
+      status.value = t('deploy-xoa-status.not-responding')
+      return
     }
 
     await Promise.all(
-      [
-        "admin-account",
-        "dns",
-        "gateway",
-        "ip",
-        "netmask",
-        "xoa-updater-credentials",
-      ].map((key) =>
-        xapi.call("VM.remove_from_xenstore_data", [
-          vmRef.value,
-          `vm-data/${key}`,
-        ])
+      ['admin-account', 'dns', 'gateway', 'ip', 'netmask', 'xoa-updater-credentials'].map(key =>
+        xapi.call('VM.remove_from_xenstore_data', [vmRef.value, `vm-data/${key}`])
       )
-    );
+    )
 
-    status.value = t("deploy-xoa-status.ready");
+    status.value = t('deploy-xoa-status.ready')
 
     // TODO: handle IPv6
-    url.value = `https://${networks["0/ip"]}`;
+    url.value = `https://${networks['0/ip']}`
   } catch (err: any) {
-    console.error(err);
-    error.value = err?.message ?? err?.code ?? "Unknown error";
+    console.error(err)
+    error.value = err?.message ?? err?.code ?? 'Unknown error'
   }
 }
 
 async function cancel() {
-  const _vmRef = vmRef.value;
-  console.log("_vmRef:", _vmRef);
-  resetValues();
+  const _vmRef = vmRef.value
+  resetValues()
   if (_vmRef !== undefined) {
     try {
-      await xapi.call("VM.destroy", [_vmRef]);
+      await xapi.call('VM.destroy', [_vmRef])
     } catch (err) {
-      console.error(err);
+      console.error(err)
     }
   }
 }
diff --git a/@xen-orchestra/lite/tsconfig.app.json b/@xen-orchestra/lite/tsconfig.app.json
new file mode 100644
index 00000000000..491e0939517
--- /dev/null
+++ b/@xen-orchestra/lite/tsconfig.app.json
@@ -0,0 +1,13 @@
+{
+  "extends": "@vue/tsconfig/tsconfig.dom.json",
+  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
+  "exclude": ["src/**/__tests__/*"],
+  "compilerOptions": {
+    "composite": true,
+    "noEmit": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  }
+}
diff --git a/@xen-orchestra/lite/tsconfig.config.json b/@xen-orchestra/lite/tsconfig.config.json
deleted file mode 100644
index 80740beeebb..00000000000
--- a/@xen-orchestra/lite/tsconfig.config.json
+++ /dev/null
@@ -1,8 +0,0 @@
-{
-  "extends": ["@tsconfig/node18/tsconfig.json", "@vue/tsconfig/tsconfig.json"],
-  "include": ["vite.config.*", "vitest.config.*", "cypress.config.*"],
-  "compilerOptions": {
-    "composite": true,
-    "types": ["node"]
-  }
-}
diff --git a/@xen-orchestra/lite/tsconfig.json b/@xen-orchestra/lite/tsconfig.json
index 64931152235..66b5e5703e8 100644
--- a/@xen-orchestra/lite/tsconfig.json
+++ b/@xen-orchestra/lite/tsconfig.json
@@ -1,18 +1,11 @@
 {
-  "extends": "@vue/tsconfig/tsconfig.dom.json",
-  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
-  "exclude": ["src/stories/**/*"],
-  "compilerOptions": {
-    "experimentalDecorators": true,
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-
+  "files": [],
   "references": [
     {
-      "path": "./tsconfig.config.json"
+      "path": "./tsconfig.node.json"
+    },
+    {
+      "path": "./tsconfig.app.json"
     }
   ]
 }
diff --git a/@xen-orchestra/lite/tsconfig.node.json b/@xen-orchestra/lite/tsconfig.node.json
new file mode 100644
index 00000000000..e7565f1496b
--- /dev/null
+++ b/@xen-orchestra/lite/tsconfig.node.json
@@ -0,0 +1,11 @@
+{
+  "extends": "@tsconfig/node18/tsconfig.json",
+  "include": ["vite.config.*", "vitest.config.*", "cypress.config.*", "nightwatch.conf.*", "playwright.config.*"],
+  "compilerOptions": {
+    "composite": true,
+    "noEmit": true,
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "types": ["node"]
+  }
+}
diff --git a/@xen-orchestra/lite/tsconfig.type-check.json b/@xen-orchestra/lite/tsconfig.type-check.json
new file mode 100644
index 00000000000..eccbaba67b5
--- /dev/null
+++ b/@xen-orchestra/lite/tsconfig.type-check.json
@@ -0,0 +1,4 @@
+{
+  "extends": "./tsconfig.app.json",
+  "exclude": ["src/stories"]
+}
diff --git a/@xen-orchestra/lite/vite.config.ts b/@xen-orchestra/lite/vite.config.ts
index a19f87a2da9..40721b7c700 100644
--- a/@xen-orchestra/lite/vite.config.ts
+++ b/@xen-orchestra/lite/vite.config.ts
@@ -1,19 +1,19 @@
-import vueI18n from "@intlify/unplugin-vue-i18n/vite";
-import vue from "@vitejs/plugin-vue";
-import { resolve } from "path";
-import { fileURLToPath, URL } from "url";
-import { defineConfig } from "vite";
+import vueI18n from '@intlify/unplugin-vue-i18n/vite'
+import vue from '@vitejs/plugin-vue'
+import { resolve } from 'path'
+import { fileURLToPath, URL } from 'url'
+import { defineConfig } from 'vite'
 
 // https://vitejs.dev/config/
 export default defineConfig({
   server: {
-    host: "127.0.0.1",
+    host: '127.0.0.1',
     port: 3000,
   },
   plugins: [
     vue(),
     vueI18n({
-      include: resolve(__dirname, "src/locales/**"),
+      include: resolve(__dirname, 'src/locales/**'),
     }),
   ],
   define: {
@@ -22,7 +22,7 @@ export default defineConfig({
   },
   resolve: {
     alias: {
-      "@": fileURLToPath(new URL("./src", import.meta.url)),
+      '@': fileURLToPath(new URL('./src', import.meta.url)),
     },
   },
 
@@ -30,18 +30,18 @@ export default defineConfig({
   build: {
     rollupOptions: {
       output: {
-        manualChunks: (id) => {
-          if (id.includes("node_modules")) {
-            if (id.includes("vue") || id.includes("pinia")) {
-              return "vue";
+        manualChunks: id => {
+          if (id.includes('node_modules')) {
+            if (id.includes('vue') || id.includes('pinia')) {
+              return 'vue'
             }
 
-            if (id.includes("lodash-es")) {
-              return "lodash-es";
+            if (id.includes('lodash-es')) {
+              return 'lodash-es'
             }
 
-            if (id.includes("echarts")) {
-              return "charts";
+            if (id.includes('echarts')) {
+              return 'charts'
             }
           }
         },
@@ -50,12 +50,26 @@ export default defineConfig({
     commonjsOptions: {
       include: [/complex-matcher/, /node_modules/],
     },
-    target: "es2020",
+    target: 'es2020',
   },
   optimizeDeps: {
-    include: ["complex-matcher"],
+    include: ['complex-matcher'],
     esbuildOptions: {
-      target: "es2020",
+      target: 'es2020',
+      tsconfigRaw: {
+        // https://github.com/vitejs/vite/issues/15201#issuecomment-1875543124
+        compilerOptions: {
+          experimentalDecorators: true,
+        },
+      },
+    },
+  },
+  esbuild: {
+    tsconfigRaw: {
+      // https://github.com/vitejs/vite/issues/15201#issuecomment-1875543124
+      compilerOptions: {
+        experimentalDecorators: true,
+      },
     },
   },
-});
+})
diff --git a/package.json b/package.json
index 105d0e933ca..42eb94098dd 100644
--- a/package.json
+++ b/package.json
@@ -5,18 +5,25 @@
     "@babel/register": "^7.0.0",
     "@commitlint/cli": "^18.2.0",
     "@commitlint/config-conventional": "^18.1.0",
+    "@limegrass/eslint-plugin-import-alias": "^1.1.0",
     "@vates/async-each": "^1.0.0",
+    "@vue/eslint-config-prettier": "^9.0.0",
+    "@vue/eslint-config-typescript": "^12.0.0",
     "babel-jest": "^29.0.3",
     "benchmark": "^2.1.4",
     "eslint": "^8.7.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-config-standard": "^17.0.0",
     "eslint-config-standard-jsx": "^11.0.0-1",
+    "eslint-import-resolver-alias": "^1.1.2",
+    "eslint-import-resolver-custom-alias": "^1.3.2",
+    "eslint-import-resolver-typescript": "^3.6.1",
     "eslint-plugin-eslint-comments": "^3.2.0",
-    "eslint-plugin-import": "^2.22.1",
+    "eslint-plugin-import": "^2.29.1",
     "eslint-plugin-n": "^16.0.0",
     "eslint-plugin-promise": "^6.0.0",
     "eslint-plugin-react": "^7.21.5",
+    "eslint-plugin-vue": "^9.19.2",
     "exec-promise": "^0.7.0",
     "getopts": "^2.3.0",
     "globby": "^13.1.1",
@@ -98,7 +105,7 @@
     "prettify": "prettier --ignore-path .gitignore --ignore-unknown --write .",
     "test": "npm run test-lint && npm run test-unit",
     "test-integration": "jest \".integ\\.spec\\.js$\" && scripts/run-script.js --parallel test-integration",
-    "test-lint": "eslint --ignore-path .gitignore --ignore-pattern @xen-orchestra/lite --ignore-pattern packages/xo-web .",
+    "test-lint": "eslint --ignore-path .gitignore --ignore-pattern packages/xo-web .",
     "test-unit": "jest \"^(?!.*\\.integ\\.spec\\.js$)\" && scripts/run-script.js --bail test"
   },
   "workspaces": [
diff --git a/scripts/.eslintrc.js b/scripts/.eslintrc.js
deleted file mode 100644
index 002b42f1742..00000000000
--- a/scripts/.eslintrc.js
+++ /dev/null
@@ -1,10 +0,0 @@
-'use strict'
-
-module.exports = {
-  rules: {
-    'n/no-process-exit': 'off',
-    'n/no-unpublished-require': 'off',
-    'n/shebang': 'off',
-    'no-console': 'off',
-  },
-}
diff --git a/yarn.lock b/yarn.lock
index 7520dd409c5..7322e6bb9fa 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1965,115 +1965,120 @@
   resolved "https://registry.yarnpkg.com/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.5.tgz#94bc8b3c3fd7112a40b7bf0b483e91eba0654a0f"
   integrity sha512-IxVBdYzR8pYe89JiyXQuYk4aVVoCPhMJkz6ElRwlVysjwURTsTk/bmY/z4FfeRE+CRBMlykPwXEVUg8lThv7AQ==
 
-"@esbuild/android-arm64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.18.20.tgz#984b4f9c8d0377443cc2dfcef266d02244593622"
-  integrity sha512-Nz4rJcchGDtENV0eMKUNa6L12zz2zBDXuhj/Vjh18zGqB44Bi7MBMSXjgunJgjRhCmKOjnPuZp4Mb6OKqtMHLQ==
-
-"@esbuild/android-arm@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.18.20.tgz#fedb265bc3a589c84cc11f810804f234947c3682"
-  integrity sha512-fyi7TDI/ijKKNZTUJAQqiG5T7YjJXgnzkURqmGj13C6dCqckZBLdl4h7bkhHt/t0WP+zO9/zwroDvANaOqO5Sw==
-
-"@esbuild/android-x64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.18.20.tgz#35cf419c4cfc8babe8893d296cd990e9e9f756f2"
-  integrity sha512-8GDdlePJA8D6zlZYJV/jnrRAi6rOiNaCC/JclcXpB+KIuvfBN4owLtgzY2bsxnx666XjJx2kDPUmnTtR8qKQUg==
-
-"@esbuild/darwin-arm64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.18.20.tgz#08172cbeccf95fbc383399a7f39cfbddaeb0d7c1"
-  integrity sha512-bxRHW5kHU38zS2lPTPOyuyTm+S+eobPUnTNkdJEfAddYgEcll4xkT8DB9d2008DtTbl7uJag2HuE5NZAZgnNEA==
-
-"@esbuild/darwin-x64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.18.20.tgz#d70d5790d8bf475556b67d0f8b7c5bdff053d85d"
-  integrity sha512-pc5gxlMDxzm513qPGbCbDukOdsGtKhfxD1zJKXjCCcU7ju50O7MeAZ8c4krSJcOIJGFR+qx21yMMVYwiQvyTyQ==
-
-"@esbuild/freebsd-arm64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.18.20.tgz#98755cd12707f93f210e2494d6a4b51b96977f54"
-  integrity sha512-yqDQHy4QHevpMAaxhhIwYPMv1NECwOvIpGCZkECn8w2WFHXjEwrBn3CeNIYsibZ/iZEUemj++M26W3cNR5h+Tw==
-
-"@esbuild/freebsd-x64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.18.20.tgz#c1eb2bff03915f87c29cece4c1a7fa1f423b066e"
-  integrity sha512-tgWRPPuQsd3RmBZwarGVHZQvtzfEBOreNuxEMKFcd5DaDn2PbBxfwLcj4+aenoh7ctXcbXmOQIn8HI6mCSw5MQ==
-
-"@esbuild/linux-arm64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.18.20.tgz#bad4238bd8f4fc25b5a021280c770ab5fc3a02a0"
-  integrity sha512-2YbscF+UL7SQAVIpnWvYwM+3LskyDmPhe31pE7/aoTMFKKzIc9lLbyGUpmmb8a8AixOL61sQ/mFh3jEjHYFvdA==
-
-"@esbuild/linux-arm@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.18.20.tgz#3e617c61f33508a27150ee417543c8ab5acc73b0"
-  integrity sha512-/5bHkMWnq1EgKr1V+Ybz3s1hWXok7mDFUMQ4cG10AfW3wL02PSZi5kFpYKrptDsgb2WAJIvRcDm+qIvXf/apvg==
-
-"@esbuild/linux-ia32@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.18.20.tgz#699391cccba9aee6019b7f9892eb99219f1570a7"
-  integrity sha512-P4etWwq6IsReT0E1KHU40bOnzMHoH73aXp96Fs8TIT6z9Hu8G6+0SHSw9i2isWrD2nbx2qo5yUqACgdfVGx7TA==
-
-"@esbuild/linux-loong64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.18.20.tgz#e6fccb7aac178dd2ffb9860465ac89d7f23b977d"
-  integrity sha512-nXW8nqBTrOpDLPgPY9uV+/1DjxoQ7DoB2N8eocyq8I9XuqJ7BiAMDMf9n1xZM9TgW0J8zrquIb/A7s3BJv7rjg==
-
-"@esbuild/linux-mips64el@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.18.20.tgz#eeff3a937de9c2310de30622a957ad1bd9183231"
-  integrity sha512-d5NeaXZcHp8PzYy5VnXV3VSd2D328Zb+9dEq5HE6bw6+N86JVPExrA6O68OPwobntbNJ0pzCpUFZTo3w0GyetQ==
-
-"@esbuild/linux-ppc64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.18.20.tgz#2f7156bde20b01527993e6881435ad79ba9599fb"
-  integrity sha512-WHPyeScRNcmANnLQkq6AfyXRFr5D6N2sKgkFo2FqguP44Nw2eyDlbTdZwd9GYk98DZG9QItIiTlFLHJHjxP3FA==
-
-"@esbuild/linux-riscv64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.18.20.tgz#6628389f210123d8b4743045af8caa7d4ddfc7a6"
-  integrity sha512-WSxo6h5ecI5XH34KC7w5veNnKkju3zBRLEQNY7mv5mtBmrP/MjNBCAlsM2u5hDBlS3NGcTQpoBvRzqBcRtpq1A==
-
-"@esbuild/linux-s390x@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.18.20.tgz#255e81fb289b101026131858ab99fba63dcf0071"
-  integrity sha512-+8231GMs3mAEth6Ja1iK0a1sQ3ohfcpzpRLH8uuc5/KVDFneH6jtAJLFGafpzpMRO6DzJ6AvXKze9LfFMrIHVQ==
-
-"@esbuild/linux-x64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.18.20.tgz#c7690b3417af318a9b6f96df3031a8865176d338"
-  integrity sha512-UYqiqemphJcNsFEskc73jQ7B9jgwjWrSayxawS6UVFZGWrAAtkzjxSqnoclCXxWtfwLdzU+vTpcNYhpn43uP1w==
-
-"@esbuild/netbsd-x64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.18.20.tgz#30e8cd8a3dded63975e2df2438ca109601ebe0d1"
-  integrity sha512-iO1c++VP6xUBUmltHZoMtCUdPlnPGdBom6IrO4gyKPFFVBKioIImVooR5I83nTew5UOYrk3gIJhbZh8X44y06A==
-
-"@esbuild/openbsd-x64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.18.20.tgz#7812af31b205055874c8082ea9cf9ab0da6217ae"
-  integrity sha512-e5e4YSsuQfX4cxcygw/UCPIEP6wbIL+se3sxPdCiMbFLBWu0eiZOJ7WoD+ptCLrmjZBK1Wk7I6D/I3NglUGOxg==
-
-"@esbuild/sunos-x64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.18.20.tgz#d5c275c3b4e73c9b0ecd38d1ca62c020f887ab9d"
-  integrity sha512-kDbFRFp0YpTQVVrqUd5FTYmWo45zGaXe0X8E1G/LKFC0v8x0vWrhOWSLITcCn63lmZIxfOMXtCfti/RxN/0wnQ==
-
-"@esbuild/win32-arm64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.18.20.tgz#73bc7f5a9f8a77805f357fab97f290d0e4820ac9"
-  integrity sha512-ddYFR6ItYgoaq4v4JmQQaAI5s7npztfV4Ag6NrhiaW0RrnOXqBkgwZLofVTlq1daVTQNhtI5oieTvkRPfZrePg==
-
-"@esbuild/win32-ia32@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.18.20.tgz#ec93cbf0ef1085cc12e71e0d661d20569ff42102"
-  integrity sha512-Wv7QBi3ID/rROT08SABTS7eV4hX26sVduqDOTe1MvGMjNd3EjOz4b7zeexIR62GTIEKrfJXKL9LFxTYgkyeu7g==
-
-"@esbuild/win32-x64@0.18.20":
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.18.20.tgz#786c5f41f043b07afb1af37683d7c33668858f6d"
-  integrity sha512-kTdfRcSiDfQca/y9QIkng02avJ+NCaQvrMejlsB3RRv5sE9rRoeBPISaZpKxHELzRxZyLvNts1P27W3wV+8geQ==
+"@esbuild/aix-ppc64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/aix-ppc64/-/aix-ppc64-0.19.11.tgz#2acd20be6d4f0458bc8c784103495ff24f13b1d3"
+  integrity sha512-FnzU0LyE3ySQk7UntJO4+qIiQgI7KoODnZg5xzXIrFJlKd2P2gwHsHY4927xj9y5PJmJSzULiUCWmv7iWnNa7g==
+
+"@esbuild/android-arm64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm64/-/android-arm64-0.19.11.tgz#b45d000017385c9051a4f03e17078abb935be220"
+  integrity sha512-aiu7K/5JnLj//KOnOfEZ0D90obUkRzDMyqd/wNAUQ34m4YUPVhRZpnqKV9uqDGxT7cToSDnIHsGooyIczu9T+Q==
+
+"@esbuild/android-arm@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-arm/-/android-arm-0.19.11.tgz#f46f55414e1c3614ac682b29977792131238164c"
+  integrity sha512-5OVapq0ClabvKvQ58Bws8+wkLCV+Rxg7tUVbo9xu034Nm536QTII4YzhaFriQ7rMrorfnFKUsArD2lqKbFY4vw==
+
+"@esbuild/android-x64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/android-x64/-/android-x64-0.19.11.tgz#bfc01e91740b82011ef503c48f548950824922b2"
+  integrity sha512-eccxjlfGw43WYoY9QgB82SgGgDbibcqyDTlk3l3C0jOVHKxrjdc9CTwDUQd0vkvYg5um0OH+GpxYvp39r+IPOg==
+
+"@esbuild/darwin-arm64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-arm64/-/darwin-arm64-0.19.11.tgz#533fb7f5a08c37121d82c66198263dcc1bed29bf"
+  integrity sha512-ETp87DRWuSt9KdDVkqSoKoLFHYTrkyz2+65fj9nfXsaV3bMhTCjtQfw3y+um88vGRKRiF7erPrh/ZuIdLUIVxQ==
+
+"@esbuild/darwin-x64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/darwin-x64/-/darwin-x64-0.19.11.tgz#62f3819eff7e4ddc656b7c6815a31cf9a1e7d98e"
+  integrity sha512-fkFUiS6IUK9WYUO/+22omwetaSNl5/A8giXvQlcinLIjVkxwTLSktbF5f/kJMftM2MJp9+fXqZ5ezS7+SALp4g==
+
+"@esbuild/freebsd-arm64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-arm64/-/freebsd-arm64-0.19.11.tgz#d478b4195aa3ca44160272dab85ef8baf4175b4a"
+  integrity sha512-lhoSp5K6bxKRNdXUtHoNc5HhbXVCS8V0iZmDvyWvYq9S5WSfTIHU2UGjcGt7UeS6iEYp9eeymIl5mJBn0yiuxA==
+
+"@esbuild/freebsd-x64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/freebsd-x64/-/freebsd-x64-0.19.11.tgz#7bdcc1917409178257ca6a1a27fe06e797ec18a2"
+  integrity sha512-JkUqn44AffGXitVI6/AbQdoYAq0TEullFdqcMY/PCUZ36xJ9ZJRtQabzMA+Vi7r78+25ZIBosLTOKnUXBSi1Kw==
+
+"@esbuild/linux-arm64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm64/-/linux-arm64-0.19.11.tgz#58ad4ff11685fcc735d7ff4ca759ab18fcfe4545"
+  integrity sha512-LneLg3ypEeveBSMuoa0kwMpCGmpu8XQUh+mL8XXwoYZ6Be2qBnVtcDI5azSvh7vioMDhoJFZzp9GWp9IWpYoUg==
+
+"@esbuild/linux-arm@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-arm/-/linux-arm-0.19.11.tgz#ce82246d873b5534d34de1e5c1b33026f35e60e3"
+  integrity sha512-3CRkr9+vCV2XJbjwgzjPtO8T0SZUmRZla+UL1jw+XqHZPkPgZiyWvbDvl9rqAN8Zl7qJF0O/9ycMtjU67HN9/Q==
+
+"@esbuild/linux-ia32@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ia32/-/linux-ia32-0.19.11.tgz#cbae1f313209affc74b80f4390c4c35c6ab83fa4"
+  integrity sha512-caHy++CsD8Bgq2V5CodbJjFPEiDPq8JJmBdeyZ8GWVQMjRD0sU548nNdwPNvKjVpamYYVL40AORekgfIubwHoA==
+
+"@esbuild/linux-loong64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.19.11.tgz#5f32aead1c3ec8f4cccdb7ed08b166224d4e9121"
+  integrity sha512-ppZSSLVpPrwHccvC6nQVZaSHlFsvCQyjnvirnVjbKSHuE5N24Yl8F3UwYUUR1UEPaFObGD2tSvVKbvR+uT1Nrg==
+
+"@esbuild/linux-mips64el@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-mips64el/-/linux-mips64el-0.19.11.tgz#38eecf1cbb8c36a616261de858b3c10d03419af9"
+  integrity sha512-B5x9j0OgjG+v1dF2DkH34lr+7Gmv0kzX6/V0afF41FkPMMqaQ77pH7CrhWeR22aEeHKaeZVtZ6yFwlxOKPVFyg==
+
+"@esbuild/linux-ppc64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-ppc64/-/linux-ppc64-0.19.11.tgz#9c5725a94e6ec15b93195e5a6afb821628afd912"
+  integrity sha512-MHrZYLeCG8vXblMetWyttkdVRjQlQUb/oMgBNurVEnhj4YWOr4G5lmBfZjHYQHHN0g6yDmCAQRR8MUHldvvRDA==
+
+"@esbuild/linux-riscv64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-riscv64/-/linux-riscv64-0.19.11.tgz#2dc4486d474a2a62bbe5870522a9a600e2acb916"
+  integrity sha512-f3DY++t94uVg141dozDu4CCUkYW+09rWtaWfnb3bqe4w5NqmZd6nPVBm+qbz7WaHZCoqXqHz5p6CM6qv3qnSSQ==
+
+"@esbuild/linux-s390x@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-s390x/-/linux-s390x-0.19.11.tgz#4ad8567df48f7dd4c71ec5b1753b6f37561a65a8"
+  integrity sha512-A5xdUoyWJHMMlcSMcPGVLzYzpcY8QP1RtYzX5/bS4dvjBGVxdhuiYyFwp7z74ocV7WDc0n1harxmpq2ePOjI0Q==
+
+"@esbuild/linux-x64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/linux-x64/-/linux-x64-0.19.11.tgz#b7390c4d5184f203ebe7ddaedf073df82a658766"
+  integrity sha512-grbyMlVCvJSfxFQUndw5mCtWs5LO1gUlwP4CDi4iJBbVpZcqLVT29FxgGuBJGSzyOxotFG4LoO5X+M1350zmPA==
+
+"@esbuild/netbsd-x64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/netbsd-x64/-/netbsd-x64-0.19.11.tgz#d633c09492a1721377f3bccedb2d821b911e813d"
+  integrity sha512-13jvrQZJc3P230OhU8xgwUnDeuC/9egsjTkXN49b3GcS5BKvJqZn86aGM8W9pd14Kd+u7HuFBMVtrNGhh6fHEQ==
+
+"@esbuild/openbsd-x64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/openbsd-x64/-/openbsd-x64-0.19.11.tgz#17388c76e2f01125bf831a68c03a7ffccb65d1a2"
+  integrity sha512-ysyOGZuTp6SNKPE11INDUeFVVQFrhcNDVUgSQVDzqsqX38DjhPEPATpid04LCoUr2WXhQTEZ8ct/EgJCUDpyNw==
+
+"@esbuild/sunos-x64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/sunos-x64/-/sunos-x64-0.19.11.tgz#e320636f00bb9f4fdf3a80e548cb743370d41767"
+  integrity sha512-Hf+Sad9nVwvtxy4DXCZQqLpgmRTQqyFyhT3bZ4F2XlJCjxGmRFF0Shwn9rzhOYRB61w9VMXUkxlBy56dk9JJiQ==
+
+"@esbuild/win32-arm64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-arm64/-/win32-arm64-0.19.11.tgz#c778b45a496e90b6fc373e2a2bb072f1441fe0ee"
+  integrity sha512-0P58Sbi0LctOMOQbpEOvOL44Ne0sqbS0XWHMvvrg6NE5jQ1xguCSSw9jQeUk2lfrXYsKDdOe6K+oZiwKPilYPQ==
+
+"@esbuild/win32-ia32@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-ia32/-/win32-ia32-0.19.11.tgz#481a65fee2e5cce74ec44823e6b09ecedcc5194c"
+  integrity sha512-6YOrWS+sDJDmshdBIQU+Uoyh7pQKrdykdefC1avn76ss5c+RN6gut3LZA4E2cH5xUEp5/cA0+YxRaVtRAb0xBg==
+
+"@esbuild/win32-x64@0.19.11":
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.19.11.tgz#a5d300008960bb39677c46bf16f53ec70d8dee04"
+  integrity sha512-vfkhltrjCAb603XaFhqhAF4LGDi2M4OrCRrFusyQ+iTLQ/o60QQXxc9cZC/FFpihBI9N1Grn6SMKVJ4KP7Fuiw==
 
 "@eslint-community/eslint-utils@^4.1.2", "@eslint-community/eslint-utils@^4.2.0", "@eslint-community/eslint-utils@^4.4.0":
   version "4.4.0"
@@ -2117,21 +2122,21 @@
   resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.5.1.tgz#fdb1ec4952b689f5f7aa0bffe46180bb35490032"
   integrity sha512-GkWzv+L6d2bI5f/Vk6ikJ9xtl7dfXtoRu3YGE6nq0p/FFqA1ebMOAWg3XgRyb0I6LYyYkiAo+3/KrwuBp8xG7A==
 
-"@fortawesome/fontawesome-svg-core@^6.4.2":
+"@fortawesome/fontawesome-svg-core@^6.5.1":
   version "6.5.1"
   resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.5.1.tgz#9d56d46bddad78a7ebb2043a97957039fcebcf0a"
   integrity sha512-MfRCYlQPXoLlpem+egxjfkEuP9UQswTrlCOsknus/NcMoblTH2g0jPrapbcIb04KGA7E2GZxbAccGZfWoYgsrQ==
   dependencies:
     "@fortawesome/fontawesome-common-types" "6.5.1"
 
-"@fortawesome/free-regular-svg-icons@^6.4.2":
+"@fortawesome/free-regular-svg-icons@^6.5.1":
   version "6.5.1"
   resolved "https://registry.yarnpkg.com/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-6.5.1.tgz#c98a91d2c9137ed54a7aa2362a916f46503e0627"
   integrity sha512-m6ShXn+wvqEU69wSP84coxLbNl7sGVZb+Ca+XZq6k30SzuP3X4TfPqtycgUh9ASwlNh5OfQCd8pDIWxl+O+LlQ==
   dependencies:
     "@fortawesome/fontawesome-common-types" "6.5.1"
 
-"@fortawesome/free-solid-svg-icons@^6.4.2":
+"@fortawesome/free-solid-svg-icons@^6.5.1":
   version "6.5.1"
   resolved "https://registry.yarnpkg.com/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-6.5.1.tgz#737b8d787debe88b400ab7528f47be333031274a"
   integrity sha512-S1PPfU3mIJa59biTtXJz1oI0+KAXW6bkAb31XKhxdxtuXDiUIFsih4JR1v5BbxY7hVHsD1RKq+jRkVRaf773NQ==
@@ -2202,15 +2207,23 @@
     source-map-js "^1.0.1"
     yaml-eslint-parser "^1.2.2"
 
-"@intlify/core-base@9.8.0":
-  version "9.8.0"
-  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.8.0.tgz#969ca59f55084e23e968ec0bfe71678774e568ec"
-  integrity sha512-UxaSZVZ1DwqC/CltUZrWZNaWNhfmKtfyV4BJSt/Zt4Or/fZs1iFj0B+OekYk1+MRHfIOe3+x00uXGQI4PbO/9g==
+"@intlify/core-base@9.9.0":
+  version "9.9.0"
+  resolved "https://registry.yarnpkg.com/@intlify/core-base/-/core-base-9.9.0.tgz#edc55a5e3dbbf8dbbbf656529ed27832c4c4f522"
+  integrity sha512-C7UXPymDIOlMGSNjAhNLtKgzITc/8BjINK5gNKXg8GiWCTwL6n3MWr55czksxn8RM5wTMz0qcLOFT+adtaVQaA==
   dependencies:
-    "@intlify/message-compiler" "9.8.0"
-    "@intlify/shared" "9.8.0"
+    "@intlify/message-compiler" "9.9.0"
+    "@intlify/shared" "9.9.0"
+
+"@intlify/message-compiler@9.9.0":
+  version "9.9.0"
+  resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.9.0.tgz#7952759329e7af0388afbce7a984820bbeff82eb"
+  integrity sha512-yDU/jdUm9KuhEzYfS+wuyja209yXgdl1XFhMlKtXEgSFTxz4COZQCRXXbbH8JrAjMsaJ7bdoPSLsKlY6mXG2iA==
+  dependencies:
+    "@intlify/shared" "9.9.0"
+    source-map-js "^1.0.2"
 
-"@intlify/message-compiler@9.8.0", "@intlify/message-compiler@^9.4.0":
+"@intlify/message-compiler@^9.4.0":
   version "9.8.0"
   resolved "https://registry.yarnpkg.com/@intlify/message-compiler/-/message-compiler-9.8.0.tgz#587d69b302f9b8130a4a949b0ab4add519761787"
   integrity sha512-McnYWhcoYmDJvssVu6QGR0shqlkJuL1HHdi5lK7fNqvQqRYaQ4lSLjYmZxwc8tRNMdIe9/KUKfyPxU9M6yCtNQ==
@@ -2223,10 +2236,15 @@
   resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.8.0.tgz#62adf8f6ef67c8eba6cf8d521e248f3503f237d3"
   integrity sha512-TmgR0RCLjzrSo+W3wT0ALf9851iFMlVI9EYNGeWvZFUQTAJx0bvfsMlPdgVtV1tDNRiAfhkFsMKu6jtUY1ZLKQ==
 
-"@intlify/unplugin-vue-i18n@^1.5.0":
-  version "1.6.0"
-  resolved "https://registry.yarnpkg.com/@intlify/unplugin-vue-i18n/-/unplugin-vue-i18n-1.6.0.tgz#49ab21125c79257e455a6e562a2511c8681b870c"
-  integrity sha512-IGeFNWxdEvB12E/3Y/+nmIsGeTg5okPsK1XEtUUD/DdkHbVqUbJucMpHKeHF8Px55Qca551pQCs/g+VjNUt6KA==
+"@intlify/shared@9.9.0":
+  version "9.9.0"
+  resolved "https://registry.yarnpkg.com/@intlify/shared/-/shared-9.9.0.tgz#56907633c0f7b2d50f53269d31e88e7b24d39187"
+  integrity sha512-1ECUyAHRrzOJbOizyGufYP2yukqGrWXtkmTu4PcswVnWbkcjzk3YQGmJ0bLkM7JZ0ZYAaohLGdYvBYnTOGYJ9g==
+
+"@intlify/unplugin-vue-i18n@^2.0.0":
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/@intlify/unplugin-vue-i18n/-/unplugin-vue-i18n-2.0.0.tgz#5b087e17b4eb4381d0a111cd89df4037880e932f"
+  integrity sha512-1oKvm92L9l2od2H9wKx2ZvR4tzn7gUtd7bPLI7AWUmm7U9H1iEypndt5d985ypxGsEs0gToDaKTrytbBIJwwSg==
   dependencies:
     "@intlify/bundle-utils" "^7.4.0"
     "@intlify/shared" "^9.4.0"
@@ -2683,10 +2701,70 @@
     estree-walker "^2.0.2"
     picomatch "^2.3.1"
 
-"@rushstack/eslint-patch@^1.5.1":
-  version "1.6.1"
-  resolved "https://registry.yarnpkg.com/@rushstack/eslint-patch/-/eslint-patch-1.6.1.tgz#9ab8f811930d7af3e3d549183a50884f9eb83f36"
-  integrity sha512-UY+FGM/2jjMkzQLn8pxcHGMaVLh9aEitG3zY2CiY7XHdLiz3bZOwa6oDxNqEMv7zZkV+cj5DOdz0cQ1BP5Hjgw==
+"@rollup/rollup-android-arm-eabi@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.9.4.tgz#b1094962742c1a0349587040bc06185e2a667c9b"
+  integrity sha512-ub/SN3yWqIv5CWiAZPHVS1DloyZsJbtXmX4HxUTIpS0BHm9pW5iYBo2mIZi+hE3AeiTzHz33blwSnhdUo+9NpA==
+
+"@rollup/rollup-android-arm64@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.9.4.tgz#96eb86fb549e05b187f2ad06f51d191a23cb385a"
+  integrity sha512-ehcBrOR5XTl0W0t2WxfTyHCR/3Cq2jfb+I4W+Ch8Y9b5G+vbAecVv0Fx/J1QKktOrgUYsIKxWAKgIpvw56IFNA==
+
+"@rollup/rollup-darwin-arm64@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.9.4.tgz#2456630c007cc5905cb368acb9ff9fc04b2d37be"
+  integrity sha512-1fzh1lWExwSTWy8vJPnNbNM02WZDS8AW3McEOb7wW+nPChLKf3WG2aG7fhaUmfX5FKw9zhsF5+MBwArGyNM7NA==
+
+"@rollup/rollup-darwin-x64@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.9.4.tgz#97742214fc7dfd47a0f74efba6f5ae264e29c70c"
+  integrity sha512-Gc6cukkF38RcYQ6uPdiXi70JB0f29CwcQ7+r4QpfNpQFVHXRd0DfWFidoGxjSx1DwOETM97JPz1RXL5ISSB0pA==
+
+"@rollup/rollup-linux-arm-gnueabihf@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.9.4.tgz#cd933e61d6f689c9cdefde424beafbd92cfe58e2"
+  integrity sha512-g21RTeFzoTl8GxosHbnQZ0/JkuFIB13C3T7Y0HtKzOXmoHhewLbVTFBQZu+z5m9STH6FZ7L/oPgU4Nm5ErN2fw==
+
+"@rollup/rollup-linux-arm64-gnu@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.9.4.tgz#33b09bf462f1837afc1e02a1b352af6b510c78a6"
+  integrity sha512-TVYVWD/SYwWzGGnbfTkrNpdE4HON46orgMNHCivlXmlsSGQOx/OHHYiQcMIOx38/GWgwr/po2LBn7wypkWw/Mg==
+
+"@rollup/rollup-linux-arm64-musl@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.9.4.tgz#50257fb248832c2308064e3764a16273b6ee4615"
+  integrity sha512-XcKvuendwizYYhFxpvQ3xVpzje2HHImzg33wL9zvxtj77HvPStbSGI9czrdbfrf8DGMcNNReH9pVZv8qejAQ5A==
+
+"@rollup/rollup-linux-riscv64-gnu@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.9.4.tgz#09589e4e1a073cf56f6249b77eb6c9a8e9b613a8"
+  integrity sha512-LFHS/8Q+I9YA0yVETyjonMJ3UA+DczeBd/MqNEzsGSTdNvSJa1OJZcSH8GiXLvcizgp9AlHs2walqRcqzjOi3A==
+
+"@rollup/rollup-linux-x64-gnu@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.9.4.tgz#bd312bb5b5f02e54d15488605d15cfd3f90dda7c"
+  integrity sha512-dIYgo+j1+yfy81i0YVU5KnQrIJZE8ERomx17ReU4GREjGtDW4X+nvkBak2xAUpyqLs4eleDSj3RrV72fQos7zw==
+
+"@rollup/rollup-linux-x64-musl@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.9.4.tgz#25b3bede85d86438ce28cc642842d10d867d40e9"
+  integrity sha512-RoaYxjdHQ5TPjaPrLsfKqR3pakMr3JGqZ+jZM0zP2IkDtsGa4CqYaWSfQmZVgFUCgLrTnzX+cnHS3nfl+kB6ZQ==
+
+"@rollup/rollup-win32-arm64-msvc@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.9.4.tgz#95957067eb107f571da1d81939f017d37b4958d3"
+  integrity sha512-T8Q3XHV+Jjf5e49B4EAaLKV74BbX7/qYBRQ8Wop/+TyyU0k+vSjiLVSHNWdVd1goMjZcbhDmYZUYW5RFqkBNHQ==
+
+"@rollup/rollup-win32-ia32-msvc@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.9.4.tgz#71b6facad976db527863f698692c6964c0b6e10e"
+  integrity sha512-z+JQ7JirDUHAsMecVydnBPWLwJjbppU+7LZjffGf+Jvrxq+dVjIE7By163Sc9DKc3ADSU50qPVw0KonBS+a+HQ==
+
+"@rollup/rollup-win32-x64-msvc@4.9.4":
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.9.4.tgz#16295ccae354707c9bc6842906bdeaad4f3ba7a5"
+  integrity sha512-LfdGXCV9rdEify1oxlN9eamvDSjv9md9ZVMAbNHA87xqIfFCxImxan9qZ8+Un54iK2nnqPlbnSi4R54ONtbWBw==
 
 "@sinclair/typebox@^0.27.8":
   version "0.27.8"
@@ -3393,7 +3471,7 @@
   resolved "https://registry.yarnpkg.com/@types/d3-time-format/-/d3-time-format-4.0.3.tgz#d6bc1e6b6a7db69cccfbbdd4c34b70632d9e9db2"
   integrity sha512-5xg9rC+wWL8kdDj153qZcsJ0FWiFt0J5RB6LYUNZjwSnesfblqrI/bJ1wBdJ8OQfncgbJG5+2F+qfqnqyzYxyg==
 
-"@types/estree@^1.0.0":
+"@types/estree@1.0.5", "@types/estree@^1.0.0":
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.5.tgz#a6ce3e556e00fd9895dd872dd172ad0d4bd687f4"
   integrity sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==
@@ -3504,7 +3582,7 @@
   resolved "https://registry.yarnpkg.com/@types/linkify-it/-/linkify-it-3.0.5.tgz#1e78a3ac2428e6d7e6c05c1665c242023a4601d8"
   integrity sha512-yg6E+u0/+Zjva+buc3EIb+29XEg4wltq7cSmd4Uc2EE/1nUVmxyzpX6gUXD0V8jIrG0r7YeOGVIbYRkxeooCtw==
 
-"@types/lodash-es@^4.17.11":
+"@types/lodash-es@^4.17.12":
   version "4.17.12"
   resolved "https://registry.yarnpkg.com/@types/lodash-es/-/lodash-es-4.17.12.tgz#65f6d1e5f80539aa7cfbfc962de5def0cf4f341b"
   integrity sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==
@@ -3577,10 +3655,10 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-18.17.15.tgz#31301a273b9ca7d568fe6d1c35ae52e0fb3f8d6a"
   integrity sha512-2yrWpBk32tvV/JAd3HNHWuZn/VDN1P+72hWirHnvsvTGSqbANi+kSeuQR9yAHnbvaBvHDsoTdXV0Fe+iRtHLKA==
 
-"@types/node@^18.18.9":
-  version "18.18.14"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-18.18.14.tgz#26771c647f2842af57eb96191cd615d845164295"
-  integrity sha512-iSOeNeXYNYNLLOMDSVPvIFojclvMZ/HDY2dU17kUlcsOsSQETbWIslJbYLZgA+ox8g2XQwSHKTkght1a5X26lQ==
+"@types/node@^18.19.5":
+  version "18.19.5"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-18.19.5.tgz#4b23a9ab8ab7dafebb57bcbaf5c3d8d04f9d8cac"
+  integrity sha512-22MG6T02Hos2JWfa1o5jsIByn+bc5iOt1IS4xyg6OG68Bu+wMonVZzdrgCw693++rpLE9RUT/Bx15BeDzO0j+g==
   dependencies:
     undici-types "~5.26.4"
 
@@ -3838,10 +3916,10 @@
   resolved "https://registry.yarnpkg.com/@ungap/structured-clone/-/structured-clone-1.2.0.tgz#756641adb587851b5ccb3e095daf27ae581c8406"
   integrity sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==
 
-"@vitejs/plugin-vue@^4.4.0":
-  version "4.5.2"
-  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-4.5.2.tgz#1212d81bc83680e14448fefe55abd9fe1ed49ed1"
-  integrity sha512-UGR3DlzLi/SaVBPX0cnSyE37vqxU3O6chn8l0HJNzQzDia6/Au2A4xKv+iIJW8w2daf80G7TYHhi1pAUjdZ0bQ==
+"@vitejs/plugin-vue@^5.0.2":
+  version "5.0.2"
+  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-5.0.2.tgz#8428ec3f446b9c2f7a7ec950f34e3d6f3c665444"
+  integrity sha512-kEjJHrLb5ePBvjD0SPZwJlw1QTRcjjCA9sB5VyfonoXVBxTS7TMnqL6EkLt1Eu61RDeiuZ/WN9Hf6PxXhPI2uA==
 
 "@volar/language-core@1.11.1", "@volar/language-core@~1.11.1":
   version "1.11.1"
@@ -3997,6 +4075,17 @@
     estree-walker "^2.0.2"
     source-map-js "^1.0.2"
 
+"@vue/compiler-core@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.4.7.tgz#7c4d0f23a21e2e0e76ef9806b702712f23015e04"
+  integrity sha512-hhCaE3pTMrlIJK7M/o3Xf7HV8+JoNTGOQ/coWS+V+pH6QFFyqtoXqQzpqsNp7UK17xYKua/MBiKj4e1vgZOBYw==
+  dependencies:
+    "@babel/parser" "^7.23.6"
+    "@vue/shared" "3.4.7"
+    entities "^4.5.0"
+    estree-walker "^2.0.2"
+    source-map-js "^1.0.2"
+
 "@vue/compiler-dom@3.3.11", "@vue/compiler-dom@^3.3.0":
   version "3.3.11"
   resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.3.11.tgz#36a76ea3a296d41bad133a6912cb0a847d969e4f"
@@ -4005,6 +4094,14 @@
     "@vue/compiler-core" "3.3.11"
     "@vue/shared" "3.3.11"
 
+"@vue/compiler-dom@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.4.7.tgz#19c41236b56f2d4b777521587aea129636c52417"
+  integrity sha512-qDKBAIurCTub4n/6jDYkXwgsFuriqqmmLrIq1N2QDfYJA/mwiwvxi09OGn28g+uDdERX9NaKDLji0oTjE3sScg==
+  dependencies:
+    "@vue/compiler-core" "3.4.7"
+    "@vue/shared" "3.4.7"
+
 "@vue/compiler-sfc@2.7.15":
   version "2.7.15"
   resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-2.7.15.tgz#62135fb2f69559fc723fd9c56b8e8b0ac7864a0b"
@@ -4014,7 +4111,22 @@
     postcss "^8.4.14"
     source-map "^0.6.1"
 
-"@vue/compiler-sfc@3.3.11", "@vue/compiler-sfc@^3.2.47":
+"@vue/compiler-sfc@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.4.7.tgz#2a50c25f163695a45ed7a085c82ee2b22f68f78d"
+  integrity sha512-Gec6CLkReVswDYjQFq79O5rktri4R7TsD/VPCiUoJw40JhNNxaNJJa8mrQrWoJluW4ETy6QN0NUyC/JO77OCOw==
+  dependencies:
+    "@babel/parser" "^7.23.6"
+    "@vue/compiler-core" "3.4.7"
+    "@vue/compiler-dom" "3.4.7"
+    "@vue/compiler-ssr" "3.4.7"
+    "@vue/shared" "3.4.7"
+    estree-walker "^2.0.2"
+    magic-string "^0.30.5"
+    postcss "^8.4.32"
+    source-map-js "^1.0.2"
+
+"@vue/compiler-sfc@^3.2.47":
   version "3.3.11"
   resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.3.11.tgz#acfae240c875d067e0e2c9a4e2d910074408c73b"
   integrity sha512-U4iqPlHO0KQeK1mrsxCN0vZzw43/lL8POxgpzcJweopmqtoYy9nljJzWDIQS3EfjiYhfdtdk9Gtgz7MRXnz3GA==
@@ -4038,6 +4150,14 @@
     "@vue/compiler-dom" "3.3.11"
     "@vue/shared" "3.3.11"
 
+"@vue/compiler-ssr@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.4.7.tgz#76020fad73d0beef0953946d2c5aacb3faafff84"
+  integrity sha512-PvYeSOvnCkST5mGS0TLwEn5w+4GavtEn6adcq8AspbHaIr+mId5hp7cG3ASy3iy8b+LuXEG2/QaV/nj5BQ/Aww==
+  dependencies:
+    "@vue/compiler-dom" "3.4.7"
+    "@vue/shared" "3.4.7"
+
 "@vue/component-compiler-utils@^3.1.0":
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/@vue/component-compiler-utils/-/component-compiler-utils-3.3.0.tgz#f9f5fb53464b0c37b2c8d2f3fbfe44df60f61dc9"
@@ -4059,12 +4179,12 @@
   resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.5.1.tgz#7f71f31e40973eeee65b9a64382b13593fdbd697"
   integrity sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA==
 
-"@vue/eslint-config-prettier@^8.0.0":
-  version "8.0.0"
-  resolved "https://registry.yarnpkg.com/@vue/eslint-config-prettier/-/eslint-config-prettier-8.0.0.tgz#de5cb77ed483b43683d17a788808a0fa4e7bd07e"
-  integrity sha512-55dPqtC4PM/yBjhAr+yEw6+7KzzdkBuLmnhBrDfp4I48+wy+Giqqj9yUr5T2uD/BkBROjjmqnLZmXRdOx/VtQg==
+"@vue/eslint-config-prettier@^9.0.0":
+  version "9.0.0"
+  resolved "https://registry.yarnpkg.com/@vue/eslint-config-prettier/-/eslint-config-prettier-9.0.0.tgz#f63394f8f7759d92b6ef3f3e1d30ff6b0c0b97c1"
+  integrity sha512-z1ZIAAUS9pKzo/ANEfd2sO+v2IUalz7cM/cTLOZ7vRFOPk5/xuRKQteOu1DErFLAh/lYGXMVZ0IfYKlyInuDVg==
   dependencies:
-    eslint-config-prettier "^8.8.0"
+    eslint-config-prettier "^9.0.0"
     eslint-plugin-prettier "^5.0.0"
 
 "@vue/eslint-config-typescript@^12.0.0":
@@ -4102,47 +4222,52 @@
     estree-walker "^2.0.2"
     magic-string "^0.30.5"
 
-"@vue/reactivity@3.3.11":
-  version "3.3.11"
-  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.3.11.tgz#91f8e6c9ac60a595a5278c836b197628fd947a0d"
-  integrity sha512-D5tcw091f0nuu+hXq5XANofD0OXnBmaRqMYl5B3fCR+mX+cXJIGNw/VNawBqkjLNWETrFW0i+xH9NvDbTPVh7g==
+"@vue/reactivity@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.4.7.tgz#034064c673fe22718c79ab95bb05dd72ce17d709"
+  integrity sha512-F539DO0ogH0+L8F9Pnw7cjqibcmSOh5UTk16u5f4MKQ8fraqepI9zdh+sozPX6VmEHOcjo8qw3Or9ZcFFw4SZA==
   dependencies:
-    "@vue/shared" "3.3.11"
+    "@vue/shared" "3.4.7"
 
-"@vue/runtime-core@3.3.11":
-  version "3.3.11"
-  resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.3.11.tgz#63defba57bc54c1dac68a95b56c2633b1419193d"
-  integrity sha512-g9ztHGwEbS5RyWaOpXuyIVFTschclnwhqEbdy5AwGhYOgc7m/q3NFwr50MirZwTTzX55JY8pSkeib9BX04NIpw==
+"@vue/runtime-core@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.4.7.tgz#c1e59a2c190d36b23589545dd3a471ce9f63f784"
+  integrity sha512-QMMsWRQaD3BpGyjjChthpl4Mji4Fjx1qfdufsXlDkKU3HV+hWNor2z+29F+E1MmVcP0ZfRZUfqYgtsQoL7IGwQ==
   dependencies:
-    "@vue/reactivity" "3.3.11"
-    "@vue/shared" "3.3.11"
+    "@vue/reactivity" "3.4.7"
+    "@vue/shared" "3.4.7"
 
-"@vue/runtime-dom@3.3.11":
-  version "3.3.11"
-  resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.3.11.tgz#1146d8d280b0fec4d2e18c4a4c8f8121d0cecc09"
-  integrity sha512-OlhtV1PVpbgk+I2zl+Y5rQtDNcCDs12rsRg71XwaA2/Rbllw6mBLMi57VOn8G0AjOJ4Mdb4k56V37+g8ukShpQ==
+"@vue/runtime-dom@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.4.7.tgz#b16c8be22a345dc5b63338b0d2bc3240a58ca6ac"
+  integrity sha512-XwegyUY1rw8zxsX1Z36vwYcqo+uOgih5ti7y9vx+pPFhNdSQmN4LqK2RmSeAJG1oKV8NqSUmjpv92f/x6h0SeQ==
   dependencies:
-    "@vue/runtime-core" "3.3.11"
-    "@vue/shared" "3.3.11"
-    csstype "^3.1.2"
+    "@vue/runtime-core" "3.4.7"
+    "@vue/shared" "3.4.7"
+    csstype "^3.1.3"
 
-"@vue/server-renderer@3.3.11":
-  version "3.3.11"
-  resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.3.11.tgz#409aed8031a125791e2143552975ecd1958ad601"
-  integrity sha512-AIWk0VwwxCAm4wqtJyxBylRTXSy1wCLOKbWxHaHiu14wjsNYtiRCSgVuqEPVuDpErOlRdNnuRgipQfXRLjLN5A==
+"@vue/server-renderer@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.4.7.tgz#97efcfeebd299d96ebd1817372f5a75ec3f3af96"
+  integrity sha512-3bWnYLEkLLhkDWqvNk7IvbQD4UcxvFKxELBiOO2iG3m6AniFIsBWfHOO5tLVQnjdWkODu4rq0GipmfEenVAK5Q==
   dependencies:
-    "@vue/compiler-ssr" "3.3.11"
-    "@vue/shared" "3.3.11"
+    "@vue/compiler-ssr" "3.4.7"
+    "@vue/shared" "3.4.7"
 
 "@vue/shared@3.3.11", "@vue/shared@^3.3.0":
   version "3.3.11"
   resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.3.11.tgz#f6a038e15237edefcc90dbfe7edb806dd355c7bd"
   integrity sha512-u2G8ZQ9IhMWTMXaWqZycnK4UthG1fA238CD+DP4Dm4WJi5hdUKKLg0RMRaRpDPNMdkTwIDkp7WtD0Rd9BH9fLw==
 
-"@vue/tsconfig@^0.4.0":
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/@vue/tsconfig/-/tsconfig-0.4.0.tgz#f01e2f6089b5098136fb084a0dd0cdd4533b72b0"
-  integrity sha512-CPuIReonid9+zOG/CGTT05FXrPYATEqoDGNrEaqS4hwcw5BUNM2FguC0mOwJD4Jr16UpRVl9N0pY3P+srIbqmg==
+"@vue/shared@3.4.7":
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.4.7.tgz#14fce32833f9f4811a2997c072f19e4adfed19d2"
+  integrity sha512-G+i4glX1dMJk88sbJEcQEGWRQnVm9eIY7CcQbO5dpdsD9SF8jka3Mr5OqZYGjczGN1+D6EUwdu6phcmcx9iuPA==
+
+"@vue/tsconfig@^0.5.1":
+  version "0.5.1"
+  resolved "https://registry.yarnpkg.com/@vue/tsconfig/-/tsconfig-0.5.1.tgz#3124ec16cc0c7e04165b88dc091e6b97782fffa9"
+  integrity sha512-VcZK7MvpjuTPx2w6blwnwZAu5/LgBUtejFOi3pPGQFXQN5Ela03FUtd2Qtg4yWGGissVL0dr6Ro1LfOFh+PCuQ==
 
 "@vuepress/core@1.9.10":
   version "1.9.10"
@@ -4292,33 +4417,33 @@
     "@types/webpack-dev-server" "^3"
     webpack-chain "^6.0.0"
 
-"@vueuse/core@^10.5.0":
-  version "10.7.0"
-  resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-10.7.0.tgz#34f2f02f179dc0dcffc2be70d6b1233e011404b9"
-  integrity sha512-4EUDESCHtwu44ZWK3Gc/hZUVhVo/ysvdtwocB5vcauSV4B7NiGY5972WnsojB3vRNdxvAt7kzJWE2h9h7C9d5w==
+"@vueuse/core@^10.7.1":
+  version "10.7.1"
+  resolved "https://registry.yarnpkg.com/@vueuse/core/-/core-10.7.1.tgz#b4bfe3355dbb0ec17d34d737385e1c8a0156ccf1"
+  integrity sha512-74mWHlaesJSWGp1ihg76vAnfVq9NTv1YT0SYhAQ6zwFNdBkkP+CKKJmVOEHcdSnLXCXYiL5e7MaewblfiYLP7g==
   dependencies:
     "@types/web-bluetooth" "^0.0.20"
-    "@vueuse/metadata" "10.7.0"
-    "@vueuse/shared" "10.7.0"
+    "@vueuse/metadata" "10.7.1"
+    "@vueuse/shared" "10.7.1"
     vue-demi ">=0.14.6"
 
-"@vueuse/math@^10.5.0":
-  version "10.7.0"
-  resolved "https://registry.yarnpkg.com/@vueuse/math/-/math-10.7.0.tgz#c0b9f81a8f2a1218dd11c90520602cc684e59965"
-  integrity sha512-JTHFTQ/Mr5nGe6YYC30evYna+981TR6HYFvjD83Aay2dLIEVZGRwM8+f6IxOGcoq9u95hFkhOcer/VsjIDvETg==
+"@vueuse/math@^10.7.1":
+  version "10.7.1"
+  resolved "https://registry.yarnpkg.com/@vueuse/math/-/math-10.7.1.tgz#7b7566b17fb725bf0028309cbd46ed0bd32cc140"
+  integrity sha512-Oz9OHRK+NOVhkH4FfMkQu7cHkvPhSrb3gIE0tHN0OGYplRRFeiLQit/JOLJz85Xhaae+IezCmCt2MeoLaZdgVw==
   dependencies:
-    "@vueuse/shared" "10.7.0"
+    "@vueuse/shared" "10.7.1"
     vue-demi ">=0.14.6"
 
-"@vueuse/metadata@10.7.0":
-  version "10.7.0"
-  resolved "https://registry.yarnpkg.com/@vueuse/metadata/-/metadata-10.7.0.tgz#7b05e6cfd376aa9bb339a81e16a89c12f3e88c03"
-  integrity sha512-GlaH7tKP2iBCZ3bHNZ6b0cl9g0CJK8lttkBNUX156gWvNYhTKEtbweWLm9rxCPIiwzYcr/5xML6T8ZUEt+DkvA==
+"@vueuse/metadata@10.7.1":
+  version "10.7.1"
+  resolved "https://registry.yarnpkg.com/@vueuse/metadata/-/metadata-10.7.1.tgz#190a8d0e97216941cc95120c89dfa2c4228b2a53"
+  integrity sha512-jX8MbX5UX067DYVsbtrmKn6eG6KMcXxLRLlurGkZku5ZYT3vxgBjui2zajvUZ18QLIjrgBkFRsu7CqTAg18QFw==
 
-"@vueuse/shared@10.7.0":
-  version "10.7.0"
-  resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-10.7.0.tgz#21e425cc5ede421e0cda38ac59a0beee6da86b1b"
-  integrity sha512-kc00uV6CiaTdc3i1CDC4a3lBxzaBE9AgYNtFN87B5OOscqeWElj/uza8qVDmk7/U8JbqoONLbtqiLJ5LGRuqlw==
+"@vueuse/shared@10.7.1", "@vueuse/shared@^10.7.1":
+  version "10.7.1"
+  resolved "https://registry.yarnpkg.com/@vueuse/shared/-/shared-10.7.1.tgz#b9892fc31784d685619015fba287cde53873485d"
+  integrity sha512-v0jbRR31LSgRY/C5i5X279A/WQjD6/JsMzGa+eqt658oJ75IvQXAeONmwvEMrvJQKnRElq/frzBR7fhmWY5uLw==
   dependencies:
     vue-demi ">=0.14.6"
 
@@ -7846,7 +7971,7 @@ csso@^4.0.2:
   dependencies:
     css-tree "^1.1.2"
 
-csstype@^3.0.2, csstype@^3.1.0, csstype@^3.1.2:
+csstype@^3.0.2, csstype@^3.1.0, csstype@^3.1.3:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.3.tgz#d80ff294d114fb0e6ac500fbf85b60137d7eff81"
   integrity sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==
@@ -8997,6 +9122,14 @@ enhanced-resolve@^4.5.0:
     memory-fs "^0.5.0"
     tapable "^1.0.0"
 
+enhanced-resolve@^5.12.0:
+  version "5.15.0"
+  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.15.0.tgz#1af946c7d93603eb88e9896cee4904dc012e9c35"
+  integrity sha512-LXYT42KJ7lpIKECr2mAXIaMldcNCh/7E0KBKOu4KSfkHmP+mZmSs+8V5gBAqisWBy0OO4W5Oyys0GO1Y8KtdKg==
+  dependencies:
+    graceful-fs "^4.2.4"
+    tapable "^2.2.0"
+
 ensure-array@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/ensure-array/-/ensure-array-1.0.0.tgz#317e9fc632c656bb849eb649133528e205b23abc"
@@ -9007,7 +9140,7 @@ entities@^2.0.0:
   resolved "https://registry.yarnpkg.com/entities/-/entities-2.2.0.tgz#098dc90ebb83d8dffa089d55256b351d34c4da55"
   integrity sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==
 
-entities@^4.2.0, entities@^4.4.0:
+entities@^4.2.0, entities@^4.4.0, entities@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/entities/-/entities-4.5.0.tgz#5d268ea5e7113ec74c4d033b79ea5a35a488fb48"
   integrity sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==
@@ -9362,33 +9495,34 @@ esbuild@0.14.7:
     esbuild-windows-64 "0.14.7"
     esbuild-windows-arm64 "0.14.7"
 
-esbuild@^0.18.10:
-  version "0.18.20"
-  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.18.20.tgz#4709f5a34801b43b799ab7d6d82f7284a9b7a7a6"
-  integrity sha512-ceqxoedUrcayh7Y7ZX6NdbbDzGROiyVBgC4PriJThBKSVPWnnFHZAkfI1lJT8QFkOwH4qOS2SJkS4wvpGl8BpA==
+esbuild@^0.19.3:
+  version "0.19.11"
+  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.19.11.tgz#4a02dca031e768b5556606e1b468fe72e3325d96"
+  integrity sha512-HJ96Hev2hX/6i5cDVwcqiJBBtuo9+FeIJOtZ9W1kA5M6AMJRHUZlpYZ1/SbEwtO0ioNAW8rUooVpC/WehY2SfA==
   optionalDependencies:
-    "@esbuild/android-arm" "0.18.20"
-    "@esbuild/android-arm64" "0.18.20"
-    "@esbuild/android-x64" "0.18.20"
-    "@esbuild/darwin-arm64" "0.18.20"
-    "@esbuild/darwin-x64" "0.18.20"
-    "@esbuild/freebsd-arm64" "0.18.20"
-    "@esbuild/freebsd-x64" "0.18.20"
-    "@esbuild/linux-arm" "0.18.20"
-    "@esbuild/linux-arm64" "0.18.20"
-    "@esbuild/linux-ia32" "0.18.20"
-    "@esbuild/linux-loong64" "0.18.20"
-    "@esbuild/linux-mips64el" "0.18.20"
-    "@esbuild/linux-ppc64" "0.18.20"
-    "@esbuild/linux-riscv64" "0.18.20"
-    "@esbuild/linux-s390x" "0.18.20"
-    "@esbuild/linux-x64" "0.18.20"
-    "@esbuild/netbsd-x64" "0.18.20"
-    "@esbuild/openbsd-x64" "0.18.20"
-    "@esbuild/sunos-x64" "0.18.20"
-    "@esbuild/win32-arm64" "0.18.20"
-    "@esbuild/win32-ia32" "0.18.20"
-    "@esbuild/win32-x64" "0.18.20"
+    "@esbuild/aix-ppc64" "0.19.11"
+    "@esbuild/android-arm" "0.19.11"
+    "@esbuild/android-arm64" "0.19.11"
+    "@esbuild/android-x64" "0.19.11"
+    "@esbuild/darwin-arm64" "0.19.11"
+    "@esbuild/darwin-x64" "0.19.11"
+    "@esbuild/freebsd-arm64" "0.19.11"
+    "@esbuild/freebsd-x64" "0.19.11"
+    "@esbuild/linux-arm" "0.19.11"
+    "@esbuild/linux-arm64" "0.19.11"
+    "@esbuild/linux-ia32" "0.19.11"
+    "@esbuild/linux-loong64" "0.19.11"
+    "@esbuild/linux-mips64el" "0.19.11"
+    "@esbuild/linux-ppc64" "0.19.11"
+    "@esbuild/linux-riscv64" "0.19.11"
+    "@esbuild/linux-s390x" "0.19.11"
+    "@esbuild/linux-x64" "0.19.11"
+    "@esbuild/netbsd-x64" "0.19.11"
+    "@esbuild/openbsd-x64" "0.19.11"
+    "@esbuild/sunos-x64" "0.19.11"
+    "@esbuild/win32-arm64" "0.19.11"
+    "@esbuild/win32-ia32" "0.19.11"
+    "@esbuild/win32-x64" "0.19.11"
 
 escalade@^3.1.1:
   version "3.1.1"
@@ -9436,11 +9570,6 @@ eslint-compat-utils@^0.1.2:
   resolved "https://registry.yarnpkg.com/eslint-compat-utils/-/eslint-compat-utils-0.1.2.tgz#f45e3b5ced4c746c127cf724fb074cd4e730d653"
   integrity sha512-Jia4JDldWnFNIru1Ehx1H5s9/yxiRHY/TimCuUc0jNexew3cF1gI6CYZil1ociakfWO3rRqFjl1mskBblB3RYg==
 
-eslint-config-prettier@^8.8.0:
-  version "8.10.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.10.0.tgz#3a06a662130807e2502fc3ff8b4143d8a0658e11"
-  integrity sha512-SM8AMJdeQqRYT9O9zguiruQZaN7+z+E4eAP9oiLNGKMtomwaB1E9dcgUD6ZAn/eQAb52USbvezbiljfZUhbJcg==
-
 eslint-config-prettier@^9.0.0:
   version "9.1.0"
   resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-9.1.0.tgz#31af3d94578645966c082fcb71a5846d3c94867f"
@@ -9456,6 +9585,19 @@ eslint-config-standard@^17.0.0:
   resolved "https://registry.yarnpkg.com/eslint-config-standard/-/eslint-config-standard-17.1.0.tgz#40ffb8595d47a6b242e07cbfd49dc211ed128975"
   integrity sha512-IwHwmaBNtDK4zDHQukFDW5u/aTb8+meQWZvNFWkiGmbWjD6bqyuSSBxxXKkCftCUzc1zwCH2m/baCNDLGmuO5Q==
 
+eslint-import-resolver-alias@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/eslint-import-resolver-alias/-/eslint-import-resolver-alias-1.1.2.tgz#297062890e31e4d6651eb5eba9534e1f6e68fc97"
+  integrity sha512-WdviM1Eu834zsfjHtcGHtGfcu+F30Od3V7I9Fi57uhBEwPkjDcii7/yW8jAT+gOhn4P/vOxxNAXbFAKsrrc15w==
+
+eslint-import-resolver-custom-alias@^1.3.2:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/eslint-import-resolver-custom-alias/-/eslint-import-resolver-custom-alias-1.3.2.tgz#e509097e87de7a10b8c205c24644c3eb3fdf03c4"
+  integrity sha512-wBPcZA2k6/IXaT8FsLMyiyVSG6WVEuaYIAbeKLXeGwr523BmeB9lKAAoLJWSqp3txsnU4gpkgD2x1q6K8k0uDQ==
+  dependencies:
+    glob-parent "^6.0.2"
+    resolve "^1.22.2"
+
 eslint-import-resolver-node@^0.3.9:
   version "0.3.9"
   resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz#d4eaac52b8a2e7c3cd1903eb00f7e053356118ac"
@@ -9465,7 +9607,20 @@ eslint-import-resolver-node@^0.3.9:
     is-core-module "^2.13.0"
     resolve "^1.22.4"
 
-eslint-module-utils@^2.8.0:
+eslint-import-resolver-typescript@^3.6.1:
+  version "3.6.1"
+  resolved "https://registry.yarnpkg.com/eslint-import-resolver-typescript/-/eslint-import-resolver-typescript-3.6.1.tgz#7b983680edd3f1c5bce1a5829ae0bc2d57fe9efa"
+  integrity sha512-xgdptdoi5W3niYeuQxKmzVDTATvLYqhpwmykwsh7f6HIOStGWEIL9iqZgQDF9u9OEzrRwR8no5q2VT+bjAujTg==
+  dependencies:
+    debug "^4.3.4"
+    enhanced-resolve "^5.12.0"
+    eslint-module-utils "^2.7.4"
+    fast-glob "^3.3.1"
+    get-tsconfig "^4.5.0"
+    is-core-module "^2.11.0"
+    is-glob "^4.0.3"
+
+eslint-module-utils@^2.7.4, eslint-module-utils@^2.8.0:
   version "2.8.0"
   resolved "https://registry.yarnpkg.com/eslint-module-utils/-/eslint-module-utils-2.8.0.tgz#e439fee65fc33f6bba630ff621efc38ec0375c49"
   integrity sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==
@@ -9489,7 +9644,7 @@ eslint-plugin-eslint-comments@^3.2.0:
     escape-string-regexp "^1.0.5"
     ignore "^5.0.5"
 
-eslint-plugin-import@^2.22.1:
+eslint-plugin-import@^2.29.1:
   version "2.29.1"
   resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.29.1.tgz#d45b37b5ef5901d639c15270d74d46d161150643"
   integrity sha512-BbPC0cuExzhiMo4Ff1BTVwHpjjv28C5R+btTOGaCRC7UEz801up0JadwkeSk5Ued6TG34uaczuVuH6qyy5YUxw==
@@ -9563,7 +9718,7 @@ eslint-plugin-react@^7.21.5:
     semver "^6.3.1"
     string.prototype.matchall "^4.0.8"
 
-eslint-plugin-vue@^9.18.1:
+eslint-plugin-vue@^9.19.2:
   version "9.19.2"
   resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-9.19.2.tgz#7ab83a001a1ac8bccae013c5b9cb5d2c644fb376"
   integrity sha512-CPDqTOG2K4Ni2o4J5wixkLVNwgctKXFu6oBpVJlpNq7f38lh9I80pRTouZSJ2MAebPJlINU/KTFSXyQfBUlymA==
@@ -10136,7 +10291,7 @@ fast-glob@^2.2.6:
     merge2 "^1.2.3"
     micromatch "^3.1.10"
 
-fast-glob@^3.2.12, fast-glob@^3.2.9, fast-glob@^3.3.0:
+fast-glob@^3.2.12, fast-glob@^3.2.9, fast-glob@^3.3.0, fast-glob@^3.3.1:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.3.2.tgz#a904501e57cfdd2ffcded45e99a54fef55e46129"
   integrity sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==
@@ -10683,7 +10838,7 @@ fsevents@^1.2.7:
     bindings "^1.5.0"
     nan "^2.12.1"
 
-fsevents@^2.3.2, fsevents@~2.3.2:
+fsevents@^2.3.2, fsevents@~2.3.2, fsevents@~2.3.3:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.3.tgz#cac6407785d03675a2a5e1a5305c697b347d90d6"
   integrity sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==
@@ -10859,7 +11014,7 @@ get-symbol-description@^1.0.0:
     call-bind "^1.0.2"
     get-intrinsic "^1.1.1"
 
-get-tsconfig@^4.7.0:
+get-tsconfig@^4.5.0, get-tsconfig@^4.7.0:
   version "4.7.2"
   resolved "https://registry.yarnpkg.com/get-tsconfig/-/get-tsconfig-4.7.2.tgz#0dcd6fb330391d46332f4c6c1bf89a6514c2ddce"
   integrity sha512-wuMsz4leaj5hbGgg4IvDU0bqJagpftG5l5cXIAvo8uZrqn0NJqwtfupTN00VnkQJPcIRrxYrm1Ue24btpCha2A==
@@ -12455,7 +12610,7 @@ is-color-stop@^1.0.0:
     rgb-regex "^1.0.1"
     rgba-regex "^1.0.0"
 
-is-core-module@^2.12.1, is-core-module@^2.13.0, is-core-module@^2.13.1, is-core-module@^2.5.0:
+is-core-module@^2.11.0, is-core-module@^2.12.1, is-core-module@^2.13.0, is-core-module@^2.13.1, is-core-module@^2.5.0:
   version "2.13.1"
   resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.13.1.tgz#ad0d7532c6fea9da1ebdc82742d74525c6273384"
   integrity sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==
@@ -17007,7 +17162,7 @@ postcss-selector-parser@^3.0.0:
     indexes-of "^1.0.1"
     uniq "^1.0.1"
 
-postcss-selector-parser@^6.0.0, postcss-selector-parser@^6.0.11, postcss-selector-parser@^6.0.13, postcss-selector-parser@^6.0.2:
+postcss-selector-parser@^6.0.0, postcss-selector-parser@^6.0.11, postcss-selector-parser@^6.0.2:
   version "6.0.13"
   resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz#d05d8d76b1e8e173257ef9d60b706a8e5e99bf1b"
   integrity sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==
@@ -17015,6 +17170,14 @@ postcss-selector-parser@^6.0.0, postcss-selector-parser@^6.0.11, postcss-selecto
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
 
+postcss-selector-parser@^6.0.13:
+  version "6.0.15"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.15.tgz#11cc2b21eebc0b99ea374ffb9887174855a01535"
+  integrity sha512-rEYkQOMUCEMhsKbK66tbEU9QVIxbhN18YiniAwA7XQYTVBqrBy+P2p5JcdqsHgKM2zWylp8d7J6eszocfds5Sw==
+  dependencies:
+    cssesc "^3.0.0"
+    util-deprecate "^1.0.2"
+
 postcss-svgo@^4.0.3:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/postcss-svgo/-/postcss-svgo-4.0.3.tgz#343a2cdbac9505d416243d496f724f38894c941e"
@@ -17071,7 +17234,7 @@ postcss@^7.0.0, postcss@^7.0.1, postcss@^7.0.14, postcss@^7.0.17, postcss@^7.0.2
     picocolors "^0.2.1"
     source-map "^0.6.1"
 
-postcss@^8.4.14, postcss@^8.4.27, postcss@^8.4.31, postcss@^8.4.32:
+postcss@^8.4.14, postcss@^8.4.32:
   version "8.4.32"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.32.tgz#1dac6ac51ab19adb21b8b34fd2d93a86440ef6c9"
   integrity sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==
@@ -17080,6 +17243,15 @@ postcss@^8.4.14, postcss@^8.4.27, postcss@^8.4.31, postcss@^8.4.32:
     picocolors "^1.0.0"
     source-map-js "^1.0.2"
 
+postcss@^8.4.33:
+  version "8.4.33"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.33.tgz#1378e859c9f69bf6f638b990a0212f43e2aaa742"
+  integrity sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==
+  dependencies:
+    nanoid "^3.3.7"
+    picocolors "^1.0.0"
+    source-map-js "^1.0.2"
+
 prelude-ls@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
@@ -18719,11 +18891,26 @@ ripemd160@^2.0.0, ripemd160@^2.0.1:
     hash-base "^3.0.0"
     inherits "^2.0.1"
 
-rollup@^3.27.1:
-  version "3.29.4"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-3.29.4.tgz#4d70c0f9834146df8705bfb69a9a19c9e1109981"
-  integrity sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==
+rollup@^4.2.0:
+  version "4.9.4"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-4.9.4.tgz#37bc0c09ae6b4538a9c974f4d045bb64b2e7c27c"
+  integrity sha512-2ztU7pY/lrQyXSCnnoU4ICjT/tCG9cdH3/G25ERqE3Lst6vl2BCM5hL2Nw+sslAvAf+ccKsAq1SkKQALyqhR7g==
+  dependencies:
+    "@types/estree" "1.0.5"
   optionalDependencies:
+    "@rollup/rollup-android-arm-eabi" "4.9.4"
+    "@rollup/rollup-android-arm64" "4.9.4"
+    "@rollup/rollup-darwin-arm64" "4.9.4"
+    "@rollup/rollup-darwin-x64" "4.9.4"
+    "@rollup/rollup-linux-arm-gnueabihf" "4.9.4"
+    "@rollup/rollup-linux-arm64-gnu" "4.9.4"
+    "@rollup/rollup-linux-arm64-musl" "4.9.4"
+    "@rollup/rollup-linux-riscv64-gnu" "4.9.4"
+    "@rollup/rollup-linux-x64-gnu" "4.9.4"
+    "@rollup/rollup-linux-x64-musl" "4.9.4"
+    "@rollup/rollup-win32-arm64-msvc" "4.9.4"
+    "@rollup/rollup-win32-ia32-msvc" "4.9.4"
+    "@rollup/rollup-win32-x64-msvc" "4.9.4"
     fsevents "~2.3.2"
 
 rst-selector-parser@^2.2.3:
@@ -19926,6 +20113,11 @@ strip-json-comments@^3.1.1:
   resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
   integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
 
+strip-json-comments@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-5.0.1.tgz#0d8b7d01b23848ed7dbdf4baaaa31a8250d8cfa0"
+  integrity sha512-0fk9zBqO67Nq5M/m45qHCJxylV/DhBlIOVExqgOMiCCrzrhU6tCibRXNqE3jwJLftzE9SNuZtYbpzcO+i9FiKw==
+
 strip-json-comments@~2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-2.0.1.tgz#3c531942e908c2697c0ec344858c286c7ca0a60a"
@@ -20191,6 +20383,11 @@ tapable@^1.0.0, tapable@^1.1.3:
   resolved "https://registry.yarnpkg.com/tapable/-/tapable-1.1.3.tgz#a1fccc06b58db61fd7a45da2da44f5f3a3e67ba2"
   integrity sha512-4WK/bYZmj8xLr+HUCODHGF1ZFzsYffasLUgEiMBY4fgtltdO6B4WJtlSbPaDTLpYTcGVwM2qLnFTICEcNxs3kA==
 
+tapable@^2.2.0:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/tapable/-/tapable-2.2.1.tgz#1967a73ef4060a82f12ab96af86d52fdb76eeca0"
+  integrity sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==
+
 tar-stream@^3.1.6:
   version "3.1.6"
   resolved "https://registry.yarnpkg.com/tar-stream/-/tar-stream-3.1.6.tgz#6520607b55a06f4a2e2e04db360ba7d338cc5bab"
@@ -20772,7 +20969,7 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==
 
-typescript@^5.0.3, typescript@^5.2.2:
+typescript@^5.0.3, typescript@^5.3.3:
   version "5.3.3"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.3.3.tgz#b3ce6ba258e72e6305ba66f5c9b452aaee3ffe37"
   integrity sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==
@@ -21330,16 +21527,16 @@ vinyl@^2.0.0, vinyl@^2.1.0:
     remove-trailing-separator "^1.0.1"
     replace-ext "^1.0.0"
 
-vite@^4.5.0:
-  version "4.5.1"
-  resolved "https://registry.yarnpkg.com/vite/-/vite-4.5.1.tgz#3370986e1ed5dbabbf35a6c2e1fb1e18555b968a"
-  integrity sha512-AXXFaAJ8yebyqzoNB9fu2pHoo/nWX+xZlaRwoeYUxEqBO+Zj4msE5G+BhGBll9lYEKv9Hfks52PAF2X7qDYXQA==
+vite@^5.0.11:
+  version "5.0.11"
+  resolved "https://registry.yarnpkg.com/vite/-/vite-5.0.11.tgz#31562e41e004cb68e1d51f5d2c641ab313b289e4"
+  integrity sha512-XBMnDjZcNAw/G1gEiskiM1v6yzM4GE5aMGvhWTlHAYYhxb7S3/V1s3m2LDHa8Vh6yIWYYB0iJwsEaS523c4oYA==
   dependencies:
-    esbuild "^0.18.10"
-    postcss "^8.4.27"
-    rollup "^3.27.1"
+    esbuild "^0.19.3"
+    postcss "^8.4.32"
+    rollup "^4.2.0"
   optionalDependencies:
-    fsevents "~2.3.2"
+    fsevents "~2.3.3"
 
 vm-browserify@^1.0.0, vm-browserify@^1.0.1:
   version "1.1.2"
@@ -21366,10 +21563,10 @@ vue-demi@^0.13.11:
   resolved "https://registry.yarnpkg.com/vue-demi/-/vue-demi-0.13.11.tgz#7d90369bdae8974d87b1973564ad390182410d99"
   integrity sha512-IR8HoEEGM65YY3ZJYAjMlKygDQn25D5ajNFNoKh9RSDMQtlzCxtfQjdQgv9jjK+m3377SsJXY8ysq8kLCZL25A==
 
-vue-echarts@^6.6.1:
-  version "6.6.4"
-  resolved "https://registry.yarnpkg.com/vue-echarts/-/vue-echarts-6.6.4.tgz#52f95e92247506683eaf541c85860f6d73b33489"
-  integrity sha512-WtTAdwcLgbCsblOlbOfOr9tOHrR6ufEfoZwPbXHp/HVRXCLlh/GaAIXtqdjGSr/YtCEQNkaW0FpR2c9ukzxVmw==
+vue-echarts@^6.6.8:
+  version "6.6.8"
+  resolved "https://registry.yarnpkg.com/vue-echarts/-/vue-echarts-6.6.8.tgz#e00c2a0fcb39681fbb41e0afacbe88aef7e80f24"
+  integrity sha512-3EGrxKGCGjHnkhudRQQ4fkK5iJxxXNQ1fXvSWA/7mzR/oV7BBSHYvC3gDbG/WIW0A/Fcx2H8k5H3NDyWgjyi8g==
   dependencies:
     resize-detector "^0.3.0"
     vue-demi "^0.13.11"
@@ -21392,13 +21589,13 @@ vue-hot-reload-api@^2.3.0:
   resolved "https://registry.yarnpkg.com/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz#532955cc1eb208a3d990b3a9f9a70574657e08f2"
   integrity sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==
 
-vue-i18n@^9.6.5:
-  version "9.8.0"
-  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.8.0.tgz#54339daf377a31b234b027c5158e774728b6bc24"
-  integrity sha512-Izho+6PYjejsTq2mzjcRdBZ5VLRQoSuuexvR8029h5CpN03FYqiqBrShMyf2I1DKkN6kw/xmujcbvC+4QybpsQ==
+vue-i18n@^9.9.0:
+  version "9.9.0"
+  resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-9.9.0.tgz#20d348fa7e37fc88e4c84f69781b2f1215c7769f"
+  integrity sha512-xQ5SxszUAqK5n84N+uUyHH/PiQl9xZ24FOxyAaNonmOQgXeN+rD9z/6DStOpOxNFQn4Cgcquot05gZc+CdOujA==
   dependencies:
-    "@intlify/core-base" "9.8.0"
-    "@intlify/shared" "9.8.0"
+    "@intlify/core-base" "9.9.0"
+    "@intlify/shared" "9.9.0"
     "@vue/devtools-api" "^6.5.0"
 
 vue-loader@^15.7.1:
@@ -21476,16 +21673,16 @@ vue@^2.6.10, vue@^2.7.14:
     "@vue/compiler-sfc" "2.7.15"
     csstype "^3.1.0"
 
-vue@^3.3.8:
-  version "3.3.11"
-  resolved "https://registry.yarnpkg.com/vue/-/vue-3.3.11.tgz#898d97025f73cdb5fc4e3ae3fd07a54615232140"
-  integrity sha512-d4oBctG92CRO1cQfVBZp6WJAs0n8AK4Xf5fNjQCBeKCvMI1efGQ5E3Alt1slFJS9fZuPcFoiAiqFvQlv1X7t/w==
-  dependencies:
-    "@vue/compiler-dom" "3.3.11"
-    "@vue/compiler-sfc" "3.3.11"
-    "@vue/runtime-dom" "3.3.11"
-    "@vue/server-renderer" "3.3.11"
-    "@vue/shared" "3.3.11"
+vue@^3.4.7:
+  version "3.4.7"
+  resolved "https://registry.yarnpkg.com/vue/-/vue-3.4.7.tgz#b9673ceaf3400b7e65031140d14be6a27b52f301"
+  integrity sha512-4urmkWpudekq0CPNMO7p6mBGa9qmTXwJMO2r6CT4EzIJVG7WoSReiysiNb7OSi/WI113oX0Srn9Rz1k/DCXKFQ==
+  dependencies:
+    "@vue/compiler-dom" "3.4.7"
+    "@vue/compiler-sfc" "3.4.7"
+    "@vue/runtime-dom" "3.4.7"
+    "@vue/server-renderer" "3.4.7"
+    "@vue/shared" "3.4.7"
 
 vuepress-html-webpack-plugin@^3.2.0:
   version "3.2.0"