Merge branch '350372' into 'master'

Update geo node health status badge

See merge request gitlab-org/gitlab!80075

ee/app/assets/javascripts/geo_nodes/components/header/geo_node_health_status.vue

 <script>
-import { GlIcon, GlBadge } from '@gitlab/ui';
+import { GlBadge } from '@gitlab/ui';
 import { HEALTH_STATUS_UI } from 'ee/geo_nodes/constants';
 
 export default {
   components: {
-    GlIcon,
     GlBadge,
   },
   props: {
@@ -23,8 +22,7 @@ export default {
 </script>
 
 <template>
-  <gl-badge :variant="statusUi.variant">
-    <gl-icon :name="statusUi.icon" />
-    <span class="gl-ml-2 gl-font-weight-bold">{{ statusUi.text }}</span>
+  <gl-badge :variant="statusUi.variant" :icon="statusUi.icon" class="gl-font-weight-bold!">
+    {{ statusUi.text }}
   </gl-badge>
 </template>

ee/spec/frontend/geo_nodes/components/header/geo_node_health_status_spec.js

-import { GlIcon, GlBadge } from '@gitlab/ui';
+import { GlBadge } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import GeoNodeHealthStatus from 'ee/geo_nodes/components/header/geo_node_health_status.vue';
 import { HEALTH_STATUS_UI } from 'ee/geo_nodes/constants';
@@ -24,8 +24,6 @@ describe('GeoNodeHealthStatus', () => {
   });
 
   const findGeoStatusBadge = () => wrapper.findComponent(GlBadge);
-  const findGeoStatusIcon = () => wrapper.findComponent(GlIcon);
-  const findGeoStatusText = () => wrapper.find('span');
 
   describe.each`
     status         | uiData
@@ -46,11 +44,11 @@ describe('GeoNodeHealthStatus', () => {
       });
 
       it(`renders icon to ${uiData.icon}`, () => {
-        expect(findGeoStatusIcon().attributes('name')).toBe(uiData.icon);
+        expect(findGeoStatusBadge().props('icon')).toBe(uiData.icon);
       });
 
       it(`renders status text to ${uiData.text}`, () => {
-        expect(findGeoStatusText().text()).toBe(uiData.text);
+        expect(findGeoStatusBadge().text()).toBe(uiData.text);
       });
     });
   });