All files / app/assets/javascripts/ide/components editor_mode_dropdown.vue

0% Statements 0/2
100% Branches 0/0
0% Functions 0/2
0% Lines 0/2

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62                                                                                                                           
<script>
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { __, sprintf } from '~/locale';
import { viewerTypes } from '../constants';
 
export default {
  components: {
    GlDropdown,
    GlDropdownItem,
  },
  props: {
    viewer: {
      type: String,
      required: true,
    },
    mergeRequestId: {
      type: Number,
      required: true,
    },
  },
  computed: {
    modeDropdownItems() {
      return [
        {
          viewerType: this.$options.viewerTypes.mr,
          title: sprintf(__('Reviewing (merge request !%{mergeRequestId})'), {
            mergeRequestId: this.mergeRequestId,
          }),
          content: __('Compare changes with the merge request target branch'),
        },
        {
          viewerType: this.$options.viewerTypes.diff,
          title: __('Reviewing'),
          content: __('Compare changes with the last commit'),
        },
      ];
    },
  },
  methods: {
    changeMode(mode) {
      this.$emit('click', mode);
    },
  },
  viewerTypes,
};
</script>
 
<template>
  <gl-dropdown :text="__('Edit')" size="small">
    <gl-dropdown-item
      v-for="mode in modeDropdownItems"
      :key="mode.viewerType"
      is-check-item
      :is-checked="viewer === mode.viewerType"
      @click="changeMode(mode.viewerType)"
    >
      <strong class="dropdown-menu-inner-title"> {{ mode.title }} </strong>
      <span class="dropdown-menu-inner-content"> {{ mode.content }} </span>
    </gl-dropdown-item>
  </gl-dropdown>
</template>