Skip to content

Add Codequality multiple findings indicator

What does this MR do and why?

fixes: #364259 (closed)

This MR enhances the codequality findings inline indicator.

Screenshots or screen recordings

1 finding 3 findings 5 findings
2022-11-10_23-06-09 2022-11-10_23-08-17 2022-11-10_23-08-57

How to set up and validate locally

  1. enable refactor_code_quality_inline_findings flag
  2. clone this project or any project with codequality enabled https://gitlab.com/jannik_lehmann/code-quality-test
  3. recreate this MR or any MR with multiple findings on 1 line jannik_lehmann/code-quality-test!2 (diffs)
  4. for full experience apply this patch
diff --git a/app/assets/javascripts/diffs/components/diff_row.vue b/app/assets/javascripts/diffs/components/diff_row.vue
index e5695c4390f1..9ad0d08554de 100644
--- a/app/assets/javascripts/diffs/components/diff_row.vue
+++ b/app/assets/javascripts/diffs/components/diff_row.vue
@@ -278,7 +278,6 @@ export default {
             :is="$options.CodeQualityGutterIcon"
             v-if="$options.showCodequalityLeft(props)"
             :code-quality-expanded="props.codeQualityExpanded"
-            :codequality="props.line.left.codequality"
             :file-path="props.filePath"
             @showCodeQualityFindings="
               listeners.toggleCodeQualityFindings(props.line.left.codequality[0].line)
@@ -401,7 +400,6 @@ export default {
           <component
             :is="$options.CodeQualityGutterIcon"
             v-if="$options.showCodequalityRight(props)"
-            :codequality="props.line.right.codequality"
             :file-path="props.filePath"
             data-testid="codeQualityIcon"
             @showCodeQualityFindings="
diff --git a/ee/app/assets/javascripts/diffs/components/code_quality_gutter_icon.vue b/ee/app/assets/javascripts/diffs/components/code_quality_gutter_icon.vue
index 2fdde5c179e6..aadfe855bc47 100644
--- a/ee/app/assets/javascripts/diffs/components/code_quality_gutter_icon.vue
+++ b/ee/app/assets/javascripts/diffs/components/code_quality_gutter_icon.vue
@@ -29,7 +29,13 @@ export default {
     codequality: {
       type: Array,
       required: false,
-      default: () => [],
+      default: () => [
+        { line: 3, description: "Unexpected hardcoded 'debugger' statement.", severity: 'major' },
+        { line: 3, description: 'Unreachable code.', severity: 'minor' },
+        { line: 3, description: 'Unreachable code.3', severity: 'info' },
+        { line: 3, description: 'Unreachable code.3', severity: 'blocker' },
+        { line: 3, description: 'Unreachable code.3', severity: 'critical' },
+      ],
     },
   },
   data() {

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Jannik Lehmann

Merge request reports

Loading