Use "Service Ping/Data" for the Usage Ping Disabled components

app/assets/javascripts/analytics/devops_report/components/usage_ping_disabled.vue → app/assets/javascripts/analytics/devops_report/components/service_ping_disabled.vue

@@ -25,28 +25,33 @@ export default {
 };
 </script>
 <template>
-  <gl-empty-state class="js-empty-state" :title="__('Usage ping is off')" :svg-path="svgPath">
+  <gl-empty-state :title="s__('ServicePing|Service ping is off')" :svg-path="svgPath">
     <template #description>
       <gl-sprintf
         v-if="!isAdmin"
         :message="
-          __(
-            'To view instance-level analytics, ask an admin to turn on %{docLinkStart}usage ping%{docLinkEnd}.',
+          s__(
+            'ServicePing|To view instance-level analytics, ask an admin to turn on %{docLinkStart}service ping%{docLinkEnd}.',
           )
         "
       >
         <template #docLink="{ content }">
-          <gl-link :href="docsLink" target="_blank">{{ content }}</gl-link>
+          <gl-link :href="docsLink" target="_blank" data-testid="docs-link">{{ content }}</gl-link>
         </template>
       </gl-sprintf>
-      <template v-else
-        ><p>
-          {{ __('Turn on usage ping to review instance-level analytics.') }}
+      <template v-else>
+        <p>
+          {{ s__('ServicePing|Turn on service ping to review instance-level analytics.') }}
         </p>
 
-        <gl-button category="primary" variant="success" :href="primaryButtonPath">
-          {{ __('Turn on usage ping') }}</gl-button
+        <gl-button
+          category="primary"
+          variant="success"
+          :href="primaryButtonPath"
+          data-testid="power-on-button"
         >
+          {{ s__('ServicePing|Turn on service ping') }}
+        </gl-button>
       </template>
     </template>
   </gl-empty-state>

app/assets/javascripts/analytics/devops_report/devops_score_disabled_usage_ping.js → app/assets/javascripts/analytics/devops_report/devops_score_disabled_service_ping.js

 import Vue from 'vue';
+import { parseBoolean } from '~/lib/utils/common_utils';
 import UserCallout from '~/user_callout';
-import UsagePingDisabled from './components/usage_ping_disabled.vue';
+import ServicePingDisabled from './components/service_ping_disabled.vue';
 
 export default () => {
   // eslint-disable-next-line no-new
   new UserCallout();
 
-  const emptyStateContainer = document.getElementById('js-devops-usage-ping-disabled');
+  const emptyStateContainer = document.getElementById('js-devops-service-ping-disabled');
 
   if (!emptyStateContainer) return false;
 
-  const { emptyStateSvgPath, enableUsagePingLink, docsLink, isAdmin } = emptyStateContainer.dataset;
+  const {
+    isAdmin,
+    emptyStateSvgPath,
+    enableServicePingPath,
+    docsLink,
+  } = emptyStateContainer.dataset;
 
   return new Vue({
     el: emptyStateContainer,
     provide: {
-      isAdmin: Boolean(isAdmin),
+      isAdmin: parseBoolean(isAdmin),
       svgPath: emptyStateSvgPath,
-      primaryButtonPath: enableUsagePingLink,
+      primaryButtonPath: enableServicePingPath,
       docsLink,
     },
     render(h) {
-      return h(UsagePingDisabled);
+      return h(ServicePingDisabled);
     },
   });
 };

app/assets/javascripts/pages/admin/dev_ops_report/index.js

 import initDevOpsScore from '~/analytics/devops_report/devops_score';
-import initDevOpsScoreDisabledUsagePing from '~/analytics/devops_report/devops_score_disabled_usage_ping';
+import initDevOpsScoreDisabledServicePing from '~/analytics/devops_report/devops_score_disabled_service_ping';
 
-initDevOpsScoreDisabledUsagePing();
+initDevOpsScoreDisabledServicePing();
 initDevOpsScore();

app/views/admin/dev_ops_report/_report.html.haml

-- usage_ping_enabled = Gitlab::CurrentSettings.usage_ping_enabled
+- service_ping_enabled = Gitlab::CurrentSettings.usage_ping_enabled
 
-- if usage_ping_enabled && show_callout?('dev_ops_report_intro_callout_dismissed')
+- if service_ping_enabled && show_callout?('dev_ops_report_intro_callout_dismissed')
   = render 'callout'
 
-- if !usage_ping_enabled
-  #js-devops-usage-ping-disabled{ data: { is_admin: current_user&.admin.to_s, empty_state_svg_path: image_path('illustrations/convdev/convdev_no_index.svg'), enable_usage_ping_link: metrics_and_profiling_admin_application_settings_path(anchor: 'js-usage-settings'), docs_link: help_page_path('development/usage_ping/index.md') } }
+- if !service_ping_enabled
+  #js-devops-service-ping-disabled{ data: { is_admin: current_user&.admin.to_s, empty_state_svg_path: image_path('illustrations/convdev/convdev_no_index.svg'), enable_service_ping_path: metrics_and_profiling_admin_application_settings_path(anchor: 'js-usage-settings'), docs_link: help_page_path('development/usage_ping/index.md') } }
 - else
   #js-devops-score{ data: { devops_score_metrics: devops_score_metrics(@metric).to_json, devops_report_docs_path: help_page_path('user/admin_area/analytics/dev_ops_report'), no_data_image_path: image_path('dev_ops_report_no_data.svg') } }
-

ee/app/views/admin/dev_ops_report/_devops_tabs.html.haml

-- usage_ping_enabled = Gitlab::CurrentSettings.usage_ping_enabled
+- service_ping_enabled = Gitlab::CurrentSettings.usage_ping_enabled
 
 %h2
   = _('DevOps Report')
 
-- if usage_ping_enabled && show_callout?('dev_ops_report_intro_callout_dismissed')
+- if service_ping_enabled && show_callout?('dev_ops_report_intro_callout_dismissed')
   = render_ce 'admin/dev_ops_report/callout'
 
-- if !usage_ping_enabled
-  #js-devops-usage-ping-disabled{ data: { is_admin: current_user&.admin.to_s, empty_state_svg_path: image_path('illustrations/convdev/convdev_no_index.svg'), enable_usage_ping_link: metrics_and_profiling_admin_application_settings_path(anchor: 'js-usage-settings'), docs_link: help_page_path('development/usage_ping/index.md') } }
+- if !service_ping_enabled
+  #js-devops-service-ping-disabled{ data: { is_admin: current_user&.admin.to_s, empty_state_svg_path: image_path('illustrations/convdev/convdev_no_index.svg'), enable_service_ping_path: metrics_and_profiling_admin_application_settings_path(anchor: 'js-usage-settings'), docs_link: help_page_path('development/usage_ping/index.md') } }
 - else
   .js-devops-adoption{ data: { empty_state_svg_path: image_path('illustrations/monitoring/getting_started.svg'), devops_score_metrics: devops_score_metrics(@metric).to_json, devops_report_docs_path: help_page_path('user/admin_area/analytics/dev_ops_report'), no_data_image_path: image_path('dev_ops_report_no_data.svg') } }

ee/spec/features/admin/admin_dev_ops_report_spec.rb

@@ -134,7 +134,7 @@ RSpec.describe 'DevOps Report page', :js do
         it 'shows empty state' do
           visit admin_dev_ops_report_path(tab: 'devops-score')
 
-          expect(page).to have_selector(".js-empty-state")
+          expect(page).to have_text('Service ping is off')
         end
 
         it 'hides the intro callout' do

locale/gitlab.pot

@@ -29819,6 +29819,18 @@ msgstr ""
 msgid "ServiceDesk|Your users can send emails to this address:"
 msgstr ""
 
+msgid "ServicePing|Service ping is off"
+msgstr ""
+
+msgid "ServicePing|To view instance-level analytics, ask an admin to turn on %{docLinkStart}service ping%{docLinkEnd}."
+msgstr ""
+
+msgid "ServicePing|Turn on service ping"
+msgstr ""
+
+msgid "ServicePing|Turn on service ping to review instance-level analytics."
+msgstr ""
+
 msgid "Session ID"
 msgstr ""
 
@@ -34387,9 +34399,6 @@ msgstr ""
 msgid "To view all %{scannedResourcesCount} scanned URLs, %{linkStart}please download the CSV file%{linkEnd}"
 msgstr ""
 
-msgid "To view instance-level analytics, ask an admin to turn on %{docLinkStart}usage ping%{docLinkEnd}."
-msgstr ""
-
 msgid "To widen your search, change or remove filters above"
 msgstr ""
 
@@ -34791,12 +34800,6 @@ msgstr ""
 msgid "Turn on"
 msgstr ""
 
-msgid "Turn on usage ping"
-msgstr ""
-
-msgid "Turn on usage ping to review instance-level analytics."
-msgstr ""
-
 msgid "Twitter"
 msgstr ""
 
@@ -35358,9 +35361,6 @@ msgstr ""
 msgid "Usage Trends"
 msgstr ""
 
-msgid "Usage ping is off"
-msgstr ""
-
 msgid "Usage statistics"
 msgstr ""
 

spec/features/admin/admin_dev_ops_report_spec.rb

@@ -32,7 +32,7 @@ RSpec.describe 'DevOps Report page', :js do
       it 'shows empty state' do
         visit admin_dev_ops_report_path
 
-        expect(page).to have_selector(".js-empty-state")
+        expect(page).to have_text('Service ping is off')
       end
 
       it 'hides the intro callout' do

spec/frontend/analytics/devops_report/components/service_ping_disabled_spec.js

+import { GlEmptyState, GlSprintf } from '@gitlab/ui';
+import { TEST_HOST } from 'helpers/test_constants';
+import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
+import ServicePingDisabled from '~/analytics/devops_report/components/service_ping_disabled.vue';
+
+describe('~/analytics/devops_report/components/service_ping_disabled.vue', () => {
+  let wrapper;
+
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  const createWrapper = ({ isAdmin = false } = {}) => {
+    wrapper = shallowMountExtended(ServicePingDisabled, {
+      provide: {
+        isAdmin,
+        svgPath: TEST_HOST,
+        docsLink: TEST_HOST,
+        primaryButtonPath: TEST_HOST,
+      },
+      stubs: { GlEmptyState, GlSprintf },
+    });
+  };
+
+  const findEmptyState = () => wrapper.findComponent(GlEmptyState);
+  const findMessageForRegularUsers = () => wrapper.findComponent(GlSprintf);
+  const findDocsLink = () => wrapper.findByTestId('docs-link');
+  const findPowerOnButton = () => wrapper.findByTestId('power-on-button');
+
+  it('renders empty state with provided SVG path', () => {
+    createWrapper();
+
+    expect(findEmptyState().props('svgPath')).toBe(TEST_HOST);
+  });
+
+  describe('for regular users', () => {
+    beforeEach(() => {
+      createWrapper({ isAdmin: false });
+    });
+
+    it('renders message without power-on button', () => {
+      expect(findMessageForRegularUsers().exists()).toBe(true);
+      expect(findPowerOnButton().exists()).toBe(false);
+    });
+
+    it('renders docs link', () => {
+      expect(findDocsLink().exists()).toBe(true);
+      expect(findDocsLink().attributes('href')).toBe(TEST_HOST);
+    });
+  });
+
+  describe('for admins', () => {
+    beforeEach(() => {
+      createWrapper({ isAdmin: true });
+    });
+
+    it('renders power-on button', () => {
+      expect(findPowerOnButton().exists()).toBe(true);
+    });
+  });
+});