Merge branch 'master' into vmHealthTab/displayNestedVirtTooltip

@vates/nbd-client/multi.mjs

@@ -34,9 +34,8 @@ export default class MultiNbdClient {
   async connect() {
     const candidates = [...this.#settings]
 
-    const promises = []
     const baseOptions = this.#options
-    const  _connect = async () => {
+    const _connect = async () => {
       if (candidates.length === 0) {
         return
       }
@@ -63,11 +62,11 @@ export default class MultiNbdClient {
         return _connect()
       }
     }
+    // don't connect in parallel since this can lead to race condition
+    // on distributed systems ( like the NBD server of the XAPI)
     for (let i = 0; i < this.#nbdConcurrency; i++) {
-      promises.push(_connect())
+      await _connect()
     }
-    await Promise.all(promises)
-
     if (this.#clients.length === 0) {
       throw new Error(`Fail to connect to any Nbd client`)
     }

@vates/nbd-client/package.json

@@ -13,7 +13,7 @@
     "url": "https://vates.fr"
   },
   "license": "ISC",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "engines": {
     "node": ">=14.0"
   },

@xen-orchestra/backups/docs/VM backups/README.md

@@ -65,7 +65,7 @@ In case any incoherence is detected, the file is deleted so it will be fully gen
   - `xo:backup:deltaChainLength` = n (number of delta copies/replicated since a full)
   - `xo:backup:exported` = 'true' (added at the end of the backup)
 
-### Of created VMs , their associated VDIs and snapshots 
+### Of created VMs , their associated VDIs and snapshots
 
 - `other_config`:
   - `xo:backup:datetime`: format is UTC %Y%m%dT%H:%M:%SZ

@xen-orchestra/backups/package.json

@@ -25,7 +25,7 @@
     "@vates/decorate-with": "^2.1.0",
     "@vates/disposable": "^0.1.6",
     "@vates/fuse-vhd": "^2.1.2",
-    "@vates/nbd-client": "^3.1.1",
+    "@vates/nbd-client": "^3.1.2",
     "@vates/parse-duration": "^0.1.1",
     "@xen-orchestra/async-map": "^0.1.2",
     "@xen-orchestra/fs": "^4.2.1",

@xen-orchestra/defined/README.md

@@ -21,6 +21,7 @@ npm install --save @xen-orchestra/defined
 Returns the first non-`undefined` value from a list of arguments, evaluating functions if needed.
 
 There is two ways to use this function:
+
 - either with a single array argument: it should return the first non-undefined item
 - or with multiple arguments: it should return the first non-undefined argument
 

@xen-orchestra/fs/package.json

@@ -41,7 +41,7 @@
     "proper-lockfile": "^4.1.2",
     "readable-stream": "^4.1.0",
     "through2": "^4.0.2",
-    "xo-remote-parser": "^0.9.2"
+    "xo-remote-parser": "^0.9.3"
   },
   "devDependencies": {
     "@babel/cli": "^7.0.0",

@xen-orchestra/fs/src/local.js

@@ -58,7 +58,7 @@ export default class LocalHandler extends RemoteHandlerAbstract {
   constructor(remote, opts = {}) {
     super(remote)
 
-    this.#addSyncStackTrace = opts.syncStackTraces ?? true ? addSyncStackTrace : dontAddSyncStackTrace
+    this.#addSyncStackTrace = (opts.syncStackTraces ?? true) ? addSyncStackTrace : dontAddSyncStackTrace
     this.#retriesOnEagain = {
       delay: 1e3,
       retries: 9,

@xen-orchestra/lite/package.json

@@ -26,7 +26,7 @@
     "@types/file-saver": "^2.0.7",
     "@types/lodash-es": "^4.17.12",
     "@types/node": "^18.19.7",
-    "@vitejs/plugin-vue": "^5.0.3",
+    "@vitejs/plugin-vue": "^5.1.4",
     "@vue/tsconfig": "^0.5.1",
     "@vueuse/core": "^10.7.1",
     "@vueuse/math": "^10.7.1",
@@ -38,7 +38,7 @@
     "echarts": "^5.4.3",
     "file-saver": "^2.0.5",
     "highlight.js": "^11.9.0",
-    "human-format": "^1.2.0",
+    "human-format": "^1.2.1",
     "iterable-backoff": "^0.1.0",
     "json-rpc-2.0": "^1.7.0",
     "json5": "^2.2.3",
@@ -48,19 +48,19 @@
     "marked": "^9.1.5",
     "minimist": "^1.2.8",
     "npm-run-all": "^4.1.5",
-    "pinia": "^2.1.7",
+    "pinia": "^2.2.6",
     "placement.js": "^1.0.0-beta.5",
     "postcss": "^8.4.33",
     "postcss-color-function": "^4.1.0",
     "postcss-custom-media": "^10.0.2",
     "postcss-nested": "^6.0.1",
-    "typescript": "~5.3.3",
-    "vite": "^5.0.11",
-    "vue": "~3.4.13",
+    "typescript": "~5.6.3",
+    "vite": "^5.4.10",
+    "vue": "~3.5.12",
     "vue-echarts": "^6.6.8",
     "vue-i18n": "^9.9.0",
     "vue-router": "^4.4.0",
-    "vue-tsc": "^1.8.27",
+    "vue-tsc": "^2.1.10",
     "zx": "^7.2.3"
   },
   "private": true,

@xen-orchestra/lite/src/App.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!$route.meta.hasStoryNav && !xenApiStore.isConnected">
+  <div v-if="!route.meta.hasStoryNav && !xenApiStore.isConnected">
     <AppLogin />
   </div>
   <div v-else>
@@ -10,7 +10,7 @@
         <RouterView />
       </main>
     </div>
-    <TooltipList />
+    <VtsTooltipList />
   </div>
   <ModalList />
 </template>
@@ -24,12 +24,15 @@ import { useChartTheme } from '@/composables/chart-theme.composable'
 import { useUnreachableHosts } from '@/composables/unreachable-hosts.composable'
 import { usePoolStore } from '@/stores/xen-api/pool.store'
 import { useXenApiStore } from '@/stores/xen-api.store'
-import TooltipList from '@core/components/tooltip/TooltipList.vue'
+import VtsTooltipList from '@core/components/tooltip-list/VtsTooltipList.vue'
 import { useUiStore } from '@core/stores/ui.store'
 import { useActiveElement, useMagicKeys, whenever } from '@vueuse/core'
 import { logicAnd } from '@vueuse/math'
 import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
+import { useRoute } from 'vue-router'
+
+const route = useRoute()
 
 const xenApiStore = useXenApiStore()
 

@xen-orchestra/lite/src/components/AppLogin.vue

@@ -27,7 +27,7 @@
           <FormCheckbox v-model="rememberMe" />
           {{ $t('keep-me-logged') }}
         </label>
-        <UiButton size="medium" color="info" level="primary" type="submit" :busy="isConnecting">
+        <UiButton size="medium" accent="info" variant="primary" type="submit" :busy="isConnecting">
           {{ $t('login') }}
         </UiButton>
       </template>
@@ -45,7 +45,7 @@ import UiIcon from '@/components/ui/icon/UiIcon.vue'
 import type { XenApiError } from '@/libs/xen-api/xen-api.types'
 import { usePageTitleStore } from '@/stores/page-title.store'
 import { useXenApiStore } from '@/stores/xen-api.store'
-import UiButton from '@core/components/button/UiButton.vue'
+import UiButton from '@core/components/ui/button/UiButton.vue'
 import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons'
 import { useLocalStorage, whenever } from '@vueuse/core'
 import { storeToRefs } from 'pinia'

@xen-orchestra/lite/src/components/AppNavigation.vue

@@ -1,7 +1,7 @@
 <template>
   <Transition name="slide">
     <nav v-if="isDesktop || isOpen" ref="navElement" :class="{ collapsible: isMobile }" class="app-navigation">
-      <StoryMenu v-if="$route.meta.hasStoryNav" />
+      <StoryMenu v-if="route.meta.hasStoryNav" />
       <InfraPoolList v-else />
     </nav>
   </Transition>
@@ -15,6 +15,9 @@ import { useUiStore } from '@core/stores/ui.store'
 import { onClickOutside, whenever } from '@vueuse/core'
 import { storeToRefs } from 'pinia'
 import { ref } from 'vue'
+import { useRoute } from 'vue-router'
+
+const route = useRoute()
 
 const uiStore = useUiStore()
 const { isMobile, isDesktop } = storeToRefs(uiStore)
@@ -58,6 +61,7 @@ whenever(isOpen, () => {
 .slide-leave-active {
   transition: transform 0.3s ease;
 }
+
 .slide-enter-from,
 .slide-leave-to {
   transform: translateX(-37rem);

@xen-orchestra/lite/src/components/FormWidget.vue

@@ -1,12 +1,12 @@
 <template>
   <label class="form-widget">
-    <span v-if="label || $slots.label" class="label">
+    <span v-if="label || slots.label" class="label">
       <slot name="label">
         {{ label }}
       </slot>
     </span>
     <span class="widget">
-      <span v-if="before || $slots.before" class="before">
+      <span v-if="before || slots.before" class="before">
         <slot name="before">
           <UiIcon v-if="isIcon(before)" :icon="before" fixed-width />
           <template v-else>{{ before }}</template>
@@ -15,7 +15,7 @@
       <span class="element">
         <slot />
       </span>
-      <span v-if="after || $slots.after" class="after">
+      <span v-if="after || slots.after" class="after">
         <slot name="after">
           <UiIcon v-if="isIcon(after)" :icon="after" fixed-width />
           <template v-else>{{ after }}</template>
@@ -36,6 +36,13 @@ defineProps<{
   inline?: boolean
 }>()
 
+const slots = defineSlots<{
+  default(): any
+  label?(): any
+  before?(): any
+  after?(): any
+}>()
+
 const isIcon = (maybeIcon: any): maybeIcon is IconDefinition => typeof maybeIcon === 'object'
 </script>
 

@xen-orchestra/lite/src/components/HostPatchesTable.vue

@@ -9,7 +9,7 @@
       </th>
       <td v-if="hasMultipleHosts">
         <UiSpinner v-if="!areAllLoaded" />
-        <VtsCounter
+        <UiCounter
           v-else
           v-tooltip="{
             placement: 'left',
@@ -33,7 +33,7 @@ import UiCardSpinner from '@/components/ui/UiCardSpinner.vue'
 import UiSpinner from '@/components/ui/UiSpinner.vue'
 import UiTable from '@/components/ui/UiTable.vue'
 import type { XenApiPatchWithHostRefs } from '@/composables/host-patches.composable'
-import VtsCounter from '@core/components/counter/VtsCounter.vue'
+import UiCounter from '@core/components/ui/counter/UiCounter.vue'
 import { vTooltip } from '@core/directives/tooltip.directive'
 import { useUiStore } from '@core/stores/ui.store'
 import { computed } from 'vue'

@xen-orchestra/lite/src/components/XoaButton.vue

@@ -2,8 +2,8 @@
   <UiButton
     v-if="xoaFound"
     size="medium"
-    color="info"
-    level="primary"
+    accent="info"
+    variant="primary"
     :left-icon="faArrowUpRightFromSquare"
     class="xoa-button"
     @click="openXoa()"
@@ -13,8 +13,8 @@
   <UiButton
     v-else
     size="medium"
-    color="info"
-    level="primary"
+    accent="info"
+    variant="primary"
     :left-icon="faDownload"
     class="xoa-button"
     @click="openXoaDeploy()"
@@ -26,7 +26,7 @@
 <script lang="ts" setup>
 import type { PRIMARY_ADDRESS_TYPE } from '@/libs/xen-api/xen-api.enums'
 import { usePoolStore } from '@/stores/xen-api/pool.store'
-import UiButton from '@core/components/button/UiButton.vue'
+import UiButton from '@core/components/ui/button/UiButton.vue'
 import { faDownload, faArrowUpRightFromSquare } from '@fortawesome/free-solid-svg-icons'
 import { computed } from 'vue'
 import { useRouter } from 'vue-router'

@xen-orchestra/lite/src/components/component-story/ComponentStory.vue

@@ -3,7 +3,7 @@
     <TabItem v-bind="tab(TAB.PROPS, propParams)">Props</TabItem>
     <TabItem class="event-tab" v-bind="tab(TAB.EVENTS, eventParams)">
       Events
-      <VtsCounter
+      <UiCounter
         v-if="unreadEventsCount > 0"
         :value="unreadEventsCount"
         accent="success"
@@ -41,7 +41,13 @@
         <UiCardTitle>
           Logs
           <template #right>
-            <UiButton v-if="eventsLog.length > 0" size="medium" color="info" level="tertiary" @click="eventsLog = []">
+            <UiButton
+              v-if="eventsLog.length > 0"
+              size="medium"
+              accent="info"
+              variant="tertiary"
+              @click="eventsLog = []"
+            >
               Clear
             </UiButton>
           </template>
@@ -85,12 +91,12 @@ import {
   ModelParam,
   type Param,
 } from '@/libs/story/story-param'
-import UiButton from '@core/components/button/UiButton.vue'
-import VtsCounter from '@core/components/counter/VtsCounter.vue'
 import MenuItem from '@core/components/menu/MenuItem.vue'
 import MenuList from '@core/components/menu/MenuList.vue'
 import TabItem from '@core/components/tab/TabItem.vue'
 import TabList from '@core/components/tab/TabList.vue'
+import UiButton from '@core/components/ui/button/UiButton.vue'
+import UiCounter from '@core/components/ui/counter/UiCounter.vue'
 import { faSliders } from '@fortawesome/free-solid-svg-icons'
 import 'highlight.js/styles/github-dark.css'
 import { uniqueId, upperFirst } from 'lodash-es'

@xen-orchestra/lite/src/components/form/FormCheckbox.vue

@@ -6,7 +6,7 @@
       :disabled="isDisabled"
       :type="type === 'radio' ? 'radio' : 'checkbox'"
       class="input"
-      v-bind="$attrs"
+      v-bind="attrs"
     />
     <span class="fake-checkbox">
       <UiIcon :fixed-width="false" :icon class="icon" />
@@ -21,7 +21,7 @@ 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 { computed, type HTMLAttributes, inject, useAttrs } from 'vue'
 
 defineOptions({ inheritAttrs: false })
 
@@ -38,6 +38,8 @@ const emit = defineEmits<{
   'update:modelValue': [value: boolean]
 }>()
 
+const attrs = useAttrs()
+
 const value = useVModel(props, 'modelValue', emit)
 const type = inject(IK_CHECKBOX_TYPE, 'checkbox')
 const hasLabel = inject(

@xen-orchestra/lite/src/components/form/FormInput.vue

@@ -9,7 +9,7 @@
         :disabled="isDisabled"
         :required
         class="select"
-        v-bind="$attrs"
+        v-bind="attrs"
       >
         <slot />
       </select>
@@ -26,7 +26,7 @@
       :disabled="isDisabled"
       :required
       class="textarea"
-      v-bind="$attrs"
+      v-bind="attrs"
     />
     <input
       v-else
@@ -37,7 +37,7 @@
       :disabled="isDisabled"
       :required
       class="input"
-      v-bind="$attrs"
+      v-bind="attrs"
     />
     <span v-if="before !== undefined" class="before">
       <template v-if="typeof before === 'string'">{{ before }}</template>
@@ -59,7 +59,7 @@ 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'
+import { computed, type HTMLAttributes, inject, nextTick, ref, useAttrs, watch } from 'vue'
 
 defineOptions({ inheritAttrs: false })
 
@@ -84,6 +84,8 @@ const emit = defineEmits<{
   'update:modelValue': [value: any]
 }>()
 
+const attrs = useAttrs()
+
 const { name: contextColor } = useContext(ColorContext, () => props.color)
 
 const inputElement = ref()