From 6d2de7884e593418b8763fa4c7ab4276958065ca Mon Sep 17 00:00:00 2001 From: mabasian <54101509+mabasian@users.noreply.github.com> Date: Tue, 27 Aug 2024 12:04:30 +0200 Subject: [PATCH] Fix: Display Server Package Updates Correctly in Update Panel (#2003) * Fix: Display Server Package Updates Correctly in Update Panel fix #1960 * FIX: fetch method to all components * update:remove logs --- .../components/modals/UpdatePanel.vue | 28 +++++----- .../components/server-update/UpdateServer.vue | 43 ++++++++++----- launcher/src/composables/version.js | 53 +++++++++++++++---- launcher/src/store/servers.js | 1 + 4 files changed, 88 insertions(+), 37 deletions(-) diff --git a/launcher/src/components/UI/base-header/components/modals/UpdatePanel.vue b/launcher/src/components/UI/base-header/components/modals/UpdatePanel.vue index 8a58b78707..c9e8374f1d 100755 --- a/launcher/src/components/UI/base-header/components/modals/UpdatePanel.vue +++ b/launcher/src/components/UI/base-header/components/modals/UpdatePanel.vue @@ -43,7 +43,7 @@ v-else class="w-4 h-4 bg-red-700 rounded-full p-1 text-[10px] text-gray-200 text-center flex justify-center items-center mr-5" > - {{ numberOfUpdatablePackages }} + {{ serverStore.numberOfUpdatablePackages }} @@ -257,7 +257,7 @@ import ControlService from "@/store/ControlService"; import { useServices } from "@/store/services.js"; import { useNodeHeader } from "@/store/nodeHeader"; import { onMounted, computed, ref, watchEffect } from "vue"; -import { useUpdateCheck } from "@/composables/version.js"; +import { useUpdateCheck, useUpgradablePackages } from "@/composables/version.js"; import { useServers } from "@/store/servers"; import { useFooter } from "@/store/theFooter"; @@ -273,6 +273,8 @@ const footerStore = useFooter(); const openButton = ref("Open OS Update Panel"); +const { getUpgradablePackages } = useUpgradablePackages(); + //Data const stereumApp = ref({ current: "alpha", @@ -280,7 +282,7 @@ const stereumApp = ref({ autoUpdate: "", }); const osVersionCurrent = ref("-"); -const numberOfUpdatablePackages = ref(0); + const searchingForOsUpdates = ref(false); //Computed @@ -358,19 +360,15 @@ const searchOsUpdates = async () => { } searchingForOsUpdates.value = true; - setTimeout(async () => { - await getUpdatablePackagesCount(); - searchingForOsUpdates.value = false; - }, 10); -}; -const getUpdatablePackagesCount = async () => { - try { - const packagesCount = await ControlService.getCountOfUpdatableOSUpdate(); - const numPackages = Number(packagesCount); - numberOfUpdatablePackages.value = isNaN(numPackages) || !numPackages ? 0 : numPackages; - } catch (error) { - console.log(error); + if (serverStore.numberOfUpdatablePackages === null || serverStore.upgradablePackages.value.length === 0) { + setTimeout(async () => { + await getUpgradablePackages(); + serverStore.numberOfUpdatablePackages = serverStore.upgradablePackages.value.length || 0; + searchingForOsUpdates.value = false; + }, 10); + } else { + searchingForOsUpdates.value = false; } }; diff --git a/launcher/src/components/UI/server-management/components/server-update/UpdateServer.vue b/launcher/src/components/UI/server-management/components/server-update/UpdateServer.vue index 4198d418ca..c082c22230 100644 --- a/launcher/src/components/UI/server-management/components/server-update/UpdateServer.vue +++ b/launcher/src/components/UI/server-management/components/server-update/UpdateServer.vue @@ -45,7 +45,9 @@ src="/animation/loading/loading-circle.gif" />
- {{ numberOfUpdatablePackages }} + {{ + serverStore.numberOfUpdatablePackages + }}
{{ @@ -98,11 +100,13 @@ import { ref, onMounted, computed, reactive, watchEffect } from "vue"; import { useServers } from "@/store/servers"; import { useFooter } from "@/store/theFooter"; import i18n from "@/includes/i18n"; +import { useUpgradablePackages } from "@/composables/version.js"; const t = i18n.global.t; const footerStore = useFooter(); const serverStore = useServers(); +const { getUpgradablePackages } = useUpgradablePackages(); const osVersionCurrent = ref(""); const updateStatus = reactive({ @@ -114,10 +118,10 @@ const stereumApp = ref({ latest: "2.0", autoUpdate: "", }); -const numberOfUpdatablePackages = ref(null); + const searchingForUpdatablePackages = ref(false); -const newUpdates = computed(() => serverStore.upgradablePackages); +const newUpdates = computed(() => serverStore.upgradablePackages.value); const onOff = computed(() => (stereumApp.value.autoUpdate == "on" ? "text-green-700" : "text-red-700")); //Watchers @@ -132,9 +136,16 @@ watchEffect(() => { //Lifecycle onMounted(async () => { - await getUpgradablePackages(); + searchingForUpdatablePackages.value = true; + + if (serverStore.numberOfUpdatablePackages === null || serverStore.upgradablePackages.value.length === 0) { + await getUpgradablePackages(); + } + await getOsVersion(); await getSettings(); + + searchingForUpdatablePackages.value = false; }); //Methods @@ -161,17 +172,21 @@ const getOsVersion = async () => { } }; -const getUpgradablePackages = async () => { +const fetchUpgradablePackages = async () => { searchingForUpdatablePackages.value = true; - try { - serverStore.upgradablePackages = await ControlService.getUpgradeablePackages(); - if (serverStore.upgradablePackages) { - numberOfUpdatablePackages.value = serverStore.upgradablePackages.length; + + if (serverStore.numberOfUpdatablePackages === null || serverStore.upgradablePackages.value.length === 0) { + try { + await getUpgradablePackages(); + + serverStore.numberOfUpdatablePackages = serverStore.upgradablePackages.value.length; + } catch (error) { + console.error("Failed to fetch upgradable packages:", error); + } finally { searchingForUpdatablePackages.value = false; } - } catch (error) { - console.error("Failed to fetch upgradable packages:", error); - serverStore.upgradablePackages = []; + } else { + searchingForUpdatablePackages.value = false; } }; @@ -179,7 +194,9 @@ const updateAll = async () => { serverStore.isUpdateProcessing = true; try { await ControlService.updateOS(); - await getUpgradablePackages(); // Refresh the list of upgradable packages + + await fetchUpgradablePackages(); + updateStatus.message = "All packages updated successfully!"; updateStatus.color = "text-green-500"; } catch (error) { diff --git a/launcher/src/composables/version.js b/launcher/src/composables/version.js index da9c13c219..767f47b27c 100644 --- a/launcher/src/composables/version.js +++ b/launcher/src/composables/version.js @@ -1,7 +1,37 @@ -import ControlService from '@/store/ControlService' +import ControlService from "@/store/ControlService"; import { useNodeHeader } from "@/store/nodeHeader"; import { useServices } from "@/store/services"; -import { useBackendServices } from '@/composables/services'; +import { useBackendServices } from "@/composables/services"; +import { useServers } from "@/store/servers"; + +export function useUpgradablePackages() { + const serverStore = useServers(); + + // Method to get upgradable packages + const getUpgradablePackages = async () => { + // Only fetch if the data hasn't been loaded before + if (serverStore.numberOfUpdatablePackages === null || serverStore.upgradablePackages.value.length === 0) { + try { + // Fetch the upgradable packages + const packages = await ControlService.getUpgradeablePackages(); + serverStore.upgradablePackages.value = packages || []; + + if (serverStore.upgradablePackages.value.length > 0) { + serverStore.numberOfUpdatablePackages = serverStore.upgradablePackages.value.length; + } else { + serverStore.numberOfUpdatablePackages = 0; + } + } catch (error) { + console.error("Failed to fetch upgradable packages:", error); + serverStore.upgradablePackages.value = []; + } + } + }; + + return { + getUpgradablePackages, + }; +} export async function useUpdateCheck() { const serviceStore = useServices(); @@ -9,10 +39,10 @@ export async function useUpdateCheck() { if (!nodeHeaderStore.updating) { nodeHeaderStore.searchingForUpdates = true; - let services = await useBackendServices() //get configurations of all services in backend format + let services = await useBackendServices(); //get configurations of all services in backend format // fetch all version information - let versions = {} + let versions = {}; try { versions.latest = await ControlService.checkUpdates(); versions.currentStereum = await ControlService.getCurrentStereumVersion(); @@ -30,8 +60,10 @@ export async function useUpdateCheck() { let newAvailableUpdates = []; if (versions.latest && services?.length > 0) { services.forEach((service) => { - if (!versions.latest[service.network] || !versions.latest[service.network][service.service]) service.network = "mainnet"; - if (!versions.latest[service.network] || !versions.latest[service.network][service.service]) service.network = "prater"; + if (!versions.latest[service.network] || !versions.latest[service.network][service.service]) + service.network = "mainnet"; + if (!versions.latest[service.network] || !versions.latest[service.network][service.service]) + service.network = "prater"; if (versions.latest[service.network] && versions.latest[service.network][service.service]) { if (service.service === "ErigonService" && !service.imageVersion.startsWith("v")) { service.imageVersion = "v" + service.imageVersion; @@ -39,14 +71,18 @@ export async function useUpdateCheck() { } if ( service.imageVersion != - versions.latest[service.network][service.service][versions.latest[service.network][service.service].length - 1] + versions.latest[service.network][service.service][ + versions.latest[service.network][service.service].length - 1 + ] ) { nodeHeaderStore.isUpdateAvailable = true; newAvailableUpdates.push({ id: service.id, name: service.service.replace(/(Beacon|Validator|Service)/gm, ""), version: - versions.latest[service.network][service.service][versions.latest[service.network][service.service].length - 1], + versions.latest[service.network][service.service][ + versions.latest[service.network][service.service].length - 1 + ], }); console.log("Service Update Available!"); } @@ -75,4 +111,3 @@ export async function useUpdateCheck() { nodeHeaderStore.searchingForUpdates = false; } } - diff --git a/launcher/src/store/servers.js b/launcher/src/store/servers.js index 2d05f0e2d0..85e50e151a 100644 --- a/launcher/src/store/servers.js +++ b/launcher/src/store/servers.js @@ -95,6 +95,7 @@ export const useServers = defineStore("servers", { serverUpdates: [], isUpdateProcessing: false, upgradablePackages: [], + numberOfUpdatablePackages: null, allTasks: [], isMajorUpgradeActive: false, isMajorUpgradeButtonActive: false,