diff options
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/markdown')
6 files changed, 33 insertions, 20 deletions
diff --git a/app/assets/javascripts/vue_shared/components/markdown/field.vue b/app/assets/javascripts/vue_shared/components/markdown/field.vue index b6e167524aa..25d01dc550f 100644 --- a/app/assets/javascripts/vue_shared/components/markdown/field.vue +++ b/app/assets/javascripts/vue_shared/components/markdown/field.vue @@ -1,19 +1,19 @@ <script> /* eslint-disable vue/no-v-html */ +import { GlIcon } from '@gitlab/ui'; import $ from 'jquery'; import '~/behaviors/markdown/render_gfm'; import { unescape } from 'lodash'; -import { GlIcon } from '@gitlab/ui'; -import { __, sprintf } from '~/locale'; -import { stripHtml } from '~/lib/utils/text_utility'; import { deprecatedCreateFlash as Flash } from '~/flash'; import GLForm from '~/gl_form'; -import MarkdownHeader from './header.vue'; -import MarkdownToolbar from './toolbar.vue'; +import axios from '~/lib/utils/axios_utils'; +import { stripHtml } from '~/lib/utils/text_utility'; +import { __, sprintf } from '~/locale'; import GfmAutocomplete from '~/vue_shared/components/gfm_autocomplete/gfm_autocomplete.vue'; import Suggestions from '~/vue_shared/components/markdown/suggestions.vue'; import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; -import axios from '~/lib/utils/axios_utils'; +import MarkdownHeader from './header.vue'; +import MarkdownToolbar from './toolbar.vue'; export default { components: { @@ -110,11 +110,6 @@ export default { return this.referencedUsers.length >= referencedUsersThreshold; }, lineContent() { - const [firstSuggestion] = this.suggestions; - if (firstSuggestion) { - return firstSuggestion.from_content; - } - if (this.line) { const { rich_text: richText, text } = this.line; diff --git a/app/assets/javascripts/vue_shared/components/markdown/header.vue b/app/assets/javascripts/vue_shared/components/markdown/header.vue index 173d192dab0..5bc1786d692 100644 --- a/app/assets/javascripts/vue_shared/components/markdown/header.vue +++ b/app/assets/javascripts/vue_shared/components/markdown/header.vue @@ -1,8 +1,8 @@ <script> -import $ from 'jquery'; import { GlPopover, GlButton, GlTooltipDirective, GlIcon } from '@gitlab/ui'; -import { s__ } from '~/locale'; +import $ from 'jquery'; import { getSelectedFragment } from '~/lib/utils/common_utils'; +import { s__ } from '~/locale'; import { CopyAsGFM } from '../../../behaviors/markdown/copy_as_gfm'; import ToolbarButton from './toolbar_button.vue'; @@ -172,6 +172,7 @@ export default { :cursor-offset="4" :tag-content="lineContent" icon="doc-code" + data-qa-selector="suggestion_button" class="js-suggestion-btn" @click="handleSuggestDismissed" /> diff --git a/app/assets/javascripts/vue_shared/components/markdown/suggestion_diff.vue b/app/assets/javascripts/vue_shared/components/markdown/suggestion_diff.vue index 93a270b8a97..bcd8c02e968 100644 --- a/app/assets/javascripts/vue_shared/components/markdown/suggestion_diff.vue +++ b/app/assets/javascripts/vue_shared/components/markdown/suggestion_diff.vue @@ -1,7 +1,7 @@ <script> +import { selectDiffLines } from '../lib/utils/diff_utils'; import SuggestionDiffHeader from './suggestion_diff_header.vue'; import SuggestionDiffRow from './suggestion_diff_row.vue'; -import { selectDiffLines } from '../lib/utils/diff_utils'; export default { components: { 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 63341b433e0..4c6fa71398d 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 @@ -88,7 +88,12 @@ export default { applySuggestion(message) { if (!this.canApply) return; this.isApplyingSingle = true; - this.$emit('apply', this.applySuggestionCallback, message); + + this.$emit( + 'apply', + this.applySuggestionCallback, + gon.features?.suggestionsCustomCommit ? message : undefined, + ); }, applySuggestionCallback() { this.isApplyingSingle = false; @@ -131,6 +136,7 @@ export default { <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" @@ -145,6 +151,7 @@ export default { <gl-button v-if="suggestionsCount > 1 && canBeBatched && !isDisableButton" class="btn-inverted js-add-to-batch-btn btn-grouped" + data-qa-selector="add_suggestion_batch_button" :disabled="isDisableButton" @click="addSuggestionToBatch" > diff --git a/app/assets/javascripts/vue_shared/components/markdown/suggestions.vue b/app/assets/javascripts/vue_shared/components/markdown/suggestions.vue index 5ee51764555..53d1cca7af3 100644 --- a/app/assets/javascripts/vue_shared/components/markdown/suggestions.vue +++ b/app/assets/javascripts/vue_shared/components/markdown/suggestions.vue @@ -1,9 +1,9 @@ <script> -import Vue from 'vue'; import { GlSafeHtmlDirective as SafeHtml } from '@gitlab/ui'; +import Vue from 'vue'; +import { deprecatedCreateFlash as Flash } from '~/flash'; import { __ } from '~/locale'; import SuggestionDiff from './suggestion_diff.vue'; -import { deprecatedCreateFlash as Flash } from '~/flash'; export default { directives: { @@ -64,6 +64,11 @@ export default { mounted() { this.renderSuggestions(); }, + beforeDestroy() { + if (this.suggestionsWatch) { + this.suggestionsWatch(); + } + }, methods: { renderSuggestions() { // swaps out suggestion(s) markdown with rich diff components @@ -108,6 +113,13 @@ export default { }, }); + // We're using `$watch` as `suggestionsCount` updates do not + // propagate to this component for some unknown reason while + // using a traditional prop watcher. + this.suggestionsWatch = this.$watch('suggestionsCount', () => { + suggestionDiff.suggestionsCount = this.suggestionsCount; + }); + suggestionDiff.$on('apply', ({ suggestionId, callback, message }) => { this.$emit('apply', { suggestionId, callback, flashContainer: this.$el, message }); }); diff --git a/app/assets/javascripts/vue_shared/components/markdown/toolbar.vue b/app/assets/javascripts/vue_shared/components/markdown/toolbar.vue index 15c5b9d6733..387b100a04f 100644 --- a/app/assets/javascripts/vue_shared/components/markdown/toolbar.vue +++ b/app/assets/javascripts/vue_shared/components/markdown/toolbar.vue @@ -60,9 +60,7 @@ export default { </div> <span v-if="canAttachFile" class="uploading-container"> <span class="uploading-progress-container hide"> - <template> - <gl-icon name="media" /> - </template> + <gl-icon name="media" /> <span class="attaching-file-message"></span> <!-- eslint-disable-next-line @gitlab/vue-require-i18n-strings --> <span class="uploading-progress">0%</span> |