Geo - Fix Sync Disabled Text

The text when a Geo sync is disabled
was hardcoded to container registries.

This should actually mention what sync it
actually is.

This MR adds the item title as a variable in
the disabled text.

ee/app/assets/javascripts/geo_nodes/components/geo_node_detail_item.vue

 <script>
-import { GlIcon, GlPopover, GlLink } from '@gitlab/ui';
+import { GlIcon, GlPopover, GlLink, GlSprintf } from '@gitlab/ui';
+import { s__ } from '~/locale';
 import popover from '~/vue_shared/directives/popover';
 
 import { VALUE_TYPE, CUSTOM_TYPE, REPLICATION_HELP_URL } from '../constants';
@@ -16,6 +17,7 @@ export default {
     GlIcon,
     GlPopover,
     GlLink,
+    GlSprintf,
   },
   directives: {
     popover,
@@ -77,6 +79,7 @@ export default {
     },
   },
   replicationHelpUrl: REPLICATION_HELP_URL,
+  disabledText: s__('Geo|Synchronization of %{itemTitle} is disabled.'),
 };
 </script>
 
@@ -124,7 +127,9 @@ export default {
         :css-classes="['w-100']"
       >
         <section>
-          <p>{{ __('Synchronization of container repositories is disabled.') }}</p>
+          <gl-sprintf :message="$options.disabledText">
+            <template #itemTitle>{{ itemTitle.toLowerCase() }}</template>
+          </gl-sprintf>
           <div class="mt-3">
             <gl-link class="gl-font-sm" :href="$options.replicationHelpUrl" target="_blank">{{
               __('Learn how to enable synchronization')

ee/app/assets/javascripts/geo_nodes/components/node_detail_sections/node_details_section_sync.vue

@@ -40,7 +40,7 @@ export default {
           detailsPath: `${this.node.url}admin/geo/projects`,
         },
         {
-          itemEnabled: this.nodeDetails.repositories.enabled,
+          itemEnabled: this.nodeDetails.wikis.enabled,
           itemTitle: s__('GeoNodes|Wikis'),
           itemValue: this.nodeDetails.wikis,
           itemValueType: VALUE_TYPE.GRAPH,

ee/spec/frontend/geo_nodes/components/geo_node_detail_item_spec.js

 import { shallowMount } from '@vue/test-utils';
-import { GlPopover, GlLink } from '@gitlab/ui';
+import { GlPopover, GlLink, GlSprintf } from '@gitlab/ui';
 
 import GeoNodeDetailItemComponent from 'ee/geo_nodes/components/geo_node_detail_item.vue';
 import GeoNodeSyncSettings from 'ee/geo_nodes/components/geo_node_sync_settings.vue';
@@ -24,6 +24,7 @@ describe('GeoNodeDetailItemComponent', () => {
 
   const createComponent = (props = {}) => {
     wrapper = shallowMount(GeoNodeDetailItemComponent, {
+      stubs: { GlSprintf },
       propsData: {
         ...defaultProps,
         ...props,
@@ -151,6 +152,12 @@ describe('GeoNodeDetailItemComponent', () => {
         expect(wrapper.find(GlPopover).exists()).toBeTruthy();
       });
 
+      it('renders disabled text', () => {
+        expect(wrapper.find(GlPopover).text()).toContain(
+          `Synchronization of ${defaultProps.itemTitle.toLowerCase()} is disabled.`,
+        );
+      });
+
       it('renders link to replication help documentation in popover', () => {
         const popoverLink = wrapper.find(GlPopover).find(GlLink);
 

locale/gitlab.pot

@@ -10358,6 +10358,9 @@ msgstr ""
 msgid "Geo|Synchronization failed - %{error}"
 msgstr ""
 
+msgid "Geo|Synchronization of %{itemTitle} is disabled."
+msgstr ""
+
 msgid "Geo|The database is currently %{db_lag} behind the primary node."
 msgstr ""
 
@@ -21523,9 +21526,6 @@ msgstr ""
 msgid "Synchronization disabled"
 msgstr ""
 
-msgid "Synchronization of container repositories is disabled."
-msgstr ""
-
 msgid "System"
 msgstr ""