add tooltips

vatesfr · Nov 26, 2024 · b24aac6 · b24aac6
1 parent 48974c8
commit b24aac6
Showing 1 changed file with 37 additions and 5 deletions.
diff --git a/@xen-orchestra/lite/src/views/pool/PoolNetworkView.vue b/@xen-orchestra/lite/src/views/pool/PoolNetworkView.vue
@@ -120,12 +120,19 @@
           <div class="typo p3-regular content-details">
             <div>{{ $t('uuid') }}</div>
             <div class="text-ellipsis">{{ selectedNetwork?.uuid }}</div>
-            <UiButtonIcon accent="info" size="medium" :icon="faCopy" @click="copyToClipboard(selectedNetwork?.uuid)" />
+            <UiButtonIcon
+              v-tooltip="{ content: $t('copy'), placement: 'bottom-end' }"
+              accent="info"
+              size="medium"
+              :icon="faCopy"
+              @click="copyToClipboard(selectedNetwork?.uuid)"
+            />
           </div>
           <div class="typo p3-regular content-details">
             <div>{{ $t('description') }}</div>
             <div>{{ selectedNetwork?.name_description }}</div>
             <UiButtonIcon
+              v-tooltip="{ content: $t('copy'), placement: 'bottom-end' }"
               accent="info"
               size="medium"
               :icon="faCopy"
@@ -135,18 +142,30 @@
           <div class="typo p3-regular content-details">
             <div>{{ $t('vlan') }}</div>
             <div>{{ (selectedNetwork as any)?.vlan }}</div>
-            <UiButtonIcon accent="info" size="medium" :icon="faCopy" />
+            <UiButtonIcon
+              v-tooltip="{ content: $t('copy'), placement: 'bottom-end' }"
+              accent="info"
+              size="medium"
+              :icon="faCopy"
+            />
           </div>
           <div class="typo p3-regular content-details">
             <div>{{ $t('mtu') }}</div>
             <div>{{ selectedNetwork?.MTU }}</div>
-            <UiButtonIcon accent="info" size="medium" :icon="faCopy" @click="copyToClipboard(selectedNetwork?.MTU)" />
+            <UiButtonIcon
+              v-tooltip="{ content: $t('copy'), placement: 'bottom-end' }"
+              accent="info"
+              size="medium"
+              :icon="faCopy"
+              @click="copyToClipboard(selectedNetwork?.MTU)"
+            />
           </div>
           <div class="typo p3-regular content-details">
             <div>{{ $t('network-block-device') }}</div>
             <div>{{ selectedNetwork?.purpose[0] }}</div>
             <UiButtonIcon
               v-if="selectedNetwork?.purpose[0]"
+              v-tooltip="{ content: $t('copy'), placement: 'bottom-end' }"
               accent="info"
               size="medium"
               :icon="faCopy"
@@ -166,12 +185,24 @@
             <div class="typo p3-regular content-details">
               <div>{{ $t('uuid') }}</div>
               <div class="text-ellipsis">{{ PIF.uuid }}</div>
-              <UiButtonIcon accent="info" size="medium" :icon="faCopy" @click="copyToClipboard(PIF.uuid)" />
+              <UiButtonIcon
+                v-tooltip="{ content: $t('copy'), placement: 'bottom-end' }"
+                accent="info"
+                size="medium"
+                :icon="faCopy"
+                @click="copyToClipboard(PIF.uuid)"
+              />
             </div>
             <div class="typo p3-regular content-details">
               <div>{{ $t('device') }}</div>
               <div>{{ PIF.device }}</div>
-              <UiButtonIcon accent="info" size="medium" :icon="faCopy" @click="copyToClipboard(PIF.device)" />
+              <UiButtonIcon
+                v-tooltip="{ content: $t('copy'), placement: 'bottom-end' }"
+                accent="info"
+                size="medium"
+                :icon="faCopy"
+                @click="copyToClipboard(PIF.device)"
+              />
             </div>
             <div class="typo p3-regular content-details">
               <div>{{ $t('mtu') }}</div>
@@ -208,6 +239,7 @@ import UiQuerySearchBar from '@core/components/ui/query-search-bar/UiQuerySearch
 import UiTableActions from '@core/components/ui/table-actions/UiTableActions.vue'
 import UiTitle from '@core/components/ui/title/UiTitle.vue'
 import UiTopBottomTable from '@core/components/ui/top-bottom-table/UiTopBottomTable.vue'
+import { vTooltip } from '@core/directives/tooltip.directive'
 import {
   faAlignLeft,
   faCaretDown,