1#@!#!123s

: / usr / share / grafana / public / build /
Filename : 8050.a94036c62fbececc42e5.js
back
"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[8050],{8050:(ce,N,n)=>{n.r(N),n.d(N,{default:()=>re});var o=n(42844),t=n(27702),$=n(66310),A=n(63439),B=n(52419),D=n(37647),m=n(86954),M=n(89949),k=n(6772),K=n.n(k),S=n(73195),b=n(66670),W=n(64714),h=n(86004),T=n(10759),j=n(218),z=n(67045),w=n(54915);function P(e){return e.path?.length===0}function F(e){const r=new Map;function c(s,i=[]){r.set(s.id,{...s,path:i}),s.routes?.forEach(a=>c(a,[...i,s.id]))}return c(e,[]),r}function I(e){return e.object_matchers?.length===0}function H({route:e}){const r=(0,$.wW)(O);return P(e)?t.createElement("div",{className:r.defaultPolicy},"Default policy"):I(e)?t.createElement("div",{className:r.textMuted},"No matchers"):t.createElement(w.g,{matchers:e.object_matchers??[]})}const O=e=>({defaultPolicy:(0,o.css)`
    padding: ${e.spacing(.5)};
    background: ${e.colors.background.secondary};
    width: fit-content;
  `,textMuted:(0,o.css)`
    color: ${e.colors.text.secondary};
  `});var G=n(13741),U=n(73453),Y=n(2082),Z=n(39036),J=n(89439);function Q({route:e,routesByIdMap:r}){const c=(0,$.wW)(R),s=e.path?.slice(1)??[],i=[...(0,M.compact)(s.map(a=>r.get(a))),e];return t.createElement("div",{className:c.policyPathWrapper},t.createElement("div",{className:c.defaultPolicy},"Default policy"),i.map((a,l)=>t.createElement("div",{key:a.id},t.createElement("div",{className:c.policyInPath(l,l===i.length-1)},I(a)?t.createElement("div",{className:c.textMuted},"No matchers"):t.createElement(w.g,{matchers:a.object_matchers??[]})))))}function X({onClose:e,route:r,receiver:c,routesByIdMap:s,alertManagerSourceName:i}){const a=(0,$.wW)(R),l=P(r),d=(0,Y.Ko)(i);return t.createElement(G.u,{className:a.detailsModal,isOpen:!0,title:"Routing details",onDismiss:e,onClickBackdrop:e},t.createElement(m.K,{gap:0,direction:"column"},t.createElement("div",{className:(0,o.cx)(a.textMuted,a.marginBottom(2))},"Your alert instances are routed as follows."),t.createElement("div",null,"Notification policy path"),l&&t.createElement("div",{className:a.textMuted},"Default policy"),t.createElement("div",{className:a.separator(1)}),!l&&t.createElement(t.Fragment,null,t.createElement(Q,{route:r,routesByIdMap:s})),t.createElement("div",{className:a.separator(4)}),t.createElement("div",{className:a.contactPoint},t.createElement(m.K,{gap:1,direction:"row",alignItems:"center"},"Contact point:",t.createElement("span",{className:a.textMuted},c.name)),t.createElement(J.q,{actions:[d.update]},t.createElement(m.K,{gap:1,direction:"row",alignItems:"center"},t.createElement("a",{href:(0,Z.eQ)(`/alerting/notifications/receivers/${encodeURIComponent(c.name)}/edit`,i),className:a.link,target:"_blank",rel:"noreferrer"},"See details ",t.createElement(U.J,{name:"external-link-alt"}))))),t.createElement("div",{className:a.button},t.createElement(b.zx,{variant:"primary",type:"button",onClick:e},"Close"))))}const R=e=>({textMuted:(0,o.css)`
    color: ${e.colors.text.secondary};
  `,link:(0,o.css)`
    display: block;
    color: ${e.colors.text.link};
  `,button:(0,o.css)`
    justify-content: flex-end;
    display: flex;
  `,detailsModal:(0,o.css)`
    max-width: 560px;
  `,defaultPolicy:(0,o.css)`
    padding: ${e.spacing(.5)};
    background: ${e.colors.background.secondary};
    width: fit-content;
  `,contactPoint:(0,o.css)`
    display: flex;
    flex-direction: row;
    gap: ${e.spacing(1)};
    align-items: center;
    justify-content: space-between;
    margin-bottom: ${e.spacing(1)};
  `,policyPathWrapper:(0,o.css)`
    display: flex;
    flex-direction: column;
    margin-top: ${e.spacing(1)};
  `,separator:r=>(0,o.css)`
    margin-top: ${e.spacing(r)};
  `,marginBottom:r=>(0,o.css)`
    margin-bottom: ${e.spacing(e.spacing(r))};
  `,policyInPath:(r=0,c=!1)=>(0,o.css)`
    margin-left: ${30+r*30}px;
    padding: ${e.spacing(1)};
    margin-top: ${e.spacing(1)};
    border: solid 1px ${e.colors.border.weak};
    background: ${e.colors.background.secondary};
    width: fit-content;
    position: relative;

    ${c&&(0,o.css)`
        border: solid 1px ${e.colors.info.border};
      `},
    &:before {
      content: '';
      position: absolute;
      height: calc(100% - 10px);
      width: ${e.spacing(1)};
      border-left: solid 1px ${e.colors.border.weak};
      border-bottom: solid 1px ${e.colors.border.weak};
      margin-top: ${e.spacing(-2)};
      margin-left: -17px;
    }
  }  `});function V({route:e,receiver:r,routesByIdMap:c,instancesCount:s,alertManagerSourceName:i,expandRoute:a,onExpandRouteClick:l}){const d=(0,$.wW)(C),[v,E]=(0,t.useState)(!1),u=()=>{E(!0)};return t.createElement("div",{className:d.routeHeader},t.createElement(T.U,{isCollapsed:!a,onToggle:y=>l(!y),"aria-label":"Expand policy route"}),t.createElement(m.K,{flexGrow:1,gap:1},t.createElement("div",{onClick:()=>l(!a),className:d.expandable},t.createElement(m.K,{gap:1,direction:"row",alignItems:"center"},"Notification policy",t.createElement(H,{route:e}))),t.createElement(z.L,null),t.createElement(m.K,{gap:2,direction:"row",alignItems:"center"},t.createElement(j.g,{icon:"layers-alt","data-testid":"matching-instances"},s??"-",t.createElement("span",null,K()("instance",s))),t.createElement(m.K,{gap:1,direction:"row",alignItems:"center"},t.createElement("div",null,t.createElement("span",{className:d.textMuted},"@ Delivered to")," ",r.name),t.createElement("div",{className:d.verticalBar}),t.createElement(b.zx,{type:"button",onClick:u,variant:"secondary",fill:"outline",size:"sm"},"See details")))),v&&t.createElement(X,{onClose:()=>E(!1),route:e,receiver:r,routesByIdMap:c,alertManagerSourceName:i}))}function q({route:e,instanceMatches:r,receiver:c,routesByIdMap:s,alertManagerSourceName:i}){const a=(0,$.wW)(C),[l,d]=(0,S.Z)(!1),v=9;return t.createElement("div",{"data-testid":"matching-policy-route"},t.createElement(V,{route:e,receiver:c,routesByIdMap:s,instancesCount:r.length,alertManagerSourceName:i,expandRoute:l,onExpandRouteClick:d}),l&&t.createElement(m.K,{gap:1,direction:"column"},t.createElement("div",{className:a.routeInstances,"data-testid":"route-matching-instance"},r.map(E=>{const u=Array.from(E.labelsMatch);let y=u.map(([g,f])=>({label:`${g[0]}=${g[1]}`,match:f.match,colorIndex:f.match?(0,W.tu)(g[0]):v}));const p=y.filter(g=>g.match),x=y.filter(g=>!g.match);return t.createElement("div",{className:a.tagListCard,key:(0,M.uniqueId)()},u.length>0?t.createElement(t.Fragment,null,p.length>0?t.createElement(h.P,{tags:p.map(g=>g.label),className:a.labelList,getColorIndex:(g,f)=>p[f].colorIndex}):t.createElement("div",{className:(0,o.cx)(a.textMuted,a.textItalic)},"No matching labels"),t.createElement("div",{className:a.labelSeparator}),t.createElement(h.P,{tags:x.map(g=>g.label),className:a.labelList,getColorIndex:(g,f)=>x[f].colorIndex})):t.createElement("div",{className:a.textMuted},"No labels"))}))))}const C=e=>({textMuted:(0,o.css)`
    color: ${e.colors.text.secondary};
  `,textItalic:(0,o.css)`
    font-style: italic;
  `,expandable:(0,o.css)`
    cursor: pointer;
  `,routeHeader:(0,o.css)`
    display: flex;
    flex-direction: row;
    gap: ${e.spacing(1)};
    align-items: center;
    border-bottom: 1px solid ${e.colors.border.weak};
    &:hover {
      background-color: ${e.components.table.rowHoverBackground};
    }
    padding: ${e.spacing(.5,.5,.5,0)};
  `,labelList:(0,o.css)`
    flex: 0 1 auto;
    justify-content: flex-start;
  `,labelSeparator:(0,o.css)`
    width: 1px;
    background-color: ${e.colors.border.weak};
  `,tagListCard:(0,o.css)`
    display: flex;
    flex-direction: row;
    gap: ${e.spacing(2)};

    position: relative;
    background: ${e.colors.background.secondary};
    padding: ${e.spacing(1)};

    border-radius: ${e.shape.borderRadius(2)};
    border: solid 1px ${e.colors.border.weak};
  `,routeInstances:(0,o.css)`
    padding: ${e.spacing(1,0,1,4)};
    position: relative;

    display: flex;
    flex-direction: column;
    gap: ${e.spacing(1)};

    &:before {
      content: '';
      position: absolute;
      left: ${e.spacing(2)};
      height: calc(100% - ${e.spacing(2)});
      width: ${e.spacing(4)};
      border-left: solid 1px ${e.colors.border.weak};
    }
  `,verticalBar:(0,o.css)`
    width: 1px;
    height: 20px;
    background-color: ${e.colors.secondary.main};
    margin-left: ${e.spacing(1)};
    margin-right: ${e.spacing(1)};
  `});var _=n(25111),ee=n(97529),te=n(36546),ae=n(26630),L=n(95984);const ne=(e,r)=>{const{currentData:c,isLoading:s,error:i}=(0,ee.W)(e),a=c?.alertmanager_config,{matchInstancesToRoute:l}=(0,te.N)(),{rootRoute:d,receivers:v}=(0,t.useMemo)(()=>a?{rootRoute:a.route?(0,L.w2)((0,ae.br)(a.route)):void 0,receivers:a.receivers??[]}:{receivers:[],rootRoute:void 0},[a]),E=d?F((0,L.tK)(d)):new Map,u=v.reduce((g,f)=>g.set(f.name,f),new Map)??new Map,{value:y=new Map,loading:p,error:x}=(0,_.Z)(async()=>{if(d)return await l(d,r)},[d,r]);return{routesByIdMap:E,receiversByName:u,matchingMap:y,loading:s||p,error:i??x}};function oe({alertManagerSource:e,potentialInstances:r,onlyOneAM:c}){const s=(0,$.wW)(se),{routesByIdMap:i,receiversByName:a,matchingMap:l,loading:d,error:v}=ne(e.name,r);return v?t.createElement(A.b,{title:"Cannot load Alertmanager configuration",severity:"error"},v.message):d?t.createElement(B.u,{text:"Loading routing preview..."}):l.size>0?t.createElement("div",{className:s.alertManagerRow},!c&&t.createElement(m.K,{direction:"row",alignItems:"center"},t.createElement("div",{className:s.firstAlertManagerLine}),t.createElement("div",{className:s.alertManagerName}," ","Alert manager:",t.createElement("img",{src:e.img,alt:"",className:s.img}),e.name),t.createElement("div",{className:s.secondAlertManagerLine})),t.createElement(m.K,{gap:1,direction:"column"},Array.from(l.entries()).map(([u,y])=>{const p=i.get(u),x=p?.receiver&&a.get(p.receiver);if(!p)return null;if(!x)throw new Error("Receiver not found");return t.createElement(q,{instanceMatches:y,route:p,receiver:x,key:u,routesByIdMap:i,alertManagerSourceName:e.name})}))):null}const re=(0,D.Pf)(oe),se=e=>({alertManagerRow:(0,o.css)`
    margin-top: ${e.spacing(2)};
    display: flex;
    flex-direction: column;
    gap: ${e.spacing(1)};
    width: 100%;
  `,firstAlertManagerLine:(0,o.css)`
    height: 1px;
    width: ${e.spacing(4)};
    background-color: ${e.colors.secondary.main};
  `,alertManagerName:(0,o.css)`
    width: fit-content;
  `,secondAlertManagerLine:(0,o.css)`
    height: 1px;
    width: 100%;
    flex: 1;
    background-color: ${e.colors.secondary.main};
  `,img:(0,o.css)`
    margin-left: ${e.spacing(2)};
    width: ${e.spacing(3)};
    height: ${e.spacing(3)};
    margin-right: ${e.spacing(1)};
  `})}}]);

//# sourceMappingURL=8050.a94036c62fbececc42e5.js.map