diff options
author | Phil Hughes <me@iamphill.com> | 2018-03-12 10:24:51 +0000 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2018-03-12 10:24:51 +0000 |
commit | 57e84c305f124b7e68fb7e4c22d34a247a13d3dd (patch) | |
tree | d2d3ac85c7bcee19c27d93870fac4fd6407d3f15 | |
parent | d47449e957217791da2d4878360eb5db12ebfa06 (diff) | |
parent | 728bcd72de466122aa000ea5c9a31d3f193c1944 (diff) | |
download | gitlab-ce-57e84c305f124b7e68fb7e4c22d34a247a13d3dd.tar.gz |
Merge branch '43702-update-label-dropdown-wording' into 'master'
Update wording to specify create/manage project vs group labels in labels dropdown
Closes #43702
See merge request gitlab-org/gitlab-ce!17640
17 files changed, 244 insertions, 24 deletions
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue index c1dd4d42d9d..5ede53d8d01 100644 --- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue +++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/base.vue @@ -1,4 +1,5 @@ <script> +import { __ } from '~/locale'; import LabelsSelect from '~/labels_select'; import LoadingIcon from '../../loading_icon.vue'; @@ -31,6 +32,11 @@ export default { required: false, default: false, }, + isProject: { + type: Boolean, + required: false, + default: false, + }, abilityName: { type: String, required: true, @@ -73,6 +79,20 @@ export default { hiddenInputName() { return this.showCreate ? `${this.abilityName}[label_names][]` : 'label_id[]'; }, + createLabelTitle() { + if (this.isProject) { + return __('Create project label'); + } + + return __('Create group label'); + }, + manageLabelsTitle() { + if (this.isProject) { + return __('Manage project labels'); + } + + return __('Manage group labels'); + }, }, mounted() { this.labelsDropdown = new LabelsSelect(this.$refs.dropdownButton, { @@ -137,10 +157,14 @@ dropdown-menu-labels dropdown-menu-selectable" <dropdown-footer v-if="showCreate" :labels-web-url="labelsWebUrl" + :create-label-title="createLabelTitle" + :manage-labels-title="manageLabelsTitle" /> </div> <dropdown-create-label v-if="showCreate" + :is-project="isProject" + :header-title="createLabelTitle" /> </div> </div> diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label.vue index 4200d1e8473..34a07f33a23 100644 --- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label.vue +++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label.vue @@ -1,5 +1,14 @@ <script> +import { __ } from '~/locale'; + export default { + props: { + headerTitle: { + type: String, + required: false, + default: () => __('Create new label'), + }, + }, created() { this.suggestedColors = gon.suggested_label_colors; }, @@ -21,7 +30,7 @@ export default { > </i> </button> - {{ __('Create new label') }} + {{ headerTitle }} <button type="button" class="dropdown-title-button dropdown-menu-close" diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer.vue index e951a863811..5f61e9fbe80 100644 --- a/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer.vue +++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer.vue @@ -1,10 +1,22 @@ <script> +import { __ } from '~/locale'; + export default { props: { labelsWebUrl: { type: String, required: true, }, + createLabelTitle: { + type: String, + required: false, + default: () => __('Create new label'), + }, + manageLabelsTitle: { + type: String, + required: false, + default: () => __('Manage labels'), + }, }, }; </script> @@ -17,7 +29,7 @@ export default { href="#" class="dropdown-toggle-page" > - {{ __('Create new label') }} + {{ createLabelTitle }} </a> </li> <li> @@ -26,7 +38,7 @@ export default { class="dropdown-external-link" :href="labelsWebUrl" > - {{ __('Manage labels') }} + {{ manageLabelsTitle }} </a> </li> </ul> diff --git a/app/helpers/labels_helper.rb b/app/helpers/labels_helper.rb index b2c641a5dbd..87ff607dc3f 100644 --- a/app/helpers/labels_helper.rb +++ b/app/helpers/labels_helper.rb @@ -174,6 +174,39 @@ module LabelsHelper end end + def create_label_title(subject) + case subject + when Group + _('Create group label') + when Project + _('Create project label') + else + _('Create new label') + end + end + + def manage_labels_title(subject) + case subject + when Group + _('Manage group labels') + when Project + _('Manage project labels') + else + _('Manage labels') + end + end + + def view_labels_title(subject) + case subject + when Group + _('View group labels') + when Project + _('View project labels') + else + _('View labels') + end + end + # Required for Banzai::Filter::LabelReferenceFilter module_function :render_colored_label, :text_color_for_bg, :escape_once end diff --git a/app/views/shared/issuable/_label_page_create.html.haml b/app/views/shared/issuable/_label_page_create.html.haml index d5e7d3b87b7..91aa329eb93 100644 --- a/app/views/shared/issuable/_label_page_create.html.haml +++ b/app/views/shared/issuable/_label_page_create.html.haml @@ -1,5 +1,6 @@ +- subject = @project || @group .dropdown-page-two.dropdown-new-label - = dropdown_title("Create new label", options: { back: true }) + = dropdown_title(create_label_title(subject), options: { back: true }) = dropdown_content do .dropdown-labels-error.js-label-error %input#new_label_name.default-dropdown-input{ type: "text", placeholder: _('Name new label') } diff --git a/app/views/shared/issuable/_label_page_default.html.haml b/app/views/shared/issuable/_label_page_default.html.haml index 6a83321abcb..2bd922bca2b 100644 --- a/app/views/shared/issuable/_label_page_default.html.haml +++ b/app/views/shared/issuable/_label_page_default.html.haml @@ -3,6 +3,7 @@ - show_footer = local_assigns.fetch(:show_footer, true) - filter_placeholder = local_assigns.fetch(:filter_placeholder, 'Search') - show_boards_content = local_assigns.fetch(:show_boards_content, false) +- subject = @project || @group .dropdown-page-one = dropdown_title(title) - if show_boards_content @@ -17,11 +18,11 @@ - if can?(current_user, :admin_label, current_board_parent) %li %a.dropdown-toggle-page{ href: "#" } - = _('Create new label') + = create_label_title(subject) %li = link_to labels_path, :"data-is-link" => true do - if show_create && can?(current_user, :admin_label, current_board_parent) - = _('Manage labels') + = manage_labels_title(subject) - else - = _('View labels') + = view_labels_title(subject) = dropdown_loading diff --git a/changelogs/unreleased/43702-update-label-dropdown-wording.yml b/changelogs/unreleased/43702-update-label-dropdown-wording.yml new file mode 100644 index 00000000000..97100ec89de --- /dev/null +++ b/changelogs/unreleased/43702-update-label-dropdown-wording.yml @@ -0,0 +1,5 @@ +--- +title: Update wording to specify create/manage project vs group labels in labels dropdown +merge_request: 17640 +author: +type: changed diff --git a/spec/features/boards/boards_spec.rb b/spec/features/boards/boards_spec.rb index 3d13f806b11..52ff47d57f9 100644 --- a/spec/features/boards/boards_spec.rb +++ b/spec/features/boards/boards_spec.rb @@ -343,7 +343,7 @@ describe 'Issue Boards', :js do wait_for_requests - click_link 'Create new label' + click_link 'Create project label' fill_in('new_label_name', with: 'Testing New Label') diff --git a/spec/features/boards/sidebar_spec.rb b/spec/features/boards/sidebar_spec.rb index b2dbfcd0031..d4c44c1adf9 100644 --- a/spec/features/boards/sidebar_spec.rb +++ b/spec/features/boards/sidebar_spec.rb @@ -312,12 +312,12 @@ describe 'Issue Boards', :js do expect(card).not_to have_content(stretch.title) end - it 'creates new label' do + it 'creates project label' do click_card(card) page.within('.labels') do click_link 'Edit' - click_link 'Create new label' + click_link 'Create project label' fill_in 'new_label_name', with: 'test label' first('.suggest-colors-dropdown a').click click_button 'Create' diff --git a/spec/features/boards/sub_group_project_spec.rb b/spec/features/boards/sub_group_project_spec.rb index 11a54079f4f..5fdb8044db2 100644 --- a/spec/features/boards/sub_group_project_spec.rb +++ b/spec/features/boards/sub_group_project_spec.rb @@ -24,7 +24,7 @@ describe 'Sub-group project issue boards', :js do page.within '.labels' do click_link 'Edit' - click_link 'Create new label' + click_link 'Create project label' end page.within '.dropdown-new-label' do diff --git a/spec/features/issues/form_spec.rb b/spec/features/issues/form_spec.rb index ef6b8edd0ad..38c618d300e 100644 --- a/spec/features/issues/form_spec.rb +++ b/spec/features/issues/form_spec.rb @@ -306,10 +306,10 @@ describe 'New/edit issue', :js do visit new_project_issue_path(sub_group_project) end - it 'creates new label from dropdown' do + it 'creates project label from dropdown' do click_button 'Labels' - click_link 'Create new label' + click_link 'Create project label' page.within '.dropdown-new-label' do fill_in 'new_label_name', with: 'test label' diff --git a/spec/features/issues/issue_sidebar_spec.rb b/spec/features/issues/issue_sidebar_spec.rb index 64b4f9e7e67..b835558b142 100644 --- a/spec/features/issues/issue_sidebar_spec.rb +++ b/spec/features/issues/issue_sidebar_spec.rb @@ -117,22 +117,22 @@ feature 'Issue Sidebar' do end end - it 'shows option to create a new label' do + it 'shows option to create a project label' do page.within('.block.labels') do - expect(page).to have_content 'Create new' + expect(page).to have_content 'Create project' end end - context 'creating a new label', :js do + context 'creating a project label', :js do before do page.within('.block.labels') do - click_link 'Create new' + click_link 'Create project' end end it 'shows dropdown switches to "create label" section' do page.within('.block.labels') do - expect(page).to have_content 'Create new label' + expect(page).to have_content 'Create project label' end end diff --git a/spec/helpers/labels_helper_spec.rb b/spec/helpers/labels_helper_spec.rb index 619baa78bfa..a2cda58e5d2 100644 --- a/spec/helpers/labels_helper_spec.rb +++ b/spec/helpers/labels_helper_spec.rb @@ -139,4 +139,76 @@ describe LabelsHelper do expect(text_color_for_bg('#000')).to eq '#FFFFFF' end end + + describe 'create_label_title' do + set(:group) { create(:group) } + + context 'with a group as subject' do + it 'returns "Create group label"' do + expect(create_label_title(group)).to eq 'Create group label' + end + end + + context 'with a project as subject' do + set(:project) { create(:project, namespace: group) } + + it 'returns "Create project label"' do + expect(create_label_title(project)).to eq 'Create project label' + end + end + + context 'with no subject' do + it 'returns "Create new label"' do + expect(create_label_title(nil)).to eq 'Create new label' + end + end + end + + describe 'manage_labels_title' do + set(:group) { create(:group) } + + context 'with a group as subject' do + it 'returns "Manage group labels"' do + expect(manage_labels_title(group)).to eq 'Manage group labels' + end + end + + context 'with a project as subject' do + set(:project) { create(:project, namespace: group) } + + it 'returns "Manage project labels"' do + expect(manage_labels_title(project)).to eq 'Manage project labels' + end + end + + context 'with no subject' do + it 'returns "Manage labels"' do + expect(manage_labels_title(nil)).to eq 'Manage labels' + end + end + end + + describe 'view_labels_title' do + set(:group) { create(:group) } + + context 'with a group as subject' do + it 'returns "View group labels"' do + expect(view_labels_title(group)).to eq 'View group labels' + end + end + + context 'with a project as subject' do + set(:project) { create(:project, namespace: group) } + + it 'returns "View project labels"' do + expect(view_labels_title(project)).to eq 'View project labels' + end + end + + context 'with no subject' do + it 'returns "View labels"' do + expect(view_labels_title(nil)).to eq 'View labels' + end + end + end end diff --git a/spec/javascripts/vue_shared/components/sidebar/labels_select/base_spec.js b/spec/javascripts/vue_shared/components/sidebar/labels_select/base_spec.js index 67056793a20..8daaf018396 100644 --- a/spec/javascripts/vue_shared/components/sidebar/labels_select/base_spec.js +++ b/spec/javascripts/vue_shared/components/sidebar/labels_select/base_spec.js @@ -37,6 +37,32 @@ describe('BaseComponent', () => { vmNonEditable.$destroy(); }); }); + + describe('createLabelTitle', () => { + it('returns `Create project label` when `isProject` prop is true', () => { + expect(vm.createLabelTitle).toBe('Create project label'); + }); + + it('return `Create group label` when `isProject` prop is false', () => { + const mockConfigGroup = Object.assign({}, mockConfig, { isProject: false }); + const vmGroup = createComponent(mockConfigGroup); + expect(vmGroup.createLabelTitle).toBe('Create group label'); + vmGroup.$destroy(); + }); + }); + + describe('manageLabelsTitle', () => { + it('returns `Manage project labels` when `isProject` prop is true', () => { + expect(vm.manageLabelsTitle).toBe('Manage project labels'); + }); + + it('return `Manage group labels` when `isProject` prop is false', () => { + const mockConfigGroup = Object.assign({}, mockConfig, { isProject: false }); + const vmGroup = createComponent(mockConfigGroup); + expect(vmGroup.manageLabelsTitle).toBe('Manage group labels'); + vmGroup.$destroy(); + }); + }); }); describe('methods', () => { diff --git a/spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label_spec.js b/spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label_spec.js index f07aefb2f87..5cb4bb6fea6 100644 --- a/spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label_spec.js +++ b/spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label_spec.js @@ -6,10 +6,12 @@ import { mockSuggestedColors } from './mock_data'; import mountComponent from '../../../../helpers/vue_mount_component_helper'; -const createComponent = () => { +const createComponent = (headerTitle) => { const Component = Vue.extend(dropdownCreateLabelComponent); - return mountComponent(Component); + return mountComponent(Component, { + headerTitle, + }); }; describe('DropdownCreateLabelComponent', () => { @@ -41,11 +43,19 @@ describe('DropdownCreateLabelComponent', () => { expect(backButtonEl.querySelector('.fa-arrow-left')).not.toBe(null); }); - it('renders component header element', () => { + it('renders component header element as `Create new label` when `headerTitle` prop is not provided', () => { const headerEl = vm.$el.querySelector('.dropdown-title'); expect(headerEl.innerText.trim()).toContain('Create new label'); }); + it('renders component header element with value of `headerTitle` prop', () => { + const headerTitle = 'Create project label'; + const vmWithHeaderTitle = createComponent(headerTitle); + const headerEl = vmWithHeaderTitle.$el.querySelector('.dropdown-title'); + expect(headerEl.innerText.trim()).toContain(headerTitle); + vmWithHeaderTitle.$destroy(); + }); + it('renders `Close` button on component header', () => { const closeButtonEl = vm.$el.querySelector('.dropdown-title button.dropdown-title-button.dropdown-menu-close'); expect(closeButtonEl).not.toBe(null); diff --git a/spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer_spec.js b/spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer_spec.js index 809e0327b1c..0f4fa716f8a 100644 --- a/spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer_spec.js +++ b/spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer_spec.js @@ -6,15 +6,23 @@ import { mockConfig } from './mock_data'; import mountComponent from '../../../../helpers/vue_mount_component_helper'; -const createComponent = (labelsWebUrl = mockConfig.labelsWebUrl) => { +const createComponent = ( + labelsWebUrl = mockConfig.labelsWebUrl, + createLabelTitle, + manageLabelsTitle, +) => { const Component = Vue.extend(dropdownFooterComponent); return mountComponent(Component, { labelsWebUrl, + createLabelTitle, + manageLabelsTitle, }); }; describe('DropdownFooterComponent', () => { + const createLabelTitle = 'Create project label'; + const manageLabelsTitle = 'Manage project labels'; let vm; beforeEach(() => { @@ -26,17 +34,35 @@ describe('DropdownFooterComponent', () => { }); describe('template', () => { - it('renders `Create new label` link element', () => { + it('renders link element with `Create new label` when `createLabelTitle` prop is not provided', () => { const createLabelEl = vm.$el.querySelector('.dropdown-footer-list .dropdown-toggle-page'); expect(createLabelEl).not.toBeNull(); expect(createLabelEl.innerText.trim()).toBe('Create new label'); }); - it('renders `Manage labels` link element', () => { + it('renders link element with value of `createLabelTitle` prop', () => { + const vmWithCreateLabelTitle = createComponent(mockConfig.labelsWebUrl, createLabelTitle); + const createLabelEl = vmWithCreateLabelTitle.$el.querySelector('.dropdown-footer-list .dropdown-toggle-page'); + expect(createLabelEl.innerText.trim()).toBe(createLabelTitle); + vmWithCreateLabelTitle.$destroy(); + }); + + it('renders link element with `Manage labels` when `manageLabelsTitle` prop is not provided', () => { const manageLabelsEl = vm.$el.querySelector('.dropdown-footer-list .dropdown-external-link'); expect(manageLabelsEl).not.toBeNull(); expect(manageLabelsEl.getAttribute('href')).toBe(vm.labelsWebUrl); expect(manageLabelsEl.innerText.trim()).toBe('Manage labels'); }); + + it('renders link element with value of `manageLabelsTitle` prop', () => { + const vmWithManageLabelsTitle = createComponent( + mockConfig.labelsWebUrl, + createLabelTitle, + manageLabelsTitle, + ); + const manageLabelsEl = vmWithManageLabelsTitle.$el.querySelector('.dropdown-footer-list .dropdown-external-link'); + expect(manageLabelsEl.innerText.trim()).toBe(manageLabelsTitle); + vmWithManageLabelsTitle.$destroy(); + }); }); }); diff --git a/spec/javascripts/vue_shared/components/sidebar/labels_select/mock_data.js b/spec/javascripts/vue_shared/components/sidebar/labels_select/mock_data.js index e9008c29b22..3fcb91b6f5e 100644 --- a/spec/javascripts/vue_shared/components/sidebar/labels_select/mock_data.js +++ b/spec/javascripts/vue_shared/components/sidebar/labels_select/mock_data.js @@ -34,6 +34,7 @@ export const mockSuggestedColors = [ export const mockConfig = { showCreate: true, + isProject: true, abilityName: 'issue', context: { labels: mockLabels, |