1 files changed, 15 insertions, 7 deletions

diff --git a/app/assets/javascripts/pages/projects/shared/permissions/components/settings_panel.vue b/app/assets/javascripts/pages/projects/shared/permissions/components/settings_panel.vue
index 0bcfb740469..b4d24f3aa36 100644
--- a/app/assets/javascripts/pages/projects/shared/permissions/components/settings_panel.vue
+++ b/app/assets/javascripts/pages/projects/shared/permissions/components/settings_panel.vue
@@ -1,11 +1,19 @@
 <script>
 import settingsMixin from 'ee_else_ce/pages/projects/shared/permissions/mixins/settings_pannel_mixin';
+import { __ } from '~/locale';
 import projectFeatureSetting from './project_feature_setting.vue';
 import projectFeatureToggle from '~/vue_shared/components/toggle_button.vue';
 import projectSettingRow from './project_setting_row.vue';
-import { visibilityOptions, visibilityLevelDescriptions } from '../constants';
+import {
+  visibilityOptions,
+  visibilityLevelDescriptions,
+  featureAccessLevelMembers,
+  featureAccessLevelEveryone,
+} from '../constants';
 import { toggleHiddenClassBySelector } from '../external';
 
+const PAGE_FEATURE_ACCESS_LEVEL = __('Everyone');
+
 export default {
   components: {
     projectFeatureSetting,
@@ -102,9 +110,9 @@ export default {
 
   computed: {
     featureAccessLevelOptions() {
-      const options = [[10, 'Only Project Members']];
+      const options = [featureAccessLevelMembers];
       if (this.visibilityLevel !== visibilityOptions.PRIVATE) {
-        options.push([20, 'Everyone With Access']);
+        options.push(featureAccessLevelEveryone);
       }
       return options;
     },
@@ -117,7 +125,7 @@ export default {
 
     pagesFeatureAccessLevelOptions() {
       if (this.visibilityLevel !== visibilityOptions.PUBLIC) {
-        return this.featureAccessLevelOptions.concat([[30, 'Everyone']]);
+        return this.featureAccessLevelOptions.concat([[30, PAGE_FEATURE_ACCESS_LEVEL]]);
       }
       return this.featureAccessLevelOptions;
     },
@@ -200,17 +208,17 @@ export default {
               <option
                 :value="visibilityOptions.PRIVATE"
                 :disabled="!visibilityAllowed(visibilityOptions.PRIVATE)"
-                >Private</option
+                >{{ __('Private') }}</option
               >
               <option
                 :value="visibilityOptions.INTERNAL"
                 :disabled="!visibilityAllowed(visibilityOptions.INTERNAL)"
-                >Internal</option
+                >{{ __('Internal') }}</option
               >
               <option
                 :value="visibilityOptions.PUBLIC"
                 :disabled="!visibilityAllowed(visibilityOptions.PUBLIC)"
-                >Public</option
+                >{{ __('Public') }}</option
               >
             </select>
             <i aria-hidden="true" data-hidden="true" class="fa fa-chevron-down"></i>