diff options
Diffstat (limited to 'app/assets/javascripts/diffs/components')
9 files changed, 68 insertions, 13 deletions
diff --git a/app/assets/javascripts/diffs/components/app.vue b/app/assets/javascripts/diffs/components/app.vue index 77cd2afc106..3ea2a2fbaee 100644 --- a/app/assets/javascripts/diffs/components/app.vue +++ b/app/assets/javascripts/diffs/components/app.vue @@ -50,6 +50,11 @@ export default { type: String, required: true, }, + endpointCoverage: { + type: String, + required: false, + default: '', + }, projectPath: { type: String, required: true, @@ -169,6 +174,7 @@ export default { endpoint: this.endpoint, endpointMetadata: this.endpointMetadata, endpointBatch: this.endpointBatch, + endpointCoverage: this.endpointCoverage, projectPath: this.projectPath, dismissEndpoint: this.dismissEndpoint, showSuggestPopover: this.showSuggestPopover, @@ -218,6 +224,7 @@ export default { 'fetchDiffFiles', 'fetchDiffFilesMeta', 'fetchDiffFilesBatch', + 'fetchCoverageFiles', 'startRenderDiffsQueue', 'assignDiscussionsToDiff', 'setHighlightedRow', @@ -292,6 +299,10 @@ export default { }); } + if (this.endpointCoverage) { + this.fetchCoverageFiles(); + } + if (!this.isNotesFetched) { eventHub.$emit('fetchNotesData'); } diff --git a/app/assets/javascripts/diffs/components/diff_expansion_cell.vue b/app/assets/javascripts/diffs/components/diff_expansion_cell.vue index 4eae2e09c08..46ed76450c4 100644 --- a/app/assets/javascripts/diffs/components/diff_expansion_cell.vue +++ b/app/assets/javascripts/diffs/components/diff_expansion_cell.vue @@ -54,7 +54,7 @@ export default { colspan: { type: Number, required: false, - default: 3, + default: 4, }, }, computed: { diff --git a/app/assets/javascripts/diffs/components/inline_diff_comment_row.vue b/app/assets/javascripts/diffs/components/inline_diff_comment_row.vue index a06dbd70ac5..87f0396cf72 100644 --- a/app/assets/javascripts/diffs/components/inline_diff_comment_row.vue +++ b/app/assets/javascripts/diffs/components/inline_diff_comment_row.vue @@ -51,7 +51,7 @@ export default { <template> <tr v-if="shouldRender" :class="className" class="notes_holder"> - <td class="notes-content" colspan="3"> + <td class="notes-content" colspan="4"> <div class="content"> <diff-discussions v-if="line.discussions.length" diff --git a/app/assets/javascripts/diffs/components/inline_diff_table_row.vue b/app/assets/javascripts/diffs/components/inline_diff_table_row.vue index 55a8df43c62..bd99fcb71b8 100644 --- a/app/assets/javascripts/diffs/components/inline_diff_table_row.vue +++ b/app/assets/javascripts/diffs/components/inline_diff_table_row.vue @@ -1,5 +1,6 @@ <script> -import { mapActions, mapState } from 'vuex'; +import { mapActions, mapGetters, mapState } from 'vuex'; +import { GlTooltipDirective } from '@gitlab/ui'; import DiffTableCell from './diff_table_cell.vue'; import { MATCH_LINE_TYPE, @@ -15,11 +16,18 @@ export default { components: { DiffTableCell, }, + directives: { + GlTooltip: GlTooltipDirective, + }, props: { fileHash: { type: String, required: true, }, + filePath: { + type: String, + required: true, + }, contextLinesPath: { type: String, required: true, @@ -40,6 +48,7 @@ export default { }; }, computed: { + ...mapGetters('diffs', ['fileLineCoverage']), ...mapState({ isHighlighted(state) { return this.line.line_code !== null && this.line.line_code === state.diffs.highlightedRow; @@ -62,6 +71,9 @@ export default { isMatchLine() { return this.line.type === MATCH_LINE_TYPE; }, + coverageState() { + return this.fileLineCoverage(this.filePath, this.line.new_line); + }, }, created() { this.newLineType = NEW_LINE_TYPE; @@ -114,13 +126,19 @@ export default { class="diff-line-num new_line qa-new-diff-line" /> <td + v-gl-tooltip.hover + :title="coverageState.text" + :class="[line.type, coverageState.class, { hll: isHighlighted }]" + class="line-coverage" + ></td> + <td :class="[ line.type, { hll: isHighlighted, }, ]" - class="line_content" + class="line_content with-coverage" v-html="line.rich_text" ></td> </tr> diff --git a/app/assets/javascripts/diffs/components/inline_diff_view.vue b/app/assets/javascripts/diffs/components/inline_diff_view.vue index 1eb17588376..8b25cdc2887 100644 --- a/app/assets/javascripts/diffs/components/inline_diff_view.vue +++ b/app/assets/javascripts/diffs/components/inline_diff_view.vue @@ -48,6 +48,7 @@ export default { <colgroup> <col style="width: 50px;" /> <col style="width: 50px;" /> + <col style="width: 8px;" /> <col /> </colgroup> <tbody> @@ -63,6 +64,7 @@ export default { <inline-diff-table-row :key="`${line.line_code || index}`" :file-hash="diffFile.file_hash" + :file-path="diffFile.file_path" :context-lines-path="diffFile.context_lines_path" :line="line" :is-bottom="index + 1 === diffLinesLength" diff --git a/app/assets/javascripts/diffs/components/parallel_diff_comment_row.vue b/app/assets/javascripts/diffs/components/parallel_diff_comment_row.vue index 65b41b0e456..b525490f7cc 100644 --- a/app/assets/javascripts/diffs/components/parallel_diff_comment_row.vue +++ b/app/assets/javascripts/diffs/components/parallel_diff_comment_row.vue @@ -122,7 +122,7 @@ export default { <template> <tr v-if="shouldRender" :class="className" class="notes_holder"> - <td class="notes-content parallel old" colspan="2"> + <td class="notes-content parallel old" colspan="3"> <div v-if="shouldRenderDiscussionsOnLeft" class="content"> <diff-discussions :discussions="line.left.discussions" @@ -147,7 +147,7 @@ export default { </template> </diff-discussion-reply> </td> - <td class="notes-content parallel new" colspan="2"> + <td class="notes-content parallel new" colspan="3"> <div v-if="shouldRenderDiscussionsOnRight" class="content"> <diff-discussions :discussions="line.right.discussions" diff --git a/app/assets/javascripts/diffs/components/parallel_diff_expansion_row.vue b/app/assets/javascripts/diffs/components/parallel_diff_expansion_row.vue index c1b30eab199..0a80107ced4 100644 --- a/app/assets/javascripts/diffs/components/parallel_diff_expansion_row.vue +++ b/app/assets/javascripts/diffs/components/parallel_diff_expansion_row.vue @@ -49,7 +49,7 @@ export default { :line="line.left" :is-top="isTop" :is-bottom="isBottom" - :colspan="4" + :colspan="6" /> </template> </tr> diff --git a/app/assets/javascripts/diffs/components/parallel_diff_table_row.vue b/app/assets/javascripts/diffs/components/parallel_diff_table_row.vue index 4c95d618b0f..83d803f42b1 100644 --- a/app/assets/javascripts/diffs/components/parallel_diff_table_row.vue +++ b/app/assets/javascripts/diffs/components/parallel_diff_table_row.vue @@ -1,6 +1,7 @@ <script> -import { mapActions, mapState } from 'vuex'; +import { mapActions, mapGetters, mapState } from 'vuex'; import $ from 'jquery'; +import { GlTooltipDirective } from '@gitlab/ui'; import DiffTableCell from './diff_table_cell.vue'; import { MATCH_LINE_TYPE, @@ -18,11 +19,18 @@ export default { components: { DiffTableCell, }, + directives: { + GlTooltip: GlTooltipDirective, + }, props: { fileHash: { type: String, required: true, }, + filePath: { + type: String, + required: true, + }, contextLinesPath: { type: String, required: true, @@ -44,6 +52,7 @@ export default { }; }, computed: { + ...mapGetters('diffs', ['fileLineCoverage']), ...mapState({ isHighlighted(state) { const lineCode = @@ -82,6 +91,9 @@ export default { isMatchLineRight() { return this.line.right && this.line.right.type === MATCH_LINE_TYPE; }, + coverageState() { + return this.fileLineCoverage(this.filePath, this.line.right.new_line); + }, }, created() { this.newLineType = NEW_LINE_TYPE; @@ -99,7 +111,7 @@ export default { const allCellsInHoveringRow = Array.from(e.currentTarget.children); const hoverIndex = allCellsInHoveringRow.indexOf(hoveringCell); - if (hoverIndex >= 2) { + if (hoverIndex >= 3) { this.isRightHover = isHover; } else { this.isLeftHover = isHover; @@ -143,17 +155,19 @@ export default { line-position="left" class="diff-line-num old_line" /> + <td :class="parallelViewLeftLineType" class="line-coverage left-side"></td> <td :id="line.left.line_code" :class="parallelViewLeftLineType" - class="line_content parallel left-side" + class="line_content with-coverage parallel left-side" @mousedown="handleParallelLineMouseDown" v-html="line.left.rich_text" ></td> </template> <template v-else> <td class="diff-line-num old_line empty-cell"></td> - <td class="line_content parallel left-side empty-cell"></td> + <td class="line-coverage left-side empty-cell"></td> + <td class="line_content with-coverage parallel left-side empty-cell"></td> </template> <template v-if="line.right && !isMatchLineRight"> <diff-table-cell @@ -170,6 +184,12 @@ export default { class="diff-line-num new_line" /> <td + v-gl-tooltip.hover + :title="coverageState.text" + :class="[line.right.type, coverageState.class, { hll: isHighlighted }]" + class="line-coverage right-side" + ></td> + <td :id="line.right.line_code" :class="[ line.right.type, @@ -177,14 +197,15 @@ export default { hll: isHighlighted, }, ]" - class="line_content parallel right-side" + class="line_content with-coverage parallel right-side" @mousedown="handleParallelLineMouseDown" v-html="line.right.rich_text" ></td> </template> <template v-else> <td class="diff-line-num old_line empty-cell"></td> - <td class="line_content parallel right-side empty-cell"></td> + <td class="line-coverage right-side empty-cell"></td> + <td class="line_content with-coverage parallel right-side empty-cell"></td> </template> </tr> </template> diff --git a/app/assets/javascripts/diffs/components/parallel_diff_view.vue b/app/assets/javascripts/diffs/components/parallel_diff_view.vue index 88baac092a1..d796aad9d06 100644 --- a/app/assets/javascripts/diffs/components/parallel_diff_view.vue +++ b/app/assets/javascripts/diffs/components/parallel_diff_view.vue @@ -47,8 +47,10 @@ export default { > <colgroup> <col style="width: 50px;" /> + <col style="width: 8px;" /> <col /> <col style="width: 50px;" /> + <col style="width: 8px;" /> <col /> </colgroup> <tbody> @@ -64,6 +66,7 @@ export default { <parallel-diff-table-row :key="line.line_code" :file-hash="diffFile.file_hash" + :file-path="diffFile.file_path" :context-lines-path="diffFile.context_lines_path" :line="line" :is-bottom="index + 1 === diffLinesLength" |