Home Explore Help
Register Sign In
wjinan
/
ck-ops
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Branch: master
Branches Tags
ck-ops
/
code
/
grafana
/
public
/
build
/
AlertingAdmin.d65d1ef6fffd70fb824f.js

AlertingAdmin.d65d1ef6fffd70fb824f.js 11 KB
Permalink History Raw

123456789101112131415161718192021222324252627282930313233 
  1. "use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[7680],{12595:(e,a,n)=>{n.r(a),n.d(a,{default:()=>B});var r,t=n(68404),l=n(40256),s=n(36636),i=n(18745),o=n(69783),c=n(82498),d=n(1698),u=n(33899),g=n(83809),m=n(19462),h=n(8455),p=n(50489),x=n(45916);function f(){var e;const a=(0,i.useDispatch)(),n=(0,d.k)("notification"),[l,s]=(0,c.k)(n),[f,j]=(0,t.useState)(!1),{loading:b}=(0,u._)((e=>e.deleteAMConfig)),{loading:y}=(0,u._)((e=>e.saveAMConfig)),A=!!l&&(0,m.RY)(l),C=(0,o.useStyles2)(v),S=(0,u._)((e=>e.amConfigs)),{result:N,loading:k,error:$}=l&&S[l]||h.oq;(0,t.useEffect)((()=>{l&&a((0,g.Yh)(l))}),[l,a]);const w=()=>{l&&a((0,g.Nc)(l)),j(!1)},I=(0,t.useMemo)((()=>({configJSON:N?JSON.stringify(N,null,2):""})),[N]),O=b||k||y;return(0,x.jsxs)("div",{className:C.container,children:[(0,x.jsx)(p.P,{current:l,onChange:s,dataSources:n}),$&&!O&&(0,x.jsx)(o.Alert,{severity:"error",title:"Error loading Alertmanager configuration",children:$.message||"Unknown error."}),b&&l!==m.GC&&(r||(r=(0,x.jsx)(o.Alert,{severity:"info",title:"Resetting Alertmanager configuration",children:"It might take a while..."}))),l&&N&&(0,x.jsx)(o.Form,{defaultValues:I,onSubmit:e=>{l&&N&&a((0,g.mM)({newConfig:JSON.parse(e.configJSON),oldConfig:N,alertManagerSourceName:l,successMessage:"Alertmanager configuration updated.",refetch:!0}))},children:a=>{var n;let{register:r,errors:t}=a;return(0,x.jsxs)(x.Fragment,{children:[!A&&(0,x.jsx)(o.Field,{disabled:O,label:"Configuration",invalid:!!t.configJSON,error:null===(n=t.configJSON)||void 0===n?void 0:n.message,children:(0,x.jsx)(o.TextArea,Object.assign({},r("configJSON",{required:{value:!0,message:"Required."},validate:e=>{try{return JSON.parse(e),!0}catch(e){return e.message}}}),{id:"configuration",rows:25}))}),A&&(0,x.jsx)(o.Field,{label:"Configuration",children:(0,x.jsx)("pre",{"data-testid":"readonly-config",children:I.configJSON})}),!A&&(0,x.jsxs)(o.HorizontalGroup,{children:[e||(e=(0,x.jsx)(o.Button,{type:"submit",variant:"primary",disabled:O,children:"Save"})),(0,x.jsx)(o.Button,{type:"button",disabled:O,variant:"destructive",onClick:()=>j(!0),children:"Reset configuration"})]}),!!f&&(0,x.jsx)(o.ConfirmModal,{isOpen:!0,title:"Reset Alertmanager configuration",body:`Are you sure you want to reset configuration ${l===m.GC?"for the Grafana Alertmanager":`for "${l}"`}? Contact points and notification policies will be reset to their defaults.`,confirmText:"Yes, reset configuration",onConfirm:w,onDismiss:()=>j(!1)})]})}},I.configJSON)]})}const v=e=>({container:s.css`
    2. 

  2.     margin-bottom: ${e.spacing(4)};
    3. 

  3.   `});var j=n(28436);const b=/\/api\/v[1|2]\/alerts/i;var y,A;const C=e=>{let{alertmanagers:a,onChangeAlertmanagerConfig:n,onClose:r}=e;const l=(0,o.useStyles2)(S),s=(0,t.useMemo)((()=>({alertmanagers:a})),[a]),i=(0,x.jsxs)("div",{className:l.modalTitle,children:[(0,x.jsx)(o.Icon,{name:"bell",className:l.modalIcon}),y||(y=(0,x.jsx)("h3",{children:"Add Alertmanager"}))]}),c=e=>{n(e.alertmanagers.map((e=>e.url.replace(/\/$/,"").replace(/\/api\/v[1|2]\/alerts/i,"")))),r()};return(0,x.jsxs)(o.Modal,{title:i,isOpen:!0,onDismiss:r,className:l.modal,children:[(0,x.jsx)("div",{className:l.description,children:"We use a service discovery method to find existing Alertmanagers for a given URL."}),(0,x.jsx)(o.Form,{onSubmit:c,defaultValues:s,children:e=>{let{register:a,control:n,errors:r}=e;return(0,x.jsxs)("div",{children:[(0,x.jsx)(o.FieldArray,{control:n,name:"alertmanagers",children:e=>{let{fields:n,append:t,remove:s}=e;return(0,x.jsxs)("div",{className:l.fieldArray,children:[(0,x.jsx)("div",{className:l.bold,children:"Source url"}),(0,x.jsx)("div",{className:l.muted,children:"Authentication can be done via URL (e.g. user:password@myalertmanager.com) and only the Alertmanager v2 API is supported. The suffix is added internally, there is no need to specify it."}),n.map(((e,n)=>{var t;return(0,x.jsx)(o.Field,{invalid:!(null==r||null===(t=r.alertmanagers)||void 0===t||!t[n]),error:"Field is required",children:(0,x.jsx)(o.Input,Object.assign({className:l.input,defaultValue:e.url},a(`alertmanagers.${n}.url`,{required:!0}),{placeholder:"http://localhost:9093",addonAfter:(0,x.jsx)(o.Button,{"aria-label":"Remove alertmanager",type:"button",onClick:()=>s(n),variant:"destructive",className:l.destroyInputRow,children:A||(A=(0,x.jsx)(o.Icon,{name:"trash-alt"}))})}))},`${e.id}-${n}`)})),(0,x.jsx)(o.Button,{type:"button",variant:"secondary",onClick:()=>t({url:""}),children:"Add URL"})]})}}),(0,x.jsx)("div",{children:(0,x.jsx)(o.Button,{type:"submit",onSubmit:()=>c,children:"Add Alertmanagers"})})]})}})]})};const S=e=>{const a=s.css`
    4. 

  4.     color: ${e.colors.text.secondary};
    5. 

  5.   `;return{description:(0,s.cx)(s.css`
    6. 

  6.         margin-bottom: ${e.spacing(2)};
    7. 

  7.       `,a),muted:a,bold:s.css`
    8. 

  8.       font-weight: ${e.typography.fontWeightBold};
    9. 

  9.     `,modal:s.css``,modalIcon:(0,s.cx)(a,s.css`
    10. 

  10.         margin-right: ${e.spacing(1)};
    11. 

  11.       `),modalTitle:s.css`
    12. 

  12.       display: flex;
    13. 

  13.     `,input:s.css`
    14. 

  14.       margin-bottom: ${e.spacing(1)};
    15. 

  15.       margin-right: ${e.spacing(1)};
    16. 

  16.     `,inputRow:s.css`
    17. 

  17.       display: flex;
    18. 

  18.     `,destroyInputRow:s.css`
    19. 

  19.       padding: ${e.spacing(1)};
    20. 

  20.     `,fieldArray:s.css`
    21. 

  21.       margin-bottom: ${e.spacing(4)};
    22. 

  22.     `}};var N,k,$,w,I,O;const R=[{value:"internal",label:"Only Internal"},{value:"external",label:"Only External"},{value:"all",label:"Both internal and external"}],M=()=>{var e;const a=(0,o.useStyles2)(J),n=(0,i.useDispatch)(),[r,l]=(0,t.useState)({open:!1,payload:[{url:""}]}),[c,d]=(0,t.useState)({open:!1,index:0}),u=function(){const e=(0,i.useSelector)((e=>{var a;return null===(a=e.unifiedAlerting.externalAlertmanagers.discoveredAlertmanagers.result)||void 0===a?void 0:a.data})),a=(0,i.useSelector)((e=>{var a;return null===(a=e.unifiedAlerting.externalAlertmanagers.alertmanagerConfig.result)||void 0===a?void 0:a.alertmanagers}));if(!e||!a)return[];const n=[],r=e.droppedAlertManagers.map((e=>({url:e.url.replace(b,""),status:"dropped",actualUrl:e.url})));for(const r of a)if(0===e.activeAlertManagers.length)n.push({url:r,status:"pending",actualUrl:""});else{const a=e.activeAlertManagers.find((e=>e.url===`${r}/api/v2/alerts`));a?n.push({url:a.url.replace(b,""),status:"active",actualUrl:a.url}):n.push({url:r,status:"pending",actualUrl:""})}return[...n,...r]}(),m=(0,i.useSelector)((e=>{var a;return null===(a=e.unifiedAlerting.externalAlertmanagers.alertmanagerConfig.result)||void 0===a?void 0:a.alertmanagersChoice})),h=(0,o.useTheme2)();(0,t.useEffect)((()=>{n((0,g.zy)()),n((0,g.wE)());const e=setInterval((()=>n((0,g.zy)())),5e3);return()=>{clearInterval(e)}}),[n]);const p=(0,t.useCallback)((e=>{const a=(null!=u?u:[]).filter(((a,n)=>n!==e)).map((e=>e.url));n((0,g.sx)({alertmanagers:a,alertmanagersChoice:null!=m?m:"all"})),d({open:!1,index:0})}),[u,n,m]),f=(0,t.useCallback)((()=>{const e=u?[...u]:[{url:""}];l((a=>Object.assign({},a,{open:!0,payload:e})))}),[l,u]),v=(0,t.useCallback)((()=>{l((e=>{const a=u?[...u,{url:""}]:[{url:""}];return Object.assign({},e,{open:!0,payload:a})}))}),[u]),y=(0,t.useCallback)((()=>{l((e=>Object.assign({},e,{open:!1})))}),[l]),A=e=>{switch(e){case"active":return h.colors.success.main;case"pending":return h.colors.warning.main;default:return h.colors.error.main}},S=0===(null==u?void 0:u.length);return(0,x.jsxs)("div",{children:[N||(N=(0,x.jsx)("h4",{children:"External Alertmanagers"})),(0,x.jsx)("div",{className:a.muted,children:"You can have your Grafana managed alerts be delivered to one or many external Alertmanager(s) in addition to the internal Alertmanager by specifying their URLs below."}),(0,x.jsx)("div",{className:a.actions,children:!S&&(0,x.jsx)(o.Button,{type:"button",onClick:v,children:"Add Alertmanager"})}),S?(0,x.jsx)(j.Z,{title:"You have not added any external alertmanagers",onClick:v,buttonTitle:"Add Alertmanager",buttonIcon:"bell-slash"}):(0,x.jsxs)(x.Fragment,{children:[(0,x.jsxs)("table",{className:(0,s.cx)("filter-table form-inline filter-table--hover",a.table),children:[(0,x.jsx)("thead",{children:(0,x.jsxs)("tr",{children:[k||(k=(0,x.jsx)("th",{children:"Url"})),$||($=(0,x.jsx)("th",{children:"Status"})),(0,x.jsx)("th",{style:{width:"2%"},children:"Action"})]})}),(0,x.jsx)("tbody",{children:null==u?void 0:u.map(((n,r)=>(0,x.jsxs)("tr",{children:[(0,x.jsxs)("td",{children:[(0,x.jsx)("span",{className:a.url,children:n.url}),n.actualUrl?(0,x.jsx)(o.Tooltip,{content:`Discovered ${n.actualUrl} from ${n.url}`,theme:"info",children:w||(w=(0,x.jsx)(o.Icon,{name:"info-circle"}))}):null]}),(0,x.jsx)("td",{children:(0,x.jsx)(o.Icon,{name:"heart",style:{color:A(n.status)},title:n.status})}),(0,x.jsx)("td",{children:(0,x.jsxs)(o.HorizontalGroup,{children:[e||(e=(0,x.jsx)(o.Button,{variant:"secondary",type:"button",onClick:f,"aria-label":"Edit alertmanager",children:I||(I=(0,x.jsx)(o.Icon,{name:"pen"}))})),(0,x.jsx)(o.Button,{variant:"destructive","aria-label":"Remove alertmanager",type:"button",onClick:()=>d({open:!0,index:r}),children:O||(O=(0,x.jsx)(o.Icon,{name:"trash-alt"}))})]})})]},r)))})]}),(0,x.jsx)("div",{children:(0,x.jsx)(o.Field,{label:"Send alerts to",description:"Sets which Alertmanager will handle your alerts. Internal (Grafana built in Alertmanager), External (All Alertmanagers configured above), or both.",children:(0,x.jsx)(o.RadioButtonGroup,{options:R,value:m,onChange:e=>(e=>{n((0,g.sx)({alertmanagers:u.map((e=>e.url)),alertmanagersChoice:e}))})(e)})})})]}),(0,x.jsx)(o.ConfirmModal,{isOpen:c.open,title:"Remove Alertmanager",body:"Are you sure you want to remove this Alertmanager",confirmText:"Remove",onConfirm:()=>p(c.index),onDismiss:()=>d({open:!1,index:0})}),r.open&&(0,x.jsx)(C,{onClose:y,alertmanagers:r.payload,onChangeAlertmanagerConfig:e=>{n((0,g.sx)({alertmanagers:e,alertmanagersChoice:null!=m?m:"all"}))}})]})},J=e=>({url:s.css`
    23. 

  23.     margin-right: ${e.spacing(1)};
    24. 

  24.   `,muted:s.css`
    25. 

  25.     color: ${e.colors.text.secondary};
    26. 

  26.   `,actions:s.css`
    27. 

  27.     margin-top: ${e.spacing(2)};
    28. 

  28.     display: flex;
    29. 

  29.     justify-content: flex-end;
    30. 

  30.   `,table:s.css`
    31. 

  31.     margin-bottom: ${e.spacing(2)};
    32. 

  32.   `});var U;function B(){return U||(U=(0,x.jsxs)(l.J,{pageId:"alerting-admin",children:[(0,x.jsx)(f,{"test-id":"admin-alertmanagerconfig"}),(0,x.jsx)(M,{"test-id":"admin-externalalertmanagers"})]}))}},40256:(e,a,n)=>{n.d(a,{J:()=>i});n(68404);var r=n(18745),t=n(33801),l=n(8674),s=n(45916);const i=e=>{let{children:a,pageId:n,isLoading:i}=e;const o=(0,l.h)((0,r.useSelector)((e=>e.navIndex)),n);return(0,s.jsx)(t.Z,{navModel:o,children:(0,s.jsx)(t.Z.Contents,{isLoading:i,children:a})})}},82498:(e,a,n)=>{n.d(a,{k:()=>o});var r=n(68404),t=n(26011),l=n(17421),s=n(85464),i=n(19462);function o(e){const[a,n]=(0,t.K)(),o=function(e){return(0,r.useCallback)((a=>e.map((e=>e.name)).includes(a)),[e])}(e),c=(0,r.useCallback)((e=>{o(e)&&(e===i.GC?(l.Z.delete(s.de),n({[s.c4]:null})):(l.Z.set(s.de,e),n({[s.c4]:e})))}),[n,o]),d=a[s.c4];if(d&&"string"==typeof d)return o(d)?[d,c]:[void 0,c];const u=l.Z.get(s.de);return u&&"string"==typeof u&&o(u)?(c(u),[u,c]):o(i.GC)?[i.GC,c]:[void 0,c]}},1698:(e,a,n)=>{n.d(a,{k:()=>l});var r=n(68404),t=n(19462);function l(e){return(0,r.useMemo)((()=>(0,t.LE)(e)),[e])}}}]);
    33. 

  33. //# sourceMappingURL=AlertingAdmin.d65d1ef6fffd70fb824f.js.map
    34.