diff --git a/shell/components/ClusterIconMenu.vue b/shell/components/ClusterIconMenu.vue index 661821dd8bc..6bbe093972f 100644 --- a/shell/components/ClusterIconMenu.vue +++ b/shell/components/ClusterIconMenu.vue @@ -25,7 +25,7 @@ export default { }, customColor() { - return !this.cluster.removePreviewColor && this.cluster.badge?.iconText ? this.cluster.badge?.color : ''; + return this.cluster.iconColor || ''; }, }, diff --git a/shell/components/nav/TopLevelMenu.helper.ts b/shell/components/nav/TopLevelMenu.helper.ts index 072f2a47e3c..7c80ffe172b 100644 --- a/shell/components/nav/TopLevelMenu.helper.ts +++ b/shell/components/nav/TopLevelMenu.helper.ts @@ -13,6 +13,7 @@ interface TopLevelMenuCluster { ready: boolean providerNavLogo: string, badge: string, + iconColor: string, isLocal: boolean, pinned: boolean, description: string, @@ -143,6 +144,7 @@ export abstract class BaseTopLevelMenuHelper { ready: mgmtCluster.isReady, // && !provCluster?.hasError, providerNavLogo: mgmtCluster.providerMenuLogo, badge: mgmtCluster.badge, + iconColor: mgmtCluster.iconColor, isLocal: mgmtCluster.isLocal, pinned: mgmtCluster.pinned, description: provCluster?.description || mgmtCluster.description, diff --git a/shell/models/management.cattle.io.cluster.js b/shell/models/management.cattle.io.cluster.js index 5c746e706e3..f25c7f76514 100644 --- a/shell/models/management.cattle.io.cluster.js +++ b/shell/models/management.cattle.io.cluster.js @@ -296,6 +296,11 @@ export default class MgmtCluster extends SteveModel { return this.providerLogo; } + // Color to use as the underline for the icon in the app bar + get iconColor() { + return this.metadata?.annotations[CLUSTER_BADGE.COLOR]; + } + // Custom badge to show for the Cluster (if the appropriate annotations are set) get badge() { const icon = this.metadata?.annotations?.[CLUSTER_BADGE.ICON_TEXT]; @@ -305,7 +310,7 @@ export default class MgmtCluster extends SteveModel { return undefined; } - let color = this.metadata?.annotations[CLUSTER_BADGE.COLOR] || DEFAULT_BADGE_COLOR; + let color = this.iconColor || DEFAULT_BADGE_COLOR; const iconText = this.metadata?.annotations[CLUSTER_BADGE.ICON_TEXT] || ''; let foregroundColor;