diff options
Diffstat (limited to 'app/assets/javascripts/invite_members/components/invite_members_modal.vue')
-rw-r--r-- | app/assets/javascripts/invite_members/components/invite_members_modal.vue | 36 |
1 files changed, 9 insertions, 27 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 a334f5e4bf7..f61e822bf7e 100644 --- a/app/assets/javascripts/invite_members/components/invite_members_modal.vue +++ b/app/assets/javascripts/invite_members/components/invite_members_modal.vue @@ -18,7 +18,8 @@ import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants'; import { getParameterValues } from '~/lib/utils/url_utility'; import { n__, sprintf } from '~/locale'; import { - CLOSE_TO_LIMIT_COUNT, + CLOSE_TO_LIMIT_VARIANT, + REACHED_LIMIT_VARIANT, USERS_FILTER_ALL, INVITE_MEMBERS_FOR_TASK, MEMBER_MODAL_LABELS, @@ -174,27 +175,11 @@ 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; - } - - return false; + showUserLimitNotification() { + return this.usersLimitDataset.reachedLimit || this.usersLimitDataset.closeToDashboardLimit; }, - formGroupDescription() { - return this.reachedLimit - ? this.$options.labels.placeHolderDisabled - : this.$options.labels.placeHolder; + limitVariant() { + return this.usersLimitDataset.reachedLimit ? REACHED_LIMIT_VARIANT : CLOSE_TO_LIMIT_VARIANT; }, errorList() { return Object.entries(this.invalidMembers).map(([member, error]) => { @@ -385,13 +370,11 @@ export default { :help-link="helpLink" :label-intro-text="labelIntroText" :label-search-field="$options.labels.searchField" - :form-group-description="formGroupDescription" + :form-group-description="$options.labels.placeHolder" :invalid-feedback-message="invalidFeedbackMessage" :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" @submit="sendInvite" @@ -448,9 +431,8 @@ export default { </template> </gl-alert> <user-limit-notification - v-else - :close-to-limit="closeToLimit" - :reached-limit="reachedLimit" + v-else-if="showUserLimitNotification" + :limit-variant="limitVariant" :users-limit-dataset="usersLimitDataset" /> </template> |