Update tooltips for runner statuses

This change updates the runner status tooltip for badges and icons,
in the admin and project views.

The status considered are "online", "offline", "never contacted" and
"stale".

Changelog: changed

app/assets/javascripts/runner/components/runner_status_badge.vue

@@ -3,10 +3,11 @@ import { GlBadge, GlTooltipDirective } from '@gitlab/ui';
 import { __, s__, sprintf } from '~/locale';
 import { getTimeago } from '~/lib/utils/datetime_utility';
 import {
-  I18N_ONLINE_RUNNER_TIMEAGO_DESCRIPTION,
-  I18N_NEVER_CONTACTED_RUNNER_DESCRIPTION,
-  I18N_OFFLINE_RUNNER_TIMEAGO_DESCRIPTION,
-  I18N_STALE_RUNNER_DESCRIPTION,
+  I18N_ONLINE_TIMEAGO_TOOLTIP,
+  I18N_NEVER_CONTACTED_TOOLTIP,
+  I18N_OFFLINE_TIMEAGO_TOOLTIP,
+  I18N_STALE_TIMEAGO_TOOLTIP,
+  I18N_STALE_NEVER_CONTACTED_TOOLTIP,
   STATUS_ONLINE,
   STATUS_NEVER_CONTACTED,
   STATUS_OFFLINE,
@@ -32,7 +33,7 @@ export default {
         return getTimeago().format(this.runner.contactedAt);
       }
       // Prevent "just now" from being rendered, in case data is missing.
-      return __('n/a');
+      return __('never');
     },
     badge() {
       switch (this.runner?.status) {
@@ -40,35 +41,39 @@ export default {
           return {
             variant: 'success',
             label: s__('Runners|online'),
-            tooltip: sprintf(I18N_ONLINE_RUNNER_TIMEAGO_DESCRIPTION, {
-              timeAgo: this.contactedAtTimeAgo,
-            }),
+            tooltip: this.timeAgoTooltip(I18N_ONLINE_TIMEAGO_TOOLTIP),
           };
         case STATUS_NEVER_CONTACTED:
           return {
             variant: 'muted',
             label: s__('Runners|never contacted'),
-            tooltip: I18N_NEVER_CONTACTED_RUNNER_DESCRIPTION,
+            tooltip: I18N_NEVER_CONTACTED_TOOLTIP,
           };
         case STATUS_OFFLINE:
           return {
             variant: 'muted',
             label: s__('Runners|offline'),
-            tooltip: sprintf(I18N_OFFLINE_RUNNER_TIMEAGO_DESCRIPTION, {
-              timeAgo: this.contactedAtTimeAgo,
-            }),
+            tooltip: this.timeAgoTooltip(I18N_OFFLINE_TIMEAGO_TOOLTIP),
           };
         case STATUS_STALE:
           return {
             variant: 'warning',
             label: s__('Runners|stale'),
-            tooltip: I18N_STALE_RUNNER_DESCRIPTION,
+            // runner may have contacted (or not) and be stale: consider both cases.
+            tooltip: this.runner.contactedAt
+              ? this.timeAgoTooltip(I18N_STALE_TIMEAGO_TOOLTIP)
+              : I18N_STALE_NEVER_CONTACTED_TOOLTIP,
           };
         default:
           return null;
       }
     },
   },
+  methods: {
+    timeAgoTooltip(text) {
+      return sprintf(text, { timeAgo: this.contactedAtTimeAgo });
+    },
+  },
 };
 </script>
 <template>

app/assets/javascripts/runner/constants.js

@@ -21,18 +21,19 @@ export const I18N_GROUP_RUNNER_DESCRIPTION = s__(
 );
 export const I18N_PROJECT_RUNNER_DESCRIPTION = s__('Runners|Associated with one or more projects');
 
-// Status
-export const I18N_ONLINE_RUNNER_TIMEAGO_DESCRIPTION = s__(
+// Status tooltips
+export const I18N_ONLINE_TIMEAGO_TOOLTIP = s__(
   'Runners|Runner is online; last contact was %{timeAgo}',
 );
-export const I18N_NEVER_CONTACTED_RUNNER_DESCRIPTION = s__(
-  'Runners|This runner has never contacted this instance',
+export const I18N_NEVER_CONTACTED_TOOLTIP = s__('Runners|Runner has never contacted this instance');
+export const I18N_OFFLINE_TIMEAGO_TOOLTIP = s__(
+  'Runners|Runner is offline; last contact was %{timeAgo}',
 );
-export const I18N_OFFLINE_RUNNER_TIMEAGO_DESCRIPTION = s__(
-  'Runners|No recent contact from this runner; last contact was %{timeAgo}',
+export const I18N_STALE_TIMEAGO_TOOLTIP = s__(
+  'Runners|Runner is stale; last contact was %{timeAgo}',
 );
-export const I18N_STALE_RUNNER_DESCRIPTION = s__(
-  'Runners|No contact from this runner in over 3 months',
+export const I18N_STALE_NEVER_CONTACTED_TOOLTIP = s__(
+  'Runners|Runner is stale; it has never contacted this instance',
 );
 
 // Actions

app/helpers/ci/runners_helper.rb

@@ -6,7 +6,7 @@ module Ci
 
     def runner_status_icon(runner, size: 16, icon_class: '')
       status = runner.status
-      active = runner.active
+      contacted_at = runner.contacted_at
 
       title = ''
       icon = 'warning-solid'
@@ -14,22 +14,20 @@ module Ci
 
       case status
       when :online
-        if active
-          title = s_("Runners|Runner is online, last contact was %{runner_contact} ago") % { runner_contact: time_ago_in_words(runner.contacted_at) }
-          icon = 'status-active'
-          span_class = 'gl-text-green-500'
-        else
-          title = s_("Runners|Runner is paused, last contact was %{runner_contact} ago") % { runner_contact: time_ago_in_words(runner.contacted_at) }
-          icon = 'status-paused'
-          span_class = 'gl-text-gray-600'
-        end
+        title = s_("Runners|Runner is online; last contact was %{runner_contact} ago") % { runner_contact: time_ago_in_words(contacted_at) }
+        icon = 'status-active'
+        span_class = 'gl-text-green-500'
       when :not_connected, :never_contacted
-        title = s_("Runners|New runner, has not contacted yet")
+        title = s_("Runners|Runner has never contacted this instance")
         icon = 'warning-solid'
       when :offline
-        title = s_("Runners|Runner is offline, last contact was %{runner_contact} ago") % { runner_contact: time_ago_in_words(runner.contacted_at) }
+        title = s_("Runners|Runner is offline; last contact was %{runner_contact} ago") % { runner_contact: time_ago_in_words(contacted_at) }
         icon = 'status-failed'
         span_class = 'gl-text-red-500'
+      when :stale
+        # runner may have contacted (or not) and be stale: consider both cases.
+        title = contacted_at ? s_("Runners|Runner is stale; last contact was %{runner_contact} ago") % { runner_contact: time_ago_in_words(contacted_at) } : s_("Runners|Runner is stale; it has never contacted this instance")
+        icon = 'warning-solid'
       end
 
       content_tag(:span, class: span_class, title: title, data: { toggle: 'tooltip', container: 'body', testid: 'runner_status_icon', qa_selector: "runner_status_#{status}_content" }) do

locale/gitlab.pot

@@ -32090,15 +32090,6 @@ msgstr ""
 msgid "Runners|New registration token generated!"
 msgstr ""
 
-msgid "Runners|New runner, has not contacted yet"
-msgstr ""
-
-msgid "Runners|No contact from this runner in over 3 months"
-msgstr ""
-
-msgid "Runners|No recent contact from this runner; last contact was %{timeAgo}"
-msgstr ""
-
 msgid "Runners|No spot. Default choice for Windows Shell executor."
 msgstr ""
 
@@ -32183,16 +32174,28 @@ msgstr ""
 msgid "Runners|Runner cannot be deleted, please contact your administrator"
 msgstr ""
 
-msgid "Runners|Runner is offline, last contact was %{runner_contact} ago"
+msgid "Runners|Runner has never contacted this instance"
+msgstr ""
+
+msgid "Runners|Runner is offline; last contact was %{runner_contact} ago"
+msgstr ""
+
+msgid "Runners|Runner is offline; last contact was %{timeAgo}"
 msgstr ""
 
-msgid "Runners|Runner is online, last contact was %{runner_contact} ago"
+msgid "Runners|Runner is online; last contact was %{runner_contact} ago"
 msgstr ""
 
 msgid "Runners|Runner is online; last contact was %{timeAgo}"
 msgstr ""
 
-msgid "Runners|Runner is paused, last contact was %{runner_contact} ago"
+msgid "Runners|Runner is stale; it has never contacted this instance"
+msgstr ""
+
+msgid "Runners|Runner is stale; last contact was %{runner_contact} ago"
+msgstr ""
+
+msgid "Runners|Runner is stale; last contact was %{timeAgo}"
 msgstr ""
 
 msgid "Runners|Runner registration"
@@ -32246,9 +32249,6 @@ msgstr ""
 msgid "Runners|The runner will be permanently deleted and no longer available for projects or groups in the instance. Are you sure you want to continue?"
 msgstr ""
 
-msgid "Runners|This runner has never contacted this instance"
-msgstr ""
-
 msgid "Runners|This runner is associated with specific projects."
 msgstr ""
 
@@ -44769,9 +44769,6 @@ msgstr ""
 msgid "my-channel"
 msgstr ""
 
-msgid "n/a"
-msgstr ""
-
 msgid "need attention"
 msgstr ""
 

spec/frontend/runner/components/runner_status_badge_spec.js

@@ -7,6 +7,8 @@ import {
   STATUS_OFFLINE,
   STATUS_STALE,
   STATUS_NEVER_CONTACTED,
+  I18N_NEVER_CONTACTED_TOOLTIP,
+  I18N_STALE_NEVER_CONTACTED_TOOLTIP,
 } from '~/runner/constants';
 
 describe('RunnerTypeBadge', () => {
@@ -59,7 +61,7 @@ describe('RunnerTypeBadge', () => {
 
     expect(wrapper.text()).toBe('never contacted');
     expect(findBadge().props('variant')).toBe('muted');
-    expect(getTooltip().value).toMatch('This runner has never contacted');
+    expect(getTooltip().value).toBe(I18N_NEVER_CONTACTED_TOOLTIP);
   });
 
   it('renders offline state', () => {
@@ -72,9 +74,7 @@ describe('RunnerTypeBadge', () => {
 
     expect(wrapper.text()).toBe('offline');
     expect(findBadge().props('variant')).toBe('muted');
-    expect(getTooltip().value).toBe(
-      'No recent contact from this runner; last contact was 1 day ago',
-    );
+    expect(getTooltip().value).toBe('Runner is offline; last contact was 1 day ago');
   });
 
   it('renders stale state', () => {
@@ -87,7 +87,20 @@ describe('RunnerTypeBadge', () => {
 
     expect(wrapper.text()).toBe('stale');
     expect(findBadge().props('variant')).toBe('warning');
-    expect(getTooltip().value).toBe('No contact from this runner in over 3 months');
+    expect(getTooltip().value).toBe('Runner is stale; last contact was 1 year ago');
+  });
+
+  it('renders stale state with no contact time', () => {
+    createComponent({
+      runner: {
+        contactedAt: null,
+        status: STATUS_STALE,
+      },
+    });
+
+    expect(wrapper.text()).toBe('stale');
+    expect(findBadge().props('variant')).toBe('warning');
+    expect(getTooltip().value).toBe(I18N_STALE_NEVER_CONTACTED_TOOLTIP);
   });
 
   describe('does not fail when data is missing', () => {
@@ -100,7 +113,7 @@ describe('RunnerTypeBadge', () => {
       });
 
       expect(wrapper.text()).toBe('online');
-      expect(getTooltip().value).toBe('Runner is online; last contact was n/a');
+      expect(getTooltip().value).toBe('Runner is online; last contact was never');
     });
 
     it('status is missing', () => {

spec/helpers/ci/runners_helper_spec.rb

@@ -10,24 +10,31 @@ RSpec.describe Ci::RunnersHelper do
   end
 
   describe '#runner_status_icon', :clean_gitlab_redis_cache do
-    it "returns - not contacted yet" do
+    it "returns online text" do
+      runner = create(:ci_runner, contacted_at: 1.second.ago)
+      expect(helper.runner_status_icon(runner)).to include("is online")
+    end
+
+    it "returns never contacted" do
       runner = create(:ci_runner)
-      expect(helper.runner_status_icon(runner)).to include("not contacted yet")
+      expect(helper.runner_status_icon(runner)).to include("never contacted")
     end
 
     it "returns offline text" do
-      runner = create(:ci_runner, contacted_at: 1.day.ago, active: true)
-      expect(helper.runner_status_icon(runner)).to include("Runner is offline")
+      runner = create(:ci_runner, contacted_at: 1.day.ago)
+      expect(helper.runner_status_icon(runner)).to include("is offline")
     end
 
-    it "returns online text" do
-      runner = create(:ci_runner, contacted_at: 1.second.ago, active: true)
-      expect(helper.runner_status_icon(runner)).to include("Runner is online")
+    it "returns stale text" do
+      runner = create(:ci_runner, created_at: 4.months.ago, contacted_at: 4.months.ago)
+      expect(helper.runner_status_icon(runner)).to include("is stale")
+      expect(helper.runner_status_icon(runner)).to include("last contact was")
     end
 
-    it "returns paused text" do
-      runner = create(:ci_runner, contacted_at: 1.second.ago, active: false)
-      expect(helper.runner_status_icon(runner)).to include("Runner is paused")
+    it "returns stale text, when runner never contacted" do
+      runner = create(:ci_runner, created_at: 4.months.ago)
+      expect(helper.runner_status_icon(runner)).to include("is stale")
+      expect(helper.runner_status_icon(runner)).to include("never contacted")
     end
   end