diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2019-12-04 12:06:33 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2019-12-04 12:06:33 +0300 |
commit | c4038d4bdff93b260cbdcd69f9a6c0b07a849457 (patch) | |
tree | 7b74ce5a60a97324dec5c61ac477ca74e3db36e9 /app/assets | |
parent | d07169c8ae0ebad0f23d03f01aeaf9acfa7e02d1 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets')
3 files changed, 57 insertions, 44 deletions
diff --git a/app/assets/javascripts/error_tracking/components/error_details.vue b/app/assets/javascripts/error_tracking/components/error_details.vue index 2000377530b..21f487f09f7 100644 --- a/app/assets/javascripts/error_tracking/components/error_details.vue +++ b/app/assets/javascripts/error_tracking/components/error_details.vue @@ -1,8 +1,9 @@ <script> import { mapActions, mapGetters, mapState } from 'vuex'; import dateFormat from 'dateformat'; -import { __, sprintf } from '~/locale'; -import { GlButton, GlLink, GlLoadingIcon } from '@gitlab/ui'; +import { GlFormInput, GlLink, GlLoadingIcon } from '@gitlab/ui'; +import { __, sprintf, n__ } from '~/locale'; +import LoadingButton from '~/vue_shared/components/loading_button.vue'; import Icon from '~/vue_shared/components/icon.vue'; import TooltipOnTruncate from '~/vue_shared/components/tooltip_on_truncate.vue'; import Stacktrace from './stacktrace.vue'; @@ -12,7 +13,8 @@ import { trackClickErrorLinkToSentryOptions } from '../utils'; export default { components: { - GlButton, + LoadingButton, + GlFormInput, GlLink, GlLoadingIcon, TooltipOnTruncate, @@ -32,10 +34,19 @@ export default { type: String, required: true, }, - issueProjectPath: { + projectIssuesPath: { type: String, required: true, }, + csrfToken: { + type: String, + required: true, + }, + }, + data() { + return { + issueCreationInProgress: false, + }; }, computed: { ...mapState('details', ['error', 'loading', 'loadingStacktrace', 'stacktraceData']), @@ -62,33 +73,26 @@ export default { showStacktrace() { return Boolean(!this.loadingStacktrace && this.stacktrace && this.stacktrace.length); }, - errorTitle() { - return `${this.error.title}`; - }, - errorUrl() { - return sprintf(__('Sentry event: %{external_url}'), { - external_url: this.error.external_url, - }); - }, - errorFirstSeen() { - return sprintf(__('First seen: %{first_seen}'), { first_seen: this.error.first_seen }); - }, - errorLastSeen() { - return sprintf(__('Last seen: %{last_seen}'), { last_seen: this.error.last_seen }); - }, - errorCount() { - return sprintf(__('Events: %{count}'), { count: this.error.count }); - }, - errorUserCount() { - return sprintf(__('Users: %{user_count}'), { user_count: this.error.user_count }); - }, - issueLink() { - return `${this.issueProjectPath}?issue[title]=${encodeURIComponent( - this.errorTitle, - )}&issue[description]=${encodeURIComponent(this.issueDescription)}`; + issueTitle() { + return this.error.title; }, issueDescription() { - return `${this.errorUrl}${this.errorFirstSeen}${this.errorLastSeen}${this.errorCount}${this.errorUserCount}`; + return sprintf( + __( + '%{description}- Sentry event: %{errorUrl}- First seen: %{firstSeen}- Last seen: %{lastSeen} %{countLabel}: %{count}%{userCountLabel}: %{userCount}', + ), + { + description: '# Error Details:\n', + errorUrl: `${this.error.external_url}\n`, + firstSeen: `\n${this.error.first_seen}\n`, + lastSeen: `${this.error.last_seen}\n`, + countLabel: n__('- Event', '- Events', this.error.count), + count: `${this.error.count}\n`, + userCountLabel: n__('- User', '- Users', this.error.user_count), + userCount: `${this.error.user_count}\n`, + }, + false, + ); }, }, mounted() { @@ -98,6 +102,10 @@ export default { methods: { ...mapActions('details', ['startPollingDetails', 'startPollingStacktrace']), trackClickErrorLinkToSentryOptions, + createIssue() { + this.issueCreationInProgress = true; + this.$refs.sentryIssueForm.submit(); + }, formatDate(date) { return `${this.timeFormated(date)} (${dateFormat(date, 'UTC:yyyy-mm-dd h:MM:ssTT Z')})`; }, @@ -114,9 +122,17 @@ export default { <div v-else-if="showDetails" class="error-details"> <div class="top-area align-items-center justify-content-between py-3"> <span v-if="!loadingStacktrace && stacktrace" v-html="reported"></span> - <gl-button variant="success" :href="issueLink"> - {{ __('Create issue') }} - </gl-button> + <form ref="sentryIssueForm" :action="projectIssuesPath" method="POST"> + <gl-form-input class="hidden" name="issue[title]" :value="issueTitle" /> + <input name="issue[description]" :value="issueDescription" type="hidden" /> + <gl-form-input :value="csrfToken" class="hidden" name="authenticity_token" /> + <loading-button + class="btn-success" + :label="__('Create issue')" + :loading="issueCreationInProgress" + @click="createIssue" + /> + </form> </div> <div> <tooltip-on-truncate :title="error.title" truncate-target="child" placement="top"> diff --git a/app/assets/javascripts/error_tracking/details.js b/app/assets/javascripts/error_tracking/details.js index 435315842bd..872cb8868a2 100644 --- a/app/assets/javascripts/error_tracking/details.js +++ b/app/assets/javascripts/error_tracking/details.js @@ -1,6 +1,7 @@ import Vue from 'vue'; import store from './store'; import ErrorDetails from './components/error_details.vue'; +import csrf from '~/lib/utils/csrf'; export default () => { // eslint-disable-next-line no-new @@ -12,13 +13,14 @@ export default () => { store, render(createElement) { const domEl = document.querySelector(this.$options.el); - const { issueDetailsPath, issueStackTracePath, issueProjectPath } = domEl.dataset; + const { issueDetailsPath, issueStackTracePath, projectIssuesPath } = domEl.dataset; return createElement('error-details', { props: { issueDetailsPath, issueStackTracePath, - issueProjectPath, + projectIssuesPath, + csrfToken: csrf.token, }, }); }, diff --git a/app/assets/javascripts/monitoring/components/dashboard.vue b/app/assets/javascripts/monitoring/components/dashboard.vue index c08b471bd51..9e376a52702 100644 --- a/app/assets/javascripts/monitoring/components/dashboard.vue +++ b/app/assets/javascripts/monitoring/components/dashboard.vue @@ -252,23 +252,18 @@ export default { 'setEndpoints', 'setPanelGroupMetrics', ]), - updateMetrics(key, panels) { + updatePanels(key, panels) { this.setPanelGroupMetrics({ panels, key, }); }, - removeMetric(key, metrics, graphIndex) { + removePanel(key, panels, graphIndex) { this.setPanelGroupMetrics({ - metrics: metrics.filter((v, i) => i !== graphIndex), + panels: panels.filter((v, i) => i !== graphIndex), key, }); }, - removeGraph(metrics, graphIndex) { - // At present graphs will not be removed, they should removed using the vuex store - // See https://gitlab.com/gitlab-org/gitlab/issues/27835 - metrics.splice(graphIndex, 1); - }, showInvalidDateError() { createFlash(s__('Metrics|Link contains an invalid time window.')); }, @@ -463,7 +458,7 @@ export default { group="metrics-dashboard" :component-data="{ attrs: { class: 'row mx-0 w-100' } }" :disabled="!isRearrangingPanels" - @input="updateMetrics(groupData.key, $event)" + @input="updatePanels(groupData.key, $event)" > <div v-for="(graphData, graphIndex) in groupData.panels" @@ -475,7 +470,7 @@ export default { <div v-if="isRearrangingPanels" class="draggable-remove js-draggable-remove p-2 w-100 position-absolute d-flex justify-content-end" - @click="removeGraph(groupData.panels, graphIndex)" + @click="removePanel(groupData.key, groupData.panels, graphIndex)" > <a class="mx-2 p-2 draggable-remove-link" :aria-label="__('Remove')" ><icon name="close" |