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 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 | <script> import { GlButton, GlButtonGroup, GlTooltipDirective } from '@gitlab/ui'; import { InternalEvents } from '~/tracking'; import { RICH_BLOB_VIEWER, RICH_BLOB_VIEWER_TITLE, SIMPLE_BLOB_VIEWER, SIMPLE_BLOB_VIEWER_TITLE, BLAME_VIEWER, BLAME_TITLE, } from './constants'; export default { components: { GlButtonGroup, GlButton, }, directives: { GlTooltip: GlTooltipDirective, }, mixins: [InternalEvents.mixin()], props: { value: { type: String, default: SIMPLE_BLOB_VIEWER, required: false, }, docIcon: { type: String, default: 'document', required: false, }, showViewerToggles: { type: Boolean, required: false, default: false, }, showBlameToggle: { type: Boolean, required: false, default: false, }, }, computed: { isSimpleViewer() { return this.value === SIMPLE_BLOB_VIEWER; }, isRichViewer() { return this.value === RICH_BLOB_VIEWER; }, isBlameViewer() { return this.value === BLAME_VIEWER; }, }, methods: { switchToViewer(viewer) { Iif (viewer === BLAME_VIEWER) { this.$emit('blame'); this.trackEvent('open_blame_viewer_on_blob_page'); } Iif (viewer !== this.value) { this.$emit('input', viewer); } }, }, SIMPLE_BLOB_VIEWER, RICH_BLOB_VIEWER, SIMPLE_BLOB_VIEWER_TITLE, RICH_BLOB_VIEWER_TITLE, BLAME_TITLE, BLAME_VIEWER, }; </script> <template> <gl-button-group class="js-blob-viewer-switcher mx-2"> <gl-button v-if="showViewerToggles" v-gl-tooltip.hover :aria-label="$options.SIMPLE_BLOB_VIEWER_TITLE" :title="$options.SIMPLE_BLOB_VIEWER_TITLE" :selected="isSimpleViewer" icon="code" category="primary" variant="default" class="js-blob-viewer-switch-btn" data-viewer="simple" @click="switchToViewer($options.SIMPLE_BLOB_VIEWER)" /> <gl-button v-if="showViewerToggles" v-gl-tooltip.hover :aria-label="$options.RICH_BLOB_VIEWER_TITLE" :title="$options.RICH_BLOB_VIEWER_TITLE" :selected="isRichViewer" :icon="docIcon" category="primary" variant="default" class="js-blob-viewer-switch-btn" data-viewer="rich" @click="switchToViewer($options.RICH_BLOB_VIEWER)" /> <gl-button v-if="showBlameToggle" v-gl-tooltip.hover :title="$options.BLAME_TITLE" :selected="isBlameViewer" category="primary" variant="default" data-test-id="blame-toggle" @click="switchToViewer($options.BLAME_VIEWER)" >{{ __('Blame') }}</gl-button > </gl-button-group> </template> |