review feedback

vatesfr · Dec 16, 2024 · b0f9ba2 · b0f9ba2
1 parent 63b7db4
commit b0f9ba2
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 48 deletions.
diff --git a/@xen-orchestra/lite/src/components/pool/network/PoolHostInternalNetworkTable.vue b/@xen-orchestra/lite/src/components/pool/network/PoolHostInternalNetworkTable.vue
@@ -16,7 +16,7 @@
       </template>
     </UiTitle>
     <div class="content">
-      <UiQuerySearchBar class="table-query" @search="(value: string) => (searchQuery = value)" />
+      <UiQuerySearchBar class="table-query" @search="value => (searchQuery = value)" />
       <UiTableActions title="Table actions">
         <UiButton
           v-tooltip="$t('coming-soon')"
@@ -56,7 +56,7 @@
                   <UiButtonIcon size="small" accent="info" :icon="getHeaderIcon(column.id)" />
                   {{ column.label }}
                 </th>
-                <ColumnTitle v-else id="networks" :icon="getHeaderIcon(column.id)"> {{ column.label }}</ColumnTitle>
+                <ColumnTitle v-else :icon="getHeaderIcon(column.id)"> {{ column.label }}</ColumnTitle>
               </template>
             </tr>
           </thead>
@@ -150,15 +150,15 @@ const { visibleColumns, rows } = useTable('networks', filteredNetworks, {
 
 type NetworkHeader = 'name_label' | 'name_description' | 'MTU' | 'default_locking_mode' | 'more'
 
-const headerIcon: Record<NetworkHeader, { icon: IconDefinition }> = {
-  name_label: { icon: faAlignLeft },
-  name_description: { icon: faAlignLeft },
-  MTU: { icon: faHashtag },
-  default_locking_mode: { icon: faCaretDown },
-  more: { icon: faEllipsis },
+const headerIcon: Record<NetworkHeader, IconDefinition> = {
+  name_label: faAlignLeft,
+  name_description: faAlignLeft,
+  MTU: faHashtag,
+  default_locking_mode: faCaretDown,
+  more: faEllipsis,
 }
 
-const getHeaderIcon = (status: NetworkHeader) => headerIcon[status].icon
+const getHeaderIcon = (status: NetworkHeader) => headerIcon[status]
 </script>
 
 <style scoped lang="postcss">

diff --git a/@xen-orchestra/lite/src/components/pool/network/PoolNetworksTable.vue b/@xen-orchestra/lite/src/components/pool/network/PoolNetworksTable.vue
@@ -16,7 +16,7 @@
       </template>
     </UiTitle>
     <div class="content">
-      <UiQuerySearchBar class="table-query" @search="(value: string) => (searchQuery = value)" />
+      <UiQuerySearchBar class="table-query" @search="value => (searchQuery = value)" />
       <UiTableActions title="Table actions">
         <UiButton
           v-tooltip="$t('coming-soon')"
@@ -66,7 +66,9 @@
                   <UiButtonIcon size="small" accent="info" :icon="getHeaderIcon(column.id)" />
                   {{ column.label }}
                 </th>
-                <ColumnTitle v-else id="networks" :icon="getHeaderIcon(column.id)"> {{ column.label }}</ColumnTitle>
+                <ColumnTitle v-else :icon="getHeaderIcon(column.id)">
+                  {{ column.label }}
+                </ColumnTitle>
               </template>
             </tr>
           </thead>
@@ -75,9 +77,7 @@
               <td v-for="column of row.visibleColumns" :key="column.id" class="typo p2-regular">
                 <UiCheckbox v-if="column.id === 'checkbox'" v-model="selected" accent="info" :value="row.id" />
                 <VtsIcon v-else-if="column.id === 'more'" accent="info" :icon="faEllipsis" />
-                <div v-else-if="column.id === 'status'" class="status">
-                  <PoolNetworksPifStatus :status="column.value" />
-                </div>
+                <PoolNetworksPifStatus v-else-if="column.id === 'status'" :status="column.value" />
                 <div v-else v-tooltip="{ placement: 'bottom-end' }" class="text-ellipsis">
                   {{ column.value }}
                 </div>
@@ -184,16 +184,16 @@ const { visibleColumns, rows } = useTable('networks', filteredNetworks, {
 })
 
 type NetworkHeader = 'name_label' | 'name_description' | 'status' | 'vlan' | 'MTU' | 'default_locking_mode' | 'more'
-const headerIcon: Record<NetworkHeader, { icon: IconDefinition }> = {
-  name_label: { icon: faAlignLeft },
-  name_description: { icon: faAlignLeft },
-  status: { icon: faPowerOff },
-  vlan: { icon: faAlignLeft },
-  MTU: { icon: faHashtag },
-  default_locking_mode: { icon: faCaretDown },
-  more: { icon: faEllipsis },
+const headerIcon: Record<NetworkHeader, IconDefinition> = {
+  name_label: faAlignLeft,
+  name_description: faAlignLeft,
+  status: faPowerOff,
+  vlan: faAlignLeft,
+  MTU: faHashtag,
+  default_locking_mode: faCaretDown,
+  more: faEllipsis,
 }
-const getHeaderIcon = (status: NetworkHeader) => headerIcon[status].icon
+const getHeaderIcon = (status: NetworkHeader) => headerIcon[status]
 </script>
 
 <style scoped lang="postcss">

diff --git a/@xen-orchestra/lite/src/stores/xen-api/network.store.ts b/@xen-orchestra/lite/src/stores/xen-api/network.store.ts
@@ -1,5 +1,5 @@
 import type { Status } from '@/components/pool/network/PoolNetworksPifStatus.vue'
-import type { XenApiNetwork, XenApiPif } from '@/libs/xen-api/xen-api.types'
+import type { XenApiPif } from '@/libs/xen-api/xen-api.types'
 import { createXapiStoreConfig } from '@/stores/xen-api/create-xapi-store-config'
 import { useHostStore } from '@/stores/xen-api/host.store'
 import { usePifStore } from '@/stores/xen-api/pif.store'
@@ -27,7 +27,7 @@ export const useNetworkStore = defineStore('xen-api-network', () => {
   const hostContext = deps.hostStore.getContext()
   const pifContext = deps.pifStore.getContext()
 
-  const PIFsByNetwork = computed(() => {
+  const pifsByNetwork = computed(() => {
     const PIFsByNetworkMap = new Map<string, XenApiPif[]>()
 
     const poolMasterRef = poolContext.pool.value?.master
@@ -46,36 +46,18 @@ export const useNetworkStore = defineStore('xen-api-network', () => {
     return PIFsByNetworkMap
   })
 
-  const networksWithVLANs = computed(() => {
-    const networksInfoMap = new Map<
-      string,
-      {
-        network: XenApiNetwork
-        vlan: string
-        status: Status
-      }
-    >()
-
-    return baseContext.records.value
+  const networksWithVLANs = computed(() =>
+    baseContext.records.value
       .filter(network => network.PIFs.length > 0)
       .map(network => {
-        const relatedPifs = PIFsByNetwork.value.get(network.$ref) || []
+        const relatedPifs = pifsByNetwork.value.get(network.$ref) || []
         const vlan =
           relatedPifs.length > 0 ? (relatedPifs[0].VLAN === -1 ? t('none') : relatedPifs[0].VLAN.toString()) : ''
         const status = determineStatus(relatedPifs)
 
-        const networkWithDetails = {
-          network,
-          vlan,
-          status,
-        }
-        if (!networksInfoMap.has(network.$ref)) {
-          networksInfoMap.set(network.$ref, networkWithDetails)
-        }
-        networksInfoMap.set(network.$ref, networkWithDetails)
-        return networkWithDetails
+        return { network, vlan, status }
       })
-  })
+  )
 
   const hostInternalNetworks = computed(() => {
     return baseContext.records.value.filter(network => network.PIFs.length === 0) // Only networks without PIFs