All files / app/assets/javascripts/vue_merge_request_widget/components/terraform terraform_plan.vue

100% Statements 14/14
100% Branches 12/12
100% Functions 8/8
100% Lines 14/14

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 117 118 119 120  2x 2x                                                     10x     10x     10x     10x     10x 5x     5x     10x 5x         5x         10x           58x                                                                                                            
<script>
import { GlIcon, GlLink, GlSprintf } from '@gitlab/ui';
import { s__ } from '~/locale';
 
export default {
  name: 'TerraformPlan',
  components: {
    GlIcon,
    GlLink,
    GlSprintf,
  },
  props: {
    plan: {
      required: true,
      type: Object,
    },
  },
  i18n: {
    changes: s__(
      'Terraform|Reported Resource Changes: %{addNum} to add, %{changeNum} to change, %{deleteNum} to delete',
    ),
    generationErrored: s__('Terraform|Generating the report caused an error.'),
    namedReportFailed: s__('Terraform|The job %{name} failed to generate a report.'),
    namedReportGenerated: s__('Terraform|The job %{name} generated a report.'),
    reportFailed: s__('Terraform|A report failed to generate.'),
    reportGenerated: s__('Terraform|A report was generated in your pipelines.'),
  },
  computed: {
    addNum() {
      return Number(this.plan.create);
    },
    changeNum() {
      return Number(this.plan.update);
    },
    deleteNum() {
      return Number(this.plan.delete);
    },
    iconType() {
      return this.validPlanValues ? 'doc-changes' : 'warning';
    },
    reportChangeText() {
      if (this.validPlanValues) {
        return this.$options.i18n.changes;
      }
 
      return this.$options.i18n.generationErrored;
    },
    reportHeaderText() {
      if (this.validPlanValues) {
        return this.plan.job_name
          ? this.$options.i18n.namedReportGenerated
          : this.$options.i18n.reportGenerated;
      }
 
      return this.plan.job_name
        ? this.$options.i18n.namedReportFailed
        : this.$options.i18n.reportFailed;
    },
    validPlanValues() {
      return this.addNum + this.changeNum + this.deleteNum >= 0;
    },
  },
};
</script>
 
<template>
  <div class="gl-display-flex gl-pb-3">
    <span
      class="gl-display-flex gl-align-items-center gl-justify-content-center gl-align-self-start gl-px-2"
    >
      <gl-icon :name="iconType" :size="16" data-testid="change-type-icon" />
    </span>
 
    <div class="gl-display-flex gl-flex-grow-1 gl-flex-direction-column flex-md-row gl-pl-3">
      <div class="gl-flex-grow-1 gl-display-flex gl-flex-direction-column gl-pr-3">
        <p class="gl-mb-3 gl-line-height-normal">
          <gl-sprintf :message="reportHeaderText">
            <template #name>
              <strong>{{ plan.job_name }}</strong>
            </template>
          </gl-sprintf>
        </p>
 
        <p class="gl-mb-3 gl-line-height-normal">
          <gl-sprintf :message="reportChangeText">
            <template #addNum>
              <strong>{{ addNum }}</strong>
            </template>
 
            <template #changeNum>
              <strong>{{ changeNum }}</strong>
            </template>
 
            <template #deleteNum>
              <strong>{{ deleteNum }}</strong>
            </template>
          </gl-sprintf>
        </p>
      </div>
 
      <div>
        <gl-link
          v-if="plan.job_path"
          :href="plan.job_path"
          target="_blank"
          data-testid="terraform-report-link"
          data-track-action="click_terraform_mr_plan_button"
          data-track-label="mr_widget_terraform_mr_plan_button"
          data-track-property="terraform_mr_plan_button"
          class="btn btn-sm"
          rel="noopener"
        >
          {{ __('View full log') }}
          <gl-icon name="external-link" />
        </gl-link>
      </div>
    </div>
  </div>
</template>