diff options
Diffstat (limited to 'app/assets/javascripts/projects/settings/repository/branch_rules/components/branch_rule.vue')
-rw-r--r-- | app/assets/javascripts/projects/settings/repository/branch_rules/components/branch_rule.vue | 62 |
1 files changed, 48 insertions, 14 deletions
diff --git a/app/assets/javascripts/projects/settings/repository/branch_rules/components/branch_rule.vue b/app/assets/javascripts/projects/settings/repository/branch_rules/components/branch_rule.vue index 2b88f8561d7..78c824c66d1 100644 --- a/app/assets/javascripts/projects/settings/repository/branch_rules/components/branch_rule.vue +++ b/app/assets/javascripts/projects/settings/repository/branch_rules/components/branch_rule.vue @@ -1,11 +1,14 @@ <script> import { GlBadge, GlButton } from '@gitlab/ui'; -import { s__ } from '~/locale'; +import { s__, sprintf, n__ } from '~/locale'; export const i18n = { defaultLabel: s__('BranchRules|default'), - protectedLabel: s__('BranchRules|protected'), detailsButtonLabel: s__('BranchRules|Details'), + allowForcePush: s__('BranchRules|Allowed to force push'), + codeOwnerApprovalRequired: s__('BranchRules|Requires CODEOWNERS approval'), + statusChecks: s__('BranchRules|%{total} status %{subject}'), + approvalRules: s__('BranchRules|%{total} approval %{subject}'), }; export default { @@ -30,24 +33,57 @@ export default { required: false, default: false, }, - isProtected: { - type: Boolean, + branchProtection: { + type: Object, required: false, - default: false, + default: () => {}, }, - approvalDetails: { - type: Array, + statusChecksTotal: { + type: Number, required: false, - default: () => [], + default: 0, + }, + approvalRulesTotal: { + type: Number, + required: false, + default: 0, }, }, computed: { hasApprovalDetails() { - return this.approvalDetails && this.approvalDetails.length; + return this.approvalDetails.length; }, detailsPath() { return `${this.branchRulesPath}?branch=${this.name}`; }, + statusChecksText() { + return sprintf(this.$options.i18n.statusChecks, { + total: this.statusChecksTotal, + subject: n__('check', 'checks', this.statusChecksTotal), + }); + }, + approvalRulesText() { + return sprintf(this.$options.i18n.approvalRules, { + total: this.approvalRulesTotal, + subject: n__('rule', 'rules', this.approvalRulesTotal), + }); + }, + approvalDetails() { + const approvalDetails = []; + if (this.branchProtection.allowForcePush) { + approvalDetails.push(this.$options.i18n.allowForcePush); + } + if (this.branchProtection.codeOwnerApprovalRequired) { + approvalDetails.push(this.$options.i18n.codeOwnerApprovalRequired); + } + if (this.statusChecksTotal) { + approvalDetails.push(this.statusChecksText); + } + if (this.approvalRulesTotal) { + approvalDetails.push(this.approvalRulesText); + } + return approvalDetails; + }, }, }; </script> @@ -61,14 +97,12 @@ export default { $options.i18n.defaultLabel }}</gl-badge> - <gl-badge v-if="isProtected" variant="success" size="sm" class="gl-ml-2">{{ - $options.i18n.protectedLabel - }}</gl-badge> - <ul v-if="hasApprovalDetails" class="gl-pl-6 gl-mt-2 gl-mb-0 gl-text-gray-500"> <li v-for="(detail, index) in approvalDetails" :key="index">{{ detail }}</li> </ul> </div> - <gl-button :href="detailsPath"> {{ $options.i18n.detailsButtonLabel }}</gl-button> + <gl-button class="gl-align-self-start" :href="detailsPath"> + {{ $options.i18n.detailsButtonLabel }}</gl-button + > </div> </template> |