Prettifies pipeline's javascript code

app/assets/javascripts/pipelines/components/blank_state.vue

 <script>
-  export default {
+export default {
   name: 'PipelinesSvgState',
   props: {
     svgPath: {
@@ -12,7 +12,7 @@
       required: true,
     },
   },
-  };
+};
 </script>
 
 <template>

app/assets/javascripts/pipelines/components/empty_state.vue

 <script>
-  export default {
+export default {
   name: 'PipelinesEmptyState',
   props: {
     helpPagePath: {
@@ -15,7 +15,7 @@
       required: true,
     },
   },
-  };
+};
 </script>
 <template>
   <div class="row empty-state js-empty-state">

app/assets/javascripts/pipelines/components/graph/action_component.vue

@@ -41,7 +41,6 @@ export default {
       type: String,
       required: true,
     },
-
   },
   data() {
     return {
@@ -67,7 +66,8 @@ export default {
 
       this.isDisabled = true;
 
-      axios.post(`${this.link}.json`)
+      axios
+        .post(`${this.link}.json`)
         .then(() => {
           this.isDisabled = false;
           this.$emit('pipelineActionRequestComplete');

app/assets/javascripts/pipelines/components/graph/job_name_component.vue

 <script>
-  import ciIcon from '../../../vue_shared/components/ci_icon.vue';
+import ciIcon from '../../../vue_shared/components/ci_icon.vue';
 
-  /**
+/**
  * Component that renders both the CI icon status and the job name.
  * Used in
  *  - Badge component
  *  - Dropdown badge components
  */
-  export default {
+export default {
   components: {
     ciIcon,
   },
@@ -22,7 +22,7 @@
       required: true,
     },
   },
-  };
+};
 </script>
 <template>
   <span class="ci-job-name-component">

app/assets/javascripts/pipelines/components/header_component.vue

 <script>
-  import ciHeader from '../../vue_shared/components/header_ci_component.vue';
-  import eventHub from '../event_hub';
-  import loadingIcon from '../../vue_shared/components/loading_icon.vue';
+import ciHeader from '../../vue_shared/components/header_ci_component.vue';
+import eventHub from '../event_hub';
+import loadingIcon from '../../vue_shared/components/loading_icon.vue';
 
-  export default {
+export default {
   name: 'PipelineHeaderSection',
   components: {
     ciHeader,
@@ -75,7 +75,7 @@
       return actions;
     },
   },
-  };
+};
 </script>
 <template>
   <div class="pipeline-header-container">

app/assets/javascripts/pipelines/components/nav_controls.vue

 <script>
-  import LoadingButton from '../../vue_shared/components/loading_button.vue';
+import LoadingButton from '../../vue_shared/components/loading_button.vue';
 
-  export default {
+export default {
   name: 'PipelineNavControls',
   components: {
     LoadingButton,
@@ -36,7 +36,7 @@
       this.$emit('resetRunnersCache', this.resetCachePath);
     },
   },
-  };
+};
 </script>
 <template>
   <div class="nav-controls">

app/assets/javascripts/pipelines/components/pipeline_url.vue

 <script>
-  import userAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue';
-  import tooltip from '../../vue_shared/directives/tooltip';
-  import popover from '../../vue_shared/directives/popover';
+import userAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue';
+import tooltip from '../../vue_shared/directives/tooltip';
+import popover from '../../vue_shared/directives/popover';
 
-  export default {
+export default {
   components: {
     userAvatarLink,
   },
@@ -43,7 +43,7 @@
       };
     },
   },
-  };
+};
 </script>
 <template>
   <div class="table-section section-15 d-none d-sm-none d-md-block pipeline-tags">

app/assets/javascripts/pipelines/components/pipelines.vue

 <script>
-  import _ from 'underscore';
-  import { __, sprintf, s__ } from '../../locale';
-  import createFlash from '../../flash';
-  import PipelinesService from '../services/pipelines_service';
-  import pipelinesMixin from '../mixins/pipelines';
-  import TablePagination from '../../vue_shared/components/table_pagination.vue';
-  import NavigationTabs from '../../vue_shared/components/navigation_tabs.vue';
-  import NavigationControls from './nav_controls.vue';
-  import { getParameterByName } from '../../lib/utils/common_utils';
-  import CIPaginationMixin from '../../vue_shared/mixins/ci_pagination_api_mixin';
+import _ from 'underscore';
+import { __, sprintf, s__ } from '../../locale';
+import createFlash from '../../flash';
+import PipelinesService from '../services/pipelines_service';
+import pipelinesMixin from '../mixins/pipelines';
+import TablePagination from '../../vue_shared/components/table_pagination.vue';
+import NavigationTabs from '../../vue_shared/components/navigation_tabs.vue';
+import NavigationControls from './nav_controls.vue';
+import { getParameterByName } from '../../lib/utils/common_utils';
+import CIPaginationMixin from '../../vue_shared/mixins/ci_pagination_api_mixin';
 
-  export default {
+export default {
   components: {
     TablePagination,
     NavigationTabs,
@@ -277,7 +277,7 @@
         });
     },
   },
-  };
+};
 </script>
 <template>
   <div class="pipelines-container">

app/assets/javascripts/pipelines/components/pipelines_actions.vue

 <script>
-  import eventHub from '../event_hub';
-  import loadingIcon from '../../vue_shared/components/loading_icon.vue';
-  import icon from '../../vue_shared/components/icon.vue';
-  import tooltip from '../../vue_shared/directives/tooltip';
+import eventHub from '../event_hub';
+import loadingIcon from '../../vue_shared/components/loading_icon.vue';
+import icon from '../../vue_shared/components/icon.vue';
+import tooltip from '../../vue_shared/directives/tooltip';
 
-  export default {
+export default {
   directives: {
     tooltip,
   },
@@ -38,7 +38,7 @@
       return !action.playable;
     },
   },
-  };
+};
 </script>
 <template>
   <div class="btn-group">

app/assets/javascripts/pipelines/components/pipelines_artifacts.vue

 <script>
-  import tooltip from '../../vue_shared/directives/tooltip';
-  import icon from '../../vue_shared/components/icon.vue';
+import tooltip from '../../vue_shared/directives/tooltip';
+import icon from '../../vue_shared/components/icon.vue';
 
-  export default {
+export default {
   directives: {
     tooltip,
   },
@@ -15,7 +15,7 @@
       required: true,
     },
   },
-  };
+};
 </script>
 <template>
   <div

app/assets/javascripts/pipelines/components/pipelines_table.vue

 <script>
-  import Modal from '~/vue_shared/components/gl_modal.vue';
-  import { s__, sprintf } from '~/locale';
-  import PipelinesTableRowComponent from './pipelines_table_row.vue';
-  import eventHub from '../event_hub';
+import Modal from '~/vue_shared/components/gl_modal.vue';
+import { s__, sprintf } from '~/locale';
+import PipelinesTableRowComponent from './pipelines_table_row.vue';
+import eventHub from '../event_hub';
 
-  /**
+/**
  * Pipelines Table Component.
  *
  * Given an array of objects, renders a table.
  */
-  export default {
+export default {
   components: {
     PipelinesTableRowComponent,
     Modal,
@@ -42,14 +42,22 @@
   },
   computed: {
     modalTitle() {
-        return sprintf(s__('Pipeline|Stop pipeline #%{pipelineId}?'), {
+      return sprintf(
+        s__('Pipeline|Stop pipeline #%{pipelineId}?'),
+        {
           pipelineId: `${this.pipelineId}`,
-        }, false);
+        },
+        false,
+      );
     },
     modalText() {
-        return sprintf(s__('Pipeline|You’re about to stop pipeline %{pipelineId}.'), {
+      return sprintf(
+        s__('Pipeline|You’re about to stop pipeline %{pipelineId}.'),
+        {
           pipelineId: `<strong>#${this.pipelineId}</strong>`,
-        }, false);
+        },
+        false,
+      );
     },
   },
   created() {
@@ -68,7 +76,7 @@
       this.cancelingPipeline = this.pipelineId;
     },
   },
-  };
+};
 </script>
 <template>
   <div class="ci-table">

app/assets/javascripts/pipelines/components/pipelines_table_row.vue

 <script>
-  import eventHub from '../event_hub';
-  import PipelinesActionsComponent from './pipelines_actions.vue';
-  import PipelinesArtifactsComponent from './pipelines_artifacts.vue';
-  import CiBadge from '../../vue_shared/components/ci_badge_link.vue';
-  import PipelineStage from './stage.vue';
-  import PipelineUrl from './pipeline_url.vue';
-  import PipelinesTimeago from './time_ago.vue';
-  import CommitComponent from '../../vue_shared/components/commit.vue';
-  import LoadingButton from '../../vue_shared/components/loading_button.vue';
-  import Icon from '../../vue_shared/components/icon.vue';
-  import { PIPELINES_TABLE } from '../constants';
+import eventHub from '../event_hub';
+import PipelinesActionsComponent from './pipelines_actions.vue';
+import PipelinesArtifactsComponent from './pipelines_artifacts.vue';
+import CiBadge from '../../vue_shared/components/ci_badge_link.vue';
+import PipelineStage from './stage.vue';
+import PipelineUrl from './pipeline_url.vue';
+import PipelinesTimeago from './time_ago.vue';
+import CommitComponent from '../../vue_shared/components/commit.vue';
+import LoadingButton from '../../vue_shared/components/loading_button.vue';
+import Icon from '../../vue_shared/components/icon.vue';
+import { PIPELINES_TABLE } from '../constants';
 
-  /**
+/**
  * Pipeline table row.
  *
  * Given the received object renders a table row in the pipelines' table.
  */
-  export default {
+export default {
   components: {
     PipelinesActionsComponent,
     PipelinesArtifactsComponent,
@@ -113,8 +113,7 @@
      * @returns {String|Undefined}
      */
     commitTag() {
-        if (this.pipeline.ref &&
-          this.pipeline.ref.tag) {
+      if (this.pipeline.ref && this.pipeline.ref.tag) {
         return this.pipeline.ref.tag;
       }
       return undefined;
@@ -153,8 +152,7 @@
      * @returns {String|Undefined}
      */
     commitUrl() {
-        if (this.pipeline.commit &&
-          this.pipeline.commit.commit_path) {
+      if (this.pipeline.commit && this.pipeline.commit.commit_path) {
         return this.pipeline.commit.commit_path;
       }
       return undefined;
@@ -167,8 +165,7 @@
      * @returns {String|Undefined}
      */
     commitShortSha() {
-        if (this.pipeline.commit &&
-          this.pipeline.commit.short_id) {
+      if (this.pipeline.commit && this.pipeline.commit.short_id) {
         return this.pipeline.commit.short_id;
       }
       return undefined;
@@ -181,8 +178,7 @@
      * @returns {String|Undefined}
      */
     commitTitle() {
-        if (this.pipeline.commit &&
-          this.pipeline.commit.title) {
+      if (this.pipeline.commit && this.pipeline.commit.title) {
         return this.pipeline.commit.title;
       }
       return undefined;
@@ -222,10 +218,12 @@
     },
 
     displayPipelineActions() {
-        return this.pipeline.flags.retryable ||
+      return (
+        this.pipeline.flags.retryable ||
         this.pipeline.flags.cancelable ||
         this.pipeline.details.manual_actions.length ||
-          this.pipeline.details.artifacts.length;
+        this.pipeline.details.artifacts.length
+      );
     },
 
     isChildView() {
@@ -249,7 +247,7 @@
       eventHub.$emit('retryPipeline', this.pipeline.retry_path);
     },
   },
-  };
+};
 </script>
 <template>
   <div class="commit gl-responsive-table-row">

app/assets/javascripts/pipelines/components/time_ago.vue

 <script>
-  import iconTimerSvg from 'icons/_icon_timer.svg';
-  import '../../lib/utils/datetime_utility';
-  import tooltip from '../../vue_shared/directives/tooltip';
-  import timeagoMixin from '../../vue_shared/mixins/timeago';
+import iconTimerSvg from 'icons/_icon_timer.svg';
+import '../../lib/utils/datetime_utility';
+import tooltip from '../../vue_shared/directives/tooltip';
+import timeagoMixin from '../../vue_shared/mixins/timeago';
 
-  export default {
+export default {
   directives: {
     tooltip,
   },
-    mixins: [
-      timeagoMixin,
-    ],
+  mixins: [timeagoMixin],
   props: {
     finishedTime: {
       type: String,
@@ -54,7 +52,7 @@
       return `${hh}:${mm}:${ss}`;
     },
   },
-  };
+};
 </script>
 <template>
   <div class="table-section section-15 pipelines-time-ago">

app/assets/javascripts/pipelines/mixins/pipelines.js

@@ -75,8 +75,7 @@ export default {
       // Stop polling
       this.poll.stop();
       // Update the table
-      return this.getPipelines()
-        .then(() => this.poll.restart());
+      return this.getPipelines().then(() => this.poll.restart());
     },
     fetchPipelines() {
       if (!this.isMakingRequest) {
@@ -86,9 +85,10 @@ export default {
       }
     },
     getPipelines() {
-      return this.service.getPipelines(this.requestData)
+      return this.service
+        .getPipelines(this.requestData)
         .then(response => this.successCallback(response))
-        .catch((error) => this.errorCallback(error));
+        .catch(error => this.errorCallback(error));
     },
     setCommonData(pipelines) {
       this.store.storePipelines(pipelines);
@@ -118,7 +118,8 @@ export default {
       }
     },
     postAction(endpoint) {
-      this.service.postAction(endpoint)
+      this.service
+        .postAction(endpoint)
         .then(() => this.fetchPipelines())
         .catch(() => Flash(__('An error occurred while making the request.')));
     },

app/assets/javascripts/pipelines/pipeline_details_bundle.js

@@ -31,7 +31,8 @@ export default () => {
       requestRefreshPipelineGraph() {
         // When an action is clicked
         // (wether in the dropdown or in the main nodes, we refresh the big graph)
-        this.mediator.refreshPipeline()
+        this.mediator
+          .refreshPipeline()
           .catch(() => Flash(__('An error occurred while making the request.')));
       },
     },

app/assets/javascripts/pipelines/pipeline_details_mediator.js

@@ -52,7 +52,8 @@ export default class pipelinesMediator {
   refreshPipeline() {
     this.poll.stop();
 
-    return this.service.getPipeline()
+    return this.service
+      .getPipeline()
       .then(response => this.successCallback(response))
       .catch(() => this.errorCallback())
       .finally(() => this.poll.restart());