Commit 3349f7e4 authored by Nicolò Maria Mezzopera's avatar Nicolò Maria Mezzopera

Merge branch '223183-move-the-invite-members-form-into-a-modal-on-members-page' into 'master'

Replace invite form on Members page with modal

See merge request gitlab-org/gitlab!49615
parents deccc605 440e22f6
......@@ -19,6 +19,11 @@ export default {
required: false,
default: '',
},
classes: {
type: String,
required: false,
default: '',
},
},
methods: {
openModal() {
......@@ -29,7 +34,7 @@ export default {
</script>
<template>
<gl-link @click="openModal">
<gl-link :class="classes" @click="openModal">
<div v-if="icon" class="nav-icon-container">
<gl-icon :size="16" :name="icon" />
</div>
......
......@@ -4,6 +4,8 @@ import UsersSelect from '~/users_select';
import groupsSelect from '~/groups_select';
import RemoveMemberModal from '~/vue_shared/components/remove_member_modal.vue';
import { initGroupMembersApp } from '~/groups/members';
import initInviteMembersModal from '~/invite_members/init_invite_members_modal';
import initInviteMembersTrigger from '~/invite_members/init_invite_members_trigger';
import { memberRequestFormatter, groupLinkRequestFormatter } from '~/groups/members/utils';
import { s__ } from '~/locale';
......@@ -64,5 +66,7 @@ groupsSelect();
memberExpirationDate();
memberExpirationDate('.js-access-expiration-date-groups');
mountRemoveMemberModal();
initInviteMembersModal();
initInviteMembersTrigger();
new UsersSelect(); // eslint-disable-line no-new
......@@ -4,6 +4,8 @@ import memberExpirationDate from '~/member_expiration_date';
import UsersSelect from '~/users_select';
import groupsSelect from '~/groups_select';
import RemoveMemberModal from '~/vue_shared/components/remove_member_modal.vue';
import initInviteMembersModal from '~/invite_members/init_invite_members_modal';
import initInviteMembersTrigger from '~/invite_members/init_invite_members_trigger';
function mountRemoveMemberModal() {
const el = document.querySelector('.js-remove-member-modal');
......@@ -24,6 +26,8 @@ document.addEventListener('DOMContentLoaded', () => {
memberExpirationDate();
memberExpirationDate('.js-access-expiration-date-groups');
mountRemoveMemberModal();
initInviteMembersModal();
initInviteMembersTrigger();
new Members(); // eslint-disable-line no-new
new UsersSelect(); // eslint-disable-line no-new
......
......@@ -6,10 +6,18 @@
.js-remove-member-modal
.project-members-page.gl-mt-3
.gl-display-flex.gl-flex-wrap
- if can_manage_members
.gl-w-half.gl-xs-w-full
%h4
= _('Group members')
%hr
- if can_manage_members
- if invite_members_allowed?(@group)
.gl-w-half.gl-xs-w-full
.gl-display-flex.gl-flex-wrap.gl-lg-justify-content-end.gl-mx-n2.gl-mb-3
.js-invite-members-trigger.gl-px-2.gl-sm-w-auto.gl-w-full.gl-mb-4{ data: { classes: 'btn btn-success gl-button gl-mt-3 gl-sm-w-auto gl-w-full', display_text: _('Invite members') } }
= render_if_exists 'groups/invite_members_modal', group: @group
- if can_manage_members && !invite_members_allowed?(@group)
%hr.gl-mt-4
%ul.nav-links.nav.nav-tabs.gitlab-tabs{ role: 'tablist' }
%li.nav-tab{ role: 'presentation' }
%a.nav-link.active{ href: '#invite-member-pane', id: 'invite-member-tab', data: { toggle: 'tab' }, role: 'tab' }= _('Invite member')
......
......@@ -4,6 +4,24 @@
.js-remove-member-modal
.row.gl-mt-3
.col-lg-12
- if invite_members_allowed?(group)
.row
.col-md-12.col-lg-6.gl-display-flex
.gl-flex-direction-column.gl-flex-wrap.align-items-baseline
%h4
= _("Project members")
.gl-justify-content-bottom.gl-display-flex.align-items-center
- if can_manage_project_members?(@project)
%p= share_project_description(@project)
- else
%p
= html_escape(_("Members can be added by project %{i_open}Maintainers%{i_close} or %{i_open}Owners%{i_close}")) % { i_open: '<i>'.html_safe, i_close: '</i>'.html_safe }
.col-md-12.col-lg-6
.gl-display-flex.gl-flex-wrap.gl-lg-justify-content-end.gl-mx-n2.gl-mb-3
.js-invite-members-trigger.gl-px-2.gl-sm-w-auto.gl-w-full.gl-mb-4{ data: { classes: 'btn btn-success gl-button gl-mt-3 gl-sm-w-auto gl-w-full', display_text: _('Invite members') } }
= render_if_exists 'projects/invite_members_modal', project: @project
- else
- if project_can_be_shared?
%h4
= _("Project members")
......@@ -13,7 +31,7 @@
%p
= html_escape(_("Members can be added by project %{i_open}Maintainers%{i_close} or %{i_open}Owners%{i_close}")) % { i_open: '<i>'.html_safe, i_close: '</i>'.html_safe }
- if can_manage_project_members?(@project) && project_can_be_shared?
- if !invite_members_allowed?(group) && can_manage_project_members?(@project) && project_can_be_shared?
- if !membership_locked? && @project.allowed_to_share_with_group?
%ul.nav-links.nav.nav-tabs.gitlab-tabs{ role: 'tablist' }
%li.nav-tab{ role: 'presentation' }
......
......@@ -51,6 +51,7 @@ RSpec.describe 'Groups > Members > List members' do
before do
stub_licensed_features(group_saml: true)
stub_feature_flags(invite_members_group_modal: false)
allow(Gitlab::Session).to receive(:current).and_return(session)
create(:identity, saml_provider: saml_provider, user: user1)
......
......@@ -8,6 +8,7 @@ RSpec.describe "User manages members" do
let_it_be(:user) { create(:user) }
before do
stub_feature_flags(invite_members_group_modal: false)
sign_in(user)
end
......
......@@ -15479,6 +15479,9 @@ msgstr ""
msgid "Invite member"
msgstr ""
msgid "Invite members"
msgstr ""
msgid "Invite team members"
msgstr ""
......
......@@ -175,6 +175,7 @@ RSpec.describe 'Admin Groups' do
describe 'add admin himself to a group' do
before do
stub_feature_flags(invite_members_group_modal: false)
group.add_user(:user, Gitlab::Access::OWNER)
end
......
......@@ -17,6 +17,7 @@ RSpec.describe 'Groups > Members > Manage groups', :js do
let_it_be(:group_to_add) { create(:group) }
before do
stub_feature_flags(invite_members_group_modal: false)
group.add_owner(user)
visit group_group_members_path(group)
end
......
......@@ -11,9 +11,37 @@ RSpec.describe 'Groups > Members > Manage members' do
let(:group) { create(:group) }
before do
stub_feature_flags(invite_members_group_modal: false)
sign_in(user1)
end
shared_examples 'includes the correct Invite Members link' do |should_include, should_not_include|
it 'includes either the form or the modal trigger' do
group.add_owner(user1)
visit group_group_members_path(group)
expect(page).to have_selector(should_include)
expect(page).not_to have_selector(should_not_include)
end
end
context 'when Invite Members modal is enabled' do
before do
stub_feature_flags(invite_members_group_modal: true)
end
it_behaves_like 'includes the correct Invite Members link', '.js-invite-members-trigger', '.invite-users-form'
end
context 'when Invite Members modal is disabled' do
before do
stub_feature_flags(invite_members_group_modal: false)
end
it_behaves_like 'includes the correct Invite Members link', '.invite-users-form', '.js-invite-members-trigger'
end
it 'update user to owner level', :js do
group.add_owner(user1)
group.add_developer(user2)
......
......@@ -11,6 +11,7 @@ RSpec.describe 'Groups > Members > Owner adds member with expiration date', :js
let(:new_member) { create(:user, name: 'Mary Jane') }
before do
stub_feature_flags(invite_members_group_modal: false)
group.add_owner(user1)
sign_in(user1)
end
......
......@@ -111,6 +111,7 @@ RSpec.describe 'Projects members', :js do
context 'with a group requester' do
before do
stub_feature_flags(invite_members_group_modal: false)
group.request_access(group_requester)
visit project_project_members_path(project)
end
......
......@@ -12,6 +12,7 @@ RSpec.describe 'Project members list' do
let(:project) { create(:project, namespace: group) }
before do
stub_feature_flags(invite_members_group_modal: false)
sign_in(user1)
group.add_owner(user1)
end
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment