2020-07-10 15:09:07 +00:00
< script >
2020-08-19 12:10:17 +00:00
import { GlEmptyState , GlButton , GlLink } from '@gitlab/ui' ;
2020-07-15 06:09:35 +00:00
import { s _ _ } from '~/locale' ;
2020-08-19 12:10:17 +00:00
import alertsHelpUrlQuery from '../graphql/queries/alert_help_url.query.graphql' ;
2020-07-10 15:09:07 +00:00
export default {
2020-07-15 06:09:35 +00:00
i18n : {
emptyState : {
2021-01-06 12:10:58 +00:00
title : s _ _ ( 'AlertManagement|Surface alerts in GitLab' ) ,
info : s _ _ (
'AlertManagement|Display alerts from all your monitoring tools directly within GitLab. Streamline the investigation of your alerts and the escalation of alerts to incidents.' ,
) ,
buttonText : s _ _ ( 'AlertManagement|Authorize external service' ) ,
2020-07-15 06:09:35 +00:00
} ,
moreInformation : s _ _ ( 'AlertManagement|More information' ) ,
} ,
2020-07-10 15:09:07 +00:00
components : {
GlEmptyState ,
GlButton ,
2020-08-19 12:10:17 +00:00
GlLink ,
} ,
apollo : {
alertsHelpUrl : {
query : alertsHelpUrlQuery ,
} ,
2020-07-10 15:09:07 +00:00
} ,
2021-01-06 12:10:58 +00:00
inject : [ 'enableAlertManagementPath' , 'userCanEnableAlertManagement' , 'emptyAlertSvgPath' ] ,
2020-08-19 12:10:17 +00:00
data ( ) {
return {
alertsHelpUrl : '' ,
} ;
} ,
2020-07-10 15:09:07 +00:00
} ;
< / script >
< template >
< div >
2021-01-06 12:10:58 +00:00
< gl -empty -state :title ="$options.i18n.emptyState.title" :svg-path ="emptyAlertSvgPath" >
2020-07-10 15:09:07 +00:00
< template # description >
2020-07-15 06:09:35 +00:00
< div class = "gl-display-block" >
2021-01-06 12:10:58 +00:00
< span > { { $options . i18n . emptyState . info } } < / span >
< gl -link :href ="alertsHelpUrl" target = "_blank" >
2020-07-15 06:09:35 +00:00
{ { $options . i18n . moreInformation } }
2020-08-19 12:10:17 +00:00
< / g l - l i n k >
2020-07-10 15:09:07 +00:00
< / div >
2021-01-06 12:10:58 +00:00
< div v-if ="userCanEnableAlertManagement" class="gl-display-block center gl-pt-4" >
2021-03-17 15:09:03 +00:00
< gl -button category = "primary" variant = "confirm" :href ="enableAlertManagementPath" >
2021-01-06 12:10:58 +00:00
{ { $options . i18n . emptyState . buttonText } }
2020-07-10 15:09:07 +00:00
< / g l - b u t t o n >
< / div >
< / template >
< / g l - e m p t y - s t a t e >
< / div >
< / template >