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"
                       >
-                        <span>{{ numberOfUpdatablePackages }}</span>
+                        <span>{{ serverStore.numberOfUpdatablePackages }}</span>
                       </div>
                     </div>
                   </div>
@@ -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"
         />
         <div v-else class="w-full col-start-1 col-span-1 bg-red-700 rounded-sm flex justify-center item-center">
-          <span class="text-sm font-semibold text-gray-300 text-center">{{ numberOfUpdatablePackages }}</span>
+          <span class="text-sm font-semibold text-gray-300 text-center">{{
+            serverStore.numberOfUpdatablePackages
+          }}</span>
         </div>
 
         <span class="col-start-2 col-span-full text-md font-semibold text-gray-300">{{
@@ -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,