From 2c298ef47a33433dd00bc4f48313834792e058f9 Mon Sep 17 00:00:00 2001 From: OlivierFL <66562640+OlivierFL@users.noreply.github.com> Date: Thu, 21 Dec 2023 11:27:06 +0100 Subject: [PATCH] fix(lite): infinite loader when no stats on pool dashboard (#7236) --- @xen-orchestra/lite/CHANGELOG.md | 1 + @xen-orchestra/lite/src/assets/no-result.svg | 51 +++++++++++++++++++ .../lite/src/components/NoResult.vue | 32 ++++++++++++ .../lite/src/components/UsageBar.vue | 47 +++++++---------- .../dashboard/PoolDashboardStorageUsage.vue | 8 ++- .../pool/dashboard/cpuUsage/HostsCpuUsage.vue | 32 ++++++------ .../pool/dashboard/cpuUsage/VmsCpuUsage.vue | 30 ++++++----- .../pool/dashboard/ramUsage/HostsRamUsage.vue | 41 +++++++-------- .../pool/dashboard/ramUsage/VmsRamUsage.vue | 35 ++++++------- .../src/composables/stat-status.composable.ts | 32 ++++++++++++ @xen-orchestra/lite/src/locales/en.json | 1 + @xen-orchestra/lite/src/locales/fr.json | 1 + @xen-orchestra/lite/src/types/stat.ts | 7 +++ 13 files changed, 214 insertions(+), 104 deletions(-) create mode 100644 @xen-orchestra/lite/src/assets/no-result.svg create mode 100644 @xen-orchestra/lite/src/components/NoResult.vue create mode 100644 @xen-orchestra/lite/src/composables/stat-status.composable.ts create mode 100644 @xen-orchestra/lite/src/types/stat.ts diff --git a/@xen-orchestra/lite/CHANGELOG.md b/@xen-orchestra/lite/CHANGELOG.md index 4bac56e06..6f5aa925b 100644 --- a/@xen-orchestra/lite/CHANGELOG.md +++ b/@xen-orchestra/lite/CHANGELOG.md @@ -7,6 +7,7 @@ - Added tooltip on CPU provisioning warning icon (PR [#7223](https://github.com/vatesfr/xen-orchestra/pull/7223)) - Add indeterminate state on FormToggle component (PR [#7230](https://github.com/vatesfr/xen-orchestra/pull/7230)) - Add new UiStatusPanel component (PR [#7227](https://github.com/vatesfr/xen-orchestra/pull/7227)) +- Fix infinite loader when no stats on pool dashboard (PR [#7236](https://github.com/vatesfr/xen-orchestra/pull/7236)) ## **0.1.6** (2023-11-30) diff --git a/@xen-orchestra/lite/src/assets/no-result.svg b/@xen-orchestra/lite/src/assets/no-result.svg new file mode 100644 index 000000000..dd958ef63 --- /dev/null +++ b/@xen-orchestra/lite/src/assets/no-result.svg @@ -0,0 +1,51 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/@xen-orchestra/lite/src/components/NoResult.vue b/@xen-orchestra/lite/src/components/NoResult.vue new file mode 100644 index 000000000..ae82b4299 --- /dev/null +++ b/@xen-orchestra/lite/src/components/NoResult.vue @@ -0,0 +1,32 @@ + + + diff --git a/@xen-orchestra/lite/src/components/UsageBar.vue b/@xen-orchestra/lite/src/components/UsageBar.vue index 3848bf9bb..c0c8ecc9e 100644 --- a/@xen-orchestra/lite/src/components/UsageBar.vue +++ b/@xen-orchestra/lite/src/components/UsageBar.vue @@ -1,43 +1,32 @@ 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 5a492b3a5..9b9366bd1 100644 --- a/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/VmsCpuUsage.vue +++ b/@xen-orchestra/lite/src/components/pool/dashboard/cpuUsage/VmsCpuUsage.vue @@ -1,33 +1,39 @@ 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 02e44164f..55c91c2a3 100644 --- a/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/HostsRamUsage.vue +++ b/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/HostsRamUsage.vue @@ -1,25 +1,31 @@ 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 1b473f3ad..adb2c59d1 100644 --- a/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/VmsRamUsage.vue +++ b/@xen-orchestra/lite/src/components/pool/dashboard/ramUsage/VmsRamUsage.vue @@ -1,25 +1,31 @@ diff --git a/@xen-orchestra/lite/src/composables/stat-status.composable.ts b/@xen-orchestra/lite/src/composables/stat-status.composable.ts new file mode 100644 index 000000000..1f5dd7656 --- /dev/null +++ b/@xen-orchestra/lite/src/composables/stat-status.composable.ts @@ -0,0 +1,32 @@ +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[]>, + _data: MaybeRef, + _isFetching: MaybeRef +) => { + const stats = toRef(_stats); + const data = toRef(_data); + const isFetching = toRef(_isFetching); + + const _isStatFetched: ComputedRef = computed( + () => stats.value.length === data.value.length + ); + + const isStatEmpty: ComputedRef = computed( + () => + !isFetching.value && stats.value.length === 0 && data.value.length === 0 + ); + + const isLoading: ComputedRef = computed( + () => isFetching.value || !_isStatFetched.value + ); + + return { + isStatEmpty, + isLoading, + }; +}; diff --git a/@xen-orchestra/lite/src/locales/en.json b/@xen-orchestra/lite/src/locales/en.json index 3b9a1fd5d..48a8e8557 100644 --- a/@xen-orchestra/lite/src/locales/en.json +++ b/@xen-orchestra/lite/src/locales/en.json @@ -112,6 +112,7 @@ "news": "News", "news-name": "{name} news", "no-alarm-triggered": "No alarm triggered", + "no-result": "No result", "no-selected-vm-can-be-exported": "No selected VM can be exported", "no-selected-vm-can-be-migrated": "No selected VM can be migrated", "no-tasks": "No tasks", diff --git a/@xen-orchestra/lite/src/locales/fr.json b/@xen-orchestra/lite/src/locales/fr.json index 966791ed9..7144d1188 100644 --- a/@xen-orchestra/lite/src/locales/fr.json +++ b/@xen-orchestra/lite/src/locales/fr.json @@ -112,6 +112,7 @@ "news": "Actualités", "news-name": "Actualités {name}", "no-alarm-triggered": "Aucune alarme déclenchée", + "no-result": "Aucun résultat", "no-selected-vm-can-be-exported": "Aucune VM sélectionnée ne peut être exportée", "no-selected-vm-can-be-migrated": "Aucune VM sélectionnée ne peut être migrée", "no-tasks": "Aucune tâche", diff --git a/@xen-orchestra/lite/src/types/stat.ts b/@xen-orchestra/lite/src/types/stat.ts new file mode 100644 index 000000000..ff6ea4fd9 --- /dev/null +++ b/@xen-orchestra/lite/src/types/stat.ts @@ -0,0 +1,7 @@ +export interface StatData { + id: string; + value: number; + label?: string; + badgeLabel?: string; + maxValue?: number; +}