1 files changed, 14 insertions, 34 deletions

diff --git a/app/assets/javascripts/registry/settings/components/registry_settings_app.vue b/app/assets/javascripts/registry/settings/components/registry_settings_app.vue
index b4a59fd0178..2ee7bbef4c6 100644
--- a/app/assets/javascripts/registry/settings/components/registry_settings_app.vue
+++ b/app/assets/javascripts/registry/settings/components/registry_settings_app.vue
@@ -1,11 +1,16 @@
 <script>
 import { mapActions, mapGetters, mapState } from 'vuex';
 import { GlAlert, GlSprintf, GlLink } from '@gitlab/ui';
-import { s__ } from '~/locale';
 
 import { FETCH_SETTINGS_ERROR_MESSAGE } from '../../shared/constants';
 
 import SettingsForm from './settings_form.vue';
+import {
+  UNAVAILABLE_FEATURE_TITLE,
+  UNAVAILABLE_FEATURE_INTRO_TEXT,
+  UNAVAILABLE_USER_FEATURE_TEXT,
+  UNAVAILABLE_ADMIN_FEATURE_TEXT,
+} from '../constants';
 
 export default {
   components: {
@@ -15,17 +20,9 @@ export default {
     GlLink,
   },
   i18n: {
-    unavailableFeatureTitle: s__(
-      `ContainerRegistry|Container Registry tag expiration and retention policy is disabled`,
-    ),
-    unavailableFeatureIntroText: s__(
-      `ContainerRegistry|The Container Registry tag expiration and retention policies for this project have not been enabled.`,
-    ),
-    unavailableUserFeatureText: s__(`ContainerRegistry|Please contact your administrator.`),
-    unavailableAdminFeatureText: s__(
-      `ContainerRegistry| Please visit the %{linkStart}administration settings%{linkEnd} to enable this feature.`,
-    ),
-    fetchSettingsErrorText: FETCH_SETTINGS_ERROR_MESSAGE,
+    UNAVAILABLE_FEATURE_TITLE,
+    UNAVAILABLE_FEATURE_INTRO_TEXT,
+    FETCH_SETTINGS_ERROR_MESSAGE,
   },
   data() {
     return {
@@ -42,9 +39,7 @@ export default {
       return this.isDisabled && !this.fetchSettingsError;
     },
     unavailableFeatureMessage() {
-      return this.isAdmin
-        ? this.$options.i18n.unavailableAdminFeatureText
-        : this.$options.i18n.unavailableUserFeatureText;
+      return this.isAdmin ? UNAVAILABLE_ADMIN_FEATURE_TEXT : UNAVAILABLE_USER_FEATURE_TEXT;
     },
   },
   mounted() {
@@ -60,39 +55,24 @@ export default {
 
 <template>
   <div>
-    <p>
-      {{ s__('ContainerRegistry|Tag expiration policy is designed to:') }}
-    </p>
-    <ul>
-      <li>{{ s__('ContainerRegistry|Keep and protect the images that matter most.') }}</li>
-      <li>
-        {{
-          s__(
-            "ContainerRegistry|Automatically remove extra images that aren't designed to be kept.",
-          )
-        }}
-      </li>
-    </ul>
     <settings-form v-if="showSettingForm" />
     <template v-else>
       <gl-alert
         v-if="showDisabledFormMessage"
         :dismissible="false"
-        :title="$options.i18n.unavailableFeatureTitle"
+        :title="$options.i18n.UNAVAILABLE_FEATURE_TITLE"
         variant="tip"
       >
-        {{ $options.i18n.unavailableFeatureIntroText }}
+        {{ $options.i18n.UNAVAILABLE_FEATURE_INTRO_TEXT }}
 
         <gl-sprintf :message="unavailableFeatureMessage">
           <template #link="{ content }">
-            <gl-link :href="adminSettingsPath" target="_blank">
-              {{ content }}
-            </gl-link>
+            <gl-link :href="adminSettingsPath" target="_blank">{{ content }}</gl-link>
           </template>
         </gl-sprintf>
       </gl-alert>
       <gl-alert v-else-if="fetchSettingsError" variant="warning" :dismissible="false">
-        <gl-sprintf :message="$options.i18n.fetchSettingsErrorText" />
+        <gl-sprintf :message="$options.i18n.FETCH_SETTINGS_ERROR_MESSAGE" />
       </gl-alert>
     </template>
   </div>