Prettify registry and reports modules

app/assets/javascripts/registry/components/app.vue

 <script>
-  import { mapGetters, mapActions } from 'vuex';
-  import Flash from '../../flash';
-  import store from '../stores';
-  import collapsibleContainer from './collapsible_container.vue';
-  import { errorMessages, errorMessagesTypes } from '../constants';
+import { mapGetters, mapActions } from 'vuex';
+import Flash from '../../flash';
+import store from '../stores';
+import collapsibleContainer from './collapsible_container.vue';
+import { errorMessages, errorMessagesTypes } from '../constants';
 
-  export default {
+export default {
   name: 'RegistryListApp',
   components: {
     collapsibleContainer,
@@ -18,25 +18,18 @@
   },
   store,
   computed: {
-      ...mapGetters([
-        'isLoading',
-        'repos',
-      ]),
+    ...mapGetters(['isLoading', 'repos']),
   },
   created() {
     this.setMainEndpoint(this.endpoint);
   },
   mounted() {
-      this.fetchRepos()
-        .catch(() => Flash(errorMessages[errorMessagesTypes.FETCH_REPOS]));
+    this.fetchRepos().catch(() => Flash(errorMessages[errorMessagesTypes.FETCH_REPOS]));
   },
   methods: {
-      ...mapActions([
-        'setMainEndpoint',
-        'fetchRepos',
-      ]),
+    ...mapActions(['setMainEndpoint', 'fetchRepos']),
   },
-  };
+};
 </script>
 <template>
   <div>

app/assets/javascripts/registry/components/collapsible_container.vue

 <script>
-  import { mapActions } from 'vuex';
-  import Flash from '../../flash';
-  import clipboardButton from '../../vue_shared/components/clipboard_button.vue';
-  import tooltip from '../../vue_shared/directives/tooltip';
-  import tableRegistry from './table_registry.vue';
-  import { errorMessages, errorMessagesTypes } from '../constants';
-  import { __ } from '../../locale';
+import { mapActions } from 'vuex';
+import Flash from '../../flash';
+import clipboardButton from '../../vue_shared/components/clipboard_button.vue';
+import tooltip from '../../vue_shared/directives/tooltip';
+import tableRegistry from './table_registry.vue';
+import { errorMessages, errorMessagesTypes } from '../constants';
+import { __ } from '../../locale';
 
-  export default {
+export default {
   name: 'CollapsibeContainerRegisty',
   components: {
     clipboardButton,
@@ -28,18 +28,15 @@
     };
   },
   methods: {
-      ...mapActions([
-        'fetchRepos',
-        'fetchList',
-        'deleteRepo',
-      ]),
+    ...mapActions(['fetchRepos', 'fetchList', 'deleteRepo']),
 
     toggleRepo() {
       this.isOpen = !this.isOpen;
 
       if (this.isOpen) {
-          this.fetchList({ repo: this.repo })
-          .catch(() => this.showError(errorMessagesTypes.FETCH_REGISTRY));
+        this.fetchList({ repo: this.repo }).catch(() =>
+          this.showError(errorMessagesTypes.FETCH_REGISTRY),
+        );
       }
     },
 
@@ -56,7 +53,7 @@
       Flash(errorMessages[message]);
     },
   },
-  };
+};
 </script>
 
 <template>

app/assets/javascripts/registry/components/table_registry.vue

 <script>
-  import { mapActions } from 'vuex';
-  import { n__ } from '../../locale';
-  import Flash from '../../flash';
-  import clipboardButton from '../../vue_shared/components/clipboard_button.vue';
-  import tablePagination from '../../vue_shared/components/table_pagination.vue';
-  import tooltip from '../../vue_shared/directives/tooltip';
-  import timeagoMixin from '../../vue_shared/mixins/timeago';
-  import { errorMessages, errorMessagesTypes } from '../constants';
-  import { numberToHumanSize } from '../../lib/utils/number_utils';
+import { mapActions } from 'vuex';
+import { n__ } from '../../locale';
+import Flash from '../../flash';
+import clipboardButton from '../../vue_shared/components/clipboard_button.vue';
+import tablePagination from '../../vue_shared/components/table_pagination.vue';
+import tooltip from '../../vue_shared/directives/tooltip';
+import timeagoMixin from '../../vue_shared/mixins/timeago';
+import { errorMessages, errorMessagesTypes } from '../constants';
+import { numberToHumanSize } from '../../lib/utils/number_utils';
 
-  export default {
+export default {
   components: {
     clipboardButton,
     tablePagination,
@@ -17,9 +17,7 @@
   directives: {
     tooltip,
   },
-    mixins: [
-      timeagoMixin,
-    ],
+  mixins: [timeagoMixin],
   props: {
     repo: {
       type: Object,
@@ -32,10 +30,7 @@
     },
   },
   methods: {
-      ...mapActions([
-        'fetchList',
-        'deleteRegistry',
-      ]),
+    ...mapActions(['fetchList', 'deleteRegistry']),
 
     layers(item) {
       return item.layers ? n__('%d layer', '%d layers', item.layers) : '';
@@ -52,15 +47,16 @@
     },
 
     onPageChange(pageNumber) {
-        this.fetchList({ repo: this.repo, page: pageNumber })
-          .catch(() => this.showError(errorMessagesTypes.FETCH_REGISTRY));
+      this.fetchList({ repo: this.repo, page: pageNumber }).catch(() =>
+        this.showError(errorMessagesTypes.FETCH_REGISTRY),
+      );
     },
 
     showError(message) {
       Flash(errorMessages[message]);
     },
   },
-  };
+};
 </script>
 <template>
   <div>

app/assets/javascripts/registry/index.js

@@ -4,7 +4,8 @@ import Translate from '../vue_shared/translate';
 
 Vue.use(Translate);
 
-export default () => new Vue({
+export default () =>
+  new Vue({
     el: '#js-vue-registry-images',
     components: {
       registryApp,
@@ -22,4 +23,4 @@ export default () => new Vue({
         },
       });
     },
-});
+  });

app/assets/javascripts/registry/stores/mutations.js

@@ -2,7 +2,6 @@ import * as types from './mutation_types';
 import { parseIntPagination, normalizeHeaders } from '../../lib/utils/common_utils';
 
 export default {
-
   [types.SET_MAIN_ENDPOINT](state, endpoint) {
     Object.assign(state, { endpoint });
   },

app/assets/javascripts/reports/components/grouped_test_reports_app.vue

 <script>
-  import { mapActions, mapGetters, mapState } from 'vuex';
-  import { s__ } from '~/locale';
-  import { componentNames } from './issue_body';
-  import ReportSection from './report_section.vue';
-  import SummaryRow from './summary_row.vue';
-  import IssuesList from './issues_list.vue';
-  import Modal from './modal.vue';
-  import createStore from '../store';
-  import { summaryTextBuilder, reportTextBuilder, statusIcon } from '../store/utils';
+import { mapActions, mapGetters, mapState } from 'vuex';
+import { s__ } from '~/locale';
+import { componentNames } from './issue_body';
+import ReportSection from './report_section.vue';
+import SummaryRow from './summary_row.vue';
+import IssuesList from './issues_list.vue';
+import Modal from './modal.vue';
+import createStore from '../store';
+import { summaryTextBuilder, reportTextBuilder, statusIcon } from '../store/utils';
 
-  export default {
+export default {
   name: 'GroupedTestReportsApp',
   store: createStore(),
   components: {
@@ -26,19 +26,12 @@
   },
   componentNames,
   computed: {
-      ...mapState([
-        'reports',
-        'isLoading',
-        'hasError',
-        'summary',
-      ]),
+    ...mapState(['reports', 'isLoading', 'hasError', 'summary']),
     ...mapState({
       modalTitle: state => state.modal.title || '',
       modalData: state => state.modal.data || {},
     }),
-      ...mapGetters([
-        'summaryStatus',
-      ]),
+    ...mapGetters(['summaryStatus']),
     groupedSummaryText() {
       if (this.isLoading) {
         return s__('Reports|Test summary results are being parsed');
@@ -73,7 +66,7 @@
       );
     },
   },
-  };
+};
 </script>
 <template>
   <report-section

app/assets/javascripts/reports/components/issue_status_icon.vue

 <script>
 import Icon from '~/vue_shared/components/icon.vue';
-import {
-  STATUS_FAILED,
-  STATUS_NEUTRAL,
-  STATUS_SUCCESS,
-} from '../constants';
+import { STATUS_FAILED, STATUS_NEUTRAL, STATUS_SUCCESS } from '../constants';
 
 export default {
   name: 'IssueStatusIcon',

app/assets/javascripts/reports/components/issues_list.vue

 <script>
 import IssuesBlock from '~/reports/components/report_issues.vue';
-import {
-  STATUS_SUCCESS,
-  STATUS_FAILED,
-  STATUS_NEUTRAL,
-} from '~/reports/constants';
+import { STATUS_SUCCESS, STATUS_FAILED, STATUS_NEUTRAL } from '~/reports/constants';
 
 /**
  * Renders block of issues

app/assets/javascripts/reports/components/modal.vue

 <script>
-  import Modal from '~/vue_shared/components/gl_modal.vue';
-  import LoadingButton from '~/vue_shared/components/loading_button.vue';
-  import CodeBlock from '~/vue_shared/components/code_block.vue';
-  import { fieldTypes } from '../constants';
+import Modal from '~/vue_shared/components/gl_modal.vue';
+import LoadingButton from '~/vue_shared/components/loading_button.vue';
+import CodeBlock from '~/vue_shared/components/code_block.vue';
+import { fieldTypes } from '../constants';
 
-  export default {
+export default {
   components: {
     Modal,
     LoadingButton,
@@ -21,7 +21,7 @@
     },
   },
   fieldTypes,
-  };
+};
 </script>
 <template>
   <modal

app/assets/javascripts/reports/components/test_issue_body.vue

 <script>
-  import { mapActions } from 'vuex';
+import { mapActions } from 'vuex';
 
-  export default {
+export default {
   name: 'TestIssueBody',
   props: {
     issue: {
@@ -22,7 +22,7 @@
   methods: {
     ...mapActions(['openModal']),
   },
-  };
+};
 </script>
 <template>
   <div class="report-block-list-issue-description prepend-top-5 append-bottom-5">

app/assets/javascripts/reports/store/actions.js

@@ -43,8 +43,10 @@ export const fetchReports = ({ state, dispatch }) => {
     },
     data: state.endpoint,
     method: 'getReports',
-    successCallback: ({ data, status }) => dispatch('receiveReportsSuccess', {
-      data, status,
+    successCallback: ({ data, status }) =>
+      dispatch('receiveReportsSuccess', {
+        data,
+        status,
       }),
     errorCallback: () => dispatch('receiveReportsError'),
   });

app/assets/javascripts/reports/store/index.js

@@ -7,9 +7,10 @@ import state from './state';
 
 Vue.use(Vuex);
 
-export default () => new Vuex.Store({
+export default () =>
+  new Vuex.Store({
     actions,
     mutations,
     getters,
     state: state(),
-});
+  });

app/assets/javascripts/reports/store/mutation_types.js

@@ -4,4 +4,3 @@ export const REQUEST_REPORTS = 'REQUEST_REPORTS';
 export const RECEIVE_REPORTS_SUCCESS = 'RECEIVE_REPORTS_SUCCESS';
 export const RECEIVE_REPORTS_ERROR = 'RECEIVE_REPORTS_ERROR';
 export const SET_ISSUE_MODAL_DATA = 'SET_ISSUE_MODAL_DATA';
-

app/assets/javascripts/reports/store/mutations.js

@@ -19,7 +19,6 @@ export default {
 
     state.status = response.status;
     state.reports = response.suites;
-
   },
   [types.RECEIVE_REPORTS_ERROR](state) {
     state.isLoading = false;
@@ -36,7 +35,7 @@ export default {
   [types.SET_ISSUE_MODAL_DATA](state, payload) {
     state.modal.title = payload.issue.name;
 
-    Object.keys(payload.issue).forEach((key) => {
+    Object.keys(payload.issue).forEach(key => {
       if (Object.prototype.hasOwnProperty.call(state.modal.data, key)) {
         state.modal.data[key] = {
           ...state.modal.data[key],

app/assets/javascripts/reports/store/state.js

@@ -57,5 +57,4 @@ export default () => ({
       },
     },
   },
-
 });