fix(front): handle no view-stats in clusters list

Do not report ongoing issue when users do not have permission on
view-stats action on a cluster in clusters list page.

CHANGELOG.md

@@ -24,7 +24,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 - agent: Fix No module named 'werkzeug.middleware' ModuleNotFoundError with
   Werkzeug < 0.15 (#419→420).
-- frontend: Update dependencies to fix CVE-2024-55565 (nanoid).
+- frontend:
+  - Do not report ongoing issue when users do not have permission on
+    `view-stats` action on a cluster in clusters list page.
+  - Update dependencies to fix CVE-2024-55565 (nanoid).
 
 ## [4.0.0] - 2024-11-28
 

frontend/src/components/clusters/ClusterListItem.vue

@@ -42,6 +42,10 @@ const gateway = useGatewayAPI()
 const router = useRouter()
 
 async function getClusterStats() {
+  if (!runtimeStore.hasClusterPermission(props.cluster.name, 'view-stats')) {
+    loading.value = false
+    return
+  }
   try {
     props.cluster.stats = await gateway.stats(props.cluster.name)
   } catch (error: any) {

frontend/src/stores/runtime.ts

@@ -341,6 +341,12 @@ export const useRuntimeStore = defineStore('runtime', () => {
     )
   }
 
+  function hasClusterPermission(clusterName: string, permission: string): boolean {
+    const cluster = getCluster(clusterName)
+    if (!cluster) return false
+    return cluster.permissions.actions.includes(permission)
+  }
+
   function addNotification(notification: Notification) {
     notifications.value.push(notification)
     setTimeout(removeNotification, notification.timeout * 1000, notification)
@@ -380,6 +386,7 @@ export const useRuntimeStore = defineStore('runtime', () => {
     getCluster,
     checkClusterAvailable,
     hasPermission,
+    hasClusterPermission,
     addNotification,
     removeNotification,
     reportError,