review_bar.vue 1.89 KB
Newer Older
1 2 3 4
<script>
import { mapActions, mapState, mapGetters } from 'vuex';
import { sprintf, s__ } from '~/locale';
import LoadingButton from '~/vue_shared/components/loading_button.vue';
5
import { GlModal, GlModalDirective } from '@gitlab-org/gitlab-ui';
6
import PreviewDropdown from './preview_dropdown.vue';
7 8 9 10

export default {
  components: {
    LoadingButton,
11
    GlModal,
12
    PreviewDropdown,
13 14 15
  },
  directives: {
    'gl-modal': GlModalDirective,
16 17
  },
  computed: {
18
    ...mapGetters(['isNotesFetched']),
19 20 21
    ...mapState('batchComments', ['isDiscarding']),
    ...mapGetters('batchComments', ['draftsCount']),
  },
22 23 24 25 26 27 28
  watch: {
    isNotesFetched() {
      if (this.isNotesFetched) {
        this.expandAllDiscussions();
      }
    },
  },
29
  methods: {
30
    ...mapActions('batchComments', ['discardReview', 'expandAllDiscussions']),
31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
  },
  modalId: 'discard-draft-review',
  text: sprintf(
    s__(
      `BatchComments|You're about to discard your review which will delete all of your pending comments.
      The deleted comments %{strong_start}cannot%{strong_end} be restored.`,
    ),
    {
      strong_start: '<strong>',
      strong_end: '</strong>',
    },
    false,
  ),
};
</script>
<template>
  <div v-show="draftsCount > 0">
    <nav class="review-bar-component">
49
      <div class="review-bar-content qa-review-bar">
50
        <preview-dropdown />
51 52 53 54
        <loading-button
          v-gl-modal="$options.modalId"
          :loading="isDiscarding"
          :label="__('Discard review')"
55
          class="qa-discard-review float-right"
56
        />
57
      </div>
58
    </nav>
59
    <gl-modal
60 61 62 63
      :title="s__('BatchComments|Discard review?')"
      :ok-title="s__('BatchComments|Delete all pending comments')"
      :modal-id="$options.modalId"
      title-tag="h4"
64
      ok-variant="danger qa-modal-delete-pending-comments"
65 66 67 68
      @ok="discardReview"
    >
      <p v-html="$options.text">
      </p>
69
    </gl-modal>
70 71
  </div>
</template>