Merge branch 'vue-data-syntax' into 'master'

Refactor: update Vue data arrow syntax to function syntax

See merge request gitlab-org/gitlab!56127

app/assets/javascripts/clusters/components/fluentd_output_settings.vue

@@ -54,15 +54,17 @@ export default {
       required: false,
     },
   },
-  data: () => ({
-    currentServerSideSettings: {
-      host: null,
-      port: null,
-      protocol: null,
-      wafLogEnabled: null,
-      ciliumLogEnabled: null,
-    },
-  }),
+  data() {
+    return {
+      currentServerSideSettings: {
+        host: null,
+        port: null,
+        protocol: null,
+        wafLogEnabled: null,
+        ciliumLogEnabled: null,
+      },
+    };
+  },
   computed: {
     isSaving() {
       return [UPDATING].includes(this.status);

app/assets/javascripts/clusters/components/ingress_modsecurity_settings.vue

@@ -53,11 +53,13 @@ export default {
       }),
     },
   },
-  data: () => ({
-    modSecurityLogo,
-    initialValue: null,
-    initialMode: null,
-  }),
+  data() {
+    return {
+      modSecurityLogo,
+      initialValue: null,
+      initialMode: null,
+    };
+  },
   computed: {
     modSecurityEnabled: {
       get() {

app/assets/javascripts/security_configuration/components/configuration_table.vue

@@ -24,9 +24,11 @@ export default {
     GlTable,
     GlAlert,
   },
-  data: () => ({
-    errorMessage: '',
-  }),
+  data() {
+    return {
+      errorMessage: '',
+    };
+  },
   methods: {
     getFeatureDocumentationLinkLabel(item) {
       return sprintf(s__('SecurityConfiguration|Feature documentation for %{featureName}'), {

app/assets/javascripts/security_configuration/components/manage_sast.vue

@@ -14,9 +14,11 @@ export default {
       default: '',
     },
   },
-  data: () => ({
-    isLoading: false,
-  }),
+  data() {
+    return {
+      isLoading: false,
+    };
+  },
   methods: {
     async mutate() {
       this.isLoading = true;

app/assets/javascripts/vue_shared/components/diff_viewer/viewers/renamed.vue

@@ -37,9 +37,11 @@ export default {
       required: true,
     },
   },
-  data: () => ({
-    state: STATE_IDLING,
-  }),
+  data() {
+    return {
+      state: STATE_IDLING,
+    };
+  },
   computed: {
     shortSha() {
       return truncateSha(this.diffFile.content_sha);

ee/app/assets/javascripts/contextual_sidebar/components/trial_status_popover.vue

@@ -45,9 +45,11 @@ export default {
       required: true,
     },
   },
-  data: () => ({
-    disabled: false,
-  }),
+  data() {
+    return {
+      disabled: false,
+    };
+  },
   i18n: {
     compareAllButtonTitle: s__('Trials|Compare all plans'),
     popoverTitle: s__('Trials|Hey there'),

ee/app/assets/javascripts/reports/components/modal_open_name.vue

@@ -20,9 +20,11 @@ export default {
       required: true,
     },
   },
-  data: () => ({
-    tooltipTitle: '',
-  }),
+  data() {
+    return {
+      tooltipTitle: '',
+    };
+  },
   mounted() {
     this.updateTooltipTitle();
   },

ee/app/assets/javascripts/security_configuration/components/app.vue

@@ -62,9 +62,11 @@ export default {
       default: false,
     },
   },
-  data: () => ({
-    autoDevopsAlertDismissed: 'false',
-  }),
+  data() {
+    return {
+      autoDevopsAlertDismissed: 'false',
+    };
+  },
   computed: {
     devopsMessage() {
       return this.autoDevopsEnabled

ee/app/assets/javascripts/security_configuration/components/expandable_section.vue

@@ -18,10 +18,12 @@ export default {
       default: 'h3',
     },
   },
-  data: () => ({
-    collapseId: uniqueId('expandable-section-'),
-    visible: false,
-  }),
+  data() {
+    return {
+      collapseId: uniqueId('expandable-section-'),
+      visible: false,
+    };
+  },
   computed: {
     toggleText() {
       return this.visible ? __('Collapse') : __('Expand');

ee/app/assets/javascripts/security_configuration/dast_profiles/components/dast_saved_scans_list.vue

@@ -29,11 +29,13 @@ export default {
       default: () => [],
     },
   },
-  data: () => ({
-    isRunningScan: null,
-    hasRunScanError: false,
-    runScanErrors: [],
-  }),
+  data() {
+    return {
+      isRunningScan: null,
+      hasRunScanError: false,
+      runScanErrors: [],
+    };
+  },
   computed: {
     error() {
       if (this.hasRunScanError) {

ee/app/assets/javascripts/security_dashboard/components/csv_export_button.vue

@@ -25,10 +25,12 @@ export default {
       required: true,
     },
   },
-  data: () => ({
-    isPreparingCsvExport: false,
-    showPopover: localStorage.getItem(STORAGE_KEY) !== 'true',
-  }),
+  data() {
+    return {
+      isPreparingCsvExport: false,
+      showPopover: localStorage.getItem(STORAGE_KEY) !== 'true',
+    };
+  },
   computed: {
     buttonProps() {
       const { isPreparingCsvExport } = this;

ee/app/assets/javascripts/security_dashboard/components/filters.vue

@@ -10,9 +10,11 @@ export default {
     StandardFilter,
     GlToggle,
   },
-  data: () => ({
-    filterConfigs: [severityFilter, scannerFilter],
-  }),
+  data() {
+    return {
+      filterConfigs: [severityFilter, scannerFilter],
+    };
+  },
   computed: {
     ...mapState('filters', ['filters']),
     hideDismissed: {

ee/app/assets/javascripts/security_dashboard/components/first_class_vulnerability_filters.vue

@@ -17,9 +17,11 @@ export default {
   props: {
     projects: { type: Array, required: false, default: undefined },
   },
-  data: () => ({
-    filterQuery: {},
-  }),
+  data() {
+    return {
+      filterQuery: {},
+    };
+  },
   computed: {
     filters() {
       const filters = [stateFilter, severityFilter, scannerFilter, activityFilter];

ee/app/assets/javascripts/security_dashboard/components/selection_summary_vuex.vue

@@ -13,9 +13,11 @@ export default {
     GlButton,
     GlFormSelect,
   },
-  data: () => ({
-    dismissalReason: null,
-  }),
+  data() {
+    return {
+      dismissalReason: null,
+    };
+  },
   computed: {
     ...mapGetters('vulnerabilities', ['selectedVulnerabilitiesCount']),
     canDismissVulnerability() {

ee/app/assets/javascripts/security_dashboard/components/vulnerability_count_list.vue

@@ -24,10 +24,12 @@ export default {
       default: () => ({}),
     },
   },
-  data: () => ({
-    queryError: false,
-    vulnerabilitiesCount: {},
-  }),
+  data() {
+    return {
+      queryError: false,
+      vulnerabilitiesCount: {},
+    };
+  },
   computed: {
     isLoading() {
       return this.$apollo.queries.vulnerabilitiesCount.loading;

ee/app/assets/javascripts/vue_shared/discover/card_security_discover_app.vue

@@ -52,14 +52,16 @@ export default {
       default: '',
     },
   },
-  data: () => ({
-    slide: 0,
-    carouselImages: [
-      securityDependencyImageUrl,
-      securityScanningImageUrl,
-      securityDashboardImageUrl,
-    ],
-  }),
+  data() {
+    return {
+      slide: 0,
+      carouselImages: [
+        securityDependencyImageUrl,
+        securityScanningImageUrl,
+        securityDashboardImageUrl,
+      ],
+    };
+  },
   computed: {
     discoverButtonProps() {
       return {

ee/app/assets/javascripts/vue_shared/security_reports/components/modal.vue

@@ -57,10 +57,12 @@ export default {
       required: true,
     },
   },
-  data: () => ({
-    localDismissalComment: '',
-    dismissalCommentErrorMessage: '',
-  }),
+  data() {
+    return {
+      localDismissalComment: '',
+      dismissalCommentErrorMessage: '',
+    };
+  },
   computed: {
     canCreateIssueForThisVulnerability() {
       return Boolean(!this.isResolved && !this.vulnerability.hasIssue && this.canCreateIssue);

ee/app/assets/javascripts/vue_shared/security_reports/components/split_button.vue

@@ -18,9 +18,11 @@ export default {
       default: false,
     },
   },
-  data: () => ({
-    selectedButton: {},
-  }),
+  data() {
+    return {
+      selectedButton: {},
+    };
+  },
   created() {
     this.setButton(this.buttons[0]);
   },

ee/app/assets/javascripts/vulnerabilities/components/footer.vue

@@ -40,12 +40,12 @@ export default {
       required: true,
     },
   },
-
-  data: () => ({
-    discussionsDictionary: {},
-    lastFetchedAt: null,
-  }),
-
+  data() {
+    return {
+      discussionsDictionary: {},
+      lastFetchedAt: null,
+    };
+  },
   computed: {
     discussions() {
       return Object.values(this.discussionsDictionary);
@@ -92,21 +92,17 @@ export default {
       };
     },
   },
-
   created() {
     this.fetchDiscussions();
   },
-
   updated() {
     this.$nextTick(() => {
       initUserPopovers(this.$el.querySelectorAll('.js-user-link'));
     });
   },
-
   beforeDestroy() {
     if (this.poll) this.poll.stop();
   },
-
   methods: {
     dateToSeconds(date) {
       return Date.parse(date) / 1000;
@@ -199,7 +195,6 @@ export default {
           }
         }
       });
-
       // Emit an event that tells the header to refresh the vulnerability.
       if (isVulnerabilityStateChanged) {
         this.$emit('vulnerability-state-change');
@@ -211,7 +206,6 @@ export default {
 <template>
   <div data-qa-selector="vulnerability_footer">
     <solution-card v-if="hasSolution" v-bind="solutionInfo" />
-
     <div v-if="vulnerability.mergeRequestFeedback" class="card gl-mt-5">
       <merge-request-note
         :feedback="vulnerability.mergeRequestFeedback"
@@ -219,7 +213,6 @@ export default {
         class="card-body"
       />
     </div>
-
     <related-jira-issues
       v-if="glFeatures.jiraForVulnerabilities && createJiraIssueUrl"
       class="gl-mt-6"
@@ -231,7 +224,6 @@ export default {
       :project-path="project.url"
       :help-path="vulnerability.relatedIssuesHelpPath"
     />
-
     <div class="notes" data-testid="detection-note">
       <div class="system-note gl-display-flex gl-align-items-center gl-p-0! gl-mt-6!">
         <div class="timeline-icon gl-m-0!">
@@ -244,9 +236,7 @@ export default {
         />
       </div>
     </div>
-
     <hr />
-
     <ul v-if="discussions.length" ref="historyList" class="notes discussion-body">
       <history-entry
         v-for="discussion in discussions"