diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-06-08 15:08:46 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-06-08 15:08:46 +0300 |
commit | cdda3d117c99cadf295f26abc92cb2456033b762 (patch) | |
tree | 30315b1ea79ee4639f44a407978ed719c62a1653 /app/assets/javascripts/invite_members | |
parent | f4ea1f8998fd64bcd02280514b91f103f830d5ce (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/invite_members')
4 files changed, 65 insertions, 9 deletions
diff --git a/app/assets/javascripts/invite_members/components/invite_members_modal.vue b/app/assets/javascripts/invite_members/components/invite_members_modal.vue index 7857b9d86d2..d597c7e53bb 100644 --- a/app/assets/javascripts/invite_members/components/invite_members_modal.vue +++ b/app/assets/javascripts/invite_members/components/invite_members_modal.vue @@ -14,6 +14,7 @@ import ExperimentTracking from '~/experimentation/experiment_tracking'; import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants'; import { getParameterValues } from '~/lib/utils/url_utility'; import { + CLOSE_TO_LIMIT_COUNT, USERS_FILTER_ALL, INVITE_MEMBERS_FOR_TASK, MEMBER_MODAL_LABELS, @@ -151,6 +152,16 @@ export default { isOnLearnGitlab() { return this.source === LEARN_GITLAB; }, + closeToLimit() { + if (this.usersLimitDataset.freeUsersLimit && this.usersLimitDataset.membersCount) { + return ( + this.usersLimitDataset.membersCount >= + this.usersLimitDataset.freeUsersLimit - CLOSE_TO_LIMIT_COUNT + ); + } + + return false; + }, reachedLimit() { if (this.usersLimitDataset.freeUsersLimit && this.usersLimitDataset.membersCount) { return this.usersLimitDataset.membersCount >= this.usersLimitDataset.freeUsersLimit; @@ -297,6 +308,7 @@ export default { :is-loading="isLoading" :new-users-to-invite="newUsersToInvite" :root-group-id="rootId" + :close-to-limit="closeToLimit" :reached-limit="reachedLimit" :users-limit-dataset="usersLimitDataset" @reset="resetFields" @@ -314,6 +326,7 @@ export default { <template #user-limit-notification> <user-limit-notification + :close-to-limit="closeToLimit" :reached-limit="reachedLimit" :users-limit-dataset="usersLimitDataset" /> diff --git a/app/assets/javascripts/invite_members/components/invite_modal_base.vue b/app/assets/javascripts/invite_members/components/invite_modal_base.vue index 33d37b809c2..90d266c3155 100644 --- a/app/assets/javascripts/invite_members/components/invite_modal_base.vue +++ b/app/assets/javascripts/invite_members/components/invite_modal_base.vue @@ -131,6 +131,11 @@ export default { required: false, default: false, }, + closeToLimit: { + type: Boolean, + required: false, + default: false, + }, reachedLimit: { type: Boolean, required: false, @@ -183,6 +188,17 @@ export default { actionCancel() { if (this.reachedLimit && this.usersLimitDataset.userNamespace) return undefined; + if (this.closeToLimit && this.usersLimitDataset.userNamespace) { + return { + text: INVITE_BUTTON_TEXT_DISABLED, + attributes: { + href: this.usersLimitDataset.membersPath, + category: 'secondary', + variant: 'confirm', + }, + }; + } + return { text: this.reachedLimit ? CANCEL_BUTTON_TEXT_DISABLED : this.cancelButtonText, ...(this.reachedLimit && { attributes: { href: this.usersLimitDataset.purchasePath } }), diff --git a/app/assets/javascripts/invite_members/components/user_limit_notification.vue b/app/assets/javascripts/invite_members/components/user_limit_notification.vue index ea5f4317d86..ae5c3c11386 100644 --- a/app/assets/javascripts/invite_members/components/user_limit_notification.vue +++ b/app/assets/javascripts/invite_members/components/user_limit_notification.vue @@ -8,15 +8,20 @@ import { REACHED_LIMIT_MESSAGE, REACHED_LIMIT_UPGRADE_SUGGESTION_MESSAGE, CLOSE_TO_LIMIT_MESSAGE, + CLOSE_TO_LIMIT_MESSAGE_PERSONAL_NAMESPACE, + DANGER_ALERT_TITLE_PERSONAL_NAMESPACE, + WARNING_ALERT_TITLE_PERSONAL_NAMESPACE, } from '../constants'; -const CLOSE_TO_LIMIT_COUNT = 2; - export default { name: 'UserLimitNotification', components: { GlAlert, GlSprintf, GlLink }, inject: ['name'], props: { + closeToLimit: { + type: Boolean, + required: true, + }, reachedLimit: { type: Boolean, required: true, @@ -40,14 +45,14 @@ export default { purchasePath() { return this.usersLimitDataset.purchasePath; }, - closeToLimit() { - if (this.freeUsersLimit && this.membersCount) { - return this.membersCount >= this.freeUsersLimit - CLOSE_TO_LIMIT_COUNT; + warningAlertTitle() { + if (this.usersLimitDataset.userNamespace) { + return sprintf(WARNING_ALERT_TITLE_PERSONAL_NAMESPACE, { + count: this.freeUsersLimit - this.membersCount, + members: this.pluralMembers(this.freeUsersLimit - this.membersCount), + }); } - return false; - }, - warningAlertTitle() { return sprintf(WARNING_ALERT_TITLE, { count: this.freeUsersLimit - this.membersCount, members: this.pluralMembers(this.freeUsersLimit - this.membersCount), @@ -55,6 +60,13 @@ export default { }); }, dangerAlertTitle() { + if (this.usersLimitDataset.userNamespace) { + return sprintf(DANGER_ALERT_TITLE_PERSONAL_NAMESPACE, { + count: this.freeUsersLimit, + members: this.pluralMembers(this.freeUsersLimit), + }); + } + return sprintf(DANGER_ALERT_TITLE, { count: this.freeUsersLimit, members: this.pluralMembers(this.freeUsersLimit), @@ -79,6 +91,10 @@ export default { return this.reachedLimitMessage; } + if (this.usersLimitDataset.userNamespace) { + return this.$options.i18n.closeToLimitMessagePersonalNamespace; + } + return this.$options.i18n.closeToLimitMessage; }, }, @@ -91,6 +107,7 @@ export default { reachedLimitMessage: REACHED_LIMIT_MESSAGE, reachedLimitUpgradeSuggestionMessage: REACHED_LIMIT_UPGRADE_SUGGESTION_MESSAGE, closeToLimitMessage: CLOSE_TO_LIMIT_MESSAGE, + closeToLimitMessagePersonalNamespace: CLOSE_TO_LIMIT_MESSAGE_PERSONAL_NAMESPACE, }, }; </script> diff --git a/app/assets/javascripts/invite_members/constants.js b/app/assets/javascripts/invite_members/constants.js index 552359f2463..beb8f5b5aab 100644 --- a/app/assets/javascripts/invite_members/constants.js +++ b/app/assets/javascripts/invite_members/constants.js @@ -1,7 +1,7 @@ import { s__ } from '~/locale'; +export const CLOSE_TO_LIMIT_COUNT = 2; export const SEARCH_DELAY = 200; - export const INVITE_MEMBERS_FOR_TASK = { minimum_access_level: 30, name: 'invite_members_for_task', @@ -132,10 +132,17 @@ export const ON_SUBMIT_TRACK_LABEL = 'manage_members_clicked'; export const WARNING_ALERT_TITLE = s__( 'InviteMembersModal|You only have space for %{count} more %{members} in %{name}', ); +export const WARNING_ALERT_TITLE_PERSONAL_NAMESPACE = s__( + 'InviteMembersModal|You only have space for %{count} more %{members} in your personal projects', +); export const DANGER_ALERT_TITLE = s__( "InviteMembersModal|You've reached your %{count} %{members} limit for %{name}", ); +export const DANGER_ALERT_TITLE_PERSONAL_NAMESPACE = s__( + "InviteMembersModal|You've reached your %{count} %{members} limit for your personal projects", +); + export const REACHED_LIMIT_MESSAGE = s__( 'InviteMembersModal|You cannot add more members, but you can remove members who no longer need access.', ); @@ -149,3 +156,6 @@ export const REACHED_LIMIT_UPGRADE_SUGGESTION_MESSAGE = REACHED_LIMIT_MESSAGE.co export const CLOSE_TO_LIMIT_MESSAGE = s__( 'InviteMembersModal|To get more members an owner of this namespace can %{trialLinkStart}start a trial%{trialLinkEnd} or %{upgradeLinkStart}upgrade%{upgradeLinkEnd} to a paid tier.', ); +export const CLOSE_TO_LIMIT_MESSAGE_PERSONAL_NAMESPACE = s__( + 'InviteMembersModal|To make more space, you can remove members who no longer need access.', +); |