diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-09-20 16:18:24 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-09-20 16:18:24 +0300 |
commit | 0653e08efd039a5905f3fa4f6e9cef9f5d2f799c (patch) | |
tree | 4dcc884cf6d81db44adae4aa99f8ec1233a41f55 /app/assets/javascripts/error_tracking_settings | |
parent | 744144d28e3e7fddc117924fef88de5d9674fe4c (diff) |
Add latest changes from gitlab-org/gitlab@14-3-stable-eev14.3.0-rc42
Diffstat (limited to 'app/assets/javascripts/error_tracking_settings')
7 files changed, 95 insertions, 25 deletions
diff --git a/app/assets/javascripts/error_tracking_settings/components/app.vue b/app/assets/javascripts/error_tracking_settings/components/app.vue index d188574e721..e12d9cc2b07 100644 --- a/app/assets/javascripts/error_tracking_settings/components/app.vue +++ b/app/assets/javascripts/error_tracking_settings/components/app.vue @@ -1,5 +1,5 @@ <script> -import { GlButton, GlFormGroup, GlFormCheckbox } from '@gitlab/ui'; +import { GlButton, GlFormGroup, GlFormCheckbox, GlFormRadioGroup, GlFormRadio } from '@gitlab/ui'; import { mapActions, mapGetters, mapState } from 'vuex'; import ErrorTrackingForm from './error_tracking_form.vue'; import ProjectDropdown from './project_dropdown.vue'; @@ -10,6 +10,8 @@ export default { GlButton, GlFormCheckbox, GlFormGroup, + GlFormRadioGroup, + GlFormRadio, ProjectDropdown, }, props: { @@ -22,6 +24,10 @@ export default { type: String, required: true, }, + initialIntegrated: { + type: String, + required: true, + }, initialProject: { type: String, required: false, @@ -49,12 +55,20 @@ export default { 'isProjectInvalid', 'projectSelectionLabel', ]), - ...mapState(['enabled', 'projects', 'selectedProject', 'settingsLoading', 'token']), + ...mapState([ + 'enabled', + 'integrated', + 'projects', + 'selectedProject', + 'settingsLoading', + 'token', + ]), }, created() { this.setInitialState({ apiHost: this.initialApiHost, enabled: this.initialEnabled, + integrated: this.initialIntegrated, project: this.initialProject, token: this.initialToken, listProjectsEndpoint: this.listProjectsEndpoint, @@ -62,7 +76,13 @@ export default { }); }, methods: { - ...mapActions(['setInitialState', 'updateEnabled', 'updateSelectedProject', 'updateSettings']), + ...mapActions([ + 'setInitialState', + 'updateEnabled', + 'updateIntegrated', + 'updateSelectedProject', + 'updateSettings', + ]), handleSubmit() { this.updateSettings(); }, @@ -76,27 +96,44 @@ export default { :label="s__('ErrorTracking|Enable error tracking')" label-for="error-tracking-enabled" > - <gl-form-checkbox - id="error-tracking-enabled" - :checked="enabled" - @change="updateEnabled($event)" - > + <gl-form-checkbox id="error-tracking-enabled" :checked="enabled" @change="updateEnabled"> {{ s__('ErrorTracking|Active') }} </gl-form-checkbox> </gl-form-group> - <error-tracking-form /> - <div class="form-group"> - <project-dropdown - :has-projects="hasProjects" - :invalid-project-label="invalidProjectLabel" - :is-project-invalid="isProjectInvalid" - :dropdown-label="dropdownLabel" - :project-selection-label="projectSelectionLabel" - :projects="projects" - :selected-project="selectedProject" - :token="token" - @select-project="updateSelectedProject" - /> + <gl-form-group + :label="s__('ErrorTracking|Error tracking backend')" + data-testid="tracking-backend-settings" + > + <gl-form-radio-group name="explicit" :checked="integrated" @change="updateIntegrated"> + <gl-form-radio name="error-tracking-integrated" :value="false"> + {{ __('Sentry') }} + <template #help> + {{ __('Requires you to deploy or set up cloud-hosted Sentry.') }} + </template> + </gl-form-radio> + <gl-form-radio name="error-tracking-integrated" :value="true"> + {{ __('GitLab') }} + <template #help> + {{ __('Uses GitLab as a lightweight alternative to Sentry.') }} + </template> + </gl-form-radio> + </gl-form-radio-group> + </gl-form-group> + <div v-if="!integrated" class="js-sentry-setting-form" data-testid="sentry-setting-form"> + <error-tracking-form /> + <div class="form-group"> + <project-dropdown + :has-projects="hasProjects" + :invalid-project-label="invalidProjectLabel" + :is-project-invalid="isProjectInvalid" + :dropdown-label="dropdownLabel" + :project-selection-label="projectSelectionLabel" + :projects="projects" + :selected-project="selectedProject" + :token="token" + @select-project="updateSelectedProject" + /> + </div> </div> <gl-button :disabled="settingsLoading" diff --git a/app/assets/javascripts/error_tracking_settings/index.js b/app/assets/javascripts/error_tracking_settings/index.js index ce315963723..324b3292834 100644 --- a/app/assets/javascripts/error_tracking_settings/index.js +++ b/app/assets/javascripts/error_tracking_settings/index.js @@ -5,7 +5,15 @@ import createStore from './store'; export default () => { const formContainerEl = document.querySelector('.js-error-tracking-form'); const { - dataset: { apiHost, enabled, project, token, listProjectsEndpoint, operationsSettingsEndpoint }, + dataset: { + apiHost, + enabled, + integrated, + project, + token, + listProjectsEndpoint, + operationsSettingsEndpoint, + }, } = formContainerEl; return new Vue({ @@ -16,6 +24,7 @@ export default () => { props: { initialApiHost: apiHost, initialEnabled: enabled, + initialIntegrated: integrated, initialProject: project, initialToken: token, listProjectsEndpoint, diff --git a/app/assets/javascripts/error_tracking_settings/store/actions.js b/app/assets/javascripts/error_tracking_settings/store/actions.js index d402d0336d9..972ad58c617 100644 --- a/app/assets/javascripts/error_tracking_settings/store/actions.js +++ b/app/assets/javascripts/error_tracking_settings/store/actions.js @@ -79,6 +79,10 @@ export const updateEnabled = ({ commit }, enabled) => { commit(types.UPDATE_ENABLED, enabled); }; +export const updateIntegrated = ({ commit }, integrated) => { + commit(types.UPDATE_INTEGRATED, integrated); +}; + export const updateToken = ({ commit }, token) => { commit(types.UPDATE_TOKEN, token); commit(types.RESET_CONNECT); 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 bf3df383ddc..2cfa14c9b64 100644 --- a/app/assets/javascripts/error_tracking_settings/store/mutation_types.js +++ b/app/assets/javascripts/error_tracking_settings/store/mutation_types.js @@ -6,6 +6,7 @@ export const UPDATE_API_HOST = 'UPDATE_API_HOST'; export const UPDATE_CONNECT_ERROR = 'UPDATE_CONNECT_ERROR'; export const UPDATE_CONNECT_SUCCESS = 'UPDATE_CONNECT_SUCCESS'; export const UPDATE_ENABLED = 'UPDATE_ENABLED'; +export const UPDATE_INTEGRATED = 'UPDATE_INTEGRATED'; export const UPDATE_SELECTED_PROJECT = 'UPDATE_SELECTED_PROJECT'; export const UPDATE_SETTINGS_LOADING = 'UPDATE_SETTINGS_LOADING'; export const UPDATE_TOKEN = 'UPDATE_TOKEN'; diff --git a/app/assets/javascripts/error_tracking_settings/store/mutations.js b/app/assets/javascripts/error_tracking_settings/store/mutations.js index 2242169aa1e..a1b43ccaaee 100644 --- a/app/assets/javascripts/error_tracking_settings/store/mutations.js +++ b/app/assets/javascripts/error_tracking_settings/store/mutations.js @@ -20,9 +20,18 @@ export default { }, [types.SET_INITIAL_STATE]( state, - { apiHost, enabled, project, token, listProjectsEndpoint, operationsSettingsEndpoint }, + { + apiHost, + enabled, + integrated, + project, + token, + listProjectsEndpoint, + operationsSettingsEndpoint, + }, ) { state.enabled = parseBoolean(enabled); + state.integrated = parseBoolean(integrated); state.apiHost = apiHost; state.token = token; state.listProjectsEndpoint = listProjectsEndpoint; @@ -38,6 +47,9 @@ export default { [types.UPDATE_ENABLED](state, enabled) { state.enabled = enabled; }, + [types.UPDATE_INTEGRATED](state, integrated) { + state.integrated = integrated; + }, [types.UPDATE_TOKEN](state, token) { state.token = token; }, diff --git a/app/assets/javascripts/error_tracking_settings/store/state.js b/app/assets/javascripts/error_tracking_settings/store/state.js index ab616f11e83..ee5597abeb3 100644 --- a/app/assets/javascripts/error_tracking_settings/store/state.js +++ b/app/assets/javascripts/error_tracking_settings/store/state.js @@ -1,6 +1,7 @@ export default () => ({ apiHost: '', enabled: false, + integrated: false, token: '', projects: [], isLoadingProjects: false, diff --git a/app/assets/javascripts/error_tracking_settings/utils.js b/app/assets/javascripts/error_tracking_settings/utils.js index 5d18ac8e802..7ef5f7bbd34 100644 --- a/app/assets/javascripts/error_tracking_settings/utils.js +++ b/app/assets/javascripts/error_tracking_settings/utils.js @@ -1,6 +1,12 @@ export const projectKeys = ['name', 'organizationName', 'organizationSlug', 'slug']; -export const transformFrontendSettings = ({ apiHost, enabled, token, selectedProject }) => { +export const transformFrontendSettings = ({ + apiHost, + enabled, + integrated, + token, + selectedProject, +}) => { const project = selectedProject ? { slug: selectedProject.slug, @@ -10,7 +16,7 @@ export const transformFrontendSettings = ({ apiHost, enabled, token, selectedPro } : null; - return { api_host: apiHost || null, enabled, token: token || null, project }; + return { api_host: apiHost || null, enabled, integrated, token: token || null, project }; }; export const getDisplayName = (project) => `${project.organizationName} | ${project.slug}`; |