diff --git a/app/assets/javascripts/environments/components/kubernetes_overview.vue b/app/assets/javascripts/environments/components/kubernetes_overview.vue
index 36cce29d6247fbda4ee167c5ccc8dc323e05f077..d5a7b43c953199febffb60ac0a44acdc20daeb52 100644
--- a/app/assets/javascripts/environments/components/kubernetes_overview.vue
+++ b/app/assets/javascripts/environments/components/kubernetes_overview.vue
@@ -43,7 +43,7 @@ export default {
return {
isVisible: false,
error: '',
- hasFailedState: false,
+ failedState: {},
podsLoading: false,
workloadTypesLoading: false,
};
@@ -78,6 +78,9 @@ export default {
return this.hasFailedState ? 'error' : 'success';
},
+ hasFailedState() {
+ return Object.values(this.failedState).some((item) => item);
+ },
},
methods: {
toggleCollapse() {
@@ -86,6 +89,12 @@ export default {
onClusterError(message) {
this.error = message;
},
+ onUpdateFailedState(event) {
+ this.failedState = {
+ ...this.failedState,
+ ...event,
+ };
+ },
},
i18n: {
collapse: __('Collapse'),
@@ -126,14 +135,14 @@ export default {
class="gl-mb-5"
@cluster-error="onClusterError"
@loading="podsLoading = $event"
- @failed="hasFailedState = true" />
+ @update-failed-state="onUpdateFailedState" />
<kubernetes-tabs
:configuration="k8sAccessConfiguration"
:namespace="namespace"
class="gl-mb-5"
@cluster-error="onClusterError"
@loading="workloadTypesLoading = $event"
- @failed="hasFailedState = true"
+ @update-failed-state="onUpdateFailedState"
/></template>
</gl-collapse>
</div>
diff --git a/app/assets/javascripts/environments/components/kubernetes_pods.vue b/app/assets/javascripts/environments/components/kubernetes_pods.vue
index 743159d62563f51446c4f287adf49dae789a0f10..2015355f7940b51e8e2daf0a04807f7338bbaf0a 100644
--- a/app/assets/javascripts/environments/components/kubernetes_pods.vue
+++ b/app/assets/javascripts/environments/components/kubernetes_pods.vue
@@ -82,9 +82,10 @@ export default {
methods: {
countPodsByPhase(phase) {
const filteredPods = this.k8sPods.filter((item) => item.status.phase === phase);
- if (phase === PHASE_FAILED && filteredPods.length) {
- this.$emit('failed');
- }
+
+ const hasFailedState = Boolean(phase === PHASE_FAILED && filteredPods.length);
+ this.$emit('update-failed-state', { pods: hasFailedState });
+
return filteredPods.length;
},
},
diff --git a/app/assets/javascripts/environments/components/kubernetes_status_bar.vue b/app/assets/javascripts/environments/components/kubernetes_status_bar.vue
index 8ecb61711ce2842ad0efde09bfbae51aaf18d471..20ed67f6bd9cfe252abbd072c17c2feae02496b0 100644
--- a/app/assets/javascripts/environments/components/kubernetes_status_bar.vue
+++ b/app/assets/javascripts/environments/components/kubernetes_status_bar.vue
@@ -153,7 +153,7 @@ export default {
},
},
i18n: {
- healthLabel: s__('Environment|Environment health'),
+ healthLabel: s__('Environment|Environment status'),
syncStatusLabel: s__('Environment|Sync status'),
},
badgeContainerClasses: 'gl-display-flex gl-align-items-center gl-flex-shrink-0 gl-mr-3 gl-mb-2',
diff --git a/app/assets/javascripts/environments/components/kubernetes_summary.vue b/app/assets/javascripts/environments/components/kubernetes_summary.vue
index 1f4e91afe3577622efae881ef313e75a05ad5b72..2912fd8f4d88f38f8dbd4e484cf4f86322af1dd6 100644
--- a/app/assets/javascripts/environments/components/kubernetes_summary.vue
+++ b/app/assets/javascripts/environments/components/kubernetes_summary.vue
@@ -140,9 +140,7 @@ export default {
return workloadType.items?.failed?.length > 0;
});
- if (failed) {
- this.$emit('failed');
- }
+ this.$emit('update-failed-state', { summary: failed });
},
},
i18n: {
diff --git a/app/assets/javascripts/environments/components/kubernetes_tabs.vue b/app/assets/javascripts/environments/components/kubernetes_tabs.vue
index 60b36596ef3f6da70d2ba5daf29d3d3d9dc3ed89..0d80b1fd79712b41fa36290fe543df0316d74f6e 100644
--- a/app/assets/javascripts/environments/components/kubernetes_tabs.vue
+++ b/app/assets/javascripts/environments/components/kubernetes_tabs.vue
@@ -140,7 +140,7 @@ export default {
:namespace="namespace"
:configuration="configuration"
@loading="$emit('loading', $event)"
- @failed="$emit('failed')"
+ @update-failed-state="$emit('update-failed-state', $event)"
@cluster-error="$emit('cluster-error', $event)"
/>
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 74170c6e5016c33bf72a5e7b389b6880e55cd911..453b983fddba2231e627c5faed9548961db30114 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -18985,7 +18985,7 @@ msgstr ""
msgid "Environment|Deployments"
msgstr ""
-msgid "Environment|Environment health"
+msgid "Environment|Environment status"
msgstr ""
msgid "Environment|External IP"
diff --git a/spec/frontend/environments/kubernetes_overview_spec.js b/spec/frontend/environments/kubernetes_overview_spec.js
index 12689df586fe00f536b78233ea982a7abb22fa7a..9f4a7518c473da484f4705d7a00b07bf9aaec93b 100644
--- a/spec/frontend/environments/kubernetes_overview_spec.js
+++ b/spec/frontend/environments/kubernetes_overview_spec.js
@@ -149,14 +149,14 @@ describe('~/environments/components/kubernetes_overview.vue', () => {
});
it('sets `clusterHealthStatus` as error when pods emitted a failure', async () => {
- findKubernetesPods().vm.$emit('failed');
+ findKubernetesPods().vm.$emit('update-failed-state', { pods: true });
await nextTick();
expect(findKubernetesStatusBar().props('clusterHealthStatus')).toBe('error');
});
it('sets `clusterHealthStatus` as error when workload types emitted a failure', async () => {
- findKubernetesTabs().vm.$emit('failed');
+ findKubernetesTabs().vm.$emit('update-failed-state', { summary: true });
await nextTick();
expect(findKubernetesStatusBar().props('clusterHealthStatus')).toBe('error');
@@ -165,6 +165,21 @@ describe('~/environments/components/kubernetes_overview.vue', () => {
it('sets `clusterHealthStatus` as success when data is loaded and no failures where emitted', () => {
expect(findKubernetesStatusBar().props('clusterHealthStatus')).toBe('success');
});
+
+ it('sets `clusterHealthStatus` as success after state update if there are no failures', async () => {
+ findKubernetesTabs().vm.$emit('update-failed-state', { summary: true });
+ findKubernetesTabs().vm.$emit('update-failed-state', { pods: true });
+ await nextTick();
+ expect(findKubernetesStatusBar().props('clusterHealthStatus')).toBe('error');
+
+ findKubernetesTabs().vm.$emit('update-failed-state', { summary: false });
+ await nextTick();
+ expect(findKubernetesStatusBar().props('clusterHealthStatus')).toBe('error');
+
+ findKubernetesTabs().vm.$emit('update-failed-state', { pods: false });
+ await nextTick();
+ expect(findKubernetesStatusBar().props('clusterHealthStatus')).toBe('success');
+ });
});
describe('on cluster error', () => {
diff --git a/spec/frontend/environments/kubernetes_pods_spec.js b/spec/frontend/environments/kubernetes_pods_spec.js
index 2952e0c68c2199d0cbede500530e9a6a757faa21..6c3e49e4d8a003e562b24eebe290428517f2abfc 100644
--- a/spec/frontend/environments/kubernetes_pods_spec.js
+++ b/spec/frontend/environments/kubernetes_pods_spec.js
@@ -90,11 +90,17 @@ describe('~/environments/components/kubernetes_pods.vue', () => {
]);
});
- it('emits a failed event when there are failed pods', async () => {
+ it('emits a update-failed-state event for each pod', async () => {
createWrapper();
await waitForPromises();
- expect(wrapper.emitted('failed')).toHaveLength(1);
+ expect(wrapper.emitted('update-failed-state')).toHaveLength(4);
+ expect(wrapper.emitted('update-failed-state')).toEqual([
+ [{ pods: false }],
+ [{ pods: false }],
+ [{ pods: false }],
+ [{ pods: true }],
+ ]);
});
});
diff --git a/spec/frontend/environments/kubernetes_summary_spec.js b/spec/frontend/environments/kubernetes_summary_spec.js
index efabd766001d8d10fc8cf6876bc757c008da5869..0d448d0b6af0dc94a1b1abe6d6187cd6366c77c1 100644
--- a/spec/frontend/environments/kubernetes_summary_spec.js
+++ b/spec/frontend/environments/kubernetes_summary_spec.js
@@ -107,8 +107,8 @@ describe('~/environments/components/kubernetes_summary.vue', () => {
);
});
- it('emits a failed event when there are failed workload types', () => {
- expect(wrapper.emitted('failed')).toHaveLength(1);
+ it('emits a update-failed-state event when there are failed workload types', () => {
+ expect(wrapper.emitted('update-failed-state')).toEqual([[{ summary: true }]]);
});
it('emits an error message when gets an error from the cluster_client API', async () => {
diff --git a/spec/frontend/environments/kubernetes_tabs_spec.js b/spec/frontend/environments/kubernetes_tabs_spec.js
index fecd6d2a8ee1a5e9a5889b20c8f16e80c6ed263d..bf029ad6a810c1b40db392d8556b928f1b3d5b88 100644
--- a/spec/frontend/environments/kubernetes_tabs_spec.js
+++ b/spec/frontend/environments/kubernetes_tabs_spec.js
@@ -179,9 +179,10 @@ describe('~/environments/components/kubernetes_tabs.vue', () => {
expect(wrapper.emitted('loading')[1]).toEqual([false]);
});
- it('emits a failed event when gets it from the component', () => {
- findKubernetesSummary().vm.$emit('failed');
- expect(wrapper.emitted('failed')).toHaveLength(1);
+ it('emits a state update event when gets it from the component', () => {
+ const eventData = { summary: true };
+ findKubernetesSummary().vm.$emit('update-failed-state', eventData);
+ expect(wrapper.emitted('update-failed-state')).toEqual([[eventData]]);
});
});
});