diff --git a/ee/app/assets/javascripts/pages/admin/application_settings/roles_and_permissions/index.js b/ee/app/assets/javascripts/pages/admin/application_settings/roles_and_permissions/index.js
index 64274640c8bd45a8c79337dfcbd81a25daee3400..6788140c19839b841cdc789b76dc9df7ac3cd00d 100644
--- a/ee/app/assets/javascripts/pages/admin/application_settings/roles_and_permissions/index.js
+++ b/ee/app/assets/javascripts/pages/admin/application_settings/roles_and_permissions/index.js
@@ -1,4 +1,7 @@
import { initRolesAndPermissions } from 'ee/roles_and_permissions';
-import { I18N_EMPTY_TEXT_ADMIN } from 'ee/roles_and_permissions/constants';
+import { s__ } from '~/locale';
-initRolesAndPermissions({ emptyText: I18N_EMPTY_TEXT_ADMIN, showGroupSelector: true });
+initRolesAndPermissions({
+ emptyText: s__(`MemberRole|To add a new role select a group and then 'Add new role'.`),
+ showGroupSelector: true,
+});
diff --git a/ee/app/assets/javascripts/pages/groups/settings/roles_and_permissions/index.js b/ee/app/assets/javascripts/pages/groups/settings/roles_and_permissions/index.js
index 15c3564518de64d730bf30e92bbe9bd53b8601b5..b7f090b22965297daf94aac7b8e5d3e2a545a36e 100644
--- a/ee/app/assets/javascripts/pages/groups/settings/roles_and_permissions/index.js
+++ b/ee/app/assets/javascripts/pages/groups/settings/roles_and_permissions/index.js
@@ -1,4 +1,7 @@
import { initRolesAndPermissions } from 'ee/roles_and_permissions';
-import { I18N_EMPTY_TEXT_GROUP } from 'ee/roles_and_permissions/constants';
+import { s__ } from '~/locale';
-initRolesAndPermissions({ emptyText: I18N_EMPTY_TEXT_GROUP, showGroupSelector: false });
+initRolesAndPermissions({
+ emptyText: s__(`MemberRole|To add a new role select 'Add new role'.`),
+ showGroupSelector: false,
+});
diff --git a/ee/app/assets/javascripts/roles_and_permissions/components/list_member_roles.vue b/ee/app/assets/javascripts/roles_and_permissions/components/list_member_roles.vue
index be47e721b7d342c2ce5bbe2db14fa1004a28733f..5c700402f21c4c883dec13e49f32965cf5dfaa9d 100644
--- a/ee/app/assets/javascripts/roles_and_permissions/components/list_member_roles.vue
+++ b/ee/app/assets/javascripts/roles_and_permissions/components/list_member_roles.vue
@@ -3,28 +3,20 @@ import { GlBadge, GlButton, GlCard, GlEmptyState, GlModal, GlTable } from '@gitl
import { keyBy } from 'lodash';
import { deleteMemberRole, getMemberRoles } from 'ee/rest_api';
import { ACCESS_LEVEL_LABELS } from '~/access_level/constants';
-import { createAlert, VARIANT_DANGER } from '~/alert';
+import { createAlert } from '~/alert';
import { HTTP_STATUS_NOT_FOUND } from '~/lib/utils/http_status';
-import { sprintf } from '~/locale';
-import {
- FIELDS,
- I18N_ADD_NEW_ROLE,
- I18N_CANCEL,
- I18N_CARD_TITLE,
- I18N_CREATION_SUCCESS,
- I18N_DELETE_ROLE,
- I18N_DELETION_ERROR,
- I18N_DELETION_SUCCESS,
- I18N_EMPTY_TITLE,
- I18N_FETCH_ERROR,
- I18N_LICENSE_ERROR,
- I18N_MODAL_TITLE,
- I18N_MODAL_WARNING,
- I18N_MEMBER_ROLE_PERMISSIONS_QUERY_ERROR,
-} from '../constants';
+import { sprintf, s__, __ } from '~/locale';
import memberRolePermissionsQuery from '../graphql/member_role_permissions.query.graphql';
import CreateMemberRole from './create_member_role.vue';
+export const FIELDS = [
+ { key: 'name', label: s__('MemberRole|Name'), sortable: true },
+ { key: 'id', label: s__('MemberRole|ID'), sortable: true },
+ { key: 'base_access_level', label: s__('MemberRole|Base role'), sortable: true },
+ { key: 'permissions', label: s__('MemberRole|Permissions') },
+ { key: 'actions', label: s__('MemberRole|Actions') },
+];
+
export default {
components: {
CreateMemberRole,
@@ -58,14 +50,14 @@ export default {
};
},
apollo: {
- memberRolePermissions: {
+ availablePermissions: {
query: memberRolePermissionsQuery,
update({ memberRolePermissions }) {
- this.availablePermissions = memberRolePermissions.nodes;
+ return memberRolePermissions.nodes;
},
error({ message }) {
this.alert = createAlert({
- message: sprintf(I18N_MEMBER_ROLE_PERMISSIONS_QUERY_ERROR, { message }),
+ message: sprintf(this.$options.i18n.fetchPermissionsError, { message }),
});
},
},
@@ -92,12 +84,11 @@ export default {
try {
await deleteMemberRole(this.groupId, this.memberRoleToDelete);
- this.$toast.show(I18N_DELETION_SUCCESS);
+ this.$toast.show(this.$options.i18n.deleteSuccess);
this.fetchMemberRoles(this.groupId);
} catch (error) {
this.alert = createAlert({
- message: error.response?.data?.message || I18N_DELETION_ERROR,
- variant: VARIANT_DANGER,
+ message: error.response?.data?.message || this.$options.i18n.deleteError,
});
} finally {
this.memberRoleToDelete = null;
@@ -118,14 +109,10 @@ export default {
} catch (error) {
this.memberRoles = [];
if (error?.response?.status === HTTP_STATUS_NOT_FOUND) {
- this.alert = createAlert({
- message: I18N_LICENSE_ERROR,
- variant: VARIANT_DANGER,
- });
+ this.alert = createAlert({ message: this.$options.i18n.licenseError });
} else {
this.alert = createAlert({
- message: error?.response?.data?.message || I18N_FETCH_ERROR,
- variant: VARIANT_DANGER,
+ message: error?.response?.data?.message || this.$options.i18n.fetchRolesError,
});
}
} finally {
@@ -148,7 +135,7 @@ export default {
return ACCESS_LEVEL_LABELS[value];
},
onCreatedMemberRole() {
- this.$toast.show(I18N_CREATION_SUCCESS);
+ this.$toast.show(this.$options.i18n.createSuccess);
this.showCreateMemberForm = false;
this.fetchMemberRoles(this.groupId);
},
@@ -161,27 +148,35 @@ export default {
},
FIELDS,
i18n: {
- addNewRole: I18N_ADD_NEW_ROLE,
- cardTitle: I18N_CARD_TITLE,
- deleteRole: I18N_DELETE_ROLE,
- emptyTitle: I18N_EMPTY_TITLE,
+ addNewRole: s__('MemberRole|Add new role'),
+ cardTitle: s__('MemberRole|Custom roles'),
+ deleteRole: s__('MemberRole|Delete role'),
+ emptyTitle: s__('MemberRole|No custom roles for this group'),
+ fetchRolesError: s__('MemberRole|Failed to fetch roles.'),
+ fetchPermissionsError: s__('MemberRole|Could not fetch available permissions: %{message}'),
+ deleteSuccess: s__('MemberRole|Role successfully deleted.'),
+ deleteError: s__('MemberRole|Failed to delete the role.'),
+ createSuccess: s__('MemberRole|Role successfully created.'),
+ licenseError: s__('MemberRole|Make sure the group is in the Ultimate tier.'),
},
modal: {
actionPrimary: {
- text: I18N_DELETE_ROLE,
+ text: s__('MemberRole|Delete role'),
attributes: {
variant: 'danger',
},
},
actionSecondary: {
- text: I18N_CANCEL,
+ text: __('Cancel'),
attributes: {
variant: 'default',
},
},
id: 'confirm-delete-role',
- title: I18N_MODAL_TITLE,
- warning: I18N_MODAL_WARNING,
+ title: s__('MemberRole|Are you sure you want to delete this role?'),
+ warning: s__(
+ 'MemberRole|To delete the custom role make sure no group member has this custom role',
+ ),
},
};
</script>
@@ -198,7 +193,7 @@ export default {
<div class="gl-new-card-actions">
<gl-button
:disabled="!groupId"
- :loading="$apollo.queries.memberRolePermissions.loading"
+ :loading="$apollo.queries.availablePermissions.loading"
size="small"
data-testid="add-role"
@click="showCreateMemberForm = true"
@@ -227,7 +222,7 @@ export default {
v-else
:fields="$options.FIELDS"
:items="memberRoles"
- :busy="isLoadingMemberRoles || $apollo.queries.memberRolePermissions.loading"
+ :busy="isLoadingMemberRoles || $apollo.queries.availablePermissions.loading"
stacked="sm"
>
<template #cell(base_access_level)="{ item: { base_access_level } }">
diff --git a/ee/app/assets/javascripts/roles_and_permissions/constants.js b/ee/app/assets/javascripts/roles_and_permissions/constants.js
deleted file mode 100644
index 087d26ddcbef99662dd473553a510c461ae1bd78..0000000000000000000000000000000000000000
--- a/ee/app/assets/javascripts/roles_and_permissions/constants.js
+++ /dev/null
@@ -1,50 +0,0 @@
-import { __, s__ } from '~/locale';
-
-export const FIELDS = [
- {
- key: 'name',
- label: s__('MemberRole|Name'),
- sortable: true,
- },
- {
- key: 'id',
- label: s__('MemberRole|ID'),
- sortable: true,
- },
- {
- key: 'base_access_level',
- label: s__('MemberRole|Base role'),
- sortable: true,
- },
- {
- key: 'permissions',
- label: s__('MemberRole|Permissions'),
- },
- {
- key: 'actions',
- label: s__('MemberRole|Actions'),
- },
-];
-
-// Translations
-export const I18N_ADD_NEW_ROLE = s__('MemberRole|Add new role');
-export const I18N_CANCEL = __('Cancel');
-export const I18N_CARD_TITLE = s__('MemberRole|Custom roles');
-export const I18N_CREATION_SUCCESS = s__('MemberRole|Role successfully created.');
-export const I18N_DELETE_ROLE = s__('MemberRole|Delete role');
-export const I18N_DELETION_ERROR = s__('MemberRole|Failed to delete the role.');
-export const I18N_DELETION_SUCCESS = s__('MemberRole|Role successfully deleted.');
-export const I18N_EMPTY_TITLE = s__('MemberRole|No custom roles for this group');
-export const I18N_EMPTY_TEXT_GROUP = s__("MemberRole|To add a new role select 'Add new role'.");
-export const I18N_EMPTY_TEXT_ADMIN = s__(
- "MemberRole|To add a new role select a group and then 'Add new role'.",
-);
-export const I18N_FETCH_ERROR = s__('MemberRole|Failed to fetch roles.');
-export const I18N_MEMBER_ROLE_PERMISSIONS_QUERY_ERROR = s__(
- 'MemberRole|Could not fetch available permissions: %{message}',
-);
-export const I18N_LICENSE_ERROR = s__('MemberRole|Make sure the group is in the Ultimate tier.');
-export const I18N_MODAL_TITLE = s__('MemberRole|Are you sure you want to delete this role?');
-export const I18N_MODAL_WARNING = s__(
- `MemberRole|To delete the custom role make sure no group member has this custom role`,
-);
diff --git a/ee/spec/frontend/roles_and_permissions/components/list_member_roles_spec.js b/ee/spec/frontend/roles_and_permissions/components/list_member_roles_spec.js
index d3ca72490802bbb580a1a5c22778899f91261d2a..b7bdc5b92a42db595607660efd8937f98deba4bf 100644
--- a/ee/spec/frontend/roles_and_permissions/components/list_member_roles_spec.js
+++ b/ee/spec/frontend/roles_and_permissions/components/list_member_roles_spec.js
@@ -1,17 +1,10 @@
import { GlCard, GlEmptyState, GlModal, GlTable } from '@gitlab/ui';
import Vue, { nextTick } from 'vue';
import VueApollo from 'vue-apollo';
-import { createAlert, VARIANT_DANGER } from '~/alert';
+import { createAlert } from '~/alert';
import { HTTP_STATUS_INTERNAL_SERVER_ERROR, HTTP_STATUS_NOT_FOUND } from '~/lib/utils/http_status';
import { getMemberRoles, deleteMemberRole } from 'ee/api/member_roles_api';
import CreateMemberRole from 'ee/roles_and_permissions/components/create_member_role.vue';
-import {
- I18N_CREATION_SUCCESS,
- I18N_DELETION_ERROR,
- I18N_DELETION_SUCCESS,
- I18N_FETCH_ERROR,
- I18N_LICENSE_ERROR,
-} from 'ee/roles_and_permissions/constants';
import ListMemberRoles from 'ee/roles_and_permissions/components/list_member_roles.vue';
import { mountExtended, shallowMountExtended } from 'helpers/vue_test_utils_helper';
import waitForPromises from 'helpers/wait_for_promises';
@@ -147,8 +140,7 @@ describe('ListMemberRoles', () => {
await waitForPromises();
expect(createAlert).toHaveBeenCalledWith({
- message: I18N_LICENSE_ERROR,
- variant: VARIANT_DANGER,
+ message: 'Make sure the group is in the Ultimate tier.',
});
});
@@ -157,10 +149,7 @@ describe('ListMemberRoles', () => {
createComponent({ groupId: '100' });
await waitForPromises();
- expect(createAlert).toHaveBeenCalledWith({
- message: I18N_FETCH_ERROR,
- variant: VARIANT_DANGER,
- });
+ expect(createAlert).toHaveBeenCalledWith({ message: 'Failed to fetch roles.' });
});
it('dismisses previous alerts', async () => {
@@ -196,7 +185,7 @@ describe('ListMemberRoles', () => {
it('shows toast', () => {
findCreateMemberRole().vm.$emit('success');
- expect(mockToastShow).toHaveBeenCalledWith(I18N_CREATION_SUCCESS);
+ expect(mockToastShow).toHaveBeenCalledWith('Role successfully created.');
});
it('fetches roles', async () => {
@@ -294,7 +283,7 @@ describe('ListMemberRoles', () => {
findModal().vm.$emit('primary');
await waitForPromises();
- expect(mockToastShow).toHaveBeenCalledWith(I18N_DELETION_SUCCESS);
+ expect(mockToastShow).toHaveBeenCalledWith('Role successfully deleted.');
});
it('fetches roles', async () => {
@@ -317,10 +306,7 @@ describe('ListMemberRoles', () => {
findModal().vm.$emit('primary');
await waitForPromises();
- expect(createAlert).toHaveBeenCalledWith({
- message: I18N_DELETION_ERROR,
- variant: VARIANT_DANGER,
- });
+ expect(createAlert).toHaveBeenCalledWith({ message: 'Failed to delete the role.' });
});
});
});