diff options
Diffstat (limited to 'app/assets/javascripts/error_tracking')
5 files changed, 82 insertions, 23 deletions
diff --git a/app/assets/javascripts/error_tracking/components/constants.js b/app/assets/javascripts/error_tracking/components/constants.js deleted file mode 100644 index 41b952e26d8..00000000000 --- a/app/assets/javascripts/error_tracking/components/constants.js +++ /dev/null @@ -1,21 +0,0 @@ -export const severityLevel = { - FATAL: 'fatal', - ERROR: 'error', - WARNING: 'warning', - INFO: 'info', - DEBUG: 'debug', -}; - -export const severityLevelVariant = { - [severityLevel.FATAL]: 'danger', - [severityLevel.ERROR]: 'neutral', - [severityLevel.WARNING]: 'warning', - [severityLevel.INFO]: 'info', - [severityLevel.DEBUG]: 'muted', -}; - -export const errorStatus = { - IGNORED: 'ignored', - RESOLVED: 'resolved', - UNRESOLVED: 'unresolved', -}; diff --git a/app/assets/javascripts/error_tracking/components/error_details.vue b/app/assets/javascripts/error_tracking/components/error_details.vue index e00fec6fddf..0a8abdc90c6 100644 --- a/app/assets/javascripts/error_tracking/components/error_details.vue +++ b/app/assets/javascripts/error_tracking/components/error_details.vue @@ -26,7 +26,7 @@ import { trackErrorStatusUpdateOptions, } from '../utils'; -import { severityLevel, severityLevelVariant, errorStatus } from './constants'; +import { severityLevel, severityLevelVariant, errorStatus } from '../constants'; import Stacktrace from './stacktrace.vue'; const SENTRY_TIMEOUT = 10000; diff --git a/app/assets/javascripts/error_tracking/components/error_tracking_list.vue b/app/assets/javascripts/error_tracking/components/error_tracking_list.vue index 5db8c8cf8d3..3d540d46b3c 100644 --- a/app/assets/javascripts/error_tracking/components/error_tracking_list.vue +++ b/app/assets/javascripts/error_tracking/components/error_tracking_list.vue @@ -1,5 +1,6 @@ <script> import { + GlAlert, GlEmptyState, GlButton, GlIcon, @@ -10,6 +11,7 @@ import { GlDropdown, GlDropdownItem, GlDropdownDivider, + GlSprintf, GlTooltipDirective, GlPagination, } from '@gitlab/ui'; @@ -21,6 +23,7 @@ import { __ } from '~/locale'; import Tracking from '~/tracking'; import TimeAgo from '~/vue_shared/components/time_ago_tooltip.vue'; import { trackErrorListViewsOptions, trackErrorStatusUpdateOptions } from '../utils'; +import { I18N_ERROR_TRACKING_LIST } from '../constants'; import ErrorTrackingActions from './error_tracking_actions.vue'; export const tableDataClass = 'table-col d-flex d-md-table-cell align-items-center'; @@ -29,6 +32,7 @@ export default { FIRST_PAGE: 1, PREV_PAGE: 1, NEXT_PAGE: 2, + i18n: I18N_ERROR_TRACKING_LIST, fields: [ { key: 'error', @@ -71,6 +75,7 @@ export default { frequency: __('Frequency'), }, components: { + GlAlert, GlEmptyState, GlButton, GlDropdown, @@ -81,6 +86,7 @@ export default { GlLoadingIcon, GlTable, GlFormInput, + GlSprintf, GlPagination, TimeAgo, ErrorTrackingActions, @@ -117,12 +123,17 @@ export default { type: String, required: true, }, + showIntegratedTrackingDisabledAlert: { + type: Boolean, + required: false, + }, }, hasLocalStorage: AccessorUtils.canUseLocalStorage(), data() { return { errorSearchQuery: '', pageValue: this.$options.FIRST_PAGE, + isAlertDismissed: false, }; }, computed: { @@ -142,6 +153,9 @@ export default { errorTrackingHelpUrl() { return helpPagePath('operations/error_tracking'); }, + showIntegratedDisabledAlert() { + return !this.isAlertDismissed && this.showIntegratedTrackingDisabledAlert; + }, }, watch: { pagination() { @@ -150,6 +164,8 @@ export default { } }, }, + epicLink: 'https://gitlab.com/gitlab-org/gitlab/-/issues/353639', + featureFlagLink: helpPagePath('operations/error_tracking'), created() { if (this.errorTrackingEnabled) { this.setEndpoint(this.indexPath); @@ -232,6 +248,34 @@ export default { <template> <div class="error-list"> <div v-if="errorTrackingEnabled"> + <gl-alert + v-if="showIntegratedDisabledAlert" + variant="danger" + data-testid="integrated-disabled-alert" + @dismiss="isAlertDismissed = true" + > + <gl-sprintf :message="this.$options.i18n.integratedErrorTrackingDisabledText"> + <template #epicLink="{ content }"> + <gl-link :href="$options.epicLink" target="_blank">{{ content }}</gl-link> + </template> + <template #flagLink="{ content }"> + <gl-link :href="$options.featureFlagLink" target="_blank">{{ content }}</gl-link> + </template> + <template #settingsLink="{ content }"> + <gl-link :href="enableErrorTrackingLink" target="_blank">{{ content }}</gl-link> + </template> + </gl-sprintf> + <div> + <gl-button + category="primary" + variant="confirm" + :href="enableErrorTrackingLink" + class="gl-mr-auto gl-mt-3" + > + {{ $options.i18n.viewProjectSettingsButton }} + </gl-button> + </div> + </gl-alert> <div class="row flex-column flex-md-row align-items-md-center m-0 mt-sm-2 p-3 p-sm-3 bg-secondary border" > diff --git a/app/assets/javascripts/error_tracking/constants.js b/app/assets/javascripts/error_tracking/constants.js new file mode 100644 index 00000000000..f01bac2e81d --- /dev/null +++ b/app/assets/javascripts/error_tracking/constants.js @@ -0,0 +1,30 @@ +import { s__ } from '~/locale'; + +export const severityLevel = { + FATAL: 'fatal', + ERROR: 'error', + WARNING: 'warning', + INFO: 'info', + DEBUG: 'debug', +}; + +export const severityLevelVariant = { + [severityLevel.FATAL]: 'danger', + [severityLevel.ERROR]: 'neutral', + [severityLevel.WARNING]: 'warning', + [severityLevel.INFO]: 'info', + [severityLevel.DEBUG]: 'muted', +}; + +export const errorStatus = { + IGNORED: 'ignored', + RESOLVED: 'resolved', + UNRESOLVED: 'unresolved', +}; + +export const I18N_ERROR_TRACKING_LIST = { + integratedErrorTrackingDisabledText: s__( + 'ErrorTracking|Integrated error tracking is %{epicLinkStart}turned off by default%{epicLinkEnd} and no longer active for this project. To re-enable error tracking on self-hosted instances, you can either %{flagLinkStart}turn on the feature flag%{flagLinkEnd} for integrated error tracking, or provide a %{settingsLinkStart}Sentry API URL and Auth Token%{settingsLinkEnd} on your project settings page. However, error tracking is not ready for production use and cannot be enabled on GitLab.com.', + ), + viewProjectSettingsButton: s__('ErrorTracking|View project settings'), +}; diff --git a/app/assets/javascripts/error_tracking/list.js b/app/assets/javascripts/error_tracking/list.js index 9c729407009..8b2086e1522 100644 --- a/app/assets/javascripts/error_tracking/list.js +++ b/app/assets/javascripts/error_tracking/list.js @@ -14,10 +14,15 @@ export default () => { projectPath, listPath, } = domEl.dataset; - let { errorTrackingEnabled, userCanEnableErrorTracking } = domEl.dataset; + let { + errorTrackingEnabled, + userCanEnableErrorTracking, + showIntegratedTrackingDisabledAlert, + } = domEl.dataset; errorTrackingEnabled = parseBoolean(errorTrackingEnabled); userCanEnableErrorTracking = parseBoolean(userCanEnableErrorTracking); + showIntegratedTrackingDisabledAlert = parseBoolean(showIntegratedTrackingDisabledAlert); // eslint-disable-next-line no-new new Vue({ @@ -36,6 +41,7 @@ export default () => { userCanEnableErrorTracking, projectPath, listPath, + showIntegratedTrackingDisabledAlert, }, }); }, |