diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-11-13 21:06:45 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-11-13 21:06:45 +0000 |
commit | b42f312df5aee0f1b832b69171e9d1cf92eb7416 (patch) | |
tree | cf0f4e59d45688723d3d534ddf13564fa10d3050 /app/assets/javascripts/error_tracking_settings | |
parent | 57e3d49fc0fb99f42ac178761fc6232715734020 (diff) | |
download | gitlab-ce-b42f312df5aee0f1b832b69171e9d1cf92eb7416.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/error_tracking_settings')
5 files changed, 20 insertions, 6 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, |