fix: composable used outside ... issue + disable cache (#3947)

apps/frontend/src/pages/servers/index.vue

@@ -719,31 +719,32 @@ async function fetchCapacityStatuses(customProduct = null) {
             product.metadata.ram < min.metadata.ram ? product : min,
           ),
         ];
-    const capacityChecks = productsToCheck.map((product) =>
+    const capacityChecks = [];
-      useServersFetch("stock", {
+    for (const product of productsToCheck) {
-        method: "POST",
+      capacityChecks.push(
-        body: {
+        useServersFetch("stock", {
-          cpu: product.metadata.cpu,
+          method: "POST",
-          memory_mb: product.metadata.ram,
+          body: {
-          swap_mb: product.metadata.swap,
+            cpu: product.metadata.cpu,
-          storage_mb: product.metadata.storage,
+            memory_mb: product.metadata.ram,
-        },
+            swap_mb: product.metadata.swap,
-        bypassAuth: true,
+            storage_mb: product.metadata.storage,
-      }),
+          },
-    );
+          bypassAuth: true,
-
+        }),
-    const results = await Promise.all(capacityChecks);
+      );
+    }
 
     if (customProduct?.metadata) {
       return {
-        custom: results[0],
+        custom: await capacityChecks[0],
       };
     } else {
       return {
-        small: results[0],
+        small: await capacityChecks[0],
-        medium: results[1],
+        medium: await capacityChecks[1],
-        large: results[2],
+        large: await capacityChecks[2],
-        custom: results[3],
+        custom: await capacityChecks[3],
       };
     }
   } catch (error) {
@@ -760,6 +761,11 @@ async function fetchCapacityStatuses(customProduct = null) {
 const { data: capacityStatuses, refresh: refreshCapacity } = await useAsyncData(
   "ServerCapacityAll",
   fetchCapacityStatuses,
+  {
+    getCachedData() {
+      return null; // Dont cache stock data.
+    },
+  },
 );
 
 const isSmallAtCapacity = computed(() => capacityStatuses.value?.small?.available === 0);