Prettify performance_bar notes and profile modules

app/assets/javascripts/notes/components/note_awards_list.vue

@@ -95,29 +95,20 @@ export default {
       return awardList.filter(award => award.user.id === this.getUserData.id).length;
     },
     awardTitle(awardsList) {
-      const hasReactionByCurrentUser = this.hasReactionByCurrentUser(
-        awardsList,
-      );
+      const hasReactionByCurrentUser = this.hasReactionByCurrentUser(awardsList);
       const TOOLTIP_NAME_COUNT = hasReactionByCurrentUser ? 9 : 10;
       let awardList = awardsList;
 
       // Filter myself from list if I am awarded.
       if (hasReactionByCurrentUser) {
-        awardList = awardList.filter(
-          award => award.user.id !== this.getUserData.id,
-        );
+        awardList = awardList.filter(award => award.user.id !== this.getUserData.id);
       }
 
       // Get only 9-10 usernames to show in tooltip text.
-      const namesToShow = awardList
-        .slice(0, TOOLTIP_NAME_COUNT)
-        .map(award => award.user.name);
+      const namesToShow = awardList.slice(0, TOOLTIP_NAME_COUNT).map(award => award.user.name);
 
       // Get the remaining list to use in `and x more` text.
-      const remainingAwardList = awardList.slice(
-        TOOLTIP_NAME_COUNT,
-        awardList.length,
-      );
+      const remainingAwardList = awardList.slice(TOOLTIP_NAME_COUNT, awardList.length);
 
       // Add myself to the begining of the list so title will start with You.
       if (hasReactionByCurrentUser) {
@@ -128,9 +119,7 @@ export default {
 
       // We have 10+ awarded user, join them with comma and add `and x more`.
       if (remainingAwardList.length) {
-        title = `${namesToShow.join(', ')}, and ${
-          remainingAwardList.length
-        } more.`;
+        title = `${namesToShow.join(', ')}, and ${remainingAwardList.length} more.`;
       } else if (namesToShow.length > 1) {
         // Join all names with comma but not the last one, it will be added with and text.
         title = namesToShow.slice(0, namesToShow.length - 1).join(', ');
@@ -170,9 +159,7 @@ export default {
         awardName: parsedName,
       };
 
-      this.toggleAwardRequest(data).catch(() =>
-        Flash('Something went wrong on our end.'),
-      );
+      this.toggleAwardRequest(data).catch(() => Flash('Something went wrong on our end.'));
     },
   },
 };

app/assets/javascripts/notes/stores/collapse_utils.js

@@ -68,10 +68,7 @@ export const collapseSystemNotes = notes => {
         lastDescriptionSystemNote = note;
         lastDescriptionSystemNoteIndex = acc.length;
       } else if (lastDescriptionSystemNote) {
-        const timeDifferenceMinutes = getTimeDifferenceMinutes(
-          lastDescriptionSystemNote,
-          note,
-        );
+        const timeDifferenceMinutes = getTimeDifferenceMinutes(lastDescriptionSystemNote, note);
 
         // are they less than 10 minutes appart?
         if (timeDifferenceMinutes > 10) {

app/assets/javascripts/notes/stores/index.js

@@ -4,5 +4,4 @@ import notesModule from './modules';
 
 Vue.use(Vuex);
 
-export default () =>
-  new Vuex.Store(notesModule());
+export default () => new Vuex.Store(notesModule());

app/assets/javascripts/performance_bar/components/simple_metric.vue

 <script>
-  export default {
+export default {
   props: {
     currentRequest: {
       type: Object,
@@ -23,7 +23,7 @@
       );
     },
   },
-  };
+};
 </script>
 <template>
   <div

app/assets/javascripts/performance_bar/index.js

@@ -9,8 +9,7 @@ export default ({ container }) =>
       performanceBarApp: () => import('./components/performance_bar_app.vue'),
     },
     data() {
-      const performanceBarData = document.querySelector(this.$options.el)
-        .dataset;
+      const performanceBarData = document.querySelector(this.$options.el).dataset;
       const store = new PerformanceBarStore();
 
       return {

app/assets/javascripts/performance_bar/services/performance_bar_service.js

@@ -11,8 +11,10 @@ export default class PerformanceBarService {
 
   static registerInterceptor(peekUrl, callback) {
     const interceptor = response => {
-      const [fireCallback, requestId, requestUrl] =
-        PerformanceBarService.callbackParams(response, peekUrl);
+      const [fireCallback, requestId, requestUrl] = PerformanceBarService.callbackParams(
+        response,
+        peekUrl,
+      );
 
       if (fireCallback) {
         callback(requestId, requestUrl);
@@ -30,10 +32,7 @@ export default class PerformanceBarService {
 
   static removeInterceptor(interceptor) {
     axios.interceptors.response.eject(interceptor);
-    Vue.http.interceptors = _.without(
-      Vue.http.interceptors,
-      vueResourceInterceptor,
-    );
+    Vue.http.interceptors = _.without(Vue.http.interceptors, vueResourceInterceptor);
   }
 
   static callbackParams(response, peekUrl) {

app/assets/javascripts/performance_bar/stores/performance_bar_store.js

@@ -32,8 +32,6 @@ export default class PerformanceBarStore {
   }
 
   canTrackRequest(requestUrl) {
-    return (
-      this.requests.filter(request => request.url === requestUrl).length < 2
-    );
+    return this.requests.filter(request => request.url === requestUrl).length < 2;
   }
 }

app/assets/javascripts/profile/account/components/delete_account_modal.vue

 <script>
-  import DeprecatedModal from '~/vue_shared/components/deprecated_modal.vue';
-  import { __, s__, sprintf } from '~/locale';
-  import csrf from '~/lib/utils/csrf';
+import DeprecatedModal from '~/vue_shared/components/deprecated_modal.vue';
+import { __, s__, sprintf } from '~/locale';
+import csrf from '~/lib/utils/csrf';
 
-  export default {
+export default {
   components: {
     DeprecatedModal,
   },
@@ -72,7 +72,7 @@ Once you confirm %{deleteAccount}, it cannot be undone or recovered.`),
       this.$refs.form.submit();
     },
   },
-  };
+};
 </script>
 
 <template>

app/assets/javascripts/profile/gl_crop.js

@@ -4,20 +4,35 @@ import $ from 'jquery';
 import 'cropper';
 import _ from 'underscore';
 
-((global) => {
+(global => {
   // Matches everything but the file name
   const FILENAMEREGEX = /^.*[\\\/]/;
 
   class GitLabCrop {
-    constructor(input, { filename, previewImage, modalCrop, pickImageEl, uploadImageBtn, modalCropImg,
-        exportWidth = 200, exportHeight = 200, cropBoxWidth = 200, cropBoxHeight = 200 } = {}) {
+    constructor(
+      input,
+      {
+        filename,
+        previewImage,
+        modalCrop,
+        pickImageEl,
+        uploadImageBtn,
+        modalCropImg,
+        exportWidth = 200,
+        exportHeight = 200,
+        cropBoxWidth = 200,
+        cropBoxHeight = 200,
+      } = {},
+    ) {
       this.onUploadImageBtnClick = this.onUploadImageBtnClick.bind(this);
       this.onModalHide = this.onModalHide.bind(this);
       this.onModalShow = this.onModalShow.bind(this);
       this.onPickImageClick = this.onPickImageClick.bind(this);
       this.fileInput = $(input);
       this.modalCropImg = _.isString(this.modalCropImg) ? $(this.modalCropImg) : this.modalCropImg;
-      this.fileInput.attr('name', `${this.fileInput.attr('name')}-trigger`).attr('id', `${this.fileInput.attr('id')}-trigger`);
+      this.fileInput
+        .attr('name', `${this.fileInput.attr('name')}-trigger`)
+        .attr('id', `${this.fileInput.attr('id')}-trigger`);
       this.exportWidth = exportWidth;
       this.exportHeight = exportHeight;
       this.cropBoxWidth = cropBoxWidth;
@@ -59,7 +74,7 @@ import _ from 'underscore';
         btn = this;
         return _this.onActionBtnClick(btn);
       });
-      return this.croppedImageBlob = null;
+      return (this.croppedImageBlob = null);
     }
 
     onPickImageClick() {
@@ -94,9 +109,9 @@ import _ from 'underscore';
             width: cropBoxWidth,
             height: cropBoxHeight,
             left: (container.width - cropBoxWidth) / 2,
-            top: (container.height - cropBoxHeight) / 2
+            top: (container.height - cropBoxHeight) / 2,
           });
-        }
+        },
       });
     }
 
@@ -116,7 +131,7 @@ import _ from 'underscore';
       var data, result;
       data = $(btn).data();
       if (this.modalCropImg.data('cropper') && data.method) {
-        return result = this.modalCropImg.cropper(data.method, data.option);
+        return (result = this.modalCropImg.cropper(data.method, data.option));
       }
     }
 
@@ -127,7 +142,7 @@ import _ from 'underscore';
     readFile(input) {
       var _this, reader;
       _this = this;
-      reader = new FileReader;
+      reader = new FileReader();
       reader.onload = () => {
         _this.modalCropImg.attr('src', reader.result);
         return _this.modalCrop.modal('show');
@@ -145,7 +160,7 @@ import _ from 'underscore';
         array.push(binary.charCodeAt(i));
       }
       return new Blob([new Uint8Array(array)], {
-        type: 'image/png'
+        type: 'image/png',
       });
     }
 
@@ -157,11 +172,13 @@ import _ from 'underscore';
     }
 
     setBlob() {
-      this.dataURL = this.modalCropImg.cropper('getCroppedCanvas', {
+      this.dataURL = this.modalCropImg
+        .cropper('getCroppedCanvas', {
           width: 200,
-        height: 200
-      }).toDataURL('image/png');
-      return this.croppedImageBlob = this.dataURLtoBlob(this.dataURL);
+          height: 200,
+        })
+        .toDataURL('image/png');
+      return (this.croppedImageBlob = this.dataURLtoBlob(this.dataURL));
     }
 
     getBlob() {

app/assets/javascripts/profile/profile.js

@@ -26,11 +26,7 @@ export default class Profile {
   }
 
   bindEvents() {
-    $('.js-preferences-form').on(
-      'change.preference',
-      'input[type=radio]',
-      this.submitForm,
-    );
+    $('.js-preferences-form').on('change.preference', 'input[type=radio]', this.submitForm);
     $('#user_notification_email').on('change', this.submitForm);
     $('#user_notified_of_own_activity').on('change', this.submitForm);
     this.form.on('submit', this.onSubmitForm);