Add latest changes from gitlab-org/gitlab@master

6 files changed, 64 insertions, 62 deletions

diff --git a/app/assets/javascripts/error_tracking_settings/components/error_tracking_form.vue b/app/assets/javascripts/error_tracking_settings/components/error_tracking_form.vue
index 716acf2d676..d86116aa315 100644
--- a/app/assets/javascripts/error_tracking_settings/components/error_tracking_form.vue
+++ b/app/assets/javascripts/error_tracking_settings/components/error_tracking_form.vue
@@ -1,12 +1,13 @@
 <script>
 import { mapActions, mapState } from 'vuex';
-import { GlButton, GlFormInput } from '@gitlab/ui';
+import { GlFormInput } from '@gitlab/ui';
 import Icon from '~/vue_shared/components/icon.vue';
+import LoadingButton from '~/vue_shared/components/loading_button.vue';
 
 export default {
-  components: { GlButton, GlFormInput, Icon },
+  components: { GlFormInput, Icon, LoadingButton },
   computed: {
-    ...mapState(['apiHost', 'connectError', 'connectSuccessful', 'token']),
+    ...mapState(['apiHost', 'connectError', 'connectSuccessful', 'isLoadingProjects', 'token']),
     tokenInputState() {
       return this.connectError ? false : null;
     },
@@ -27,6 +28,7 @@ export default {
           <gl-form-input
             id="error-tracking-api-host"
             :value="apiHost"
+            :disabled="isLoadingProjects"
             placeholder="https://mysentryserver.com"
             @input="updateApiHost"
           />
@@ -47,13 +49,17 @@ export default {
             id="error-tracking-token"
             :value="token"
             :state="tokenInputState"
+            :disabled="isLoadingProjects"
             @input="updateToken"
           />
         </div>
         <div class="col-4 col-md-3 gl-pl-0">
-          <gl-button class="js-error-tracking-connect prepend-left-5" @click="fetchProjects">{{
-            __('Connect')
-          }}</gl-button>
+          <loading-button
+            class="js-error-tracking-connect prepend-left-5 d-inline-flex"
+            :label="isLoadingProjects ? __('Connecting') : __('Connect')"
+            :loading="isLoadingProjects"
+            @click="fetchProjects"
+          />
           <icon
             v-show="connectSuccessful"
             class="js-error-tracking-connect-success prepend-left-5 text-success align-middle"
diff --git a/app/assets/javascripts/error_tracking_settings/store/actions.js b/app/assets/javascripts/error_tracking_settings/store/actions.js
index 95105797807..6b540ea7dfd 100644
--- a/app/assets/javascripts/error_tracking_settings/store/actions.js
+++ b/app/assets/javascripts/error_tracking_settings/store/actions.js
@@ -6,17 +6,20 @@ import { transformFrontendSettings } from '../utils';
 import * as types from './mutation_types';
 
 export const requestProjects = ({ commit }) => {
+  commit(types.SET_PROJECTS_LOADING, true);
   commit(types.RESET_CONNECT);
 };
 
 export const receiveProjectsSuccess = ({ commit }, projects) => {
   commit(types.UPDATE_CONNECT_SUCCESS);
   commit(types.RECEIVE_PROJECTS, projects);
+  commit(types.SET_PROJECTS_LOADING, false);
 };
 
 export const receiveProjectsError = ({ commit }) => {
   commit(types.UPDATE_CONNECT_ERROR);
   commit(types.CLEAR_PROJECTS);
+  commit(types.SET_PROJECTS_LOADING, false);
 };
 
 export const fetchProjects = ({ dispatch, state }) => {
diff --git a/app/assets/javascripts/error_tracking_settings/store/mutation_types.js b/app/assets/javascripts/error_tracking_settings/store/mutation_types.js
index b4f8a237947..bf3df383ddc 100644
--- a/app/assets/javascripts/error_tracking_settings/store/mutation_types.js
+++ b/app/assets/javascripts/error_tracking_settings/store/mutation_types.js
@@ -9,3 +9,4 @@ export const UPDATE_ENABLED = 'UPDATE_ENABLED';
 export const UPDATE_SELECTED_PROJECT = 'UPDATE_SELECTED_PROJECT';
 export const UPDATE_SETTINGS_LOADING = 'UPDATE_SETTINGS_LOADING';
 export const UPDATE_TOKEN = 'UPDATE_TOKEN';
+export const SET_PROJECTS_LOADING = 'SET_PROJECTS_LOADING';
diff --git a/app/assets/javascripts/error_tracking_settings/store/mutations.js b/app/assets/javascripts/error_tracking_settings/store/mutations.js
index 4089d1ee94e..133f25264b9 100644
--- a/app/assets/javascripts/error_tracking_settings/store/mutations.js
+++ b/app/assets/javascripts/error_tracking_settings/store/mutations.js
@@ -58,4 +58,7 @@ export default {
     state.connectSuccessful = false;
     state.connectError = true;
   },
+  [types.SET_PROJECTS_LOADING](state, loading) {
+    state.isLoadingProjects = loading;
+  },
 };
diff --git a/app/assets/javascripts/error_tracking_settings/store/state.js b/app/assets/javascripts/error_tracking_settings/store/state.js
index 98219d33f4d..ab616f11e83 100644
--- a/app/assets/javascripts/error_tracking_settings/store/state.js
+++ b/app/assets/javascripts/error_tracking_settings/store/state.js
@@ -3,6 +3,7 @@ export default () => ({
   enabled: false,
   token: '',
   projects: [],
+  isLoadingProjects: false,
   selectedProject: null,
   settingsLoading: false,
   connectSuccessful: false,
diff --git a/app/assets/javascripts/notes.js b/app/assets/javascripts/notes.js
index 3715a91d599..defa278c089 100644
--- a/app/assets/javascripts/notes.js
+++ b/app/assets/javascripts/notes.js
@@ -1,8 +1,8 @@
-/* eslint-disable no-restricted-properties, func-names, no-var, camelcase,
+/* eslint-disable no-restricted-properties, no-var, camelcase,
 no-unused-expressions, one-var, default-case,
-consistent-return, no-alert, no-return-assign,
-no-param-reassign, no-else-return, vars-on-top,
-no-shadow, no-useless-escape, class-methods-use-this */
+consistent-return, no-alert, no-param-reassign, no-else-return,
+vars-on-top, no-shadow, no-useless-escape,
+class-methods-use-this */
 
 /* global ResolveService */
 
@@ -281,14 +281,7 @@ export default class Notes {
     if (Notes.interval) {
       clearInterval(Notes.interval);
     }
-    return (Notes.interval = setInterval(
-      (function(_this) {
-        return function() {
-          return _this.refresh();
-        };
-      })(this),
-      this.pollingInterval,
-    ));
+    Notes.interval = setInterval(() => this.refresh(), this.pollingInterval);
   }
 
   refresh() {
@@ -847,57 +840,52 @@ export default class Notes {
     var noteElId, $note;
     $note = $(e.currentTarget).closest('.note');
     noteElId = $note.attr('id');
-    $(`.note[id="${noteElId}"]`).each(
-      (function() {
-        // A same note appears in the "Discussion" and in the "Changes" tab, we have
-        // to remove all. Using $('.note[id='noteId']') ensure we get all the notes,
-        // where $('#noteId') would return only one.
-        return function(i, el) {
-          var $note, $notes;
-          $note = $(el);
-          $notes = $note.closest('.discussion-notes');
-          const discussionId = $('.notes', $notes).data('discussionId');
-
-          if (typeof gl.diffNotesCompileComponents !== 'undefined') {
-            if (gl.diffNoteApps[noteElId]) {
-              gl.diffNoteApps[noteElId].$destroy();
-            }
-          }
-
-          $note.remove();
+    $(`.note[id="${noteElId}"]`).each((i, el) => {
+      // A same note appears in the "Discussion" and in the "Changes" tab, we have
+      // to remove all. Using $('.note[id='noteId']') ensure we get all the notes,
+      // where $('#noteId') would return only one.
+      const $note = $(el);
+      const $notes = $note.closest('.discussion-notes');
+      const discussionId = $('.notes', $notes).data('discussionId');
+
+      if (typeof gl.diffNotesCompileComponents !== 'undefined') {
+        if (gl.diffNoteApps[noteElId]) {
+          gl.diffNoteApps[noteElId].$destroy();
+        }
+      }
 
-          // check if this is the last note for this line
-          if ($notes.find('.note').length === 0) {
-            var notesTr = $notes.closest('tr');
+      $note.remove();
 
-            // "Discussions" tab
-            $notes.closest('.timeline-entry').remove();
+      // check if this is the last note for this line
+      if ($notes.find('.note').length === 0) {
+        const notesTr = $notes.closest('tr');
 
-            $(`.js-diff-avatars-${discussionId}`).trigger('remove.vue');
+        // "Discussions" tab
+        $notes.closest('.timeline-entry').remove();
 
-            // The notes tr can contain multiple lists of notes, like on the parallel diff
-            // notesTr does not exist for image diffs
-            if (notesTr.find('.discussion-notes').length > 1 || notesTr.length === 0) {
-              const $diffFile = $notes.closest('.diff-file');
-              if ($diffFile.length > 0) {
-                const removeBadgeEvent = new CustomEvent('removeBadge.imageDiff', {
-                  detail: {
-                    // badgeNumber's start with 1 and index starts with 0
-                    badgeNumber: $notes.index() + 1,
-                  },
-                });
+        $(`.js-diff-avatars-${discussionId}`).trigger('remove.vue');
 
-                $diffFile[0].dispatchEvent(removeBadgeEvent);
-              }
+        // The notes tr can contain multiple lists of notes, like on the parallel diff
+        // notesTr does not exist for image diffs
+        if (notesTr.find('.discussion-notes').length > 1 || notesTr.length === 0) {
+          const $diffFile = $notes.closest('.diff-file');
+          if ($diffFile.length > 0) {
+            const removeBadgeEvent = new CustomEvent('removeBadge.imageDiff', {
+              detail: {
+                // badgeNumber's start with 1 and index starts with 0
+                badgeNumber: $notes.index() + 1,
+              },
+            });
 
-              $notes.remove();
-            } else if (notesTr.length > 0) {
-              notesTr.remove();
-            }
+            $diffFile[0].dispatchEvent(removeBadgeEvent);
           }
-        };
-      })(this),
-    );
+
+          $notes.remove();
+        } else if (notesTr.length > 0) {
+          notesTr.remove();
+        }
+      }
+    });
 
     Notes.checkMergeRequestStatus();
     return this.updateNotesCount(-1);