1#@!#!123s

: / usr / share / grafana / public / build /
Filename : DashboardPage.47d249f8c940b079c4b5.js
back
"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[5296],{30670:(ue,k,o)=>{o.d(k,{E:()=>e,z:()=>m});const m=()=>({type:"query",query:{params:["A","5m","now"]},reducer:{type:"avg",params:[]},evaluator:{type:"gt",params:[null]},operator:{type:"and"}}),e=async(N,L,H,v)=>{if(L.length===0)return"Could not find any metric queries";if(N&&N.length)return"Transformations are not supported in alert queries";let w=0,T=0;for(const y of L){const K=y.datasource||v,C=await H.get(K);C.meta.alerting?C.targetContainsTemplate&&C.targetContainsTemplate(y)&&T++:w++}return w===L.length?"The datasource does not support alerting queries":T===L.length?"Template variables are not supported in alert queries":""}},12743:(ue,k,o)=>{o.r(k),o.d(k,{DashboardPage:()=>lt,UnthemedDashboardPage:()=>it,default:()=>ao,mapStateToProps:()=>un});var m=o(42844),e=o(27702),N=o(27173),L=o(38192),H=o(94469),v=o(74639),w=o(26129),T=o(34667),y=o(66310),K=o(33877),C=o(44644),O=o(73149),V=o(26473),B=o(73807),b=o(18771);function G(t){switch(t.kiosk){case"tv":return b.KioskMode.TV;case"1":case!0:return b.KioskMode.Full;default:return null}}var pe=o(86809),ct=o(284),ro=o(76810);function so(t){const n=t.match.params.slug??"",a=useAsync(()=>getGrafanaStorage().list("content/"+n),[n]),s=n.length>0?`g/${n}/`:"g/",r=dt(n),i=()=>a.value?a.value.fields[0].values.map(c=>{let u=c;const p=u.indexOf(".")<0,g=!p&&u.endsWith(".json"),h=`${s}${u}`;return React.createElement(Card,{key:u,href:p||g?h:void 0},React.createElement(Card.Heading,null,u),React.createElement(Card.Figure,null,React.createElement(Icon,{name:p?"folder":g?"gf-grid":"file-alt",size:"sm"})))}):a.loading?React.createElement(Spinner,null):React.createElement("div",null,"?"),l=ut();return React.createElement(Page,{navModel:l,pageNav:r},i())}function dt(t){const n=t.split("/");let a=[],s="g",r;for(let i=0;i<n.length;i++)s+=`/${n[i]}`,a.push({text:n[i],url:s,parentItem:r}),r=a[a.length-1];return r}function ut(){return{main:{text:"C:"},node:{text:"Content",url:"/g"}}}const oo=null;var Q=o(43620),pt=o(4684),mn=o(81587),q=o(13741),re=o(1128),j=o(73453),se=o(29372),gn=o(8594),hn=o(56983);const We=({isCurrent:t,plugin:n,onClick:a,disabled:s})=>e.createElement(hn.X,{title:n.name,plugin:n,description:n.info.description,onClick:a,isCurrent:t,disabled:s,showBadge:!0});We.displayName="VizTypePickerPlugin";var oe=o(17112);const fn=()=>{const t=(0,y.wW)(vn),[n,a]=(0,e.useState)(""),s=(0,b.useSelector)(d=>d.dashboard.getModel()),r=(0,e.useMemo)(()=>(0,oe.Ry)(),[]),i=(0,e.useMemo)(()=>(0,oe.rw)(r,n),[r,n]),l=()=>{w.E1.partial({addWidget:null})};return e.createElement(q.u,{title:"Select widget type",closeOnEscape:!0,closeOnBackdropClick:!0,isOpen:!0,className:t.modal,onClickBackdrop:l,onDismiss:l},e.createElement(re.I,{type:"search",autoFocus:!0,className:t.searchInput,value:n,prefix:e.createElement(j.J,{name:"search"}),placeholder:"Search widget",onChange:d=>{a(d.currentTarget.value)}}),e.createElement(se.$,null,e.createElement("div",{className:t.grid},i.map((d,c)=>e.createElement(We,{disabled:!1,key:d.id,isCurrent:!1,plugin:d,onClick:u=>{const p=(0,gn.AI)(s,d.id);w.E1.partial({editPanel:p,addWidget:null})}})))))},vn=t=>({modal:(0,m.css)`
    width: 65%;
    max-width: 960px;

    ${t.breakpoints.down("md")} {
      width: 100%;
    }
  `,searchInput:(0,m.css)`
    margin-bottom: ${t.spacing(2)};
  `,grid:(0,m.css)`
    display: grid;
    grid-gap: ${t.spacing(1)};
  `});var En=o(97188),yn=o(64611),bn=o(65036),X=o(89949),Be=o(7662),mt=o(60729),Cn=o(5933),ie=o(91368),Pe=o(25111),Pn=o(29956),D=o(66670),Sn=o(75766),Tn=o(51214),xn=o(37024);const gt=({panel:t,folderUid:n,isUnsavedPrompt:a,onDismiss:s,onConfirm:r,onDiscard:i})=>{const[l,d]=(0,e.useState)(""),c=(0,Pe.Z)(async()=>{const P=await(0,Sn.E8)(t.libraryPanel.uid);return P.length>0?P.map(I=>I.title):[]},[t.libraryPanel.uid]),[u,p]=(0,e.useState)([]);(0,Pn.Z)(()=>c.value?p(c.value.filter(P=>P.toLowerCase().includes(l.toLowerCase()))):p([]),300,[c.value,l]);const{saveLibraryPanel:g}=(0,xn.E)(),h=(0,y.wW)(Tn.J),f=(0,e.useCallback)(()=>{i()},[i]),E=a?"Unsaved library panel changes":"Save library panel";return e.createElement(q.u,{title:E,icon:"save",onDismiss:s,isOpen:!0},e.createElement("div",null,e.createElement("p",{className:h.textInfo},"This update will affect ",e.createElement("strong",null,t.libraryPanel.meta?.connectedDashboards," ",t.libraryPanel.meta?.connectedDashboards===1?"dashboard":"dashboards","."),"The following dashboards using the panel will be affected:"),e.createElement(re.I,{className:h.dashboardSearch,prefix:e.createElement(j.J,{name:"search"}),placeholder:"Search affected dashboards",value:l,onChange:P=>d(P.currentTarget.value)}),c.loading?e.createElement("p",null,"Loading connected dashboards..."):e.createElement("table",{className:h.myTable},e.createElement("thead",null,e.createElement("tr",null,e.createElement("th",null,"Dashboard name"))),e.createElement("tbody",null,u.map((P,I)=>e.createElement("tr",{key:`dashrow-${I}`},e.createElement("td",null,P))))),e.createElement(q.u.ButtonRow,null,e.createElement(D.zx,{variant:"secondary",onClick:s,fill:"outline"},"Cancel"),a&&e.createElement(D.zx,{variant:"destructive",onClick:f},"Discard"),e.createElement(D.zx,{onClick:()=>{g(t,n).then(()=>{r()})}},"Update all"))))};var wn=o(85991),Ue=o(56812),ke=o(22377),Se=o(32195),ht=o(47875),J=o(45743);function Dn(t,n){return async a=>{const s=n.initEditPanel(t);a((0,J.Hl)({panel:s,sourcePanel:t}))}}function ft(){return async(t,n)=>{const{getPanel:a}=n().panelEditor;a().configRev=0,t((0,J.yi)(!0))}}function Rn(t,n){return a=>{if(t.libraryPanel?.uid===void 0||!n)return;const s=t.getSaveModel();for(const r of n.panels){if(Nn(t,r))continue;r.restoreModel({...s,...(0,X.pick)(r,"gridPos","id")});const i=r.plugin?.meta.id!==t.plugin?.meta.id;r.plugin=t.plugin,r.configRev++,i&&(r.generateNewKey(),a((0,ht.bc)({key:r.key,plugin:r.plugin}))),setTimeout(()=>{r.getQueryRunner().useLastResultFrom(t.getQueryRunner())},20)}t.repeat&&setTimeout(()=>n.processRepeats(),20)}}function Nn(t,n){return!!(n.libraryPanel?.uid!==t.libraryPanel.uid||n.id&&n.id===t.id||n.repeatPanelId)}function On(){return async(t,n)=>{const a=n().dashboard.getModel(),{getPanel:s,getSourcePanel:r,shouldDiscardChanges:i}=n().panelEditor,l=s();a&&a.exitPanelEditor();const d=r();if(In(l)&&!i){const c=l.getSaveModel(),u=d.type!==l.type;t(Rn(l,a)),d.restoreModel(c),d.configRev++,u&&(d.plugin=l.plugin,d.generateNewKey(),await t((0,ht.bc)({key:d.key,plugin:l.plugin}))),setTimeout(()=>{d.getQueryRunner().useLastResultFrom(l.getQueryRunner()),d.render(),l.hasSavedPanelEditChange&&!l.hasChanged&&(d.configRev=0)},20)}d.isNew&&(i?a&&(0,ke.WJ)(a,d,!0):delete d.isNew),t((0,Se.qj)(l.key)),t((0,J.my)())}}function In(t){return t.hasChanged||t.hasSavedPanelEditChange||t.isAngularPlugin()}function Ve(t){return(n,a)=>{const s={...a().panelEditor.ui,...t};n((0,J.K9)(s));try{Ue.Z.setObject(J.jy,s)}catch(r){console.error(r)}}}var Mn=o(63534);const An=({dashboard:t,onSaveSuccess:n,onDiscard:a,onDismiss:s})=>e.createElement(q.u,{isOpen:!0,title:"Unsaved changes",onDismiss:s,icon:"exclamation-triangle",className:(0,m.css)`
        width: 500px;
      `},e.createElement("h5",null,"Do you want to save your changes?"),e.createElement(q.u.ButtonRow,null,e.createElement(D.zx,{variant:"secondary",onClick:s,fill:"outline"},"Cancel"),e.createElement(D.zx,{variant:"destructive",onClick:a},"Discard"),e.createElement(Mn.i,{dashboard:t,onSaveSuccess:n}))),vt=e.memo(({dashboard:t})=>{const[n,a]=(0,e.useState)({original:null}),s=(0,b.useDispatch)(),{original:r,originalPath:i}=n,{showModal:l,hideModal:d}=(0,e.useContext)(mt.kr);(0,e.useEffect)(()=>{const u=setTimeout(()=>{const g=w.E1.getLocation().pathname,h=t.getSaveModelClone();a({originalPath:g,original:h})},1e3),p=Cn.h.subscribe(Q.Jd,()=>{const g=t.getSaveModelClone();a({originalPath:i,original:g})});return()=>{clearTimeout(u),p.unsubscribe()}},[t,i]),(0,e.useEffect)(()=>{const u=p=>{Et(t,r)||bt(t,r)&&(p.preventDefault(),p.returnValue="")};return window.addEventListener("beforeunload",u),()=>window.removeEventListener("beforeunload",u)},[t,r]);const c=u=>{const p=t.panelInEdit,g=new URLSearchParams(u.search);return p&&p.libraryPanel&&p.hasChanged&&!g.has("editPanel")?(l(gt,{isUnsavedPrompt:!0,panel:t.panelInEdit,folderUid:t.meta.folderUid??"",onConfirm:()=>{d(),Te(u)},onDiscard:()=>{s(ft()),Te(u),d()},onDismiss:d}),!1):i===u.pathname||!r?(p&&!g.has("editPanel")&&s(On()),!0):Et(t,r)||!bt(t,r)?!0:(l(An,{dashboard:t,onSaveSuccess:()=>{d(),Te(u)},onDiscard:()=>{a({...n,original:null}),d(),Te(u)},onDismiss:d}),!1)};return e.createElement(Be.NL,{when:!0,message:c})});vt.displayName="DashboardPrompt";function Te(t){t&&setTimeout(()=>w.E1.push(t),10)}function Et(t,n){if(!n||!ie.contextSrv.isSignedIn||!t)return!0;const{canSave:a,fromScript:s,fromFile:r}=t.meta;return!ie.contextSrv.isEditor&&!a?!0:!a||s||r}function yt(t){const n=new wn.f(t);n.expandRows();const a=n.getSaveModelClone();return a.time=0,a.refresh="",a.schemaVersion=0,a.timezone=0,a.panels=[],(0,X.each)(a.getVariables(),s=>{s.current=null,s.options=null,s.filters=null}),a}function bt(t,n){if(t.hasUnsavedChanges())return!0;const a=yt(t.getSaveModelClone()),s=yt(n),r=(0,X.find)(a.nav,{type:"timepicker"}),i=(0,X.find)(s.nav,{type:"timepicker"});r&&i&&(r.now=i.now);const l=JSON.stringify(a,null),d=JSON.stringify(s,null);return l!==d}var $n=o(83961),F=o(49516),xe=o(69037),we=o(55925),Ct=o(62247),De=o(23852),Pt=o(14574),Ln=o(96198),He=o(15372),me=o(54281),Fn=o(62108),_=o(63439),le=o(22209),St=o(28580),Ke=o(71585),zn=o(11649),z=o(64022),ee=o(42074),Wn=o(49086),Bn=o.n(Wn),Un=o(60956),Re=o(21609),kn=o(31279),Vn=o(53069),ge=o(26858),Hn=o(73170),Tt=o(54195),xt=o(17551),he=(t=>(t[t.Support=0]="Support",t[t.Data=1]="Data",t))(he||{}),Ne=(t=>(t[t.PanelSnapshot=0]="PanelSnapshot",t[t.GithubComment=1]="GithubComment",t))(Ne||{});class Kn extends kn.b{constructor(n){super({panel:n,panelTitle:n.replaceVariables(n.title,void 0,"text")||"Panel",currentTab:0,showMessage:1,snapshotText:"",markdownText:"",randomize:{},snapshotUpdate:0,options:[{label:"GitHub comment",description:"Copy and paste this message into a GitHub issue or comment",value:1},{label:"Panel support snapshot",description:"Dashboard JSON used to help troubleshoot visualization issues",value:0}]}),this.onCurrentTabChange=a=>{this.setState({currentTab:a})},this.onShowMessageChange=a=>{this.setState({showMessage:a.value})},this.onGetMarkdownForClipboard=()=>{const{markdownText:a}=this.state,s=Math.pow(1024,2)*1.5;return a.length>s?(this.setState({error:{title:"Copy to clipboard failed",message:"Snapshot is too large, consider download and attaching a file instead"}}),""):a},this.onDownloadDashboard=()=>{const{snapshotText:a,panelTitle:s}=this.state,r=new Blob([a],{type:"text/plain"}),i=`debug-${s}-${(0,Un.dq)(new Date)}.json.txt`;Bn()(r,i)},this.onSetSnapshotText=a=>{this.setState({snapshotText:a})},this.onToggleRandomize=a=>{const{randomize:s}=this.state;this.setState({randomize:{...s,[a]:!s[a]}})},this.onPreviewDashboard=()=>{const{snapshot:a}=this.state;a&&((0,Tt.$M)({meta:{},dashboard:a}),o.g.open(T.config.appUrl+"dashboard/new","_blank"))}}async buildDebugDashboard(){const{panel:n,randomize:a,snapshotUpdate:s}=this.state,r=await(0,xt.$R)(n,a,(0,ge.$t)().timeRange()),i=JSON.stringify(r,null,2),l=(0,xt.S$)(n,i),d=(0,Re.zc)((0,Re.Cf)("bytes")(i?.length??0));let c;if(!n.isAngularPlugin())try{const u=new Hn.f(r);c=(0,Vn.Yz)(u).state.body}catch(u){console.log("Error creating scene:",u)}this.setState({snapshot:r,snapshotText:i,markdownText:l,snapshotSize:d,snapshotUpdate:s+1,scene:c})}}function Gn({panel:t,plugin:n,onClose:a}){const s=(0,y.wW)(jn),r=(0,e.useMemo)(()=>new Kn(t),[t]),{currentTab:i,loading:l,error:d,options:c,showMessage:u,snapshotSize:p,markdownText:g,snapshotText:h,randomize:f,panelTitle:E,scene:P}=r.useState();if((0,e.useEffect)(()=>{r.buildDebugDashboard()},[r,n,f]),!n)return null;const I=[{label:"Snapshot",value:he.Support},{label:"Data",value:he.Data}],A=T.config.supportBundlesEnabled&&ie.contextSrv.hasAccess(b.AccessControlAction.ActionSupportBundlesCreate,ie.contextSrv.isGrafanaAdmin);return e.createElement(Pt.d,{title:"Get help with this panel",size:"lg",onClose:a,scrollableContent:!0,subtitle:e.createElement(De.K,{direction:"column",gap:1},e.createElement(De.K,{direction:"row",gap:1},e.createElement(Ln.a,{featureState:Ct.CQ.beta}),e.createElement("a",{href:"https://grafana.com/docs/grafana/latest/troubleshooting/",target:"blank",className:"external-link",rel:"noopener noreferrer"},"Troubleshooting docs ",e.createElement(j.J,{name:"external-link-alt"}))),e.createElement("span",{className:"muted"},"To request troubleshooting help, send a snapshot of this panel to Grafana Labs Technical Support. The snapshot contains query response data and panel settings."),A&&e.createElement("span",{className:"muted"},"You can also retrieve a support bundle containing information concerning your Grafana instance and configured datasources in the ",e.createElement("a",{href:"/support-bundles"},"support bundles section"),".")),tabs:e.createElement(He.J,null,I.map((S,W)=>e.createElement(me.O,{key:`${S.value}-${W}`,label:S.label,active:S.value===i,onChangeTab:()=>r.onCurrentTabChange(S.value)})))},l&&e.createElement(Fn.$,null),d&&e.createElement(_.b,{title:d.title},d.message),i===he.Data&&e.createElement("div",{className:s.code},e.createElement("div",{className:s.opts},e.createElement(le.g,{label:"Template",className:s.field},e.createElement(St.Ph,{options:c,value:u,onChange:r.onShowMessageChange})),u===Ne.GithubComment?e.createElement(Ke.m,{icon:"copy",getText:r.onGetMarkdownForClipboard},"Copy to clipboard"):e.createElement(D.zx,{icon:"download-alt",onClick:r.onDownloadDashboard},"Download (",p,")")),e.createElement(we.Z,{disableWidth:!0},({height:S})=>e.createElement(zn.p,{width:"100%",height:S,language:u===Ne.GithubComment?"markdown":"json",showLineNumbers:!0,showMiniMap:!0,value:u===Ne.GithubComment?g:h,readOnly:!1,onBlur:r.onSetSnapshotText}))),i===he.Support&&e.createElement(e.Fragment,null,e.createElement(le.g,{label:"Randomize data",description:"Modify the original data to hide sensitve information.  Note the lengths will stay the same, and duplicate values will be equal."},e.createElement(z.Lh,null,e.createElement(ee.x,{label:"Labels",id:"randomize-labels",showLabel:!0,value:!!f.labels,onChange:()=>r.onToggleRandomize("labels")}),e.createElement(ee.x,{label:"Field names",id:"randomize-field-names",showLabel:!0,value:!!f.names,onChange:()=>r.onToggleRandomize("names")}),e.createElement(ee.x,{label:"String values",id:"randomize-string-values",showLabel:!0,value:!!f.values,onChange:()=>r.onToggleRandomize("values")}))),e.createElement(le.g,{label:"Support snapshot",description:`Panel: ${E}`},e.createElement(De.K,null,e.createElement(D.zx,{icon:"download-alt",onClick:r.onDownloadDashboard},"Dashboard (",p,")"),e.createElement(Ke.m,{icon:"github",getText:r.onGetMarkdownForClipboard,title:"Copy a complete GitHub comment to the clipboard"},"Copy to clipboard"),e.createElement(D.zx,{onClick:r.onPreviewDashboard,variant:"secondary",title:"Open support snapshot dashboard in a new tab"},"Preview"))),e.createElement(we.Z,{disableWidth:!0},({height:S})=>e.createElement("div",{style:{height:S,overflow:"auto"}},P&&e.createElement(P.Component,{model:P})))))}const jn=t=>({code:(0,m.css)`
    flex-grow: 1;
    height: 100%;
    overflow: scroll;
  `,field:(0,m.css)`
    width: 100%;
  `,opts:(0,m.css)`
    display: flex;
    display: flex;
    width: 100%;
    flex-grow: 0;
    align-items: center;
    justify-content: flex-end;

    button {
      margin-left: 8px;
    }
  `});var Zn=o(53933);const Ge=(t,n,a)=>{const s=(0,e.useRef)(),[r,i]=(0,e.useState)();return(0,e.useEffect)(()=>{let l=-1,d=0;return s.current=t.getQueryRunner().getData({withTransforms:n.withTransforms,withFieldConfig:!1}).subscribe({next:c=>{if(a){if(l===c.structureRev){const u=Date.now();if(u-d<1e4)return;d=u}l=c.structureRev??-1}i(c)}}),()=>{s.current&&s.current.unsubscribe()}},[t,n.withTransforms]),{data:r,error:r&&r.error,isLoading:r?r.state===Zn.Gu.Loading:!0,hasSeries:r?!!r.series:!1}};var Qn=o(39317),Y=o(65322),Jn=o(97196),Yn=o(81682),Xn=o(83486);const qn=({data:t,metadataDatasource:n})=>!n||!n.components?.MetadataInspector?e.createElement(Y.cC,{i18nKey:"dashboard.inspect-meta.no-inspector"},"No Metadata Inspector"):e.createElement(n.components.MetadataInspector,{datasource:n,data:t.series});var _n=o(41586),ea=o(1e3);const ta=({panel:t,plugin:n,dashboard:a,tabs:s,data:r,isDataLoading:i,dataOptions:l,metadataDatasource:d,defaultTab:c,onDataOptionsChange:u,onClose:p})=>{const[g,h]=(0,e.useState)(c??F.q.Data);if(!n)return null;let f=r?.errors;!f?.length&&r?.error&&(f=[r.error]);let E=g;s.find(A=>A.value===g)||(E=F.q.JSON);const P=(0,Qn.J)().replace(t.title,t.scopedVars,"text")||"Panel",I=(0,Y.t)("dashboard.inspect.title","Inspect: {{panelTitle}}",{panelTitle:P});return e.createElement(Pt.d,{title:I,subtitle:r&&na(r),onClose:p,scrollableContent:!0,tabs:e.createElement(He.J,null,s.map((A,S)=>e.createElement(me.O,{key:`${A.value}-${S}`,label:A.label,active:A.value===E,onChangeTab:()=>h(A.value||F.q.Data)})))},E===F.q.Data&&e.createElement(Jn.E,{panel:t,data:r&&r.series,isLoading:i,options:l,onOptionsChange:u,timeZone:a.timezone,app:Ct.zj.Dashboard}),r&&E===F.q.Meta&&e.createElement(qn,{data:r,metadataDatasource:d}),E===F.q.JSON&&e.createElement(Xn.W,{panel:t,dashboard:a,data:r,onClose:p}),E===F.q.Error&&e.createElement(Yn.l,{errors:f}),r&&E===F.q.Stats&&e.createElement(_n.f,{data:r,timeZone:a.getTimezone()}),r&&E===F.q.Query&&e.createElement(ea.D,{panel:t,data:r.series,onRefreshQuery:()=>t.refresh()}))};function na(t){const{request:n}=t;if(!n||(0,X.isEmpty)(n))return"";const a=n.targets.length,s=n.endTime?n.endTime-n.startTime:0,r=(0,Re.zc)((0,Re.Cf)("ms")(s));return e.createElement(Y.cC,{i18nKey:"dashboard.inspect.subtitle"},{queryCount:a}," queries with total query time of ",{formatted:r})}var aa=o(80601),wt=o(10864),je=o(11778);const ra=t=>(0,aa.Z)(async()=>{const a=t?.request?.targets||[];if(t&&t.series&&a.length){for(const s of t.series)if(s.meta&&s.meta.custom){const r=await(0,wt.F)().get(a[0].datasource);if(r&&r.components?.MetadataInspector)return r}}},[t]).value,sa=(t,n,a,s,r)=>(0,e.useMemo)(()=>{const i=[];return(0,je.sY)(a)&&(i.push({label:(0,Y.t)("dashboard.inspect.data-tab","Data"),value:F.q.Data}),i.push({label:(0,Y.t)("dashboard.inspect.stats-tab","Stats"),value:F.q.Stats})),r&&i.push({label:(0,Y.t)("dashboard.inspect.meta-tab","Meta Data"),value:F.q.Meta}),i.push({label:(0,Y.t)("dashboard.inspect.json-tab","JSON"),value:F.q.JSON}),s&&s.message&&i.push({label:(0,Y.t)("dashboard.inspect.error-tab","Error"),value:F.q.Error}),n.meta.canEdit&&(0,je.sY)(a)&&i.push({label:(0,Y.t)("dashboard.inspect.query-tab","Query"),value:F.q.Query}),i},[a,r,n,s]),oa=({panel:t,dashboard:n,plugin:a})=>{const[s,r]=(0,e.useState)({withTransforms:!1,withFieldConfig:!0}),i=(0,Be.TH)(),{data:l,isLoading:d,error:c}=Ge(t,s,!0),u=ra(l),p=sa(t,n,a,c,u),g=new URLSearchParams(i.search).get("inspectTab"),h=()=>{w.E1.partial({inspect:null,inspectTab:null})};return a?g===F.q.Help?e.createElement(Gn,{panel:t,plugin:a,onClose:h}):e.createElement(ta,{dashboard:n,panel:t,plugin:a,defaultTab:g,tabs:p,data:l,isDataLoading:d,dataOptions:s,onDataOptionsChange:r,metadataDatasource:u,onClose:h}):null},ia=(t,n)=>{const a=(0,xe.i)(t,n.panel);return a?{plugin:a.plugin}:{plugin:null}},la=(0,N.connect)(ia)(oa);var Dt=o(19973),Oe=o(40705),Ie=o(30973),ca=o(84693),Rt=o(80402),da=o(75443),Nt=o(80918),ua=o(66574),fe=o(80011),pa=o(41355),ma=o(80169),Ze=o(6230);const ga=t=>{const n=(0,e.useMemo)(()=>pa.z.get(t.variable.type).picker,[t.variable]);return t.variable?e.createElement("div",{className:"gf-form"},e.createElement(ha,{variable:t.variable}),t.variable.hide!==Ze.bU.hideVariable&&n&&e.createElement(n,{variable:t.variable,readOnly:t.readOnly??!1})):e.createElement("div",null,"Couldn't load variable")};function ha({variable:t}){const n=(0,e.useMemo)(()=>t.label||t.name,[t]);if(t.hide!==Ze.bU.dontHide)return null;const a=ma.IG+t.id;return t.description?e.createElement(fe.u,{content:t.description,placement:"bottom"},e.createElement("label",{className:"gf-form-label gf-form-label--variable","data-testid":v.wl.pages.Dashboard.SubMenu.submenuItemLabels(n),htmlFor:a},n)):e.createElement("label",{className:"gf-form-label gf-form-label--variable","data-testid":v.wl.pages.Dashboard.SubMenu.submenuItemLabels(n),htmlFor:a},n)}const Ot=({variables:t,readOnly:n})=>{const[a,s]=(0,e.useState)([]);return(0,e.useEffect)(()=>{s(t.filter(r=>r.hide!==Ze.bU.hideVariable))},[t]),a.length===0?null:e.createElement(e.Fragment,null,a.map(r=>e.createElement("div",{key:r.id,className:"submenu-item gf-form-inline","data-testid":v.wl.pages.Dashboard.SubMenu.submenuItem},e.createElement(ga,{variable:r,readOnly:n}))))};var fa=o(83341),va=o(97816),ve=o(73668),Qe=o(51824),Ea=o(70053),ya=o(57082),ba=o(37778),It=o(33716),Ca=o(64626),Mt=o(9772);function Pa(t,n){Ue.Z.set(`panel-edit-section-${t}`,n?"true":"false")}function Sa(t,n){return Ue.Z.getBool(`panel-edit-section-${t}`,n)}const At=(t,n)=>({angularPanelComponent:(0,xe.i)(t,n.panel)?.angularComponent}),$t={changePanelPlugin:Se.Kc},io=(0,N.connect)(At,$t);class Ta extends e.PureComponent{constructor(n){super(n)}componentDidMount(){this.loadAngularOptions()}componentDidUpdate(n){(this.props.plugin!==n.plugin||this.props.angularPanelComponent!==n.angularPanelComponent)&&this.cleanUpAngularOptions(),this.loadAngularOptions()}componentWillUnmount(){this.cleanUpAngularOptions()}cleanUpAngularOptions(){this.angularOptions&&(this.angularOptions.destroy(),this.angularOptions=null)}loadAngularOptions(){const{panel:n,angularPanelComponent:a,changePanelPlugin:s}=this.props;if(!this.element||!a||this.angularOptions)return;const r=a.getScope();if(!r.$$childHead){setTimeout(()=>{this.forceUpdate()});return}const i=r.$$childHead.ctrl;i.initEditMode(),i.onPluginTypeChange=u=>{s({panel:n,pluginId:u.id})};let l="";for(let u=0;u<i.editorTabs.length;u++){const p=i.editorTabs[u];p.isOpen=Sa(p.title,u===0),l+=`
      <div class="panel-options-group" ng-cloak>
        <div class="panel-options-group__header" ng-click="toggleOptionGroup(${u})" aria-label="${p.title} section">
          <div class="panel-options-group__icon">
            <icon name="ctrl.editorTabs[${u}].isOpen ? 'angle-down' : 'angle-right'"></icon>
          </div>
          <div class="panel-options-group__title">${p.title}</div>
        </div>
        <div class="panel-options-group__body" ng-if="ctrl.editorTabs[${u}].isOpen">
          <panel-editor-tab editor-tab="ctrl.editorTabs[${u}]" ctrl="ctrl"></panel-editor-tab>
        </div>
      </div>
      `}const d=(0,Mt.w)(),c={ctrl:i,toggleOptionGroup:u=>{const p=i.editorTabs[u];p.isOpen=!p.isOpen,Pa(p.title,!!p.isOpen)}};this.angularOptions=d.load(this.element,c,l),this.angularOptions.digest()}render(){return e.createElement("div",{ref:n=>this.element=n})}}const xa=(0,N.connect)(At,$t)(Ta);var Je=o(18282),Lt=o(76178),Me=o(25587),Ft=o(78425),zt=o(73990),Ae=o(89897),wa=o(3819),Da=o.n(wa),Ra=o(79978),Na=o(77122),$e=o(67437);const Oa=({property:t,context:n,registry:a,onChange:s,onRemove:r,isSystemOverride:i,searchQuery:l})=>{const d=(0,y.wW)(Ia),c=a?.getIfExists(t.id),u=(0,e.useId)();if(!c)return null;const p=Array.isArray(t.value)||t.id===Me.qb.Thresholds||t.id===Me.qb.Links||t.id===Me.qb.Mappings,g=c.category?.filter(E=>E!==c.name);let h;const f=(E=!0,P=!1)=>(I=!1)=>e.createElement(z.Lh,{justify:"space-between"},e.createElement(Ra._,{category:g,description:E?c.description:void 0,htmlFor:u},e.createElement(Da(),{textToHighlight:c.name,searchWords:[l],highlightClassName:"search-fragment-highlight"}),!I&&P&&c.getItemsCount&&e.createElement(Na.A,{value:c.getItemsCount(t.value)})),!i&&e.createElement("div",null,e.createElement($e.h,{name:"times",onClick:r,tooltip:"Remove label"})));return p?h=e.createElement(Je.u,{id:c.name,renderTitle:f(!1,!0),className:(0,m.css)`
          padding-left: 0;
          padding-right: 0;
        `,isNested:!0,isOpenDefault:t.value!==void 0},e.createElement(c.override,{value:t.value,onChange:E=>{s(E)},item:c,context:n})):h=e.createElement("div",null,e.createElement(le.g,{label:f()(),description:c.description},e.createElement(c.override,{value:t.value,onChange:E=>{s(E)},item:c,context:n,id:u}))),e.createElement("div",{className:(0,m.cx)(p&&d.collapsibleOverrideEditor,!p&&"dynamicConfigValueEditor--nonCollapsible")},h)},Ia=t=>({collapsibleOverrideEditor:(0,m.css)`
      label: collapsibleOverrideEditor;
      & + .dynamicConfigValueEditor--nonCollapsible {
        margin-top: ${t.spacing(1)};
      }
    `});var te=o(32299),Z=o(23140);const Wt=({isExpanded:t,registry:n,matcherUi:a,overrideName:s,override:r,onOverrideRemove:i})=>{const l=(0,y.wW)(Ma),c=r.properties.map(p=>n.getIfExists(p.id)).filter(p=>!!p).map(p=>p?.name).join(", "),u=a.optionsToLabel(r.matcher.options);return e.createElement("div",null,e.createElement(z.Lh,{justify:"space-between"},e.createElement("div",null,s),e.createElement($e.h,{name:"trash-alt",onClick:i,tooltip:"Remove override"})),!t&&e.createElement("div",{className:l.overrideDetails},e.createElement("div",{className:l.options,title:u},u," ",e.createElement(j.J,{name:"angle-right"})," ",c)))};Wt.displayName="OverrideTitle";const Ma=t=>({matcherUi:(0,m.css)`
      padding: ${t.spacing(1)};
    `,propertyPickerWrapper:(0,m.css)`
      margin-top: ${t.spacing(2)};
    `,overrideDetails:(0,m.css)`
      font-size: ${t.typography.bodySmall.fontSize};
      color: ${t.colors.text.secondary};
      font-weight: ${t.typography.fontWeightRegular};
    `,options:(0,m.css)`
      overflow: hidden;
      padding-right: ${t.spacing(4)};
    `,unknownLabel:(0,m.css)`
      margin-bottom: 0;
    `});function Aa(t,n){const a=[],s=t.panel.fieldConfig,r=t.plugin.fieldConfigRegistry,i=t.data?.series??[];if(r.isEmpty())return[];const l=(p,g)=>{let h=(0,X.cloneDeep)(s.overrides);h[p]=g,t.onFieldConfigsChange({...s,overrides:h})},d=p=>{let g=(0,X.cloneDeep)(s.overrides);g.splice(p,1),t.onFieldConfigsChange({...s,overrides:g})},c=p=>{const g=Lt.Ls.get(p.value);g&&t.onFieldConfigsChange({...s,overrides:[...s.overrides,{matcher:{id:g.id,options:g.defaultOptions},properties:[]}]})},u={data:i,getSuggestions:p=>(0,Ae.PW)(i,p),isOverride:!0};for(let p=0;p<s.overrides.length;p++){const g=s.overrides[p],h=`Override ${p+1}`,f=Ft.i.get(g.matcher.id),E=$a(r),P=(0,Me.v3)(g),I=g.properties.length===0?1:0,A=new te.j({title:h,id:h,forceOpen:I,renderTitle:function(U){return e.createElement(Wt,{override:g,isExpanded:U,registry:r,overrideName:h,matcherUi:f,onOverrideRemove:()=>d(p)})}}),S=x=>{g.matcher.options=x,l(p,g)},W=(x,U)=>{const ae=r.get(U.value),de={id:ae.id,value:ae.defaultValue};g.properties?x.properties.push(de):x.properties=[de],l(p,x)};A.addItem(new Z.a({title:f.name,render:function(){return e.createElement(f.component,{id:`${f.matcher.id}-${p}`,matcher:f.matcher,data:t.data?.series??[],options:g.matcher.options,onChange:S})}}));for(let x=0;x<g.properties.length;x++){const U=g.properties[x],ae=r.getIfExists(U.id);if(!ae)continue;const de=pn=>{g.properties[x].value=pn,l(p,g)},Ce=()=>{g.properties.splice(x,1),l(p,g)};A.addItem(new Z.a({title:ae.name,skipField:!0,render:function(){return e.createElement(Oa,{key:`${U.id}/${x}`,isSystemOverride:P,onChange:de,onRemove:Ce,property:U,registry:r,context:u,searchQuery:n})}}))}!P&&g.matcher.options&&A.addItem(new Z.a({title:"----------",skipField:!0,render:function(){return e.createElement(zt.b,{key:"Add override property",label:"Add override property",variant:"secondary",isFullWidth:!0,icon:"plus",menuPlacement:"auto",options:E,onChange:U=>W(g,U)})}})),a.push(A)}return a.push(new te.j({title:"add button",id:"add button",customRender:function(){return e.createElement(La,{key:"Add override"},e.createElement(zt.b,{icon:"plus",label:"Add field override",variant:"secondary",menuPlacement:"auto",isFullWidth:!0,size:"md",options:Ft.i.list().filter(g=>!g.excludeFromPicker).map(g=>({label:g.name,value:g.id,description:g.description})),onChange:g=>c(g)}))}})),a}function $a(t){return t.list().filter(n=>!n.hideFromOverrides).map(n=>{let a=n.name;return n.category&&(a=[...n.category,n.name].join(" > ")),{label:a,value:n.id,description:n.description}})}function La({children:t}){const n=(0,y.wW)(Fa);return e.createElement("div",{className:n},t)}function Fa(t){return(0,m.css)({borderTop:`1px solid ${t.colors.border.weak}`,padding:`${t.spacing(2)}`,display:"flex"})}const za=({panel:t,formatDate:n})=>{const a=(0,y.wW)(Wa),s=t.libraryPanel?.meta;return s?e.createElement("div",{className:a.info},e.createElement("div",{className:a.libraryPanelInfo},`Used on ${s.connectedDashboards} `,s.connectedDashboards===1?"dashboard":"dashboards"),e.createElement("div",{className:a.libraryPanelInfo},"Last edited on ",n?.(s.updated,"L")??s.updated," by",s.updatedBy.avatarUrl&&e.createElement("img",{width:"22",height:"22",className:a.userAvatar,src:s.updatedBy.avatarUrl,alt:`Avatar for ${s.updatedBy.name}`}),s.updatedBy.name)):null},Wa=t=>({info:(0,m.css)`
      line-height: 1;
    `,libraryPanelInfo:(0,m.css)`
      color: ${t.colors.text.secondary};
      font-size: ${t.typography.bodySmall.fontSize};
    `,userAvatar:(0,m.css)`
      border-radius: ${t.shape.radius.circle};
      box-sizing: content-box;
      width: 22px;
      height: 22px;
      padding-left: ${t.spacing(1)};
      padding-right: ${t.spacing(1)};
    `});function Ba(t){const{panel:n,onPanelConfigChange:a,dashboard:s}=t,r=new te.j({title:"Library panel options",id:"Library panel options",isOpenDefault:!0});return(0,ve.V)(n)&&r.addItem(new Z.a({title:"Name",value:n.libraryPanel.name,popularRank:1,render:function(){return e.createElement(re.I,{id:"LibraryPanelFrameName",defaultValue:n.libraryPanel.name,onBlur:l=>a("libraryPanel",{...n.libraryPanel,name:l.currentTarget.value})})}})).addItem(new Z.a({title:"Information",render:function(){return e.createElement(za,{panel:n,formatDate:s.formatDate})}})),r}var Ua=o(60105),ka=o(36537),Va=o(60508);function Ha(t){const{panel:n,onPanelConfigChange:a}=t;return new te.j({title:"Panel options",id:"Panel options",isOpenDefault:!0}).addItem(new Z.a({title:"Title",value:n.title,popularRank:1,render:function(){return e.createElement(re.I,{id:"PanelFrameTitle",defaultValue:n.title,onBlur:i=>a("title",i.currentTarget.value)})}})).addItem(new Z.a({title:"Description",description:n.description,value:n.description,render:function(){return e.createElement(Ua.K,{id:"description-text-area",defaultValue:n.description,onBlur:i=>a("description",i.currentTarget.value)})}})).addItem(new Z.a({title:"Transparent background",render:function(){return e.createElement(ee.r,{value:n.transparent,id:"transparent-background",onChange:i=>a("transparent",i.currentTarget.checked)})}})).addCategory(new te.j({title:"Panel links",id:"Panel links",isOpenDefault:!1,itemsCount:n.links?.length}).addItem(new Z.a({title:"Panel links",render:function(){return e.createElement(ka.d,{links:n.links,onChange:i=>a("links",i),getSuggestions:Ae.PR,data:[]})}}))).addCategory(new te.j({title:"Repeat options",id:"Repeat options",isOpenDefault:!1}).addItem(new Z.a({title:"Repeat by variable",description:"Repeat this panel for each value in the selected variable. This is not visible while in edit mode. You need to go back to dashboard and then update the variable or reload the dashboard.",render:function(){return e.createElement(Va.X,{id:"repeat-by-variable-select",repeat:n.repeat,onChange:i=>{a("repeat",i)}})}})).addItem(new Z.a({title:"Repeat direction",showIf:()=>!!n.repeat,render:function(){const i=[{label:"Horizontal",value:"h"},{label:"Vertical",value:"v"}];return e.createElement(Oe.S,{options:i,value:n.repeatDirection||"h",onChange:l=>a("repeatDirection",l)})}})).addItem(new Z.a({title:"Max per row",showIf:()=>!!(n.repeat&&n.repeatDirection==="h"),render:function(){const i=[2,3,4,6,8,12].map(l=>({label:l.toString(),value:l}));return e.createElement(St.Ph,{options:i,value:n.maxPerRow,onChange:l=>a("maxPerRow",l.value)})}})))}var Ka=o(26908);class Ga{constructor(n,a){this.categories=n,this.overrides=a}search(n){const a=new RegExp(n,"i"),r=this.collectHits(this.categories,a,[]).sort(Bt).map(d=>d.item),l=this.collectHits(this.overrides,a,[]).sort(Bt).map(d=>d.item);return{optionHits:r,overrideHits:this.buildOverrideHitCategories(l),totalCount:this.getAllOptionsCount(this.categories)}}collectHits(n,a,s){for(const r of n){const i=a.test(r.props.title);for(const l of r.items){if(a.test(l.props.title)){s.push({item:l,rank:1});continue}if(l.props.description&&a.test(l.props.description)){s.push({item:l,rank:2});continue}i&&s.push({item:l,rank:3})}r.categories.length>0&&this.collectHits(r.categories,a,s)}return s}getAllOptionsCount(n){let a=0;for(const s of n)a+=s.items.length,s.categories.length>0&&(a+=this.getAllOptionsCount(s.categories));return a}buildOverrideHitCategories(n){const a={};for(const s of n){let r=a[s.parent.props.title];r||(r=a[s.parent.props.title]=new te.j(s.parent.props),r.addItem(s.parent.items[0])),r.items[0].props.title!==s.props.title&&r.addItem(s)}return Object.values(a)}}function Bt(t,n){return t.rank-n.rank}function ja(t){const n=[];for(const a of t)for(const s of a.items)s.props.title==="Unit"&&(s.props.popularRank=2),s.props.title==="Min"&&(s.props.popularRank=3),s.props.title==="Max"&&(s.props.popularRank=4),s.props.title==="Display name"&&(s.props.popularRank=5),s.props.popularRank&&n.push(s);return n.sort((a,s)=>a.props.popularRank-s.props.popularRank)}const Za=t=>{const{plugin:n,dashboard:a,panel:s}=t,[r,i]=(0,e.useState)(""),[l,d]=(0,e.useState)("All"),c=(0,y.wW)(Xa),[u,p,g]=(0,e.useMemo)(()=>[Ha(t),(0,Ka.AL)(t),Ba(t)],[s.configRev,t.data,t.instanceState,r]),h=(0,e.useMemo)(()=>Aa(t,r),[s.configRev,t.data,t.instanceState,r]),f=[],E=r.length>0,P=(0,e.useMemo)(Qa,[]),I=(0,ve.V)(s)?[g,u,...p]:[u,...p];if(E)f.push(Ya(I,h,r)),t.plugin.angularPanelCtrl&&f.push(e.createElement("div",{className:c.searchNotice,key:"Search notice"},"This is an old visualization type that does not support searching all options."));else switch(l){case"All":(0,ve.V)(s)&&f.push(g.render()),f.push(u.render()),t.plugin.angularPanelCtrl&&f.push(e.createElement(xa,{plugin:n,dashboard:a,panel:s,key:"AngularOptions"}));for(const S of p)f.push(S.render());for(const S of h)f.push(S.render());break;case"Overrides":for(const S of h)f.push(S.render());break;case"Recent":f.push(e.createElement(Je.u,{id:"Recent options",title:"Recent options",key:"Recent options",forceOpen:1},ja(I).map(S=>S.render())));break}const A=!E&&!n.fieldConfigRegistry.isEmpty();return e.createElement("div",{className:c.wrapper},e.createElement("div",{className:c.formBox},s.isAngularPlugin()&&e.createElement(Ca.Y,{className:c.angularDeprecationWrapper,showPluginDetailsLink:!0,pluginId:n.meta.id,pluginType:n.meta.type,angularSupportEnabled:T.config?.angularSupportEnabled}),e.createElement("div",{className:c.formRow},e.createElement(It.H,{width:0,value:r,onChange:i,placeholder:"Search options"})),A&&e.createElement("div",{className:c.formRow},e.createElement(Oe.S,{options:P,value:l,fullWidth:!0,onChange:d}))),e.createElement("div",{className:c.scrollWrapper},e.createElement(se.$,{autoHeightMin:"100%"},e.createElement("div",{className:c.mainBox},f))))};function Qa(){return[{label:"All",value:"All"},{label:"Overrides",value:"Overrides"}]}var Ja=(t=>(t.All="All",t.Overrides="Overrides",t.Recent="Recent",t))(Ja||{});function Ya(t,n,a){const s=new Ga(t,n),{optionHits:r,totalCount:i,overrideHits:l}=s.search(a);return e.createElement("div",{key:"search results"},e.createElement(Je.u,{id:"Found options",title:`Matched ${r.length}/${i} options`,key:"Normal options",forceOpen:1},r.map(d=>d.render(a))),l.map(d=>d.render(a)))}const Xa=t=>({wrapper:(0,m.css)`
    height: 100%;
    display: flex;
    flex-direction: column;
    flex: 1 1 0;

    .search-fragment-highlight {
      color: ${t.colors.warning.text};
      background: transparent;
    }
  `,searchBox:(0,m.css)`
    display: flex;
    flex-direction: column;
    min-height: 0;
  `,formRow:(0,m.css)`
    margin-bottom: ${t.spacing(1)};
  `,formBox:(0,m.css)`
    padding: ${t.spacing(1)};
    background: ${t.colors.background.primary};
    border: 1px solid ${t.components.panel.borderColor};
    border-top-left-radius: ${t.shape.borderRadius(1.5)};
    border-bottom: none;
  `,closeButton:(0,m.css)`
    margin-left: ${t.spacing(1)};
  `,searchHits:(0,m.css)`
    padding: ${t.spacing(1,1,0,1)};
  `,scrollWrapper:(0,m.css)`
    flex-grow: 1;
    min-height: 0;
  `,searchNotice:(0,m.css)`
    font-size: ${t.typography.size.sm};
    color: ${t.colors.text.secondary};
    padding: ${t.spacing(1)};
    text-align: center;
  `,mainBox:(0,m.css)`
    background: ${t.colors.background.primary};
    border: 1px solid ${t.components.panel.borderColor};
    border-top: none;
    flex-grow: 1;
  `,angularDeprecationWrapper:(0,m.css)`
    padding: ${t.spacing(1)};
  `});var qa=o(77720),_a=o(59307);const Ut=t=>n=>n.plugins.panels[t]||(0,_a.X)(`Panel plugin not found (${t})`,!0),Ye=({panel:t})=>{const n=(0,b.useDispatch)(),a=(0,b.useSelector)(Ut(t.type)),s=(0,b.useSelector)(d=>d.panelEditor.ui.isPanelOptionsVisible),r=(0,b.useSelector)(d=>d.panelEditor.isVizPickerOpen),i=()=>{n((0,J.g_)(!r))},l=()=>{n(Ve({isPanelOptionsVisible:!s}))};return a?e.createElement("div",{className:kt.wrapper},e.createElement(qa.h,null,e.createElement(Ie.h,{className:kt.vizButton,tooltip:"Click to change visualization",imgSrc:a.meta.info.logos.small,isOpen:r,onClick:i,"data-testid":v.wl.components.PanelEditor.toggleVizPicker,"aria-label":"Change Visualization",variant:"canvas",fullWidth:!0},a.meta.name),e.createElement(Ie.h,{tooltip:s?"Close options pane":"Show options pane",icon:s?"angle-right":"angle-left",onClick:l,variant:"canvas","data-testid":v.wl.components.PanelEditor.toggleVizOptions,"aria-label":s?"Close options pane":"Show options pane"}))):null};Ye.displayName="VisualizationTab";const kt={wrapper:(0,m.css)`
    display: flex;
    flex-direction: column;
  `,vizButton:(0,m.css)`
    text-align: left;
  `};var er=o(84789),Vt=o(97957),tr=o(75261),nr=o(29325),ar=o(14673),Le=o(3613);const rr=({onConfirm:t,onDismiss:n,panel:a})=>{const s=(0,ve.V)(a),r=`${s?"Changing":"Replace with"} library panel`,i=`${s?"Changing":"Replacing with a"} library panel will remove any changes since last save.`;return e.createElement(Le.s,{onConfirm:t,onDismiss:n,confirmText:s?"Change":"Replace",title:r,body:i,dismissText:"Cancel",isOpen:!0})};var sr=o(83929);const or=({panel:t,searchQuery:n,isWidget:a=!1})=>{const[s,r]=(0,e.useState)(!1),[i,l]=(0,e.useState)(void 0),[d,c]=(0,e.useState)([]),u=(0,e.useCallback)(P=>{c(P.map(I=>I.id))},[c]),p=(0,tr.h4)().getCurrent(),g=(0,b.useDispatch)(),h=async()=>{i&&(l(void 0),g((0,Se.ih)(t,i)))},f=()=>r(!0),E=()=>l(void 0);return e.createElement(z.wc,{spacing:"md"},!t.libraryPanel&&e.createElement(z.wc,{align:"center"},e.createElement(D.zx,{icon:"plus",onClick:f,variant:"secondary",fullWidth:!0},"Create new library panel")),e.createElement(nr.j,{onChange:u,isWidget:a}),e.createElement("div",{className:ir.libraryPanelsView},e.createElement(sr.u,{currentPanelId:t.libraryPanel?.uid,searchString:n,panelFilter:d,onClickCard:l,showSecondaryActions:!0,isWidget:a})),s&&e.createElement(ar.c,{panel:t,onDismiss:()=>r(!1),initialFolderUid:p?.meta.folderUid,isOpen:s}),i&&e.createElement(rr,{panel:t,onDismiss:E,onConfirm:h}))},ir={libraryPanelsView:(0,m.css)`
    width: 100%;
  `};var Xe=o(90482),lr=o(59882);const cr=["timeseries","barchart","gauge","stat","piechart","bargauge","table","state-timeline","status-history","logs","candlestick","flamegraph"];async function dr(t,n){const a=new Xe.mi(t,n);for(const r of cr){const l=(await(0,lr.Ub)(r)).getSuggestionsSupplier();l&&l.getSuggestionsForData(a)}const s=a.getList();if(a.dataSummary.fieldCount===0)for(const r of Object.values(T.config.panels))!r.skipDataQuery||r.hideFromList||s.push({name:r.name,pluginId:r.id,description:r.info.description,cardOptions:{imgSrc:r.info.logos.small}});return s.sort((r,i)=>{if(a.dataSummary.preferredVisualisationType){if(r.pluginId===a.dataSummary.preferredVisualisationType)return-1;if(i.pluginId===a.dataSummary.preferredVisualisationType)return 1}return(i.score??Xe._.OK)-(r.score??Xe._.OK)})}var Ht=o(24084);function ur({data:t,suggestion:n,onChange:a,width:s}){const r=(0,y.wW)(pr),{innerStyles:i,outerStyles:l,renderWidth:d,renderHeight:c}=mr(s),u=n.cardOptions??{},p={"aria-label":n.name,className:r.vizBox,"data-testid":v.wl.components.VisualizationPreview.card(n.name),style:l,onClick:()=>{a({pluginId:n.pluginId,options:n.options,fieldConfig:n.fieldConfig})}};if(u.imgSrc)return e.createElement(fe.u,{content:n.description??n.name},e.createElement("button",{...p,className:(0,m.cx)(r.vizBox,r.imgBox)},e.createElement("div",{className:r.name},n.name),e.createElement("img",{className:r.img,src:u.imgSrc,alt:n.name})));let g=n;return n.cardOptions?.previewModifier&&(g=(0,X.cloneDeep)(n),n.cardOptions.previewModifier(g)),e.createElement("button",{...p},e.createElement(fe.u,{content:n.name},e.createElement("div",{style:i,className:r.renderContainer},e.createElement(Ht.$,{title:"",data:t,pluginId:n.pluginId,width:d,height:c,options:g.options,fieldConfig:g.fieldConfig}),e.createElement("div",{className:r.hoverPane}))))}const pr=t=>({hoverPane:(0,m.css)({position:"absolute",top:0,right:0,left:0,borderRadius:t.spacing(2),bottom:0}),vizBox:(0,m.css)`
      position: relative;
      background: none;
      border-radius: ${t.shape.borderRadius(1)};
      cursor: pointer;
      border: 1px solid ${t.colors.border.medium};

      transition: ${t.transitions.create(["background"],{duration:t.transitions.duration.short})};

      &:hover {
        background: ${t.colors.background.secondary};
      }
    `,imgBox:(0,m.css)`
      display: flex;
      flex-direction: column;
      height: 100%;

      justify-self: center;
      color: ${t.colors.text.primary};
      width: 100%;
      display: flex;

      justify-content: center;
      align-items: center;
      text-align: center;
    `,name:(0,m.css)`
      padding-bottom: ${t.spacing(.5)};
      margin-top: ${t.spacing(-1)};
      font-size: ${t.typography.bodySmall.fontSize};
      white-space: nowrap;
      overflow: hidden;
      color: ${t.colors.text.secondary};
      font-weight: ${t.typography.fontWeightMedium};
      text-overflow: ellipsis;
    `,img:(0,m.css)`
      max-width: ${t.spacing(8)};
      max-height: ${t.spacing(8)};
    `,renderContainer:(0,m.css)`
      position: absolute;
      transform-origin: left top;
      top: 6px;
      left: 6px;
    `});function mr(t){const a=t,s=t*(1/1.6),r=350,i=r*(1/1.6),l=6,d=(a-l*2)/r,c=(s-l*2)/i;return{renderHeight:i,renderWidth:r,outerStyles:{width:a,height:s},innerStyles:{width:r,height:i,transform:`scale(${d}, ${c})`}}}function gr({onChange:t,data:n,panel:a,searchQuery:s}){const r=(0,y.wW)(fr),{value:i}=(0,Pe.Z)(()=>dr(n,a),[n,a]),l=hr(s,i);return e.createElement(we.Z,{disableHeight:!0,style:{width:"100%",height:"100%"}},({width:d})=>{if(!d)return null;const c=Math.floor(d/170),u=8*(c-1),p=(d-u)/c;return e.createElement("div",null,e.createElement("div",{className:r.filterRow},e.createElement("div",{className:r.infoText},"Based on current data")),e.createElement("div",{className:r.grid,style:{gridTemplateColumns:`repeat(auto-fill, ${p-1}px)`}},l.map((g,h)=>e.createElement(ur,{key:h,data:n,suggestion:g,onChange:t,width:p})),s&&l.length===0&&e.createElement("div",{className:r.infoText},"No results matched your query")))})}function hr(t,n){if(!t||!n)return n||[];const a=new RegExp(t,"i");return n.filter(s=>a.test(s.name)||a.test(s.pluginId))}const fr=t=>({heading:(0,m.css)({...t.typography.h5,margin:t.spacing(0,.5,1)}),filterRow:(0,m.css)({display:"flex",flexDirection:"row",justifyContent:"space-around",alignItems:"center",paddingBottom:"8px"}),infoText:(0,m.css)({fontSize:t.typography.bodySmall.fontSize,color:t.colors.text.secondary,fontStyle:"italic"}),grid:(0,m.css)({display:"grid",gridGap:t.spacing(1),gridTemplateColumns:"repeat(auto-fill, 144px)",marginBottom:t.spacing(1),justifyContent:"space-evenly"})});var vr=o(10701);function Kt({searchQuery:t,onChange:n,current:a,data:s,isWidget:r=!1}){const i=(0,y.wW)(Er),l=(0,e.useMemo)(()=>T.config.featureToggles.vizAndWidgetSplit?r?(0,oe.Ry)():(0,oe.hK)():(0,oe.xW)(),[r]),d=(0,e.useMemo)(()=>(0,oe.rw)(l,t,a),[a,l,t]);return d.length===0?e.createElement(vr.K,null,"Could not find anything matching your query"):e.createElement("div",{className:i.grid},d.map((c,u)=>e.createElement(We,{disabled:!1,key:c.id,isCurrent:c.id===a.id,plugin:c,onClick:p=>n({pluginId:c.id,withModKey:!!(p.metaKey||p.ctrlKey||p.altKey)})})))}const Er=t=>({grid:(0,m.css)`
      max-width: 100%;
      display: grid;
      grid-gap: ${t.spacing(.5)};
    `,heading:(0,m.css)({...t.typography.h5,margin:t.spacing(0,.5,1)})});var R=o(25374);const Gt=({panel:t,data:n})=>{const a=(0,b.useSelector)(Ut(t.type)),[s,r]=(0,e.useState)(""),i=!!a.meta.skipDataQuery,l=!!(i&&T.config.featureToggles.vizAndWidgetSplit),d=l?Vt.Hk:Vt.FL,c=l?R.Ok.Widgets:R.Ok.Visualizations,[u,p]=(0,er.Z)(d,c),g=(0,b.useDispatch)(),h=(0,y.wW)(yr),f=(0,e.useRef)(null),E=(0,e.useCallback)(S=>{g((0,Se.Kc)({panel:t,...S})),S.withModKey||g((0,J.g_)(!1))},[g,t]),P=()=>{g((0,J.g_)(!1))};if(!a)return null;const I=[{label:"Visualizations",value:R.Ok.Visualizations},{label:"Suggestions",value:R.Ok.Suggestions},{label:"Library panels",value:R.Ok.LibraryPanels,description:"Reusable panels you can share between multiple dashboards."}],A=[{label:"Widgets",value:R.Ok.Widgets},{label:"Library panels",value:R.Ok.LibraryPanels,description:"Reusable panels you can share between multiple dashboards."}];return e.createElement("div",{className:h.openWrapper},e.createElement("div",{className:h.formBox},e.createElement("div",{className:h.searchRow},e.createElement(It.H,{value:s,onChange:r,ref:f,autoFocus:!0,placeholder:"Search for..."}),e.createElement(D.zx,{title:"Close",variant:"secondary",icon:"angle-up",className:h.closeButton,"aria-label":v.wl.components.PanelEditor.toggleVizPicker,onClick:P})),e.createElement(le.g,{className:h.customFieldMargin},e.createElement(Oe.S,{options:l?A:I,value:u,onChange:p,fullWidth:!0}))),e.createElement("div",{className:h.scrollWrapper},e.createElement(se.$,{autoHeightMin:"100%"},e.createElement("div",{className:h.scrollContent},u===R.Ok.Visualizations&&e.createElement(Kt,{current:a.meta,onChange:E,searchQuery:s,data:n,onClose:()=>{}}),u===R.Ok.Widgets&&e.createElement(Kt,{current:a.meta,onChange:E,searchQuery:s,data:n,onClose:()=>{},isWidget:!0}),u===R.Ok.Suggestions&&e.createElement(gr,{current:a.meta,onChange:E,searchQuery:s,panel:t,data:n,onClose:()=>{}}),u===R.Ok.LibraryPanels&&e.createElement(or,{searchQuery:s,panel:t,key:"Panel Library",isWidget:i})))))};Gt.displayName="VisualizationSelectPane";const yr=t=>({icon:(0,m.css)`
      color: ${t.v1.palette.gray33};
    `,wrapper:(0,m.css)`
      display: flex;
      flex-direction: column;
      flex: 1 1 0;
      height: 100%;
    `,vizButton:(0,m.css)`
      text-align: left;
    `,scrollWrapper:(0,m.css)`
      flex-grow: 1;
      min-height: 0;
    `,scrollContent:(0,m.css)`
      padding: ${t.spacing(1)};
    `,openWrapper:(0,m.css)`
      display: flex;
      flex-direction: column;
      flex: 1 1 100%;
      height: 100%;
      background: ${t.colors.background.primary};
      border: 1px solid ${t.colors.border.weak};
    `,searchRow:(0,m.css)`
      display: flex;
      margin-bottom: ${t.spacing(1)};
    `,closeButton:(0,m.css)`
      margin-left: ${t.spacing(1)};
    `,customFieldMargin:(0,m.css)`
      margin-bottom: ${t.spacing(1)};
    `,formBox:(0,m.css)`
      padding: ${t.spacing(1)};
      padding-bottom: 0;
    `}),br=({plugin:t,panel:n,onFieldConfigsChange:a,onPanelOptionsChanged:s,onPanelConfigChange:r,dashboard:i,instanceState:l})=>{const d=(0,y.wW)(Cr),c=(0,b.useSelector)(p=>p.panelEditor.isVizPickerOpen),{data:u}=Ge(n,{withTransforms:!0,withFieldConfig:!1},!0);return e.createElement("div",{className:d.wrapper,"aria-label":v.wl.components.PanelEditor.OptionsPane.content},!c&&e.createElement(e.Fragment,null,e.createElement("div",{className:d.vizButtonWrapper},e.createElement(Ye,{panel:n})),e.createElement("div",{className:d.optionsWrapper},e.createElement(Za,{panel:n,dashboard:i,plugin:t,instanceState:l,data:u,onFieldConfigsChange:a,onPanelOptionsChanged:s,onPanelConfigChange:r}))),c&&e.createElement(Gt,{panel:n,data:u}))},Cr=t=>({wrapper:(0,m.css)`
      height: 100%;
      width: 100%;
      display: flex;
      flex: 1 1 0;
      flex-direction: column;
      padding: 0;
    `,optionsWrapper:(0,m.css)`
      flex-grow: 1;
      min-height: 0;
    `,vizButtonWrapper:(0,m.css)`
      padding: 0 ${t.spacing(2,2)} 0;
    `,legacyOptions:(0,m.css)`
      label: legacy-options;
      .panel-options-grid {
        display: flex;
        flex-direction: column;
      }
      .panel-options-group {
        margin-bottom: 0;
      }
      .panel-options-group__body {
        padding: ${t.spacing(2)} 0;
      }

      .section {
        display: block;
        margin: ${t.spacing(2)} 0;

        &:first-child {
          margin-top: 0;
        }
      }
    `});var jt=o(32713),Pr=o(92056),Sr=o(39118);function Tr({width:t,height:n,panel:a,dashboard:s}){const{data:r}=Ge(a,{withTransforms:!0,withFieldConfig:!1},!1),[i,l]=(0,e.useState)({frameIndex:0,showHeader:!0,showTypeIcons:!0});if((0,e.useEffect)(()=>{const c=(0,ge.$t)(),u=a.events.subscribe(jt.U5,()=>{const p=(0,ke.W1)(a,c.timeRange());a.runAllPanelQueries({dashboardUID:s.uid,dashboardTimezone:s.getTimezone(),timeData:p,width:t})});return()=>{u.unsubscribe()}},[a,s,t]),!r)return null;const d=r?.errors?r.errors.length>1?"Multiple errors found. Click for more details":r.errors[0].message:r?.error?.message;return e.createElement(Pr.fm,{width:t,height:n,padding:"none"},(c,u)=>e.createElement(e.Fragment,null,e.createElement(Sr.Z,{panel:a,error:d}),e.createElement(Ht.$,{title:"Raw data",pluginId:"table",width:c,height:u,data:r,options:i,onOptionsChange:l})))}var Ee=o(86312),Zt=o(75340),qe=o(65469),xr=o(4432),wr=o(62435),Dr=o(66970);function Qt({message:t}){const n=(0,e.useCallback)(()=>{w.E1.partial({tab:R.Ip.Query})},[]);return e.createElement(z.Ar,{justify:"center",style:{marginTop:"100px"}},e.createElement(z.wc,{spacing:"md"},e.createElement("h2",null,t),e.createElement("div",null,e.createElement(D.zx,{size:"md",variant:"secondary",icon:"arrow-left",onClick:n},"Go back to Queries"))))}var _e=o(73289),Rr=o(55205),Jt=o(43609);class Nr extends e.PureComponent{constructor(){super(...arguments),this.state={stateHistoryItems:[]},this.clearHistory=async()=>{const{dashboard:n,panelId:a,onRefresh:s}=this.props;await(0,_e.i)().post("/api/annotations/mass-delete",{dashboardId:n.id,panelId:a}),this.setState({stateHistoryItems:[]}),s()}}componentDidMount(){const{dashboard:n,panelId:a}=this.props;(0,_e.i)().get(`/api/annotations?dashboardId=${n.id}&panelId=${a}&limit=50&type=alert`,{},`state-history-${n.id}-${a}`).then(s=>{const r=s.map(i=>({stateModel:Jt.Z.getStateDisplayModel(i.newState),time:n.formatDate(i.time,"MMM D, YYYY HH:mm:ss"),info:Jt.Z.getAlertAnnotationInfo(i)}));this.setState({stateHistoryItems:r})})}render(){const{stateHistoryItems:n}=this.state;return e.createElement("div",null,n.length>0&&e.createElement("div",{className:"p-b-1"},e.createElement("span",{className:"muted"},"Last 50 state changes"),e.createElement(Rr.p,{onConfirm:this.clearHistory,confirmVariant:"destructive",confirmText:"Clear"},e.createElement(D.zx,{className:(0,m.css)`
                  direction: ltr;
                `,variant:"destructive",icon:"trash-alt"},"Clear history"))),e.createElement("ol",{className:"alert-rule-list"},n.length>0?n.map((a,s)=>e.createElement("li",{className:"alert-rule-item",key:`${a.time}-${s}`},e.createElement("div",{className:`alert-rule-item__icon ${a.stateModel.stateClass}`},e.createElement(j.J,{name:a.stateModel.iconClass,size:"xl"})),e.createElement("div",{className:"alert-rule-item__body"},e.createElement("div",{className:"alert-rule-item__header"},e.createElement("p",{className:"alert-rule-item__name"},a.alertName),e.createElement("div",{className:"alert-rule-item__text"},e.createElement("span",{className:`${a.stateModel.stateClass}`},a.stateModel.text))),a.info),e.createElement("div",{className:"alert-rule-item__time"},a.time))):e.createElement("i",null,"No state changes recorded")))}}const Or=Nr;var Yt=o(52419),et=o(78838);class Ir extends e.PureComponent{constructor(){super(...arguments),this.state={isLoading:!1,allNodesExpanded:null,testRuleResponse:{}},this.setFormattedJson=n=>{this.formattedJson=n},this.getTextForClipboard=()=>JSON.stringify(this.formattedJson,null,2),this.onToggleExpand=()=>{this.setState(n=>({...n,allNodesExpanded:!this.state.allNodesExpanded}))},this.getNrOfOpenNodes=()=>this.state.allNodesExpanded===null?3:this.state.allNodesExpanded?20:1,this.renderExpandCollapse=()=>{const{allNodesExpanded:n}=this.state,a=e.createElement(e.Fragment,null,e.createElement(j.J,{name:"minus-circle"})," Collapse All"),s=e.createElement(e.Fragment,null,e.createElement(j.J,{name:"plus-circle"})," Expand All");return n?a:s}}componentDidMount(){this.testRule()}async testRule(){const{dashboard:n,panel:a}=this.props,s=n.getSaveModelClone();s.panels=s.panels.map(l=>l.id===a.id?a.getSaveModel():l);const r={dashboard:s,panelId:a.id};this.setState({isLoading:!0});const i=await(0,_e.i)().post("/api/alerts/test",r);this.setState({isLoading:!1,testRuleResponse:i})}render(){const{testRuleResponse:n,isLoading:a}=this.state,s=(0,D.gN)(this.props.theme);if(a===!0)return e.createElement(Yt.u,{text:"Evaluating rule"});const r=this.getNrOfOpenNodes();return e.createElement(e.Fragment,null,e.createElement("div",{className:"pull-right"},e.createElement(z.Lh,{spacing:"md"},e.createElement("button",{type:"button",className:s,onClick:this.onToggleExpand},this.renderExpandCollapse()),e.createElement(Ke.m,{getText:this.getTextForClipboard,icon:"copy"},"Copy to Clipboard"))),e.createElement(et.g,{json:n,open:r,onDidRender:this.setFormattedJson}))}}const Mr=(0,y.HE)(Ir);var Ar=o(30670);class $r extends e.PureComponent{constructor(){super(...arguments),this.state={validationMessage:"",showStateHistory:!1,showDeleteConfirmation:!1,showTestRule:!1},this.onAngularPanelUpdated=()=>{this.forceUpdate()},this.onAddAlert=()=>{this.panelCtrl?._enableAlert(),this.component?.digest(),this.forceUpdate()},this.onToggleModal=n=>{const a=this.state[n];this.setState({...this.state,[n]:!a})},this.renderTestRule=()=>{if(!this.state.showTestRule)return null;const{panel:n,dashboard:a}=this.props,s=()=>this.onToggleModal("showTestRule");return e.createElement(q.u,{isOpen:!0,icon:"bug",title:"Testing rule",onDismiss:s,onClickBackdrop:s},e.createElement(Mr,{panel:n,dashboard:a}))},this.renderDeleteConfirmation=()=>{if(!this.state.showDeleteConfirmation)return null;const{panel:n}=this.props,a=()=>this.onToggleModal("showDeleteConfirmation");return e.createElement(Le.s,{isOpen:!0,icon:"trash-alt",title:"Delete",body:e.createElement("div",null,"Are you sure you want to delete this alert rule?",e.createElement("br",null),e.createElement("small",null,"You need to save dashboard for the delete to take effect.")),confirmText:"Delete alert",onDismiss:a,onConfirm:()=>{delete n.alert,n.thresholds=[],this.panelCtrl&&(this.panelCtrl.alertState=null,this.panelCtrl.render()),this.component?.digest(),a()}})},this.renderStateHistory=()=>{if(!this.state.showStateHistory)return null;const{panel:n,dashboard:a}=this.props,s=()=>this.onToggleModal("showStateHistory");return e.createElement(q.u,{isOpen:!0,icon:"history",title:"State history",onDismiss:s,onClickBackdrop:s},e.createElement(Or,{dashboard:a,panelId:n.id,onRefresh:()=>this.panelCtrl?.refresh()}))}}async componentDidMount(){T.config.angularSupportEnabled?(await Promise.all([o.e(1189),o.e(5718)]).then(o.bind(o,54608)),this.loadAlertTab()):alert("Angular support disabled, legacy alerting cannot function without angular support")}componentDidUpdate(n){this.loadAlertTab()}componentWillUnmount(){this.component&&this.component.destroy()}async loadAlertTab(){const{panel:n,angularPanelComponent:a}=this.props;if(!this.element||this.component)return;if(a){const d=a.getScope();if(!d.$$childHead){setTimeout(()=>{this.forceUpdate()});return}this.panelCtrl=d.$$childHead.ctrl}else this.panelCtrl=this.getReactAlertPanelCtrl();const s=(0,Mt.w)(),r="<alert-tab />",i={ctrl:this.panelCtrl};this.component=s.load(this.element,i,r);const l=await(0,Ar.E)(n.transformations,n.targets,(0,wt.F)(),n.datasource);l&&this.setState({validationMessage:l})}getReactAlertPanelCtrl(){return{panel:this.props.panel,events:new wr.F,render:()=>{this.props.panel.render()}}}render(){const{alert:n,transformations:a}=this.props.panel,{validationMessage:s}=this.state,r=a&&a.length>0;if(!n&&s)return e.createElement(Qt,{message:s});const i={title:"Panel has no alert rule defined",buttonIcon:"bell",onClick:this.onAddAlert,buttonTitle:"Create Alert"};return e.createElement(e.Fragment,null,e.createElement(se.$,{autoHeightMin:"100%"},e.createElement(z.W2,{padding:"md"},e.createElement("div",{"aria-label":v.wl.components.AlertTab.content},n&&r&&e.createElement(_.b,{severity:b.AppNotificationSeverity.Error,title:"Transformations are not supported in alert queries"}),e.createElement("div",{ref:l=>this.element=l}),n&&e.createElement(z.Lh,null,e.createElement(D.zx,{onClick:()=>this.onToggleModal("showStateHistory"),variant:"secondary"},"State history"),e.createElement(D.zx,{onClick:()=>this.onToggleModal("showTestRule"),variant:"secondary"},"Test rule"),e.createElement(D.zx,{onClick:()=>this.onToggleModal("showDeleteConfirmation"),variant:"destructive"},"Delete")),!n&&!s&&e.createElement(Dr.Z,{...i})))),this.renderTestRule(),this.renderDeleteConfirmation(),this.renderStateHistory())}}const Lr=(t,n)=>({angularPanelComponent:(0,xe.i)(t,n.panel)?.angularComponent}),Fr={},zr=(0,N.connect)(Lr,Fr)($r);var Wr=o(78968),Br=o(91106),Ur=o(28722),kr=o(85184);const Xt=({dashboard:t,panel:n,className:a})=>{const s=(0,b.useSelector)(c=>c.templating),r=(0,Be.TH)(),{loading:i,value:l}=(0,Pe.Z)(()=>(0,kr.aR)(n,t),[n,t,s]);if(i)return e.createElement(D.zx,{disabled:!0},"Create alert rule from this panel");if(!l)return e.createElement(_.b,{severity:"info",title:"No alerting capable query found"},"Cannot create alerts from this panel because no query to an alerting capable datasource is found.");const d=Wr.Cj.renderUrl("alerting/new",{defaults:JSON.stringify(l),returnTo:r.pathname+r.search});return e.createElement(D.Qj,{icon:"bell",onClick:()=>(0,Br.PN)(Ur.z7.alertRuleFromPanel),href:d,className:a,"data-testid":"create-alert-rule-button"},"Create alert rule from this panel")};var Vr=o(3312),qt=o(47702),tt=o(33555),ce=o(22513),_t=o(84369),Hr=o(52467),en=o(10027);function tn({dashboard:t,panel:n,poll:a=!1}){const s=(0,b.useDispatch)(),r=(0,en._)(p=>p.promRules[ce.GC])??_t.oq,i=(0,en._)(p=>p.rulerRules[ce.GC])??_t.oq;(0,e.useEffect)(()=>{const p=()=>{s((0,qt.y6)({rulesSourceName:ce.GC,filter:{dashboardUID:t.uid,panelId:n.id}})),s((0,qt.UR)({rulesSourceName:ce.GC,filter:{dashboardUID:t.uid,panelId:n.id}}))};if(p(),a){const g=setInterval(p,tt.p4);return()=>{clearInterval(g)}}return()=>{}},[s,a,n.id,t.uid]);const l=r.loading||i.loading,d=[r.error,i.error].filter(p=>!!p),c=(0,Hr.Zo)(ce.GC);return{rules:(0,e.useMemo)(()=>c.flatMap(p=>p.groups).flatMap(p=>p.rules).filter(p=>p.annotations[tt.q6.dashboardUID]===t.uid&&p.annotations[tt.q6.panelID]===String(n.id)),[c,t,n]),errors:d,loading:l}}var nn=o(2082);const Kr=({dashboard:t,panel:n})=>{const a=(0,y.wW)(Gr),{errors:s,loading:r,rules:i}=tn({dashboard:t,panel:n,poll:!0}),l=(0,nn.Bz)("grafana"),d=ie.contextSrv.hasPermission(l.create),c=s.length?e.createElement(_.b,{title:"Errors loading rules",severity:"error"},s.map((u,p)=>e.createElement("div",{key:p},"Failed to load Grafana rules state: ",u.message||"Unknown error."))):null;return r&&!i.length?e.createElement("div",{className:a.innerWrapper},c,e.createElement(Yt.u,{text:"Loading rules..."})):i.length?e.createElement(se.$,{autoHeightMin:"100%"},e.createElement("div",{className:a.innerWrapper},c,e.createElement(Vr.i,{rules:i}),!!t.meta.canSave&&d&&e.createElement(Xt,{className:a.newButton,panel:n,dashboard:t}))):e.createElement("div",{"aria-label":v.wl.components.PanelAlertTabContent.content,className:a.noRulesWrapper},c,!!t.uid&&e.createElement(e.Fragment,null,e.createElement("p",null,"There are no alert rules linked to this panel."),!!t.meta.canSave&&d&&e.createElement(Xt,{panel:n,dashboard:t})),!t.uid&&!!t.meta.canSave&&e.createElement(_.b,{severity:"info",title:"Dashboard not saved"},"Dashboard must be saved before alerts can be added."))},Gr=t=>({newButton:(0,m.css)`
    margin-top: ${t.spacing(3)};
  `,innerWrapper:(0,m.css)`
    padding: ${t.spacing(2)};
  `,noRulesWrapper:(0,m.css)`
    margin: ${t.spacing(2)};
    background-color: ${t.colors.background.secondary};
    padding: ${t.spacing(3)};
  `}),jr=T.config.unifiedAlertingEnabled?Kr:zr,Zr=({panel:t,dashboard:n,...a})=>{const{rules:s,loading:r}=tn({panel:t,dashboard:n});return e.createElement(me.O,{...a,counter:r?null:s.length})};var an=o(85532),Fe=o(52273),ye=o(63699),$=o(14544),Qr=o(81520),ne=o(50230),Jr=o(74273),M=o(12308);const Yr={[ye.x.Transformations]:"https://grafana.com/docs/grafana/latest/panels/transformations",[ye.x.FieldConfig]:"https://grafana.com/docs/grafana/latest/panels/field-configuration-options/",[ye.x.FieldConfigOverrides]:"https://grafana.com/docs/grafana/latest/panels/field-configuration-options/#override-a-field"},rn=t=>Yr[t];var nt=o(90741),Xr=o(30306),at=o(73195),qr=o(19221),_r=o(43567),be=o(984),es=o(10186),ts=o(22479),rt=o(83667);const ns=({debugMode:t,index:n,data:a,uiConfig:s,configs:r,onChange:i})=>{const l=(0,y.wW)(as),[d,c]=(0,e.useState)([]),[u,p]=(0,e.useState)([]),g=(0,e.useMemo)(()=>r[n],[r,n]);(0,e.useEffect)(()=>{const f=r[n].transformation,E=f.filter?.options?(0,Lt.b9)(f.filter):void 0,P=r.slice(0,n).map(W=>W.transformation),I=r.slice(n,n+1).map(W=>W.transformation),A=(0,rt.H)(P,a).subscribe(W=>{E&&(W=a.filter(x=>E(x))),c(W)}),S=(0,rt.H)(P,a).pipe((0,ts.z)(W=>(0,rt.H)(I,W))).subscribe(p);return function(){A.unsubscribe(),S.unsubscribe()}},[n,a,r]);const h=(0,e.useMemo)(()=>e.createElement(s.editor,{options:{...s.transformation.defaultOptions,...g.transformation.options},input:d,onChange:f=>{i(n,{...g.transformation,options:f})}}),[s.editor,s.transformation.defaultOptions,g.transformation,d,i,n]);return e.createElement("div",{className:l.editor,"data-testid":v.wl.components.TransformTab.transformationEditor(s.name)},h,t&&e.createElement("div",{className:l.debugWrapper,"data-testid":v.wl.components.TransformTab.transformationEditorDebugger(s.name)},e.createElement("div",{className:l.debug},e.createElement("div",{className:l.debugTitle},"Transformation input data"),e.createElement("div",{className:l.debugJson},e.createElement(et.g,{json:d}))),e.createElement("div",{className:l.debugSeparator},e.createElement(j.J,{name:"arrow-right"})),e.createElement("div",{className:l.debug},e.createElement("div",{className:l.debugTitle},"Transformation output data"),e.createElement("div",{className:l.debugJson},u&&e.createElement(et.g,{json:u})))))},as=t=>{const n=t.isLight?t.v1.palette.gray85:t.v1.palette.gray15;return{title:(0,m.css)`
      display: flex;
      padding: 4px 8px 4px 8px;
      position: relative;
      height: 35px;
      border-radius: 4px 4px 0 0;
      flex-wrap: nowrap;
      justify-content: space-between;
      align-items: center;
    `,name:(0,m.css)`
      font-weight: ${t.typography.fontWeightMedium};
      color: ${t.colors.primary.text};
    `,iconRow:(0,m.css)`
      display: flex;
    `,icon:(0,m.css)`
      background: transparent;
      border: none;
      box-shadow: none;
      cursor: pointer;
      color: ${t.colors.text.secondary};
      margin-left: ${t.spacing(1)};
      &:hover {
        color: ${t.colors.text};
      }
    `,editor:(0,m.css)``,debugWrapper:(0,m.css)`
      display: flex;
      flex-direction: row;
    `,debugSeparator:(0,m.css)`
      width: 48px;
      min-height: 300px;
      display: flex;
      align-items: center;
      align-self: stretch;
      justify-content: center;
      margin: 0 ${t.spacing(.5)};
      color: ${t.colors.primary.text};
    `,debugTitle:(0,m.css)`
      padding: ${t.spacing(1)} ${t.spacing(.25)};
      font-family: ${t.typography.fontFamilyMonospace};
      font-size: ${t.typography.bodySmall.fontSize};
      color: ${t.colors.text};
      border-bottom: 1px solid ${n};
      flex-grow: 0;
      flex-shrink: 1;
    `,debug:(0,m.css)`
      margin-top: ${t.spacing(1)};
      padding: 0 ${t.spacing(1,1,1)};
      border: 1px solid ${n};
      background: ${t.isLight?t.v1.palette.white:t.v1.palette.gray05};
      border-radius: ${t.shape.borderRadius(1)};
      width: 100%;
      min-height: 300px;
      display: flex;
      flex-direction: column;
      align-self: stretch;
    `,debugJson:(0,m.css)`
      flex-grow: 1;
      height: 100%;
      overflow: hidden;
      padding: ${t.spacing(.5)};
    `}};var rs=o(65604);const ss=({index:t,data:n,config:a,onChange:s})=>{const r=(0,y.wW)(os),i=(0,e.useMemo)(()=>({data:n}),[n]);return e.createElement("div",{className:r.wrapper},e.createElement(le.g,{label:"Apply transformation to"},e.createElement(rs.M,{value:a.filter,context:i,item:{},onChange:l=>s(t,{...a,filter:l})})))},os=t=>{const n=t.shape.borderRadius();return{wrapper:(0,m.css)`
      padding: ${t.spacing(2)};
      border: 2px solid ${t.colors.background.secondary};
      border-top: none;
      border-radius: 0 0 ${n} ${n};
      position: relative;
      top: -4px;
    `}},is=({onRemove:t,index:n,id:a,data:s,configs:r,uiConfig:i,onChange:l})=>{const[d,c]=(0,at.Z)(!1),[u,p]=(0,at.Z)(!1),[g,h]=(0,at.Z)(!1),f=!!r[n].transformation.disabled,E=r[n].transformation.filter!=null,P=E||s.length>1,I=(0,e.useCallback)(x=>{const U=r[x].transformation;l(x,{...U,disabled:U.disabled?void 0:!0})},[l,r]),A=(0,e.useCallback)(()=>{let x={...r[n].transformation};x.filter?delete x.filter:x.filter={id:qr.E4.byRefId,options:""},l(n,x)},[l,n,r]),S=(0,e.useCallback)((x,U,ae)=>de=>{let Ce="panel_editor_tabs_transformations_toggle";M.default.featureToggles.transformationsRedesign&&(Ce="transformations_redesign_"+Ce),(0,Ee.ff)(Ce,{action:ae?"off":"on",toggleId:U,transformationId:r[n].transformation.id}),x(de)},[r,n]),W=({isOpen:x})=>e.createElement(z.Lh,{align:"center",width:"auto"},i.state&&e.createElement(nt.u,{state:i.state}),e.createElement(be.V,{title:"Show transform help",icon:"info-circle",onClick:S(h,"help",g),active:g}),P&&e.createElement(be.V,{title:"Filter",icon:"filter",onClick:S(A,"filter",E),active:E}),e.createElement(be.V,{title:"Debug",disabled:!x,icon:"bug",onClick:S(p,"debug",u),active:u}),e.createElement(be.V,{title:"Disable transformation",icon:f?"eye-slash":"eye",onClick:S(()=>I(n),"disabled",f),active:f}),e.createElement(be.y,{title:"Remove",icon:"trash-alt",onClick:()=>M.default.featureToggles.transformationsRedesign?c(!0):t(n)}),M.default.featureToggles.transformationsRedesign&&e.createElement(Le.s,{isOpen:d,title:`Delete ${i.name}?`,body:"Note that removing one transformation may break others. If there is only a single transformation, you will go back to the main selection screen.",confirmText:"Delete",onConfirm:()=>{c(!1),t(n)},onDismiss:()=>c(!1)}));return e.createElement(es.t,{id:a,index:n,title:i.name,draggable:!0,actions:W,disabled:f},g&&e.createElement(_r.h,{markdown:ls(i)}),E&&e.createElement(ss,{index:n,config:r[n].transformation,data:s,onChange:l}),e.createElement(ns,{debugMode:u,index:n,data:s,configs:r,uiConfig:i,onChange:l}))};function ls(t){return`
${t.help??t.description}

Go the <a href="https://grafana.com/docs/grafana/latest/panels/transformations/?utm_source=grafana" target="_blank" rel="noreferrer">
transformation documentation
</a> for more.
`}const cs=({data:t,onChange:n,onRemove:a,configs:s})=>e.createElement(e.Fragment,null,s.map((r,i)=>{const l=Fe.Z.getIfExists(r.transformation.id);return l?e.createElement(is,{index:i,id:`${r.id}`,key:`${r.id}`,data:t,configs:s,uiConfig:l,onRemove:a,onChange:n}):null})),ds="dashboard.components.TransformationEditor.featureInfoBox.isDismissed",st="viewAll",us=[[st,"View all"],...Object.entries(Xr.Vx)];class ps extends e.PureComponent{constructor(n){super(n),this.onSearchChange=r=>{this.setState({search:r.target.value})},this.onSearchKeyDown=r=>{if(r.key==="Enter"){const{search:i}=this.state;if(i){const l=i.toLowerCase(),d=Fe.Z.list().filter(c=>(c.name+c.description).toLowerCase().indexOf(l)>=0);d.length>0&&this.onTransformationAdd({value:d[0].id})}}else r.keyCode===27&&(this.setState({search:"",showPicker:!1}),r.stopPropagation())},this.getTransformationNextId=r=>{const{transformations:i}=this.state;let l=0;const d=i.filter(c=>c.id.startsWith(r)).map(c=>c.id);return d.length!==0&&(l=Math.max(...d.map(c=>parseInt(c.match(/\d+/)[0],10)))+1),`${r}-${l}`},this.onTransformationAdd=r=>{let i="panel_editor_tabs_transformations_management";M.default.featureToggles.transformationsRedesign&&(i="transformations_redesign_"+i),(0,Ee.ff)(i,{action:"add",transformationId:r.value});const{transformations:l}=this.state,d=this.getTransformationNextId(r.value);this.setState({search:"",showPicker:!1}),this.onChange([...l,{id:d,transformation:{id:r.value,options:{}}}])},this.onTransformationChange=(r,i)=>{const{transformations:l}=this.state,d=Array.from(l);let c="panel_editor_tabs_transformations_management";M.default.featureToggles.transformationsRedesign&&(c="transformations_redesign_"+c),(0,Ee.ff)(c,{action:"change",transformationId:d[r].transformation.id}),d[r].transformation=i,this.onChange(d)},this.onTransformationRemove=r=>{const{transformations:i}=this.state,l=Array.from(i);let d="panel_editor_tabs_transformations_management";M.default.featureToggles.transformationsRedesign&&(d="transformations_redesign_"+d),(0,Ee.ff)(d,{action:"remove",transformationId:l[r].transformation.id}),l.splice(r,1),this.onChange(l)},this.onTransformationRemoveAll=()=>{this.onChange([]),this.setState({showRemoveAllModal:!1})},this.onDragEnd=r=>{const{transformations:i}=this.state;if(!r||!r.destination)return;const l=r.source.index,d=r.destination.index;if(l===d)return;const c=Array.from(i),[u]=c.splice(l,1);c.splice(d,0,u),this.onChange(c)},this.renderTransformationEditors=()=>{const{data:r,transformations:i}=this.state;return e.createElement(an.Z5,{onDragEnd:this.onDragEnd},e.createElement(an.bK,{droppableId:"transformations-list",direction:"vertical"},l=>e.createElement("div",{ref:l.innerRef,...l.droppableProps},e.createElement(cs,{configs:i,data:r,onRemove:this.onTransformationRemove,onChange:this.onTransformationChange}),l.placeholder)))};const a=n.panel.transformations||[],s=this.buildTransformationIds(a);this.state={transformations:a.map((r,i)=>({transformation:r,id:s[i]})),data:[],search:"",selectedFilter:st,showIllustrations:!0}}buildTransformationIds(n){const a={},s=[];for(let r=0;r<n.length;r++){const i=n[r];a[i.id]===void 0?a[i.id]=0:a[i.id]+=1,s.push(`${n[r].id}-${a[n[r].id]}`)}return s}componentDidMount(){this.subscription=this.props.panel.getQueryRunner().getData({withTransforms:!1,withFieldConfig:!1}).subscribe({next:n=>this.setState({data:n.series})})}componentWillUnmount(){this.subscription&&this.subscription.unsubscribe()}componentDidUpdate(n,a){if(M.default.featureToggles.transformationsRedesign){const r=!(a.transformations.length>0)||a.showPicker,l=!(this.state.transformations.length>0)||this.state.showPicker;if(r!==l){const d=Math.random()/2;this.setState({scrollTop:l?d:Number.MAX_SAFE_INTEGER})}}}onChange(n){this.setState({transformations:n}),this.props.panel.setTransformations(n.map(a=>a.transformation))}renderTransformsPicker(){const n=ze(M.default.theme2),{transformations:a,search:s}=this.state;let r=null,i=Fe.Z.list().sort((c,u)=>c.name>u.name?1:u.name>c.name?-1:0);if(this.state.selectedFilter!==st&&(i=i.filter(c=>c.categories&&this.state.selectedFilter&&c.categories.has(this.state.selectedFilter))),s){const c=s.toLowerCase(),u=i.filter(p=>(p.name+p.description).toLowerCase().indexOf(c)>=0);r=e.createElement(e.Fragment,null,u.length," / ",i.length," \xA0\xA0",e.createElement($e.h,{name:"times",onClick:()=>{this.setState({search:""})},tooltip:"Clear search"})),i=u}const l=!a?.length,d=l||this.state.showPicker;return!r&&d&&!l&&(r=e.createElement($e.h,{name:"times",onClick:()=>{this.setState({showPicker:!1})},tooltip:"Close picker"})),e.createElement(e.Fragment,null,l&&!M.default.featureToggles.transformationsRedesign&&e.createElement(z.W2,{grow:1},e.createElement(Jr.G,{storageKey:ds,defaultValue:!1},(c,u)=>c?null:e.createElement(_.b,{title:"Transformations",severity:"info",onRemove:()=>{u(!0)}},e.createElement("p",null,"Transformations allow you to join, calculate, re-order, hide, and rename your query results before they are visualized. ",e.createElement("br",null),"Many transforms are not suitable if you're using the Graph visualization, as it currently only supports time series data. ",e.createElement("br",null),"It can help to switch to the Table visualization to understand what a transformation is doing."," "),e.createElement("a",{href:rn(ye.x.Transformations),className:"external-link",target:"_blank",rel:"noreferrer"},"Read more")))),d?e.createElement(e.Fragment,null,M.default.featureToggles.transformationsRedesign&&e.createElement(e.Fragment,null,!l&&e.createElement(D.zx,{variant:"secondary",fill:"text",icon:"angle-left",onClick:()=>{this.setState({showPicker:!1})}},"Go back to\xA0",e.createElement("i",null,"Transformations in use")),e.createElement("div",{className:n.pickerInformationLine},e.createElement("a",{href:rn(ye.x.Transformations),className:"external-link",target:"_blank",rel:"noreferrer"},e.createElement("span",{className:n.pickerInformationLineHighlight},"Transformations")," ",e.createElement(j.J,{name:"external-link-alt"})),"\xA0allow you to manipulate your data before a visualization is applied.")),e.createElement(z.wc,null,!M.default.featureToggles.transformationsRedesign&&e.createElement(re.I,{"data-testid":v.wl.components.Transforms.searchInput,value:s??"",autoFocus:!l,placeholder:"Search for transformation",onChange:this.onSearchChange,onKeyDown:this.onSearchKeyDown,suffix:r}),!M.default.featureToggles.transformationsRedesign&&i.map(c=>e.createElement(ms,{key:c.name,transform:c,onClick:()=>{this.onTransformationAdd({value:c.id})}})),M.default.featureToggles.transformationsRedesign&&e.createElement("div",{className:n.searchWrapper},e.createElement(re.I,{"data-testid":v.wl.components.Transforms.searchInput,className:n.searchInput,value:s??"",autoFocus:!l,placeholder:"Search for transformation",onChange:this.onSearchChange,onKeyDown:this.onSearchKeyDown,suffix:r}),e.createElement("div",{className:n.showImages},e.createElement("span",{className:n.illustationSwitchLabel},"Show images")," ",e.createElement(ee.r,{value:this.state.showIllustrations,onChange:()=>this.setState({showIllustrations:!this.state.showIllustrations})}))),M.default.featureToggles.transformationsRedesign&&e.createElement("div",{className:n.filterWrapper},us.map(([c,u])=>e.createElement(Qr.B,{key:c,onClick:()=>this.setState({selectedFilter:c}),label:u,selected:this.state.selectedFilter===c}))),M.default.featureToggles.transformationsRedesign&&e.createElement(gs,{showIllustrations:this.state.showIllustrations,transformations:i,onClick:c=>{this.onTransformationAdd({value:c})}}))):e.createElement(D.zx,{icon:"plus",variant:"secondary",onClick:()=>{this.setState({showPicker:!0})},"data-testid":v.wl.components.Transforms.addTransformationButton},"Add",M.default.featureToggles.transformationsRedesign?" another ":" ","transformation"))}render(){const n=ze(M.default.theme2),{panel:{alert:a}}=this.props,{transformations:s}=this.state,r=s.length>0;return!r&&a?e.createElement(Qt,{message:"Transformations can't be used on a panel with existing alerts"}):e.createElement(se.$,{scrollTop:this.state.scrollTop,autoHeightMin:"100%"},e.createElement(z.W2,{padding:"lg"},e.createElement("div",{"data-testid":v.wl.components.TransformTab.content},r&&a?e.createElement(_.b,{severity:b.AppNotificationSeverity.Error,title:"Transformations can't be used on a panel with alerts"}):null,r&&M.default.featureToggles.transformationsRedesign&&!this.state.showPicker&&e.createElement("div",{className:n.listInformationLineWrapper},e.createElement("span",{className:n.listInformationLineText},"Transformations in use")," ",e.createElement(D.zx,{size:"sm",variant:"secondary",onClick:()=>{this.setState({showRemoveAllModal:!0})}},"Delete all transformations"),e.createElement(Le.s,{isOpen:!!this.state.showRemoveAllModal,title:"Delete all transformations?",body:"By deleting all transformations, you will go back to the main selection screen.",confirmText:"Delete all",onConfirm:()=>this.onTransformationRemoveAll(),onDismiss:()=>this.setState({showRemoveAllModal:!1})})),r&&(!M.default.featureToggles.transformationsRedesign||!this.state.showPicker)&&this.renderTransformationEditors(),this.renderTransformsPicker())))}}function ms({transform:t,onClick:n}){const a=(0,y.wW)(ze);return e.createElement(ne.Z,{className:a.card,"data-testid":v.wl.components.TransformTab.newTransform(t.name),onClick:n},e.createElement(ne.Z.Heading,null,t.name),e.createElement(ne.Z.Description,null,t.description),t.state&&e.createElement(ne.Z.Tags,null,e.createElement(nt.u,{state:t.state})))}const ze=t=>({card:(0,m.css)`
      margin: 0;
      padding: ${t.spacing(1)};
    `,grid:(0,m.css)`
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      grid-auto-rows: 1fr;
      gap: ${t.spacing(2)} ${t.spacing(1)};
      width: 100%;
    `,newCard:(0,m.css)`
      grid-template-rows: min-content 0 1fr 0;
    `,heading:(0,m.css)`
      font-weight: 400;

      > button {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: no-wrap;
      }
    `,description:(0,m.css)`
      font-size: 12px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    `,image:(0,m.css)`
      display: block;
      max-width: 100%;
      margin-top: ${t.spacing(2)};
    `,searchWrapper:(0,m.css)`
      display: flex;
      flex-wrap: wrap;
      column-gap: 27px;
      row-gap: 16px;
      width: 100%;
    `,searchInput:(0,m.css)`
      flex-grow: 1;
      width: initial;
    `,showImages:(0,m.css)`
      flex-basis: 0;
      display: flex;
      gap: 8px;
      align-items: center;
    `,pickerInformationLine:(0,m.css)`
      font-size: 16px;
      margin-bottom: ${t.spacing(2)};
    `,pickerInformationLineHighlight:(0,m.css)`
      vertical-align: middle;
    `,illustationSwitchLabel:(0,m.css)`
      white-space: nowrap;
    `,filterWrapper:(0,m.css)`
      padding: ${t.spacing(1)} 0;
      display: flex;
      flex-wrap: wrap;
      row-gap: ${t.spacing(1)};
      column-gap: ${t.spacing(.5)};
    `,listInformationLineWrapper:(0,m.css)`
      display: flex;
      justify-content: space-between;
      margin-bottom: 24px;
    `,listInformationLineText:(0,m.css)`
      font-size: 16px;
    `,pluginStateInfoWrapper:(0,m.css)`
      margin-left: 5px;
    `});function gs({showIllustrations:t,transformations:n,onClick:a}){const s=(0,y.wW)(ze);return e.createElement("div",{className:s.grid},n.map(r=>e.createElement(ne.Z,{key:r.id,className:s.newCard,"data-testid":v.wl.components.TransformTab.newTransform(r.name),onClick:()=>a(r.id)},e.createElement(ne.Z.Heading,{className:s.heading},e.createElement(e.Fragment,null,e.createElement("span",null,r.name),e.createElement("span",{className:s.pluginStateInfoWrapper},e.createElement(nt.u,{state:r.state})))),e.createElement(ne.Z.Description,{className:s.description},e.createElement(e.Fragment,null,e.createElement("span",null,fs(r.id)),t&&e.createElement("span",null,e.createElement("img",{className:s.image,src:hs(r.id),alt:r.name})))))))}const hs=t=>`public/img/transformations/${M.default.theme2.isDark?"dark":"light"}/${t}.svg`,fs=t=>({[$.W.concatenate]:"Combine all fields into a single frame.",[$.W.configFromData]:"Set unit, min, max and more.",[$.W.fieldLookup]:"Use a field value to lookup countries, states, or airports.",[$.W.filterFieldsByName]:"Removes part of the query results using a regex pattern.",[$.W.filterByRefId]:"Filter out queries in panels that have multiple queries.",[$.W.filterByValue]:"Removes rows of the query results using user-defined filters.",[$.W.groupBy]:"Group the data by a field value then process calculations.",[$.W.groupingToMatrix]:"Summarizes and reorganizes data based on three fields.",[$.W.joinByField]:"Combine rows from 2+ tables, based on a related field.",[$.W.labelsToFields]:"Groups series by time and return labels or tags as fields.",[$.W.merge]:"Merge multiple series. Values will be combined into one row.",[$.W.organize]:"Allows the user to re-order, hide, or rename fields / columns.",[$.W.partitionByValues]:"Splits a one-frame dataset into multiple series.",[$.W.prepareTimeSeries]:"Will stretch data frames from the wide format into the long format.",[$.W.reduce]:"Reduce all rows or data points to a single value (ex. max, mean).",[$.W.renameByRegex]:"Reduce all rows or data points to a single value (ex. max, mean).",[$.W.seriesToRows]:"Merge multiple series. Return time, metric and values as a row."})[t]||Fe.Z.getIfExists(t)?.description||"",vs=(0,y.Zz)(ps);var Es=o(17312),sn=o(5926),ys=o(61863);class bs extends e.PureComponent{constructor(n){super(n),this.onRunQueries=()=>{this.props.panel.refresh()},this.onOpenQueryInspector=()=>{w.E1.partial({inspect:this.props.panel.id,inspectTab:"query"})},this.onOptionsChange=a=>{const{panel:s}=this.props;s.updateQueries(a),a.dataSource.uid!==s.datasource?.uid&&setTimeout(this.onRunQueries,10),this.forceUpdate()}}buildQueryOptions(n){const a=n.datasource??{default:!0},s=(0,sn.ak)().getInstanceSettings(a);return{cacheTimeout:s?.meta.queryOptions?.cacheTimeout?n.cacheTimeout:void 0,dataSource:{default:s?.isDefault,type:s?.type,uid:s?.uid},queryCachingTTL:s?.cachingConfig?.enabled?n.queryCachingTTL:void 0,queries:n.targets,maxDataPoints:n.maxDataPoints,minInterval:n.interval,timeRange:{from:n.timeFrom,shift:n.timeShift,hide:n.hideTimeOverride}}}async componentDidMount(){const{panel:n}=this.props;if(!n.datasource){const a=(0,sn.ak)().getInstanceSettings(null);n.datasource=(0,Es.iU)(a),this.forceUpdate()}}render(){const{panel:n}=this.props;if(!n.datasource)return null;const a=this.buildQueryOptions(n);return e.createElement(ys.D,{options:a,queryRunner:n.getQueryRunner(),onRunQueries:this.onRunQueries,onOpenQueryInspector:this.onOpenQueryInspector,onOptionsChange:this.onOptionsChange})}}const on=e.memo(({panel:t,dashboard:n,tabs:a,onChangeTab:s})=>{const r=(0,Zt.N)(),i=(0,y.wW)(Ps),l=(0,e.useCallback)(c=>{let u="panel_editor_tabs_changed";T.config.featureToggles.transformationsRedesign&&(u="transformations_redesign_"+u),c.active||(0,Ee.ff)(u,{tab_id:c.id}),s(c)},[s]);(0,e.useEffect)(()=>{const c=new Dt.w0;return c.add(t.events.subscribe(Q.pO,r)),c.add(t.events.subscribe(Q.Xw,r)),()=>c.unsubscribe()},[t,n,r]);const d=a.find(c=>c.active);return a.length===0?null:e.createElement("div",{className:i.wrapper},e.createElement(He.J,{className:i.tabBar,hideBorder:!0},a.map(c=>c.id===R.Ip.Alert?Cs(c,t,n,l):e.createElement(me.O,{key:c.id,label:c.text,active:c.active,onChangeTab:()=>l(c),icon:(0,qe.toIconName)(c.icon),counter:ln(t,c)}))),e.createElement(xr.I,{className:i.tabContent},d.id===R.Ip.Query&&e.createElement(bs,{panel:t,queries:t.targets}),d.id===R.Ip.Alert&&e.createElement(jr,{panel:t,dashboard:n}),d.id===R.Ip.Transform&&e.createElement(vs,{panel:t})))});on.displayName="PanelEditorTabs";function ln(t,n){switch(n.id){case R.Ip.Query:return t.targets.length;case R.Ip.Alert:return t.alert?1:0;case R.Ip.Transform:return(t.getTransformations()??[]).length}return null}function Cs(t,n,a,s){return!T.config.alertingEnabled&&!T.config.unifiedAlertingEnabled?null:T.config.unifiedAlertingEnabled?e.createElement(Zr,{key:t.id,label:t.text,active:t.active,onChangeTab:()=>s(t),icon:(0,qe.toIconName)(t.icon),panel:n,dashboard:a}):T.config.alertingEnabled?e.createElement(me.O,{key:t.id,label:t.text,active:t.active,onChangeTab:()=>s(t),icon:(0,qe.toIconName)(t.icon),counter:ln(n,t)}):null}const Ps=t=>({wrapper:(0,m.css)`
      display: flex;
      flex-direction: column;
      height: 100%;
    `,tabBar:(0,m.css)`
      padding-left: ${t.spacing(2)};
    `,tabContent:(0,m.css)`
      padding: 0;
      display: flex;
      flex-direction: column;
      flex: 1;
      min-height: 0;
      background: ${t.colors.background.primary};
      border: 1px solid ${t.components.panel.borderColor};
      border-left: none;
      border-bottom: none;
      border-top-right-radius: ${t.shape.borderRadius(1.5)};
    `});var Ss=o(82152);const Ts=(0,Ss.Z)((t,n)=>{const a=[];if(!n)return a;let s=R.Ip.Visualize;if(n.meta.skipDataQuery)return[];n.meta.skipDataQuery||(s=R.Ip.Query,a.push({id:R.Ip.Query,text:"Query",icon:"database",active:!1}),a.push({id:R.Ip.Transform,text:"Transform",icon:"process",active:!1}));const{alertingEnabled:r,unifiedAlertingEnabled:i}=(0,M.iE)(),l=ie.contextSrv.hasPermission((0,nn.Bz)(ce.GC).read),d=r||i&&l,c=n.meta.id==="graph",u=n.meta.id==="timeseries";(d&&c||u)&&a.push({id:R.Ip.Alert,text:"Alert",icon:"bell",active:!1});const p=a.find(g=>g.id===(t||s))??a[0];return p.active=!0,a}),xs=(t,n)=>{const a=t.panelEditor.getPanel(),s=(0,xe.i)(t,a);return{panel:a,plugin:s?.plugin,instanceState:s?.instanceState,initDone:t.panelEditor.initDone,uiState:t.panelEditor.ui,tableViewEnabled:t.panelEditor.tableViewEnabled,variables:(0,Qe.gt)(n.dashboard.uid,t)}},ws={initPanelEditor:Dn,discardPanelChanges:ft,updatePanelEditorUIState:Ve,updateTimeZoneForSession:fa.YT,toggleTableView:J.OT,notifyApp:K.$l},Ds=(0,N.connect)(xs,ws);class Rs extends e.PureComponent{constructor(){super(...arguments),this.state={showSaveLibraryPanelModal:!1},this.triggerForceUpdate=()=>{this.forceUpdate()},this.onBack=()=>{w.E1.partial({editPanel:null,tab:null,showCategory:null})},this.onDiscard=()=>{this.props.discardPanelChanges(),this.onBack()},this.onSaveDashboard=()=>{ua.h$.publish(new Q.Dn({component:ba.d,props:{dashboard:this.props.dashboard}}))},this.onSaveLibraryPanel=async()=>{(0,ve.V)(this.props.panel)&&this.setState({showSaveLibraryPanelModal:!0})},this.onChangeTab=n=>{w.E1.partial({tab:n.id})},this.onFieldConfigChange=n=>{this.props.panel.updateFieldConfig({...n})},this.onPanelOptionsChanged=n=>{this.props.panel.updateOptions(n)},this.onPanelConfigChanged=(n,a)=>{this.props.panel.setProperty(n,a),this.props.panel.render(),this.forceUpdate()},this.onDisplayModeChange=n=>{const{updatePanelEditorUIState:a}=this.props;this.props.tableViewEnabled&&this.props.toggleTableView(),a({mode:n})},this.onToggleTableView=()=>{this.props.toggleTableView()},this.onGoBackToDashboard=()=>{w.E1.partial({editPanel:null,tab:null,showCategory:null})},this.onConfirmAndDismissLibarayPanelModel=()=>{this.setState({showSaveLibraryPanelModal:!1})}}componentDidMount(){this.props.initPanelEditor(this.props.sourcePanel,this.props.dashboard)}componentDidUpdate(){const{panel:n,initDone:a}=this.props;a&&!this.eventSubs&&(this.eventSubs=new Dt.w0,this.eventSubs.add(n.events.subscribe(Q.Wj,this.triggerForceUpdate)))}componentWillUnmount(){this.eventSubs?.unsubscribe()}renderPanel(n,a){const{dashboard:s,panel:r,uiState:i,tableViewEnabled:l,theme:d}=this.props;return e.createElement("div",{className:n.mainPaneWrapper,key:"panel"},this.renderPanelToolbar(n),e.createElement("div",{className:n.panelWrapper},e.createElement(we.Z,null,({width:c,height:u})=>{if(c<3||u<3)return null;if(a&&(u-=d.spacing.gridSize*2),l)return e.createElement(Tr,{width:c,height:u,panel:r,dashboard:s});const p=(0,je.jF)(i.mode,c,u,r);return e.createElement("div",{className:n.centeringContainer,style:{width:c,height:u}},e.createElement("div",{style:p,"data-panelid":r.id},e.createElement(Ea.l,{key:r.key,stateKey:r.key,dashboard:s,panel:r,isEditing:!0,isViewing:!1,lazy:!1,width:p.width,height:p.height})))})))}renderPanelAndEditor(n,a){const{panel:s,dashboard:r,plugin:i,tab:l}=this.props,d=Ts(l,i),c=d.length===0,u=this.renderPanel(a,c);return d.length===0?e.createElement("div",{className:a.onlyPanel},u):e.createElement(Nt.U,{splitOrientation:"horizontal",maxSize:-200,paneSize:n.topPaneSize,primary:"first",secondaryPaneStyle:{minHeight:0},onDragFinished:p=>{p&&Ve({topPaneSize:p/window.innerHeight})}},u,e.createElement("div",{className:a.tabsWrapper,"aria-label":v.wl.components.PanelEditor.DataPane.content,key:"panel-editor-tabs"},e.createElement(on,{key:s.key,panel:s,dashboard:r,tabs:d,onChangeTab:this.onChangeTab})))}renderTemplateVariables(n){const{variables:a}=this.props;return a.length?e.createElement("div",{className:n.variablesWrapper},e.createElement(Ot,{variables:a})):null}renderPanelToolbar(n){const{dashboard:a,uiState:s,variables:r,updateTimeZoneForSession:i,panel:l,tableViewEnabled:d}=this.props;return e.createElement("div",{className:n.panelToolbar},e.createElement(z.Lh,{justify:r.length>0?"space-between":"flex-end",align:"flex-start"},this.renderTemplateVariables(n),e.createElement(De.K,{gap:1},e.createElement(ee.x,{label:"Table view",showLabel:!0,id:"table-view",value:d,onClick:this.onToggleTableView,"aria-label":v.wl.components.PanelEditor.toggleTableView}),e.createElement(Oe.S,{value:s.mode,options:R.d7,onChange:this.onDisplayModeChange}),e.createElement(ya.C,{dashboard:a,onChangeTimeZone:i,isOnCanvas:!0}),!s.isPanelOptionsVisible&&e.createElement(Ye,{panel:l}))))}renderEditorActions(){const n="sm";let a=[e.createElement(D.zx,{onClick:this.onDiscard,title:"Undo all changes",key:"discard",size:n,variant:"destructive",fill:"outline"},"Discard"),this.props.panel.libraryPanel?e.createElement(D.zx,{onClick:this.onSaveLibraryPanel,variant:"primary",size:n,title:"Apply changes and save library panel",key:"save-panel"},"Save library panel"):e.createElement(D.zx,{onClick:this.onSaveDashboard,title:"Apply changes and save dashboard",key:"save",size:n,variant:"secondary"},"Save"),e.createElement(D.zx,{onClick:this.onBack,variant:"primary",title:"Apply changes and go back to dashboard","data-testid":v.wl.components.PanelEditor.applyButton,key:"apply",size:n},"Apply")];return this.props.panel.libraryPanel&&(a.splice(1,0,e.createElement(mt.JY,{key:"unlink-controller"},({showModal:s,hideModal:r})=>e.createElement(Ie.h,{onClick:()=>{s(va.i,{onConfirm:()=>{this.props.panel.unlinkLibraryPanel(),this.forceUpdate()},onDismiss:r,isOpen:!0})},title:"Disconnects this panel from the library panel so that you can edit it regularly.",key:"unlink"},"Unlink"))),a.pop()),a}renderOptionsPane(){const{plugin:n,dashboard:a,panel:s,instanceState:r}=this.props;return n?e.createElement(br,{plugin:n,dashboard:a,panel:s,instanceState:r,onFieldConfigsChange:this.onFieldConfigChange,onPanelOptionsChanged:this.onPanelOptionsChanged,onPanelConfigChange:this.onPanelConfigChanged}):e.createElement("div",null)}render(){const{initDone:n,uiState:a,theme:s,sectionNav:r,pageNav:i,className:l,updatePanelEditorUIState:d}=this.props,c=Os(s,this.props);return n?e.createElement(C.T,{navModel:r,pageNav:i,"aria-label":v.wl.components.PanelEditor.General.content,layout:L.Q.Custom,className:l},e.createElement(da.A,{actions:e.createElement(ca.R,{alignment:"right"},this.renderEditorActions())}),e.createElement("div",{className:c.wrapper},e.createElement("div",{className:c.verticalSplitPanesWrapper},a.isPanelOptionsVisible?e.createElement(Nt.U,{splitOrientation:"vertical",maxSize:-300,paneSize:a.rightPaneSize,primary:"second",onDragFinished:u=>{u&&d({rightPaneSize:u/window.innerWidth})}},this.renderPanelAndEditor(a,c),this.renderOptionsPane()):this.renderPanelAndEditor(a,c)),this.state.showSaveLibraryPanelModal&&e.createElement(gt,{panel:this.props.panel,folderUid:this.props.dashboard.meta.folderUid??"",onConfirm:this.onConfirmAndDismissLibarayPanelModel,onDiscard:this.onDiscard,onDismiss:this.onConfirmAndDismissLibarayPanelModel}))):null}}const Ns=(0,y.HE)(Ds(Rs)),Os=(0,Rt.B)((t,n)=>{const{uiState:a}=n,s=t.spacing(2);return{wrapper:(0,m.css)({width:"100%",flexGrow:1,minHeight:0,display:"flex",paddingTop:t.spacing(2)}),verticalSplitPanesWrapper:(0,m.css)`
      display: flex;
      flex-direction: column;
      height: 100%;
      width: 100%;
      position: relative;
    `,mainPaneWrapper:(0,m.css)`
      display: flex;
      flex-direction: column;
      height: 100%;
      width: 100%;
      padding-right: ${a.isPanelOptionsVisible?0:s};
    `,variablesWrapper:(0,m.css)`
      label: variablesWrapper;
      display: flex;
      flex-grow: 1;
      flex-wrap: wrap;
      gap: ${t.spacing(1,2)};
    `,panelWrapper:(0,m.css)`
      flex: 1 1 0;
      min-height: 0;
      width: 100%;
      padding-left: ${s};
    `,tabsWrapper:(0,m.css)`
      height: 100%;
      width: 100%;
    `,panelToolbar:(0,m.css)`
      display: flex;
      padding: 0 0 ${s} ${s};
      justify-content: space-between;
      flex-wrap: wrap;
    `,angularWarning:(0,m.css)`
      display: flex;
      height: theme.spacing(4);
      align-items: center;
    `,toolbarLeft:(0,m.css)`
      padding-left: ${t.spacing(1)};
    `,centeringContainer:(0,m.css)`
      display: flex;
      justify-content: center;
      align-items: center;
      position: relative;
      flex-direction: column;
    `,onlyPanel:(0,m.css)`
      height: 100%;
      position: absolute;
      overflow: hidden;
      width: 100%;
    `}});var Is=o(71107),Ms=o(48024),As=o(44790),$s=o(77972);const Ls=({annotation:t,events:n,onEnabledChanged:a})=>{const[s,r]=(0,e.useState)(!1),i=(0,y.wW)(Fs),l=()=>(0,$s.kt)().cancel(t);return(0,e.useEffect)(()=>{const d=n.getStream(Q.z).subscribe({next:u=>{u.payload===t&&r(!0)}}),c=n.getStream(Q.RB).subscribe({next:u=>{u.payload===t&&r(!1)}});return()=>{d.unsubscribe(),c.unsubscribe()}}),e.createElement("div",{key:t.name,className:i.annotation},e.createElement(Is.Z,null,e.createElement(Ms._,{label:t.name,disabled:s,"data-testid":v.wl.pages.Dashboard.SubMenu.Annotations.annotationLabel(t.name)},e.createElement(ee.x,{label:t.name,value:t.enable,onChange:()=>a(t),disabled:s,"data-testid":v.wl.pages.Dashboard.SubMenu.Annotations.annotationToggle(t.name)})),e.createElement("div",{className:i.indicator},e.createElement(As.T,{loading:s,onCancel:l}))))};function Fs(t){return{annotation:(0,m.css)`
      display: inline-block;
      margin-right: ${t.spacing(1)};

      .fa-caret-down {
        font-size: 75%;
        padding-left: ${t.spacing(1)};
      }

      .gf-form-inline .gf-form {
        margin-bottom: 0;
      }
    `,indicator:(0,m.css)`
      align-self: center;
      padding: 0 ${t.spacing(.5)};
    `}}const zs=({annotations:t,onAnnotationChanged:n,events:a})=>{const[s,r]=(0,e.useState)([]);return(0,e.useEffect)(()=>{r(t.filter(i=>i.hide!==!0))},[t]),s.length===0?null:e.createElement("div",{"data-testid":v.wl.pages.Dashboard.SubMenu.Annotations.annotationsWrapper},s.map(i=>e.createElement(Ls,{events:a,annotation:i,onEnabledChanged:n,key:i.name})))};var Ws=o(19559),ot=o(42690),Bs=o(1674),Us=o(45937);const ks=t=>{const{link:n,linkInfo:a}=t,s=(0,e.useRef)(null),[r,i]=(0,e.useState)("invisible"),[l,d]=(0,e.useState)(0),c=Vs(t,l),u=(0,y.wW)(js);return(0,e.useLayoutEffect)(()=>{i(Gs(s.current))},[c]),n.asDropdown?e.createElement(cn,{link:n,key:"dashlinks-dropdown","data-testid":v.wl.components.DashboardLinks.dropDown},e.createElement(e.Fragment,null,e.createElement(Ie.h,{onClick:()=>d(Date.now()),className:(0,m.cx)("gf-form-label gf-form-label--dashlink",u.button),"data-placement":"bottom","data-toggle":"dropdown","aria-expanded":!!l,"aria-controls":"dropdown-list","aria-haspopup":"menu"},e.createElement(j.J,{"aria-hidden":!0,name:"bars",className:u.iconMargin}),e.createElement("span",null,a.title)),e.createElement("ul",{id:"dropdown-list",className:`dropdown-menu ${u.dropdown} ${r}`,role:"menu",ref:s},c.length>0&&c.map((p,g)=>e.createElement("li",{role:"none",key:`dashlinks-dropdown-item-${p.uid}-${g}`},e.createElement("a",{role:"menuitem",href:p.url,target:n.targetBlank?"_blank":void 0,rel:"noreferrer","data-testid":v.wl.components.DashboardLinks.link,"aria-label":`${p.title} dashboard`},p.title)))))):e.createElement(e.Fragment,null,c.length>0&&c.map((p,g)=>e.createElement(cn,{link:n,key:`dashlinks-list-item-${p.uid}-${g}`,"data-testid":v.wl.components.DashboardLinks.container},e.createElement("a",{className:"gf-form-label gf-form-label--dashlink",href:p.url,target:n.targetBlank?"_blank":void 0,rel:"noreferrer","data-testid":v.wl.components.DashboardLinks.link,"aria-label":`${p.title} dashboard`},e.createElement(j.J,{"aria-hidden":!0,name:"apps",style:{marginRight:"4px"}}),e.createElement("span",null,p.title)))))},cn=t=>{const{link:n,children:a,...s}=t;return e.createElement("div",{...s,className:"gf-form"},n.tooltip&&e.createElement(fe.u,{content:n.tooltip},a),!n.tooltip&&e.createElement(e.Fragment,null,a))},Vs=({link:t,dashboardUID:n},a)=>{const{tags:s}=t,r=(0,Pe.Z)(()=>Hs(s),[s,a]);return r.value?Ks(n,t,r.value):[]};async function Hs(t,n={getBackendSrv:Us.i}){return await n.getBackendSrv().search({tag:t,limit:100})}function Ks(t,n,a,s={getLinkSrv:Ae.Bq,sanitize:ot.Nw,sanitizeUrl:ot.Nm}){return a.filter(r=>r.uid!==t).map(r=>{const i=r.uid,l=s.sanitize(r.title),d=s.getLinkSrv().getLinkUrl({...n,url:r.url}),c=s.sanitizeUrl(d);return{uid:i,title:l,url:c}})}function Gs(t){if(!t)return"invisible";const n=t.parentElement.getBoundingClientRect(),a=t.getBoundingClientRect();return a.width===0?"invisible":n.left+a.width+10>window.innerWidth?"pull-left":"pull-right"}function js(t){return{iconMargin:(0,m.css)({marginRight:t.spacing(.5)}),dropdown:(0,m.css)({maxWidth:"max(30vw, 300px)",maxHeight:"70vh",overflowY:"auto",a:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}}),button:(0,m.css)({color:t.colors.text.primary})}}const Zs=({dashboard:t,links:n})=>{const a=(0,Zt.N)();return(0,Ws.Z)(()=>{const s=t.events.subscribe(jt.md,a);return()=>s.unsubscribe()}),n.length?e.createElement(e.Fragment,null,n.map((s,r)=>{const i=(0,Ae.Bq)().getAnchorInfo(s),l=`${s.title}-$${r}`;if(s.type==="dashboards")return e.createElement(ks,{key:l,link:s,linkInfo:i,dashboardUID:t.uid});const d=Bs.xy[s.icon],c=e.createElement("a",{className:"gf-form-label gf-form-label--dashlink",href:(0,ot.Nm)(i.href),target:s.targetBlank?"_blank":void 0,rel:"noreferrer","data-testid":v.wl.components.DashboardLinks.link},d&&e.createElement(j.J,{"aria-hidden":!0,name:d,style:{marginRight:"4px"}}),e.createElement("span",null,i.title));return e.createElement("div",{key:l,className:"gf-form","data-testid":v.wl.components.DashboardLinks.container},s.tooltip?e.createElement(fe.u,{content:i.tooltip},c):c)})):null};class Qs extends e.PureComponent{constructor(){super(...arguments),this.onAnnotationStateChanged=n=>{for(let a=0;a<this.props.dashboard.annotations.list.length;a++){const s=this.props.dashboard.annotations.list[a];if(s.name===n.name){s.enable=!s.enable;break}}this.props.dashboard.startRefresh(),this.forceUpdate()},this.disableSubmitOnEnter=n=>{n.preventDefault()}}render(){const{dashboard:n,variables:a,links:s,annotations:r,theme:i}=this.props,l=Ys(i);if(!n.isSubMenuVisible())return null;const d=n.meta.isSnapshot??!1;return e.createElement("div",{className:l.submenu},e.createElement("form",{"aria-label":"Template variables",className:l.formStyles,onSubmit:this.disableSubmitOnEnter},e.createElement(Ot,{variables:a,readOnly:d})),e.createElement(zs,{annotations:r,onAnnotationChanged:this.onAnnotationStateChanged,events:n.events}),e.createElement("div",{className:l.spacer}),n&&e.createElement(Zs,{dashboard:n,links:s}))}}const Js=(t,n)=>{const{uid:a}=n.dashboard,s=(0,Qe.AE)(a,t);return{variables:(0,Qe.IV)(a,s.variables)}},Ys=(0,Rt.B)(t=>({formStyles:(0,m.css)`
      display: flex;
      flex-wrap: wrap;
      display: contents;
    `,submenu:(0,m.css)`
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-content: flex-start;
      align-items: flex-start;
      gap: ${t.spacing(1)} ${t.spacing(2)};
      padding: 0 0 ${t.spacing(1)} 0;
    `,spacer:(0,m.css)({flexGrow:1})})),dn=(0,y.HE)((0,N.connect)(Js)(Qs));dn.displayName="SubMenu";var Xs=o(83350),qs=o(87909),_s=o(42997);const un=t=>({initPhase:t.dashboard.initPhase,initError:t.dashboard.initError,dashboard:t.dashboard.getModel(),navIndex:t.navIndex}),eo={initDashboard:Tt.mV,cleanUpDashboardAndVariables:_s.lw,notifyApp:K.$l,cancelVariables:pt.wX,templateVarsChangedInUrl:pt.xs},to=(0,N.connect)(un,eo);class it extends e.PureComponent{constructor(){super(...arguments),this.forceRouteReloadCounter=0,this.state=this.getCleanState(),this.updateLiveTimer=()=>{let n;this.props.dashboard?.liveNow&&(n=(0,ge.$t)().timeRange()),qs.A.setLiveTimeRange(n)},this.onAddPanel=()=>{const{dashboard:n}=this.props;n&&(n.panels.length>0&&n.panels[0].type==="add-panel"||(n.addPanel({type:"add-panel",gridPos:(0,ke.lg)(n),title:"Panel Title"}),this.setState({updateScrollTop:0})))},this.setScrollRef=n=>{this.setState({scrollElement:n})}}getCleanState(){return{editPanel:null,viewPanel:null,showLoadingState:!1,panelNotFound:!1,editPanelAccessDenied:!1}}componentDidMount(){this.initDashboard(),this.forceRouteReloadCounter=this.props.history.location.state?.routeReloadCounter||0}componentWillUnmount(){this.closeDashboard()}closeDashboard(){this.props.cleanUpDashboardAndVariables(),this.setState(this.getCleanState())}initDashboard(){const{dashboard:n,match:a,queryParams:s}=this.props;n&&this.closeDashboard(),this.props.initDashboard({urlSlug:a.params.slug,urlUid:a.params.uid,urlType:a.params.type,urlFolderUid:s.folderUid,panelType:s.panelType,routeName:this.props.route.routeName,fixUrl:!0,accessToken:a.params.accessToken,keybindingSrv:this.context.keybindings}),setTimeout(this.updateLiveTimer,250)}componentDidUpdate(n,a){const{dashboard:s,match:r,templateVarsChangedInUrl:i}=this.props,l=this.props.history.location.state?.routeReloadCounter;if(s){if(n.match.params.uid!==r.params.uid||l!==void 0&&this.forceRouteReloadCounter!==l){this.initDashboard(),this.forceRouteReloadCounter=l;return}if(n.location.search!==this.props.location.search){const d=n.queryParams,c=this.props.queryParams;(c?.from!==d?.from||c?.to!==d?.to)&&((0,ge.$t)().updateTimeRangeFromUrl(),this.updateLiveTimer()),!d?.refresh&&c?.refresh&&(0,ge.$t)().setAutoRefresh(c.refresh);const u=(0,mn.xT)(this.props.queryParams,n.queryParams);u&&i(s.uid,u)}this.state.editPanel&&!a.editPanel&&(ct.H.setEditingState(!0),this.props.dashboard?.events.publish(new Q.xF(this.state.editPanel.id))),!this.state.editPanel&&a.editPanel&&(ct.H.setEditingState(!1),this.props.dashboard?.events.publish(new Q.Yr(a.editPanel.id))),this.state.editPanelAccessDenied&&(this.props.notifyApp((0,B.t_)("Permission to edit panel denied")),w.E1.partial({editPanel:null})),this.state.panelNotFound&&(this.props.notifyApp((0,B.t_)("Panel not found")),w.E1.partial({editPanel:null,viewPanel:null}))}}static getDerivedStateFromProps(n,a){const{dashboard:s,queryParams:r}=n,i=r.editPanel,l=r.viewPanel;if(!s)return a;const d={...a};if(!a.editPanel&&i){const c=s.getPanelByUrlId(i);c?s.canEditPanel(c)?(d.editPanel=c,d.rememberScrollTop=a.scrollElement?.scrollTop):d.editPanelAccessDenied=!0:d.panelNotFound=!0}else a.editPanel&&!i&&(d.editPanel=null,d.updateScrollTop=a.rememberScrollTop);if(!a.viewPanel&&l){const c=s.getPanelByUrlId(l);c?(s.initViewPanel(c),d.viewPanel=c,d.rememberScrollTop=a.scrollElement?.scrollTop,d.updateScrollTop=0):d.panelNotFound=!0}else a.viewPanel&&!l&&(s.exitViewPanel(a.viewPanel),d.viewPanel=null,d.updateScrollTop=a.rememberScrollTop);return(a.panelNotFound||a.editPanelAccessDenied&&!i)&&(d.panelNotFound=!1,d.editPanelAccessDenied=!1),no(n,d)}getInspectPanel(){const{dashboard:n,queryParams:a}=this.props,s=a.inspect;if(!n||!s)return null;const r=n.getPanelById(parseInt(s,10));return r||null}render(){const{dashboard:n,initError:a,queryParams:s}=this.props,{editPanel:r,viewPanel:i,updateScrollTop:l,pageNav:d,sectionNav:c}=this.state,u=G(this.props.queryParams);if(!n||!d||!c)return e.createElement(bn.B,{initPhase:this.props.initPhase});const p=this.getInspectPanel(),g=!r&&!u&&!this.props.queryParams.editview,h=u!==b.KioskMode.Full&&!s.editview,f=(0,m.cx)({"panel-in-fullscreen":!!i,"page-hidden":!!(s.editview||r)});return n.meta.dashboardNotFound?e.createElement(C.T,{navId:"dashboards/browse",layout:L.Q.Canvas,pageNav:{text:"Not found"}},e.createElement(O.j,{entity:"Dashboard"})):e.createElement(e.Fragment,null,e.createElement(C.T,{navModel:c,pageNav:d,layout:L.Q.Canvas,className:f,scrollRef:this.setScrollRef,scrollTop:l},h&&e.createElement("header",{"data-testid":v.wl.pages.Dashboard.DashNav.navV2},e.createElement(En.t,{dashboard:n,title:n.title,folderTitle:n.meta.folderTitle,isFullscreen:!!i,onAddPanel:this.onAddPanel,kioskMode:u,hideTimePicker:n.timepicker.hidden})),e.createElement(vt,{dashboard:n}),a&&e.createElement(yn.u,null),g&&e.createElement("section",{"aria-label":v.wl.pages.Dashboard.SubMenu.submenu},e.createElement(dn,{dashboard:n,annotations:n.annotations.list,links:n.links})),e.createElement(Xs.Z,{dashboard:n,isEditable:!!n.meta.canEdit,viewPanel:i,editPanel:r}),p&&e.createElement(la,{dashboard:n,panel:p})),r&&e.createElement(Ns,{dashboard:n,sourcePanel:r,tab:this.props.queryParams.tab,sectionNav:c,pageNav:d}),s.editview&&e.createElement($n.D,{dashboard:n,editview:s.editview,pageNav:d,sectionNav:c}),s.addWidget&&T.config.featureToggles.vizAndWidgetSplit&&e.createElement(fn,null))}}it.contextType=V.h;function no(t,n){const{dashboard:a,navIndex:s}=t;if(!a)return n;let r=n.pageNav,i=n.sectionNav;(!r||a.title!==r.text||a.meta.folderUrl!==r.parentItem?.url)&&(r={text:a.title,url:H.u.getUrlForPartial(t.history.location,{editview:null,editPanel:null,viewPanel:null})});const{folderTitle:l,folderUid:d}=a.meta;if(d&&r)if(T.config.featureToggles.nestedFolders){const c=(0,pe.ht)(s,`folder-dashboards-${d}`).main;r={...r,parentItem:c}}else l&&r.parentItem?.text!==l&&(r={...r,parentItem:{text:l,url:`/dashboards/f/${a.meta.folderUid}`}});if(t.route.routeName===b.DashboardRoutes.Path){i=ut();const c=dt(t.match.params.slug);c?.parentItem&&(c.parentItem=c.parentItem)}else i=(0,pe.ht)(t.navIndex,"dashboards/browse");return(n.editPanel||n.viewPanel)&&(r={...r,text:`${n.editPanel?"Edit":"View"} panel`,parentItem:r,url:void 0}),n.pageNav===r&&n.sectionNav===i?n:{...n,pageNav:r,sectionNav:i}}const lt=(0,y.HE)(it);lt.displayName="DashboardPage";const ao=to(lt)},57461:(ue,k,o)=>{o.r(k),o.d(k,{default:()=>y});var m=o(27702),e=o(10864),N=o(34667),L=o(26129),H=o(44644),v=o(18771),w=o(54195),T=o(10974);function y(K){const[C,O]=(0,m.useState)(null),{datasourceUid:V}=K.match.params,B=(0,v.useDispatch)();return(0,m.useEffect)(()=>{const b=(0,e.F)().getInstanceSettings(V);if(!b){O("Data source not found");return}if(N.config.featureToggles.emptyDashboardPage)B((0,T.Rd)(V));else{const G=(0,w.ZQ)(),{dashboard:pe}=G;pe.panels[0]={...pe.panels[0],datasource:{uid:b.uid,type:b.type}},(0,w.$M)(G)}L.E1.replace("/dashboard/new")},[V,B]),C?m.createElement(H.T,{navId:"dashboards"},m.createElement(H.T.Contents,null,m.createElement("div",null,'Data source with UID "',V,'" not found.'))):null}},76810:(ue,k,o)=>{o.d(k,{$:()=>y,J:()=>w});var m=o(66784),e=o(61965),N=o(73289),L=o(34667),H=o(45937);class v{constructor(){}async get(C){const O=`api/storage/read/${C}`.replace("//","/");return(0,N.i)().get(O)}async list(C){let O="api/storage/list/";C&&(O+=C+"/");const V=await(0,N.i)().get(O);if(V?.data){const B=(0,m.vP)(V);for(const b of B.fields)b.display=(0,e.U)({field:b,theme:L.config.theme2});return B}}async createFolder(C){const O=await(0,N.i)().post("/api/storage/createFolder",JSON.stringify({path:C}));return O.success?{}:{error:O.message??"unknown error"}}async deleteFolder(C){const O=await(0,N.i)().post("/api/storage/deleteFolder",JSON.stringify(C));return O.success?{}:{error:O.message??"unknown error"}}async deleteFile(C){const O=await(0,N.i)().post(`/api/storage/delete/${C.path}`);return O.success?{}:{error:O.message??"unknown error"}}async delete(C){return C.isFolder?this.deleteFolder({path:C.path,force:!0}):this.deleteFile({path:C.path})}async upload(C,O,V){const B=new FormData;B.append("folder",C),B.append("file",O),B.append("overwriteExistingFile",String(V));const b=await fetch("/api/storage/upload",{method:"POST",body:B});let G=await b.json();return G||(G={}),G.status=b.status,G.statusText=b.statusText,b.status!==200&&!G.err&&(G.err=!0),G}async write(C,O){return H.ae.post(`/api/storage/write/${C}`,O)}async getConfig(){return(0,N.i)().get("/api/storage/config")}async getOptions(C){return(0,N.i)().get(`/api/storage/options/${C}`)}}function w(K,C){const V=K.toLowerCase().trim();return C.map(b=>b.trim().toLowerCase()).includes(V)}let T;function y(){return T||(T=new v),T}},65604:(ue,k,o)=>{o.d(k,{M:()=>L});var m=o(27702),e=o(19221),N=o(85219);const L=({value:H,context:v,onChange:w})=>{const T=(0,m.useCallback)(y=>{w(y?.length?{id:e.E4.byRefId,options:y}:void 0)},[w]);return m.createElement(N.O,{value:H?.options,onChange:T,data:v.data,placeholder:"Change filter"})}},80601:(ue,k,o)=>{var m;m={value:!0};var e=o(48314),N=o(27702),L=e.__importDefault(o(58281));function H(v,w){w===void 0&&(w=[]);var T=L.default(v,w,{loading:!0}),y=T[0],K=T[1];return N.useEffect(function(){K()},[K]),y}k.Z=H}}]);

//# sourceMappingURL=DashboardPage.47d249f8c940b079c4b5.js.map