diff options
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_header.vue')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_header.vue | 87 |
1 files changed, 50 insertions, 37 deletions
diff --git a/app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_header.vue b/app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_header.vue index 5fdef0b1a23..f9ae59567b2 100644 --- a/app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_header.vue +++ b/app/assets/javascripts/vue_shared/components/markdown/suggestion_diff_header.vue @@ -58,12 +58,19 @@ export default { isApplyingSingle: false, }; }, + computed: { isApplying() { return this.isApplyingSingle || this.isApplyingBatch; }, tooltipMessage() { - return this.canApply ? __('This also resolves this thread') : this.inapplicableReason; + if (!this.canApply) { + return this.inapplicableReason; + } + + return this.batchSuggestionsCount > 1 + ? __('This also resolves all related threads') + : __('This also resolves this thread'); }, isDisableButton() { return this.isApplying || !this.canApply; @@ -72,13 +79,30 @@ export default { if (this.isApplyingSingle || this.batchSuggestionsCount < 2) { return __('Applying suggestion...'); } + return __('Applying suggestions...'); }, isLoggedIn() { return isLoggedIn(); }, + showApplySuggestion() { + if (!this.isLoggedIn) return false; + + if (this.batchSuggestionsCount >= 1 && !this.isBatched) { + return false; + } + + return true; + }, }, methods: { + apply(message) { + if (this.batchSuggestionsCount > 1) { + this.applySuggestionBatch(message); + } else { + this.applySuggestion(message); + } + }, applySuggestion(message) { if (!this.canApply) return; this.isApplyingSingle = true; @@ -88,9 +112,9 @@ export default { applySuggestionCallback() { this.isApplyingSingle = false; }, - applySuggestionBatch() { + applySuggestionBatch(message) { if (!this.canApply) return; - this.$emit('applyBatch'); + this.$emit('applyBatch', message); }, addSuggestionToBatch() { this.$emit('addToBatch'); @@ -115,45 +139,34 @@ export default { <gl-loading-icon size="sm" class="d-flex-center mr-2" /> <span>{{ applyingSuggestionsMessage }}</span> </div> - <div v-else-if="canApply && isBatched" class="d-flex align-items-center"> - <gl-button - class="btn-inverted js-remove-from-batch-btn btn-grouped" - :disabled="isApplying" - @click="removeSuggestionFromBatch" - > - {{ __('Remove from batch') }} - </gl-button> - <gl-button - v-gl-tooltip.viewport="__('This also resolves all related threads')" - class="btn-inverted js-apply-batch-btn btn-grouped" - data-qa-selector="apply_suggestions_batch_button" - :disabled="isApplying" - variant="success" - @click="applySuggestionBatch" - > - {{ __('Apply suggestions') }} - <span class="badge badge-pill badge-pill-success"> - {{ batchSuggestionsCount }} - </span> - </gl-button> - </div> - <div v-else class="d-flex align-items-center"> - <gl-button - v-if="suggestionsCount > 1 && !isDisableButton" - class="btn-inverted js-add-to-batch-btn btn-grouped" - data-qa-selector="add_suggestion_batch_button" - :disabled="isDisableButton" - @click="addSuggestionToBatch" - > - {{ __('Add suggestion to batch') }} - </gl-button> + <div v-else-if="isLoggedIn" class="d-flex align-items-center"> + <div v-if="isBatched"> + <gl-button + class="btn-inverted js-remove-from-batch-btn btn-grouped" + :disabled="isApplying" + @click="removeSuggestionFromBatch" + > + {{ __('Remove from batch') }} + </gl-button> + </div> + <div v-else-if="!isDisableButton && suggestionsCount > 1"> + <gl-button + class="btn-inverted js-add-to-batch-btn btn-grouped" + data-qa-selector="add_suggestion_batch_button" + :disabled="isDisableButton" + @click="addSuggestionToBatch" + > + {{ __('Add suggestion to batch') }} + </gl-button> + </div> <apply-suggestion - v-if="isLoggedIn" + v-if="showApplySuggestion" v-gl-tooltip.viewport="tooltipMessage" :disabled="isDisableButton" :default-commit-message="defaultCommitMessage" + :batch-suggestions-count="batchSuggestionsCount" class="gl-ml-3" - @apply="applySuggestion" + @apply="apply" /> </div> </div> |