Skip to content

Icon variants in app/assets/javascripts/environments/constants.js

Update constants in https://gitlab.com/gitlab-org/gitlab/-/blob/6ee4a9c457545a9eb340ada2808adbdccedc6c65/app/assets/javascripts/environments/constants.js to use GlIcon variant prop instead of applying a class e.g.

const RUNNING_STATUS_ICON = { icon: 'status-running', variant: 'info' };
const SUCCESS_STATUS_ICON = { icon: 'status-success', variant: 'success' };
const WAITING_STATUS_ICON = { icon: 'status-waiting', variant: 'subtle' };
const FAILED_STATUS_ICON = { icon: 'status-failed', variant: 'danger' };
const PAUSED_STATUS_ICON = { icon: 'status-paused', variant: 'warning' };

Will need to re-wire implementation in https://gitlab.com/gitlab-org/gitlab/-/blob/ed3e1bc51dc0fdbcf43e6afef635cb672a3b913c/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_tree_item.vue

diff --git a/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_tree_item.vue b/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_tree_item.vue
index 2e5c0368e8a5..4ffec96651d0 100644
--- a/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_tree_item.vue
+++ b/app/assets/javascripts/environments/environment_details/components/kubernetes/kubernetes_tree_item.vue
@@ -49,7 +49,7 @@ export default {
           :title="status"
           :name="statusBadge.icon"
           :size="12"
-          :class="statusBadge.class"
+          :variant="statusBadge.variant"
           class="gl-ml-2"
           data-testid="resource-status-icon"
         />
Edited by Scott de Jonge