"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[5296],{75321:(Pe,G,o)=>{o.d(G,{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(O,F,j,v)=>{if(F.length===0)return"Could not find any metric queries";if(O&&O.length)return"Transformations are not supported in alert queries";let I=0,S=0;for(const y of F){const Q=y.datasource||v,C=await j.get(Q);C.meta.alerting?C.targetContainsTemplate&&C.targetContainsTemplate(y)&&S++:I++}return I===F.length?"The datasource does not support alerting queries":S===F.length?"Template variables are not supported in alert queries":""}},29243:(Pe,G,o)=>{o.r(G),o.d(G,{DashboardPage:()=>mt,UnthemedDashboardPage:()=>pt,default:()=>yo,mapStateToProps:()=>vn});var m=o(41407),e=o(39953),O=o(89772),F=o(15750),j=o(57837),v=o(28888),I=o(13601),S=o(32688),y=o(82803),Q=o(97316),C=o(13253),A=o(18644),z=o(61205),W=o(90634),b=o(57721);function B(n){switch(n.kiosk){case"tv":return b.KioskMode.TV;case"1":case!0:return b.KioskMode.Full;default:return null}}var me=o(45015),En=o(23334),ft=o(3654),ae=o(72639),X=o(33155),ht=o(1188);const yn="grafana.angularDeprecation.dashboardNotice.isDismissed";function bn(n){return yn+"."+n}function Cn({dashboardUid:n}){return e.createElement(ht.G,{storageKey:bn(n),defaultValue:!1},(t,a)=>t?null:e.createElement("div",null,e.createElement(X.b,{severity:"warning",title:"This dashboard depends on Angular, which is deprecated and will stop working in future releases of Grafana.",onRemove:()=>{(0,ae.ff)("angular_deprecation_notice_dismissed"),a(!0)}},e.createElement("div",{className:"markdown-html"},e.createElement("ul",null,e.createElement("li",null,e.createElement("a",{href:"https://grafana.com/docs/grafana/latest/developers/angular_deprecation/",className:"external-link",target:"_blank",rel:"noreferrer"},"Read our deprecation notice and migration advice.")))))))}var bo=o(42410);function Co(n){const t=n.match.params.slug??"",a=useAsync(()=>getGrafanaStorage().list("content/"+t),[t]),s=t.length>0?`g/${t}/`:"g/",r=vt(t),i=()=>a.value?a.value.fields[0].values.map(c=>{let u=c;const p=u.indexOf(".")<0,g=!p&&u.endsWith(".json"),f=`${s}${u}`;return React.createElement(Card,{key:u,href:p||g?f: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=Et();return React.createElement(Page,{navModel:l,pageNav:r},i())}function vt(n){const t=n.split("/");let a=[],s="g",r;for(let i=0;i<t.length;i++)s+=`/${t[i]}`,a.push({text:t[i],url:s,parentItem:r}),r=a[a.length-1];return r}function Et(){return{main:{text:"C:"},node:{text:"Content",url:"/g"}}}const Po=null;var Z=o(73431),yt=o(87863),Pn=o(49955),q=o(73075),re=o(38637),U=o(12190),se=o(64447),Se=o(57428),Sn=o(31851);const Be=({isCurrent:n,plugin:t,onClick:a,disabled:s})=>e.createElement(Sn.X,{title:t.name,plugin:t,description:t.info.description,onClick:a,isCurrent:n,disabled:s,showBadge:!0});Be.displayName="VizTypePickerPlugin";var oe=o(42923);const Tn=()=>{const n=(0,y.wW)(xn),[t,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,t),[r,t]),l=()=>{I.E1.partial({addWidget:null})};return e.createElement(q.u,{title:"Select widget type",closeOnEscape:!0,closeOnBackdropClick:!0,isOpen:!0,className:n.modal,onClickBackdrop:l,onDismiss:l},e.createElement(re.I,{type:"search",autoFocus:!0,className:n.searchInput,value:t,prefix:e.createElement(U.J,{name:"search"}),placeholder:"Search widget",onChange:d=>{a(d.currentTarget.value)}}),e.createElement(se.$,null,e.createElement("div",{className:n.grid},i.map((d,c)=>e.createElement(Be,{disabled:!1,key:d.id,isCurrent:!1,plugin:d,onClick:u=>{const p=(0,Se.AI)(s,d.id);I.E1.partial({editPanel:p,addWidget:null})}})))))},xn=n=>({modal:(0,m.css)`
    width: 65%;
    max-width: 960px;

    ${n.breakpoints.down("md")} {
      width: 100%;
    }
  `,searchInput:(0,m.css)`
    margin-bottom: ${n.spacing(2)};
  `,grid:(0,m.css)`
    display: grid;
    grid-gap: ${n.spacing(1)};
  `});var wn=o(47499),Dn=o(19873),In=o(69234),_=o(86832),Ue=o(53721),bt=o(39106),Nn=o(28833),ge=o(97125),Te=o(20653),Rn=o(48993),w=o(4919),On=o(64840),An=o(50384),Mn=o(38365);const Ct=({panel:n,folderUid:t,isUnsavedPrompt:a,onDismiss:s,onConfirm:r,onDiscard:i})=>{const[l,d]=(0,e.useState)(""),c=(0,Te.Z)(async()=>{const P=await(0,On.E8)(n.libraryPanel.uid);return P.length>0?P.map($=>$.title):[]},[n.libraryPanel.uid]),[u,p]=(0,e.useState)([]);(0,Rn.Z)(()=>c.value?p(c.value.filter(P=>P.toLowerCase().includes(l.toLowerCase()))):p([]),300,[c.value,l]);const{saveLibraryPanel:g}=(0,Mn.E)(),f=(0,y.wW)(An.J),h=(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:f.textInfo},"This update will affect ",e.createElement("strong",null,n.libraryPanel.meta?.connectedDashboards," ",n.libraryPanel.meta?.connectedDashboards===1?"dashboard":"dashboards","."),"The following dashboards using the panel will be affected:"),e.createElement(re.I,{className:f.dashboardSearch,prefix:e.createElement(U.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:f.myTable},e.createElement("thead",null,e.createElement("tr",null,e.createElement("th",null,"Dashboard name"))),e.createElement("tbody",null,u.map((P,$)=>e.createElement("tr",{key:`dashrow-${$}`},e.createElement("td",null,P))))),e.createElement(q.u.ButtonRow,null,e.createElement(w.zx,{variant:"secondary",onClick:s,fill:"outline"},"Cancel"),a&&e.createElement(w.zx,{variant:"destructive",onClick:h},"Discard"),e.createElement(w.zx,{onClick:()=>{g(n,t).then(()=>{r()})}},"Update all"))))};var $n=o(52002),Ve=o(23062),He=o(30093),xe=o(51201),Pt=o(33567),Y=o(91507);function Ln(n,t){return async a=>{const s=t.initEditPanel(n);a((0,Y.Hl)({panel:s,sourcePanel:n}))}}function St(){return async(n,t)=>{const{getPanel:a}=t().panelEditor;a().configRev=0,n((0,Y.yi)(!0))}}function Fn(n,t){return a=>{if(n.libraryPanel?.uid===void 0||!t)return;const s=n.getSaveModel();for(const r of t.panels){if(Wn(n,r))continue;r.restoreModel({...s,...(0,_.pick)(r,"gridPos","id")});const i=r.plugin?.meta.id!==n.plugin?.meta.id;r.plugin=n.plugin,r.configRev++,i&&(r.generateNewKey(),a((0,Pt.bc)({key:r.key,plugin:r.plugin}))),setTimeout(()=>{r.getQueryRunner().useLastResultFrom(n.getQueryRunner())},20)}n.repeat&&setTimeout(()=>t.processRepeats(),20)}}function Wn(n,t){return!!(t.libraryPanel?.uid!==n.libraryPanel.uid||t.id&&t.id===n.id||t.repeatPanelId)}function kn(){return async(n,t)=>{const a=t().dashboard.getModel(),{getPanel:s,getSourcePanel:r,shouldDiscardChanges:i}=t().panelEditor,l=s();a&&a.exitPanelEditor();const d=r();if(zn(l)&&!i){const c=l.getSaveModel(),u=d.type!==l.type;n(Fn(l,a)),d.restoreModel(c),d.configRev++,u&&(d.plugin=l.plugin,d.generateNewKey(),await n((0,Pt.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,He.WJ)(a,d,!0):delete d.isNew),n((0,xe.qj)(l.key)),n((0,Y.my)())}}function zn(n){return n.hasChanged||n.hasSavedPanelEditChange||n.isAngularPlugin()}function Ge(n){return(t,a)=>{const s={...a().panelEditor.ui,...n};t((0,Y.K9)(s));try{Ve.Z.setObject(Y.jy,s)}catch(r){console.error(r)}}}var Bn=o(75406);const Un=({dashboard:n,onSaveSuccess:t,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(w.zx,{variant:"secondary",onClick:s,fill:"outline"},"Cancel"),e.createElement(w.zx,{variant:"destructive",onClick:a},"Discard"),e.createElement(Bn.i,{dashboard:n,onSaveSuccess:t}))),Tt=e.memo(({dashboard:n})=>{const[t,a]=(0,e.useState)({original:null}),s=(0,b.useDispatch)(),{original:r,originalPath:i}=t,{showModal:l,hideModal:d}=(0,e.useContext)(bt.kr);(0,e.useEffect)(()=>{const u=setTimeout(()=>{const g=I.E1.getLocation().pathname,f=n.getSaveModelCloneOld();a({originalPath:g,original:f})},1e3),p=Nn.h.subscribe(Z.Jd,()=>{const g=n.getSaveModelCloneOld();a({originalPath:i,original:g})});return()=>{clearTimeout(u),p.unsubscribe()}},[n,i]),(0,e.useEffect)(()=>{const u=p=>{xt(n,r)||Dt(n,r)&&(p.preventDefault(),p.returnValue="")};return window.addEventListener("beforeunload",u),()=>window.removeEventListener("beforeunload",u)},[n,r]);const c=u=>{const p=n.panelInEdit,g=new URLSearchParams(u.search);return p&&p.libraryPanel&&p.hasChanged&&!g.has("editPanel")?(l(Ct,{isUnsavedPrompt:!0,panel:n.panelInEdit,folderUid:n.meta.folderUid??"",onConfirm:()=>{d(),we(u)},onDiscard:()=>{s(St()),we(u),d()},onDismiss:d}),!1):i===u.pathname||!r?(p&&!g.has("editPanel")&&s(kn()),!0):xt(n,r)||!Dt(n,r)?!0:(l(Un,{dashboard:n,onSaveSuccess:()=>{d(),we(u)},onDiscard:()=>{a({...t,original:null}),d(),we(u)},onDismiss:d}),!1)};return e.createElement(Ue.NL,{when:!0,message:c})});Tt.displayName="DashboardPrompt";function we(n){n&&setTimeout(()=>I.E1.push(n),10)}function xt(n,t){if(!t||!ge.contextSrv.isSignedIn||!n)return!0;const{canSave:a,fromScript:s,fromFile:r}=n.meta;return!ge.contextSrv.isEditor&&!a?!0:!a||s||r}function wt(n){const t=new $n.f(n);t.expandRows();const a=t.getSaveModelClone();if(delete a.time,a.refresh="",a.schemaVersion=0,delete a.timezone,a.panels=[],a.templating?.list)for(const s of a.templating.list)delete s.current,delete s.options,delete s.filters;return a}function Dt(n,t){if(n.hasUnsavedChanges())return!0;const a=wt(n.getSaveModelCloneOld()),s=wt(t),r=(0,_.find)(a.nav,{type:"timepicker"}),i=(0,_.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 Vn=o(6869),V=o(31954),De=o(75361),Ie=o(19977),It=o(96083),Ne=o(27366),Nt=o(87722),Hn=o(5217),Ke=o(22784),fe=o(77804),Gn=o(28409),ie=o(96227),Rt=o(9558),je=o(36210),Kn=o(84541),k=o(12223),ee=o(26286),jn=o(22160),Jn=o.n(jn),Qn=o(48069),Re=o(83502),Zn=o(99636),Yn=o(24119),le=o(6278),Xn=o(75397),Ot=o(35260),At=o(45013),he=(n=>(n[n.Support=0]="Support",n[n.Data=1]="Data",n))(he||{}),Oe=(n=>(n[n.PanelSnapshot=0]="PanelSnapshot",n[n.GithubComment=1]="GithubComment",n))(Oe||{});class qn extends Zn.b{constructor(t){super({panel:t,panelTitle:t.replaceVariables(t.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,Qn.dq)(new Date)}.json.txt`;Jn()(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,Ot.$M)({meta:{},dashboard:a}),o.g.open(S.config.appUrl+"dashboard/new","_blank"))}}async buildDebugDashboard(){const{panel:t,randomize:a,snapshotUpdate:s}=this.state,r=await(0,At.$R)(t,a,(0,le.$t)().timeRange()),i=JSON.stringify(r,null,2),l=(0,At.S$)(t,i),d=(0,Re.zc)((0,Re.Cf)("bytes")(i?.length??0));let c;if(!t.isAngularPlugin())try{const u=new Xn.f(r);c=(0,Yn.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 _n({panel:n,plugin:t,onClose:a}){const s=(0,y.wW)(ea),r=(0,e.useMemo)(()=>new qn(n),[n]),{currentTab:i,loading:l,error:d,options:c,showMessage:u,snapshotSize:p,markdownText:g,snapshotText:f,randomize:h,panelTitle:E,scene:P}=r.useState();if((0,e.useEffect)(()=>{r.buildDebugDashboard()},[r,t,h]),!t)return null;const $=[{label:"Snapshot",value:he.Support},{label:"Data",value:he.Data}],N=S.config.supportBundlesEnabled&&ge.contextSrv.hasPermission(b.AccessControlAction.ActionSupportBundlesCreate);return e.createElement(Nt.d,{title:"Get help with this panel",size:"lg",onClose:a,subtitle:e.createElement(Ne.K,{direction:"column",gap:1},e.createElement(Ne.K,{direction:"row",gap:1},e.createElement(Hn.a,{featureState:It.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(U.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."),N&&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(Ke.J,null,$.map((x,J)=>e.createElement(fe.O,{key:`${x.value}-${J}`,label:x.label,active:x.value===i,onChangeTab:()=>r.onCurrentTabChange(x.value)})))},l&&e.createElement(Gn.$,null),d&&e.createElement(X.b,{title:d.title},d.message),i===he.Data&&e.createElement("div",{className:s.code},e.createElement("div",{className:s.opts},e.createElement(ie.g,{label:"Template",className:s.field},e.createElement(Rt.Ph,{options:c,value:u,onChange:r.onShowMessageChange})),u===Oe.GithubComment?e.createElement(je.m,{icon:"copy",getText:r.onGetMarkdownForClipboard},"Copy to clipboard"):e.createElement(w.zx,{icon:"download-alt",onClick:r.onDownloadDashboard},"Download (",p,")")),e.createElement(Ie.Z,{disableWidth:!0},({height:x})=>e.createElement(Kn.p,{width:"100%",height:x,language:u===Oe.GithubComment?"markdown":"json",showLineNumbers:!0,showMiniMap:!0,value:u===Oe.GithubComment?g:f,readOnly:!1,onBlur:r.onSetSnapshotText}))),i===he.Support&&e.createElement(e.Fragment,null,e.createElement(ie.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(k.Lh,null,e.createElement(ee.x,{label:"Labels",id:"randomize-labels",showLabel:!0,value:!!h.labels,onChange:()=>r.onToggleRandomize("labels")}),e.createElement(ee.x,{label:"Field names",id:"randomize-field-names",showLabel:!0,value:!!h.names,onChange:()=>r.onToggleRandomize("names")}),e.createElement(ee.x,{label:"String values",id:"randomize-string-values",showLabel:!0,value:!!h.values,onChange:()=>r.onToggleRandomize("values")}))),e.createElement(ie.g,{label:"Support snapshot",description:`Panel: ${E}`},e.createElement(Ne.K,null,e.createElement(w.zx,{icon:"download-alt",onClick:r.onDownloadDashboard},"Dashboard (",p,")"),e.createElement(je.m,{icon:"github",getText:r.onGetMarkdownForClipboard,title:"Copy a complete GitHub comment to the clipboard"},"Copy to clipboard"),e.createElement(w.zx,{onClick:r.onPreviewDashboard,variant:"secondary",title:"Open support snapshot dashboard in a new tab"},"Preview"))),e.createElement(Ie.Z,{disableWidth:!0},({height:x})=>e.createElement("div",{style:{height:x,overflow:"auto"}},P&&e.createElement(P.Component,{model:P})))))}const ea=n=>({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 Je=o(10694);const Qe=(n,t,a)=>{const s=(0,e.useRef)(),[r,i]=(0,e.useState)();return(0,e.useEffect)(()=>{let l=-1,d=0;return s.current=n.getQueryRunner().getData({withTransforms:t.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()}},[n,t.withTransforms]),{data:r,isLoading:r?.state===Je.Gu.Loading,hasSeries:r?!!r.series:!1,hasError:!!(r&&(r.error||r?.errors?.length||r.state===Je.Gu.Error))}};var Ze=o(79059),Ye=o(62679),ta=o(66155),na=o(90131),aa=o(61333);const ra=({data:n,metadataDatasource:t})=>!t||!t.components?.MetadataInspector?e.createElement(Ye.cC,{i18nKey:"dashboard.inspect-meta.no-inspector"},"No Metadata Inspector"):e.createElement(t.components.MetadataInspector,{datasource:t,data:n.series});var sa=o(68716),oa=o(69496);const ia=({panel:n,plugin:t,dashboard:a,tabs:s,data:r,isDataLoading:i,dataOptions:l,metadataDatasource:d,defaultTab:c,onDataOptionsChange:u,onClose:p})=>{const[g,f]=(0,e.useState)(c??V.q.Data);if(!t)return null;let h=la(r),E=g;s.find(N=>N.value===g)||(E=V.q.JSON);const P=(0,Ze.J)().replace(n.title,n.scopedVars,"text")||"Panel",$=(0,Ye.t)("dashboard.inspect.title","Inspect: {{panelTitle}}",{panelTitle:P});return e.createElement(Nt.d,{title:$,subtitle:r&&ca(r),onClose:p,tabs:e.createElement(Ke.J,null,s.map((N,x)=>e.createElement(fe.O,{key:`${N.value}-${x}`,label:N.label,active:N.value===E,onChangeTab:()=>f(N.value||V.q.Data)})))},E===V.q.Data&&e.createElement(ta.E,{dataName:n.getDisplayTitle(),panelPluginId:n.type,fieldConfig:n.fieldConfig,hasTransformations:!!n.transformations?.length,data:r&&r.series,isLoading:i,options:l,onOptionsChange:u,timeZone:a.timezone,app:It.zj.Dashboard}),r&&E===V.q.Meta&&e.createElement(ra,{data:r,metadataDatasource:d}),E===V.q.JSON&&e.createElement(aa.W,{panel:n,dashboard:a,data:r,onClose:p}),E===V.q.Error&&e.createElement(na.l,{errors:h}),r&&E===V.q.Stats&&e.createElement(sa.f,{data:r,timeZone:a.getTimezone()}),r&&E===V.q.Query&&e.createElement(oa.D,{data:r,onRefreshQuery:()=>n.refresh()}))};function la(n){let t=n?.errors??[];return n?.error&&!t.includes(n.error)&&(t=[n.error,...t]),!t.length&&n?.state===Je.Gu.Error?[{message:"Error loading data"}]:t}function ca(n){const{request:t}=n;if(!t||(0,_.isEmpty)(t))return"";const a=t.targets.length,s=t.endTime?t.endTime-t.startTime:0,r=(0,Re.zc)((0,Re.Cf)("ms")(s));return e.createElement(Ye.cC,{i18nKey:"dashboard.inspect.subtitle"},{queryCount:a}," queries with total query time of ",{formatted:r})}var Mt=o(97470);const da=({panel:n,dashboard:t,plugin:a})=>{const s=(0,Ue.TH)(),r=new URLSearchParams(s.search).get("inspectTab"),[i,l]=(0,e.useState)({withTransforms:r===V.q.Error,withFieldConfig:!0}),{data:d,isLoading:c,hasError:u}=Qe(n,i,!0),p=(0,Mt.pV)(d),g=(0,Mt.WM)(n,t,a,u,p),f=()=>{I.E1.partial({inspect:null,inspectTab:null})};return a?r===V.q.Help?e.createElement(_n,{panel:n,plugin:a,onClose:f}):e.createElement(ia,{dashboard:t,panel:n,plugin:a,defaultTab:r,tabs:g,data:d,isDataLoading:c,dataOptions:i,onDataOptionsChange:l,metadataDatasource:p,onClose:f}):null},ua=(n,t)=>{const a=(0,De.i)(n,t.panel);return a?{plugin:a.plugin}:{plugin:null}},pa=(0,O.connect)(ua)(da);var $t=o(31544),Ae=o(20454),Me=o(3839),ma=o(7258),Lt=o(64084),ga=o(16924),Ft=o(49712),fa=o(21308),ce=o(69865),ha=o(16261),va=o(87842),Xe=o(68734);const Ea=n=>{const t=(0,e.useMemo)(()=>ha.z.get(n.variable.type).picker,[n.variable]);return n.variable?e.createElement("div",{className:"gf-form"},e.createElement(ya,{variable:n.variable}),n.variable.hide!==Xe.bU.hideVariable&&t&&e.createElement(t,{variable:n.variable,readOnly:n.readOnly??!1})):e.createElement("div",null,"Couldn't load variable")};function ya({variable:n}){const t=(0,e.useMemo)(()=>n.label||n.name,[n]);if(n.hide!==Xe.bU.dontHide)return null;const a=va.IG+n.id;return n.description?e.createElement(ce.u,{content:n.description,placement:"bottom"},e.createElement("label",{className:"gf-form-label gf-form-label--variable","data-testid":v.wl.pages.Dashboard.SubMenu.submenuItemLabels(t),htmlFor:a},t)):e.createElement("label",{className:"gf-form-label gf-form-label--variable","data-testid":v.wl.pages.Dashboard.SubMenu.submenuItemLabels(t),htmlFor:a},t)}const Wt=({variables:n,readOnly:t})=>{const[a,s]=(0,e.useState)([]);return(0,e.useEffect)(()=>{s(n.filter(r=>r.hide!==Xe.bU.hideVariable))},[n]),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(Ea,{variable:r,readOnly:t}))))};var ba=o(16920),Ca=o(46714),ve=o(33784),qe=o(45882),Pa=o(80560),Sa=o(33620),Ta=o(99874),kt=o(41245),xa=o(87819),zt=o(52275);function wa(n,t){Ve.Z.set(`panel-edit-section-${n}`,t?"true":"false")}function Da(n,t){return Ve.Z.getBool(`panel-edit-section-${n}`,t)}const Bt=(n,t)=>({angularPanelComponent:(0,De.i)(n,t.panel)?.angularComponent}),Ut={changePanelPlugin:xe.Kc},So=(0,O.connect)(Bt,Ut);class Ia extends e.PureComponent{constructor(t){super(t)}componentDidMount(){this.loadAngularOptions()}componentDidUpdate(t){(this.props.plugin!==t.plugin||this.props.angularPanelComponent!==t.angularPanelComponent)&&this.cleanUpAngularOptions(),this.loadAngularOptions()}componentWillUnmount(){this.cleanUpAngularOptions()}cleanUpAngularOptions(){this.angularOptions&&(this.angularOptions.destroy(),this.angularOptions=null)}loadAngularOptions(){const{panel:t,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:t,pluginId:u.id})};let l="";for(let u=0;u<i.editorTabs.length;u++){const p=i.editorTabs[u];p.isOpen=Da(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,zt.w)(),c={ctrl:i,toggleOptionGroup:u=>{const p=i.editorTabs[u];p.isOpen=!p.isOpen,wa(p.title,!!p.isOpen)}};this.angularOptions=d.load(this.element,c,l),this.angularOptions.digest()}render(){return e.createElement("div",{ref:t=>this.element=t})}}const Na=(0,O.connect)(Bt,Ut)(Ia);var _e=o(8376),Vt=o(36085),$e=o(82909),Ht=o(63064),Gt=o(96428),Le=o(84278),Ra=o(90135),Oa=o.n(Ra),Aa=o(36495),Ma=o(54951),Ee=o(68497);const $a=({property:n,context:t,registry:a,onChange:s,onRemove:r,isSystemOverride:i,searchQuery:l})=>{const d=(0,y.wW)(La),c=a?.getIfExists(n.id),u=(0,e.useId)();if(!c)return null;const p=Array.isArray(n.value)||n.id===$e.qb.Thresholds||n.id===$e.qb.Links||n.id===$e.qb.Mappings,g=c.category?.filter(E=>E!==c.name);let f;const h=(E=!0,P=!1)=>($=!1)=>e.createElement(k.Lh,{justify:"space-between"},e.createElement(Aa._,{category:g,description:E?c.description:void 0,htmlFor:u},e.createElement(Oa(),{textToHighlight:c.name,searchWords:[l],highlightClassName:"search-fragment-highlight"}),!$&&P&&c.getItemsCount&&e.createElement(Ma.A,{value:c.getItemsCount(n.value)})),!i&&e.createElement("div",null,e.createElement(Ee.h,{name:"times",onClick:r,tooltip:"Remove label"})));return p?f=e.createElement(_e.u,{id:c.name,renderTitle:h(!1,!0),className:(0,m.css)`
          padding-left: 0;
          padding-right: 0;
        `,isNested:!0,isOpenDefault:n.value!==void 0},e.createElement(c.override,{value:n.value,onChange:E=>{s(E)},item:c,context:t})):f=e.createElement("div",null,e.createElement(ie.g,{label:h()(),description:c.description},e.createElement(c.override,{value:n.value,onChange:E=>{s(E)},item:c,context:t,id:u}))),e.createElement("div",{className:(0,m.cx)(p&&d.collapsibleOverrideEditor,!p&&"dynamicConfigValueEditor--nonCollapsible")},f)},La=n=>({collapsibleOverrideEditor:(0,m.css)`
      label: collapsibleOverrideEditor;
      & + .dynamicConfigValueEditor--nonCollapsible {
        margin-top: ${n.spacing(1)};
      }
    `});var te=o(2148),H=o(79311);const Kt=({isExpanded:n,registry:t,matcherUi:a,overrideName:s,override:r,onOverrideRemove:i})=>{const l=(0,y.wW)(Fa),c=r.properties.map(p=>t.getIfExists(p.id)).filter(p=>!!p).map(p=>p?.name).join(", "),u=a.optionsToLabel(r.matcher.options);return e.createElement("div",null,e.createElement(k.Lh,{justify:"space-between"},e.createElement("div",null,s),e.createElement(Ee.h,{name:"trash-alt",onClick:i,tooltip:"Remove override"})),!n&&e.createElement("div",{className:l.overrideDetails},e.createElement("div",{className:l.options,title:u},u," ",e.createElement(U.J,{name:"angle-right"})," ",c)))};Kt.displayName="OverrideTitle";const Fa=n=>({matcherUi:(0,m.css)`
      padding: ${n.spacing(1)};
    `,propertyPickerWrapper:(0,m.css)`
      margin-top: ${n.spacing(2)};
    `,overrideDetails:(0,m.css)`
      font-size: ${n.typography.bodySmall.fontSize};
      color: ${n.colors.text.secondary};
      font-weight: ${n.typography.fontWeightRegular};
    `,options:(0,m.css)`
      overflow: hidden;
      padding-right: ${n.spacing(4)};
    `,unknownLabel:(0,m.css)`
      margin-bottom: 0;
    `});function Wa(n,t){const a=[],s=n.panel.fieldConfig,r=n.plugin.fieldConfigRegistry,i=n.data?.series??[];if(r.isEmpty())return[];const l=(p,g)=>{let f=(0,_.cloneDeep)(s.overrides);f[p]=g,n.onFieldConfigsChange({...s,overrides:f})},d=p=>{let g=(0,_.cloneDeep)(s.overrides);g.splice(p,1),n.onFieldConfigsChange({...s,overrides:g})},c=p=>{const g=Vt.Ls.get(p.value);g&&n.onFieldConfigsChange({...s,overrides:[...s.overrides,{matcher:{id:g.id,options:g.defaultOptions},properties:[]}]})},u={data:i,getSuggestions:p=>(0,Le.PW)(i,p),isOverride:!0};for(let p=0;p<s.overrides.length;p++){const g=s.overrides[p],f=`Override ${p+1}`,h=Ht.i.get(g.matcher.id),E=ka(r),P=(0,$e.v3)(g),$=g.properties.length===0?1:0,N=new te.j({title:f,id:f,forceOpen:$,renderTitle:function(R){return e.createElement(Kt,{override:g,isExpanded:R,registry:r,overrideName:f,matcherUi:h,onOverrideRemove:()=>d(p)})}}),x=T=>{g.matcher.options=T,l(p,g)},J=(T,R)=>{const K=r.get(R.value),ue={id:K.id,value:K.defaultValue};g.properties?T.properties.push(ue):T.properties=[ue],l(p,T)};N.addItem(new H.a({title:h.name,render:function(){return e.createElement(h.component,{id:`${h.matcher.id}-${p}`,matcher:h.matcher,data:n.data?.series??[],options:g.matcher.options,onChange:x})}}));for(let T=0;T<g.properties.length;T++){const R=g.properties[T],K=r.getIfExists(R.id);if(!K)continue;const ue=pe=>{g.properties[T].value=pe,l(p,g)},gt=()=>{g.properties.splice(T,1),l(p,g)};N.addItem(new H.a({title:K.name,skipField:!0,render:function(){return e.createElement($a,{key:`${R.id}/${T}`,isSystemOverride:P,onChange:ue,onRemove:gt,property:R,registry:r,context:u,searchQuery:t})}}))}!P&&g.matcher.options&&N.addItem(new H.a({title:"----------",skipField:!0,render:function(){return e.createElement(Gt.b,{key:"Add override property",label:"Add override property",variant:"secondary",isFullWidth:!0,icon:"plus",menuPlacement:"auto",options:E,onChange:R=>J(g,R)})}})),a.push(N)}return a.push(new te.j({title:"add button",id:"add button",customRender:function(){return e.createElement(za,{key:"Add override"},e.createElement(Gt.b,{icon:"plus",label:"Add field override",variant:"secondary",menuPlacement:"auto",isFullWidth:!0,size:"md",options:Ht.i.list().filter(g=>!g.excludeFromPicker).map(g=>({label:g.name,value:g.id,description:g.description})),onChange:g=>c(g)}))}})),a}function ka(n){return n.list().filter(t=>!t.hideFromOverrides).map(t=>{let a=t.name;return t.category&&(a=[...t.category,t.name].join(" > ")),{label:a,value:t.id,description:t.description}})}function za({children:n}){const t=(0,y.wW)(Ba);return e.createElement("div",{className:t},n)}function Ba(n){return(0,m.css)({borderTop:`1px solid ${n.colors.border.weak}`,padding:`${n.spacing(2)}`,display:"flex"})}const Ua=({panel:n,formatDate:t})=>{const a=(0,y.wW)(Va),s=n.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 ",t?.(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},Va=n=>({info:(0,m.css)`
      line-height: 1;
    `,libraryPanelInfo:(0,m.css)`
      color: ${n.colors.text.secondary};
      font-size: ${n.typography.bodySmall.fontSize};
    `,userAvatar:(0,m.css)`
      border-radius: ${n.shape.radius.circle};
      box-sizing: content-box;
      width: 22px;
      height: 22px;
      padding-left: ${n.spacing(1)};
      padding-right: ${n.spacing(1)};
    `});function Ha(n){const{panel:t,onPanelConfigChange:a,dashboard:s}=n,r=new te.j({title:"Library panel options",id:"Library panel options",isOpenDefault:!0});return(0,ve.V)(t)&&r.addItem(new H.a({title:"Name",value:t.libraryPanel.name,popularRank:1,render:function(){return e.createElement(re.I,{id:"LibraryPanelFrameName",defaultValue:t.libraryPanel.name,onBlur:l=>a("libraryPanel",{...t.libraryPanel,name:l.currentTarget.value})})}})).addItem(new H.a({title:"Information",render:function(){return e.createElement(Ua,{panel:t,formatDate:s.formatDate})}})),r}var Ga=o(68421),Ka=o(86467),Fe=o(97433),ja=o(11769),Ja=o(4041),We=o(4811);const Qa=`You are an expert in creating Grafana Panels.
You will be given the title and description of the dashboard the panel is in as well as the JSON for the panel.
Your goal is to write a descriptive and concise panel description.
The panel description is meant to explain the purpose of the panel, not just its attributes.
Do not refer to the panel; simply describe its purpose.
There should be no numbers in the description except for thresholds.
The description should be, at most, 140 characters.`,Za=({onGenerate:n,panel:t})=>{const a=e.useMemo(()=>Ya(t),[t]);return e.createElement(ja.v,{messages:a,onGenerate:n,loadingText:"Generating description",eventTrackingSrc:Ja.dG.panelDescription,toggleTipTitle:"Improve your panel description"})};function Ya(n){const t=(0,Fe.h4)().getCurrent();return[{content:Qa,role:We.uU.system},{content:`The panel is part of a dashboard with the title: ${t.title}`,role:We.uU.system},{content:`The panel is part of a dashboard with the description: ${t.title}`,role:We.uU.system},{content:`This is the JSON which defines the panel: ${JSON.stringify(n.getSaveModel())}`,role:We.uU.user}]}var Xa=o(11267),qa=o(59357);function _a(n){const{panel:t,onPanelConfigChange:a}=n,s=new te.j({title:"Panel options",id:"Panel options",isOpenDefault:!0}),r=l=>{const d=document.getElementById("PanelFrameTitle");d instanceof HTMLInputElement&&(d.value=l,a("title",l))},i=l=>{const d=document.getElementById("description-text-area");d instanceof HTMLTextAreaElement&&(d.value=l,a("description",l))};return s.addItem(new H.a({title:"Title",value:t.title,popularRank:1,render:function(){return e.createElement(re.I,{id:"PanelFrameTitle",defaultValue:t.title,onBlur:d=>a("title",d.currentTarget.value)})},addon:S.config.featureToggles.dashgpt&&e.createElement(Xa.j,{onGenerate:r,panel:t})})).addItem(new H.a({title:"Description",description:t.description,value:t.description,render:function(){return e.createElement(Ga.K,{id:"description-text-area",defaultValue:t.description,onBlur:d=>a("description",d.currentTarget.value)})},addon:S.config.featureToggles.dashgpt&&e.createElement(Za,{onGenerate:i,panel:t})})).addItem(new H.a({title:"Transparent background",render:function(){return e.createElement(ee.r,{value:t.transparent,id:"transparent-background",onChange:d=>a("transparent",d.currentTarget.checked)})}})).addCategory(new te.j({title:"Panel links",id:"Panel links",isOpenDefault:!1,itemsCount:t.links?.length}).addItem(new H.a({title:"Panel links",render:function(){return e.createElement(Ka.d,{links:t.links,onChange:d=>a("links",d),getSuggestions:Le.PR,data:[]})}}))).addCategory(new te.j({title:"Repeat options",id:"Repeat options",isOpenDefault:!1}).addItem(new H.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(qa.X,{id:"repeat-by-variable-select",repeat:t.repeat,onChange:d=>{a("repeat",d)}})}})).addItem(new H.a({title:"Repeat direction",showIf:()=>!!t.repeat,render:function(){const d=[{label:"Horizontal",value:"h"},{label:"Vertical",value:"v"}];return e.createElement(Ae.S,{options:d,value:t.repeatDirection||"h",onChange:c=>a("repeatDirection",c)})}})).addItem(new H.a({title:"Max per row",showIf:()=>!!(t.repeat&&t.repeatDirection==="h"),render:function(){const d=[2,3,4,6,8,12].map(c=>({label:c.toString(),value:c}));return e.createElement(Rt.Ph,{options:d,value:t.maxPerRow,onChange:c=>a("maxPerRow",c.value)})}})))}var er=o(2978);class tr{constructor(t,a){this.categories=t,this.overrides=a}search(t){const a=new RegExp(t,"i"),r=this.collectHits(this.categories,a,[]).sort(jt).map(d=>d.item),l=this.collectHits(this.overrides,a,[]).sort(jt).map(d=>d.item);return{optionHits:r,overrideHits:this.buildOverrideHitCategories(l),totalCount:this.getAllOptionsCount(this.categories)}}collectHits(t,a,s){for(const r of t){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(t){let a=0;for(const s of t)a+=s.items.length,s.categories.length>0&&(a+=this.getAllOptionsCount(s.categories));return a}buildOverrideHitCategories(t){const a={};for(const s of t){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 jt(n,t){return n.rank-t.rank}function nr(n){const t=[];for(const a of n)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&&t.push(s);return t.sort((a,s)=>a.props.popularRank-s.props.popularRank)}const ar=n=>{const{plugin:t,dashboard:a,panel:s}=n,[r,i]=(0,e.useState)(""),[l,d]=(0,e.useState)("All"),c=(0,y.wW)(ir),[u,p,g]=(0,e.useMemo)(()=>[_a(n),(0,er.AL)(n),Ha(n)],[s.configRev,n.data,n.instanceState,r]),f=(0,e.useMemo)(()=>Wa(n,r),[s.configRev,n.data,n.instanceState,r]),h=[],E=r.length>0,P=(0,e.useMemo)(rr,[]),$=(0,ve.V)(s)?[g,u,...p]:[u,...p];if(E)h.push(or($,f,r)),n.plugin.angularPanelCtrl&&h.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)&&h.push(g.render()),h.push(u.render()),n.plugin.angularPanelCtrl&&h.push(e.createElement(Na,{plugin:t,dashboard:a,panel:s,key:"AngularOptions"}));for(const x of p)h.push(x.render());for(const x of f)h.push(x.render());break;case"Overrides":for(const x of f)h.push(x.render());break;case"Recent":h.push(e.createElement(_e.u,{id:"Recent options",title:"Recent options",key:"Recent options",forceOpen:1},nr($).map(x=>x.render())));break}const N=!E&&!t.fieldConfigRegistry.isEmpty();return e.createElement("div",{className:c.wrapper},e.createElement("div",{className:c.formBox},s.isAngularPlugin()&&e.createElement(xa.Y,{className:c.angularDeprecationWrapper,showPluginDetailsLink:!0,pluginId:t.meta.id,pluginType:t.meta.type,angularSupportEnabled:S.config?.angularSupportEnabled,interactionElementId:"panel-options"}),e.createElement("div",{className:c.formRow},e.createElement(kt.H,{width:0,value:r,onChange:i,placeholder:"Search options"})),N&&e.createElement("div",{className:c.formRow},e.createElement(Ae.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},h))))};function rr(){return[{label:"All",value:"All"},{label:"Overrides",value:"Overrides"}]}var sr=(n=>(n.All="All",n.Overrides="Overrides",n.Recent="Recent",n))(sr||{});function or(n,t,a){const s=new tr(n,t),{optionHits:r,totalCount:i,overrideHits:l}=s.search(a);return e.createElement("div",{key:"search results"},e.createElement(_e.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 ir=n=>({wrapper:(0,m.css)`
    height: 100%;
    display: flex;
    flex-direction: column;
    flex: 1 1 0;

    .search-fragment-highlight {
      color: ${n.colors.warning.text};
      background: transparent;
    }
  `,searchBox:(0,m.css)`
    display: flex;
    flex-direction: column;
    min-height: 0;
  `,formRow:(0,m.css)`
    margin-bottom: ${n.spacing(1)};
  `,formBox:(0,m.css)`
    padding: ${n.spacing(1)};
    background: ${n.colors.background.primary};
    border: 1px solid ${n.components.panel.borderColor};
    border-top-left-radius: ${n.shape.borderRadius(1.5)};
    border-bottom: none;
  `,closeButton:(0,m.css)`
    margin-left: ${n.spacing(1)};
  `,searchHits:(0,m.css)`
    padding: ${n.spacing(1,1,0,1)};
  `,scrollWrapper:(0,m.css)`
    flex-grow: 1;
    min-height: 0;
  `,searchNotice:(0,m.css)`
    font-size: ${n.typography.size.sm};
    color: ${n.colors.text.secondary};
    padding: ${n.spacing(1)};
    text-align: center;
  `,mainBox:(0,m.css)`
    background: ${n.colors.background.primary};
    border: 1px solid ${n.components.panel.borderColor};
    border-top: none;
    flex-grow: 1;
  `,angularDeprecationWrapper:(0,m.css)`
    padding: ${n.spacing(1)};
  `});var lr=o(48824),cr=o(11818);const Jt=n=>t=>t.plugins.panels[n]||(0,cr.X)(`Panel plugin not found (${n})`,!0),et=({panel:n})=>{const t=(0,b.useDispatch)(),a=(0,b.useSelector)(Jt(n.type)),s=(0,b.useSelector)(d=>d.panelEditor.ui.isPanelOptionsVisible),r=(0,b.useSelector)(d=>d.panelEditor.isVizPickerOpen),i=()=>{t((0,Y.g_)(!r))},l=()=>{t(Ge({isPanelOptionsVisible:!s}))};return a?e.createElement("div",{className:Qt.wrapper},e.createElement(lr.h,null,e.createElement(Me.h,{className:Qt.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(Me.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};et.displayName="VisualizationTab";const Qt={wrapper:(0,m.css)`
    display: flex;
    flex-direction: column;
  `,vizButton:(0,m.css)`
    text-align: left;
  `};var dr=o(973),Zt=o(74602),ur=o(81224),pr=o(78288),ke=o(32840);const mr=({onConfirm:n,onDismiss:t,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(ke.s,{onConfirm:n,onDismiss:t,confirmText:s?"Change":"Replace",title:r,body:i,dismissText:"Cancel",isOpen:!0})};var gr=o(76185);const fr=({panel:n,searchQuery:t,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($=>$.id))},[c]),p=(0,Fe.h4)().getCurrent(),g=(0,b.useDispatch)(),f=async()=>{i&&(l(void 0),g((0,xe.ih)(n,i)))},h=()=>r(!0),E=()=>l(void 0);return e.createElement(k.wc,{spacing:"md"},!n.libraryPanel&&e.createElement(k.wc,{align:"center"},e.createElement(w.zx,{icon:"plus",onClick:h,variant:"secondary",fullWidth:!0},"Create new library panel")),e.createElement(ur.j,{onChange:u,isWidget:a}),e.createElement("div",{className:hr.libraryPanelsView},e.createElement(gr.u,{currentPanelId:n.libraryPanel?.uid,searchString:t,panelFilter:d,onClickCard:l,showSecondaryActions:!0,isWidget:a})),s&&e.createElement(pr.c,{panel:n,onDismiss:()=>r(!1),initialFolderUid:p?.meta.folderUid,isOpen:s}),i&&e.createElement(mr,{panel:n,onDismiss:E,onConfirm:f}))},hr={libraryPanelsView:(0,m.css)`
    width: 100%;
  `};var tt=o(64943),vr=o(13090);const Er=["timeseries","barchart","gauge","stat","piechart","bargauge","table","state-timeline","status-history","logs","candlestick","flamegraph"];async function yr(n,t){const a=new tt.mi(n,t);for(const r of Er){const l=(await(0,vr.Ub)(r)).getSuggestionsSupplier();l&&l.getSuggestionsForData(a)}const s=a.getList();if(!S.config.featureToggles.vizAndWidgetSplit&&a.dataSummary.fieldCount===0)for(const r of Object.values(S.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??tt._.OK)-(r.score??tt._.OK)})}var Yt=o(95430);function br({data:n,suggestion:t,onChange:a,width:s}){const r=(0,y.wW)(Cr),{innerStyles:i,outerStyles:l,renderWidth:d,renderHeight:c}=Pr(s),u=t.cardOptions??{},p={"aria-label":t.name,className:r.vizBox,"data-testid":v.wl.components.VisualizationPreview.card(t.name),style:l,onClick:()=>{a({pluginId:t.pluginId,options:t.options,fieldConfig:t.fieldConfig})}};if(u.imgSrc)return e.createElement(ce.u,{content:t.description??t.name},e.createElement("button",{...p,className:(0,m.cx)(r.vizBox,r.imgBox)},e.createElement("div",{className:r.name},t.name),e.createElement("img",{className:r.img,src:u.imgSrc,alt:t.name})));let g=t;return t.cardOptions?.previewModifier&&(g=(0,_.cloneDeep)(t),t.cardOptions.previewModifier(g)),e.createElement("button",{...p},e.createElement(ce.u,{content:t.name},e.createElement("div",{style:i,className:r.renderContainer},e.createElement(Yt.$,{title:"",data:n,pluginId:t.pluginId,width:d,height:c,options:g.options,fieldConfig:g.fieldConfig}),e.createElement("div",{className:r.hoverPane}))))}const Cr=n=>({hoverPane:(0,m.css)({position:"absolute",top:0,right:0,left:0,borderRadius:n.spacing(2),bottom:0}),vizBox:(0,m.css)`
      position: relative;
      background: none;
      border-radius: ${n.shape.radius.default};
      cursor: pointer;
      border: 1px solid ${n.colors.border.medium};

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

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

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

      justify-content: center;
      align-items: center;
      text-align: center;
    `,name:(0,m.css)`
      padding-bottom: ${n.spacing(.5)};
      margin-top: ${n.spacing(-1)};
      font-size: ${n.typography.bodySmall.fontSize};
      white-space: nowrap;
      overflow: hidden;
      color: ${n.colors.text.secondary};
      font-weight: ${n.typography.fontWeightMedium};
      text-overflow: ellipsis;
    `,img:(0,m.css)`
      max-width: ${n.spacing(8)};
      max-height: ${n.spacing(8)};
    `,renderContainer:(0,m.css)`
      position: absolute;
      transform-origin: left top;
      top: 6px;
      left: 6px;
    `});function Pr(n){const a=n,s=n*(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 Sr({onChange:n,data:t,panel:a,searchQuery:s}){const r=(0,y.wW)(xr),{value:i}=(0,Te.Z)(()=>yr(t,a),[t,a]),l=Tr(s,i);return e.createElement(Ie.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,f)=>e.createElement(br,{key:f,data:t,suggestion:g,onChange:n,width:p})),s&&l.length===0&&e.createElement("div",{className:r.infoText},"No results matched your query")))})}function Tr(n,t){if(!n||!t)return t||[];const a=new RegExp(n,"i");return t.filter(s=>a.test(s.name)||a.test(s.pluginId))}const xr=n=>({heading:(0,m.css)({...n.typography.h5,margin:n.spacing(0,.5,1)}),filterRow:(0,m.css)({display:"flex",flexDirection:"row",justifyContent:"space-around",alignItems:"center",paddingBottom:"8px"}),infoText:(0,m.css)({fontSize:n.typography.bodySmall.fontSize,color:n.colors.text.secondary,fontStyle:"italic"}),grid:(0,m.css)({display:"grid",gridGap:n.spacing(1),gridTemplateColumns:"repeat(auto-fill, 144px)",marginBottom:n.spacing(1),justifyContent:"space-evenly"})});var wr=o(16708);function Xt({searchQuery:n,onChange:t,current:a,data:s,isWidget:r=!1}){const i=(0,y.wW)(Dr),l=(0,e.useMemo)(()=>S.config.featureToggles.vizAndWidgetSplit?r?(0,oe.Ry)():(0,oe.hK)():(0,oe.xW)(),[r]),d=(0,e.useMemo)(()=>(0,oe.rw)(l,n,a),[a,l,n]);return d.length===0?e.createElement(wr.K,null,"Could not find anything matching your query"):e.createElement("div",{className:i.grid},d.map((c,u)=>e.createElement(Be,{disabled:!1,key:c.id,isCurrent:c.id===a.id,plugin:c,onClick:p=>t({pluginId:c.id,withModKey:!!(p.metaKey||p.ctrlKey||p.altKey)})})))}const Dr=n=>({grid:(0,m.css)`
      max-width: 100%;
      display: grid;
      grid-gap: ${n.spacing(.5)};
    `,heading:(0,m.css)({...n.typography.h5,margin:n.spacing(0,.5,1)})});var D=o(47864);const qt=({panel:n,data:t})=>{const a=(0,b.useSelector)(Jt(n.type)),[s,r]=(0,e.useState)(""),i=!!a.meta.skipDataQuery,l=!!(i&&S.config.featureToggles.vizAndWidgetSplit),d=l?Zt.Hk:Zt.FL,c=l?D.Ok.Widgets:D.Ok.Visualizations,[u,p]=(0,dr.Z)(d,c),g=(0,b.useDispatch)(),f=(0,y.wW)(Ir),h=(0,e.useRef)(null),E=(0,e.useCallback)(x=>{g((0,xe.Kc)({panel:n,...x})),x.withModKey||g((0,Y.g_)(!1))},[g,n]),P=()=>{g((0,Y.g_)(!1))};if(!a)return null;const $=[{label:"Visualizations",value:D.Ok.Visualizations},{label:"Suggestions",value:D.Ok.Suggestions},{label:"Library panels",value:D.Ok.LibraryPanels,description:"Reusable panels you can share between multiple dashboards."}],N=[{label:"Widgets",value:D.Ok.Widgets},{label:"Library panels",value:D.Ok.LibraryPanels,description:"Reusable panels you can share between multiple dashboards."}];return e.createElement("div",{className:f.openWrapper},e.createElement("div",{className:f.formBox},e.createElement("div",{className:f.searchRow},e.createElement(kt.H,{value:s,onChange:r,ref:h,autoFocus:!0,placeholder:"Search for..."}),e.createElement(w.zx,{title:"Close",variant:"secondary",icon:"angle-up",className:f.closeButton,"aria-label":v.wl.components.PanelEditor.toggleVizPicker,onClick:P})),e.createElement(ie.g,{className:f.customFieldMargin},e.createElement(Ae.S,{options:l?N:$,value:u,onChange:p,fullWidth:!0}))),e.createElement("div",{className:f.scrollWrapper},e.createElement(se.$,{autoHeightMin:"100%"},e.createElement("div",{className:f.scrollContent},u===D.Ok.Visualizations&&e.createElement(Xt,{current:a.meta,onChange:E,searchQuery:s,data:t,onClose:()=>{}}),u===D.Ok.Widgets&&e.createElement(Xt,{current:a.meta,onChange:E,searchQuery:s,data:t,onClose:()=>{},isWidget:!0}),u===D.Ok.Suggestions&&e.createElement(Sr,{current:a.meta,onChange:E,searchQuery:s,panel:n,data:t,onClose:()=>{}}),u===D.Ok.LibraryPanels&&e.createElement(fr,{searchQuery:s,panel:n,key:"Panel Library",isWidget:i})))))};qt.displayName="VisualizationSelectPane";const Ir=n=>({icon:(0,m.css)`
      color: ${n.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: ${n.spacing(1)};
    `,openWrapper:(0,m.css)`
      display: flex;
      flex-direction: column;
      flex: 1 1 100%;
      height: 100%;
      background: ${n.colors.background.primary};
      border: 1px solid ${n.colors.border.weak};
    `,searchRow:(0,m.css)`
      display: flex;
      margin-bottom: ${n.spacing(1)};
    `,closeButton:(0,m.css)`
      margin-left: ${n.spacing(1)};
    `,customFieldMargin:(0,m.css)`
      margin-bottom: ${n.spacing(1)};
    `,formBox:(0,m.css)`
      padding: ${n.spacing(1)};
      padding-bottom: 0;
    `}),Nr=({plugin:n,panel:t,onFieldConfigsChange:a,onPanelOptionsChanged:s,onPanelConfigChange:r,dashboard:i,instanceState:l})=>{const d=(0,y.wW)(Rr),c=(0,b.useSelector)(p=>p.panelEditor.isVizPickerOpen),{data:u}=Qe(t,{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(et,{panel:t})),e.createElement("div",{className:d.optionsWrapper},e.createElement(ar,{panel:t,dashboard:i,plugin:n,instanceState:l,data:u,onFieldConfigsChange:a,onPanelOptionsChanged:s,onPanelConfigChange:r}))),c&&e.createElement(qt,{panel:t,data:u}))},Rr=n=>({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 ${n.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: ${n.spacing(2)} 0;
      }

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

        &:first-child {
          margin-top: 0;
        }
      }
    `});var _t=o(77014),Or=o(4185),Ar=o(52807),Mr=(n=>(n.Error="Error",n.Info="Info",n.Links="Links",n))(Mr||{});class $r extends e.Component{constructor(){super(...arguments),this.timeSrv=(0,le.$t)(),this.getInfoMode=()=>{const{panel:t,error:a}=this.props;if(a)return"Error";if(t.description)return"Info";if(t.links&&t.links.length)return"Links"},this.getInfoContent=()=>{const{panel:t}=this.props,a=t.description||"",s=(0,Ze.J)().replace(a,t.scopedVars),r=(0,Ar.a)(s),i=this.props.links&&this.props.links.getLinks(t.replaceVariables);return e.createElement("div",{className:"panel-info-content markdown-html"},e.createElement("div",{dangerouslySetInnerHTML:{__html:r}}),i&&i.length>0&&e.createElement("ul",{className:"panel-info-corner-links"},i.map((l,d)=>e.createElement("li",{key:d},e.createElement("a",{className:"panel-info-corner-links__item",href:l.href,target:l.target},l.title)))))},this.onClickError=()=>{I.E1.partial({inspect:this.props.panel.id,inspectTab:V.q.Error})}}renderCornerType(t,a,s){const r=t==="Error"?"error":"info",i=`panel-info-corner panel-info-corner--${t.toLowerCase()}`,l=v.wl.components.Panels.Panel.headerCornerInfo(t.toLowerCase());return e.createElement(ce.u,{content:a,placement:"top-start",theme:r,interactive:!0},e.createElement("button",{type:"button",className:i,onClick:s,"aria-label":l},e.createElement("i",{"aria-hidden":!0,className:"fa"}),e.createElement("span",{className:"panel-info-corner-inner"})))}render(){const{error:t}=this.props,a=this.getInfoMode();return a?a==="Error"&&t?this.renderCornerType(a,t,this.onClickError):a==="Info"||a==="Links"?this.renderCornerType(a,this.getInfoContent):null:null}}const Lr=$r;function Fr({width:n,height:t,panel:a,dashboard:s}){const{data:r}=Qe(a,{withTransforms:!0,withFieldConfig:!1},!1),[i,l]=(0,e.useState)({frameIndex:0,showHeader:!0,showTypeIcons:!0});if((0,e.useEffect)(()=>{const c=(0,le.$t)(),u=a.events.subscribe(_t.U5,()=>{const p=(0,He.W1)(a,c.timeRange());a.runAllPanelQueries({dashboardUID:s.uid,dashboardTimezone:s.getTimezone(),timeData:p,width:n})});return()=>{u.unsubscribe()}},[a,s,n]),!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(Or.fm,{width:n,height:t,padding:"none"},(c,u)=>e.createElement(e.Fragment,null,e.createElement(Lr,{panel:a,error:d}),e.createElement(Yt.$,{title:"Raw data",pluginId:"table",width:c,height:u,data:r,options:i,onOptionsChange:l})))}var en=o(55356),nt=o(41730),Wr=o(90201),kr=o(91395),zr=o(26205),Br=o(11906);function tn({message:n}){const t=(0,e.useCallback)(()=>{I.E1.partial({tab:D.Ip.Query})},[]);return e.createElement(k.Ar,{justify:"center",style:{marginTop:"100px"}},e.createElement(k.wc,{spacing:"md"},e.createElement("h2",null,n),e.createElement("div",null,e.createElement(w.zx,{size:"md",variant:"secondary",icon:"arrow-left",onClick:t},"Go back to Queries"))))}var at=o(4148),Ur=o(85387),nn=o(5026);class Vr extends e.PureComponent{constructor(){super(...arguments),this.state={stateHistoryItems:[]},this.clearHistory=async()=>{const{dashboard:t,panelId:a,onRefresh:s}=this.props;await(0,at.i)().post("/api/annotations/mass-delete",{dashboardId:t.id,panelId:a}),this.setState({stateHistoryItems:[]}),s()}}componentDidMount(){const{dashboard:t,panelId:a}=this.props;(0,at.i)().get(`/api/annotations?dashboardId=${t.id}&panelId=${a}&limit=50&type=alert`,{},`state-history-${t.id}-${a}`).then(s=>{const r=s.map(i=>({stateModel:nn.Z.getStateDisplayModel(i.newState),time:t.formatDate(i.time,"MMM D, YYYY HH:mm:ss"),info:nn.Z.getAlertAnnotationInfo(i)}));this.setState({stateHistoryItems:r})})}render(){const{stateHistoryItems:t}=this.state;return e.createElement("div",null,t.length>0&&e.createElement("div",{className:"p-b-1"},e.createElement("span",{className:"muted"},"Last 50 state changes"),e.createElement(Ur.p,{onConfirm:this.clearHistory,confirmVariant:"destructive",confirmText:"Clear"},e.createElement(w.zx,{className:(0,m.css)`
                  direction: ltr;
                `,variant:"destructive",icon:"trash-alt"},"Clear history"))),e.createElement("ol",{className:"alert-rule-list"},t.length>0?t.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(U.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 Hr=Vr;var an=o(84766),rt=o(19649);class Gr extends e.PureComponent{constructor(){super(...arguments),this.state={isLoading:!1,allNodesExpanded:null,testRuleResponse:{}},this.setFormattedJson=t=>{this.formattedJson=t},this.getTextForClipboard=()=>JSON.stringify(this.formattedJson,null,2),this.onToggleExpand=()=>{this.setState(t=>({...t,allNodesExpanded:!this.state.allNodesExpanded}))},this.getNrOfOpenNodes=()=>this.state.allNodesExpanded===null?3:this.state.allNodesExpanded?20:1,this.renderExpandCollapse=()=>{const{allNodesExpanded:t}=this.state,a=e.createElement(e.Fragment,null,e.createElement(U.J,{name:"minus-circle"})," Collapse All"),s=e.createElement(e.Fragment,null,e.createElement(U.J,{name:"plus-circle"})," Expand All");return t?a:s}}componentDidMount(){this.testRule()}async testRule(){const{dashboard:t,panel:a}=this.props,s=t.getSaveModelCloneOld();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,at.i)().post("/api/alerts/test",r);this.setState({isLoading:!1,testRuleResponse:i})}render(){const{testRuleResponse:t,isLoading:a}=this.state,s=(0,w.gN)(this.props.theme);if(a===!0)return e.createElement(an.u,{text:"Evaluating rule"});const r=this.getNrOfOpenNodes();return e.createElement(e.Fragment,null,e.createElement("div",{className:"pull-right"},e.createElement(k.Lh,{spacing:"md"},e.createElement("button",{type:"button",className:s,onClick:this.onToggleExpand},this.renderExpandCollapse()),e.createElement(je.m,{getText:this.getTextForClipboard,icon:"copy"},"Copy to Clipboard"))),e.createElement(rt.g,{json:t,open:r,onDidRender:this.setFormattedJson}))}}const Kr=(0,y.HE)(Gr);var jr=o(75321);class Jr 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=t=>{const a=this.state[t];this.setState({...this.state,[t]:!a})},this.renderTestRule=()=>{if(!this.state.showTestRule)return null;const{panel:t,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(Kr,{panel:t,dashboard:a}))},this.renderDeleteConfirmation=()=>{if(!this.state.showDeleteConfirmation)return null;const{panel:t}=this.props,a=()=>this.onToggleModal("showDeleteConfirmation");return e.createElement(ke.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 t.alert,t.thresholds=[],this.panelCtrl&&(this.panelCtrl.alertState=null,this.panelCtrl.render()),this.component?.digest(),a()}})},this.renderStateHistory=()=>{if(!this.state.showStateHistory)return null;const{panel:t,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(Hr,{dashboard:a,panelId:t.id,onRefresh:()=>this.panelCtrl?.refresh()}))}}async componentDidMount(){S.config.angularSupportEnabled?(await Promise.all([o.e(8342),o.e(5718)]).then(o.bind(o,63368)),this.loadAlertTab()):alert("Angular support disabled, legacy alerting cannot function without angular support")}componentDidUpdate(t){this.loadAlertTab()}componentWillUnmount(){this.component&&this.component.destroy()}async loadAlertTab(){const{panel:t,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,zt.w)(),r="<alert-tab />",i={ctrl:this.panelCtrl};this.component=s.load(this.element,i,r);const l=await(0,jr.E)(t.transformations,t.targets,(0,zr.F)(),t.datasource);l&&this.setState({validationMessage:l})}getReactAlertPanelCtrl(){return{panel:this.props.panel,events:new kr.F,render:()=>{this.props.panel.render()}}}render(){const{alert:t,transformations:a}=this.props.panel,{validationMessage:s}=this.state,r=a&&a.length>0;if(!t&&s)return e.createElement(tn,{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(k.W2,{padding:"md"},e.createElement("div",{"aria-label":v.wl.components.AlertTab.content},t&&r&&e.createElement(X.b,{severity:b.AppNotificationSeverity.Error,title:"Transformations are not supported in alert queries"}),e.createElement("div",{ref:l=>this.element=l}),t&&e.createElement(k.Lh,null,e.createElement(w.zx,{onClick:()=>this.onToggleModal("showStateHistory"),variant:"secondary"},"State history"),e.createElement(w.zx,{onClick:()=>this.onToggleModal("showTestRule"),variant:"secondary"},"Test rule"),e.createElement(w.zx,{onClick:()=>this.onToggleModal("showDeleteConfirmation"),variant:"destructive"},"Delete")),!t&&!s&&e.createElement(Br.Z,{...i})))),this.renderTestRule(),this.renderDeleteConfirmation(),this.renderStateHistory())}}const Qr=(n,t)=>({angularPanelComponent:(0,De.i)(n,t.panel)?.angularComponent}),Zr={},Yr=(0,O.connect)(Qr,Zr)(Jr);var Xr=o(69307),qr=o(54538),_r=o(79517),es=o(90839);const rn=({dashboard:n,panel:t,className:a})=>{const s=(0,b.useSelector)(c=>c.templating),r=(0,Ue.TH)(),{loading:i,value:l}=(0,Te.Z)(()=>(0,es.aR)(t,n),[t,n,s]);if(i)return e.createElement(w.zx,{disabled:!0},"Create alert rule from this panel");if(!l)return e.createElement(X.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=Xr.Cj.renderUrl("alerting/new",{defaults:JSON.stringify(l),returnTo:r.pathname+r.search});return e.createElement(w.Qj,{icon:"bell",onClick:()=>(0,qr.PN)(_r.z7.alertRuleFromPanel),href:d,className:a,"data-testid":"create-alert-rule-button"},"Create alert rule from this panel")};var ts=o(72776),sn=o(79493),st=o(63483),de=o(95712),on=o(57675),ns=o(52106),ln=o(26544);function cn({dashboard:n,panel:t,poll:a=!1}){const s=(0,b.useDispatch)(),r=(0,ln._)(p=>p.promRules[de.GC])??on.oq,i=(0,ln._)(p=>p.rulerRules[de.GC])??on.oq;(0,e.useEffect)(()=>{const p=()=>{s((0,sn.y6)({rulesSourceName:de.GC,filter:{dashboardUID:n.uid,panelId:t.id}})),s((0,sn.UR)({rulesSourceName:de.GC,filter:{dashboardUID:n.uid,panelId:t.id}}))};if(p(),a){const g=setInterval(p,st.p4);return()=>{clearInterval(g)}}return()=>{}},[s,a,t.id,n.uid]);const l=r.loading||i.loading,d=[r.error,i.error].filter(p=>!!p),c=(0,ns.Zo)(de.GC);return{rules:(0,e.useMemo)(()=>c.flatMap(p=>p.groups).flatMap(p=>p.rules).filter(p=>p.annotations[st.q6.dashboardUID]===n.uid&&p.annotations[st.q6.panelID]===String(t.id)),[c,n,t]),errors:d,loading:l}}var dn=o(60703);const as=({dashboard:n,panel:t})=>{const a=(0,y.wW)(rs),{errors:s,loading:r,rules:i}=cn({dashboard:n,panel:t,poll:!0}),l=(0,dn.Bz)("grafana"),d=ge.contextSrv.hasPermission(l.create),c=s.length?e.createElement(X.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(an.u,{text:"Loading rules..."})):i.length?e.createElement(se.$,{autoHeightMin:"100%"},e.createElement("div",{className:a.innerWrapper},c,e.createElement(ts.i,{rules:i}),!!n.meta.canSave&&d&&e.createElement(rn,{className:a.newButton,panel:t,dashboard:n}))):e.createElement("div",{"aria-label":v.wl.components.PanelAlertTabContent.content,className:a.noRulesWrapper},c,!!n.uid&&e.createElement(e.Fragment,null,e.createElement("p",null,"There are no alert rules linked to this panel."),!!n.meta.canSave&&d&&e.createElement(rn,{panel:t,dashboard:n})),!n.uid&&!!n.meta.canSave&&e.createElement(X.b,{severity:"info",title:"Dashboard not saved"},"Dashboard must be saved before alerts can be added."))},rs=n=>({newButton:(0,m.css)`
    margin-top: ${n.spacing(3)};
  `,innerWrapper:(0,m.css)`
    padding: ${n.spacing(2)};
  `,noRulesWrapper:(0,m.css)`
    margin: ${n.spacing(2)};
    background-color: ${n.colors.background.secondary};
    padding: ${n.spacing(3)};
  `}),ss=S.config.unifiedAlertingEnabled?as:Yr,os=({panel:n,dashboard:t,...a})=>{const{rules:s,loading:r}=cn({panel:n,dashboard:t});return e.createElement(fe.O,{...a,counter:r?null:s.length})};var un=o(24058),ze=o(34177),ye=o(74129),is=o(36604),L=o(7959),ls=o(13868),ne=o(4236),M=o(50820);const cs={[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"},pn=n=>cs[n];var ot=o(47082),ds=o(34484),it=o(948),us=o(86981),ps=o(98347),be=o(78209),ms=o(98324),gs=o(84289),lt=o(60593);const fs=({debugMode:n,index:t,data:a,uiConfig:s,configs:r,onChange:i})=>{const l=(0,y.wW)(hs),[d,c]=(0,e.useState)([]),[u,p]=(0,e.useState)([]),g=(0,e.useMemo)(()=>r[t],[r,t]);(0,e.useEffect)(()=>{const h=r[t].transformation,E=h.filter?.options?(0,Vt.b9)(h.filter):void 0,P=r.slice(0,t).map(T=>T.transformation),$=r.slice(t,t+1).map(T=>T.transformation),N={interpolate:T=>(0,Ze.J)().replace(T)},x=(0,lt.H)(P,a,N).subscribe(T=>{E&&(T=a.filter(R=>E(R))),c(T)}),J=(0,lt.H)(P,a,N).pipe((0,gs.z)(T=>(0,lt.H)($,T,N))).subscribe(p);return function(){x.unsubscribe(),J.unsubscribe()}},[t,a,r]);const f=(0,e.useMemo)(()=>e.createElement(s.editor,{options:{...s.transformation.defaultOptions,...g.transformation.options},input:d,onChange:h=>{i(t,{...g.transformation,options:h})}}),[s.editor,s.transformation.defaultOptions,g.transformation,d,i,t]);return e.createElement("div",{className:l.editor,"data-testid":v.wl.components.TransformTab.transformationEditor(s.name)},f,n&&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(rt.g,{json:d}))),e.createElement("div",{className:l.debugSeparator},e.createElement(U.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(rt.g,{json:u})))))},hs=n=>{const t=n.isLight?n.v1.palette.gray85:n.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: ${n.typography.fontWeightMedium};
      color: ${n.colors.primary.text};
    `,iconRow:(0,m.css)`
      display: flex;
    `,icon:(0,m.css)`
      background: transparent;
      border: none;
      box-shadow: none;
      cursor: pointer;
      color: ${n.colors.text.secondary};
      margin-left: ${n.spacing(1)};
      &:hover {
        color: ${n.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 ${n.spacing(.5)};
      color: ${n.colors.primary.text};
    `,debugTitle:(0,m.css)`
      padding: ${n.spacing(1)} ${n.spacing(.25)};
      font-family: ${n.typography.fontFamilyMonospace};
      font-size: ${n.typography.bodySmall.fontSize};
      color: ${n.colors.text};
      border-bottom: 1px solid ${t};
      flex-grow: 0;
      flex-shrink: 1;
    `,debug:(0,m.css)`
      margin-top: ${n.spacing(1)};
      padding: 0 ${n.spacing(1,1,1)};
      border: 1px solid ${t};
      background: ${n.isLight?n.v1.palette.white:n.v1.palette.gray05};
      border-radius: ${n.shape.radius.default};
      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: ${n.spacing(.5)};
    `}};var vs=o(410);const Es=({index:n,data:t,config:a,onChange:s})=>{const r=(0,y.wW)(ys),i=(0,e.useMemo)(()=>({data:t}),[t]);return e.createElement("div",{className:r.wrapper},e.createElement(ie.g,{label:"Apply transformation to"},e.createElement(vs.M,{value:a.filter,context:i,item:{},onChange:l=>s(n,{...a,filter:l})})))},ys=n=>{const t=n.shape.radius.default;return{wrapper:(0,m.css)`
      padding: ${n.spacing(2)};
      border: 2px solid ${n.colors.background.secondary};
      border-top: none;
      border-radius: 0 0 ${t} ${t};
      position: relative;
      top: -4px;
    `}},bs=({onRemove:n,index:t,id:a,data:s,configs:r,uiConfig:i,onChange:l})=>{const[d,c]=(0,it.Z)(!1),[u,p]=(0,it.Z)(!1),[g,f]=(0,it.Z)(!1),h=!!r[t].transformation.disabled,E=r[t].transformation.filter!=null,P=E||s.length>1,$=(0,e.useCallback)(R=>{const K=r[R].transformation;l(R,{...K,disabled:K.disabled?void 0:!0})},[l,r]),N=(0,e.useCallback)(()=>{if(g)return!0},[g]),x=(0,e.useCallback)(()=>{let R={...r[t].transformation};R.filter?delete R.filter:R.filter={id:us.E4.byRefId,options:""},l(t,R)},[l,t,r]),J=(0,e.useCallback)((R,K,ue)=>gt=>{let pe="panel_editor_tabs_transformations_toggle";M.default.featureToggles.transformationsRedesign&&(pe="transformations_redesign_"+pe),(0,ae.ff)(pe,{action:ue?"off":"on",toggleId:K,transformationId:r[t].transformation.id}),R(gt)},[r,t]),T=({isOpen:R})=>e.createElement(e.Fragment,null,i.state&&e.createElement(ot.u,{state:i.state}),e.createElement(be.V,{title:"Show transform help",icon:"info-circle",onClick:J(K=>f(!g),"help",g),active:!!g}),P&&e.createElement(be.V,{title:"Filter",icon:"filter",onClick:J(x,"filter",E),active:E}),e.createElement(be.V,{title:"Debug",disabled:!R,icon:"bug",onClick:J(p,"debug",u),active:u}),e.createElement(be.V,{title:"Disable transformation",icon:h?"eye-slash":"eye",onClick:J(()=>$(t),"disabled",h),active:h}),e.createElement(be.y,{title:"Remove",icon:"trash-alt",onClick:()=>M.default.featureToggles.transformationsRedesign?c(!0):n(t)}),M.default.featureToggles.transformationsRedesign&&e.createElement(ke.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),n(t)},onDismiss:()=>c(!1)}));return e.createElement(ms.t,{id:a,index:t,title:`${t+1} - ${i.name}`,draggable:!0,actions:T,disabled:h,isOpen:N(),onClose:()=>f(!1),expanderMessages:{close:"Collapse transformation row",open:"Expand transformation row"}},g&&e.createElement(ps.h,{markdown:Cs(i)}),E&&e.createElement(Es,{index:t,config:r[t].transformation,data:s,onChange:l}),e.createElement(fs,{debugMode:u,index:t,data:s,configs:r,uiConfig:i,onChange:l}))};function Cs(n){return`
${n.help??n.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 Ps=({data:n,onChange:t,onRemove:a,configs:s})=>e.createElement(e.Fragment,null,s.map((r,i)=>{const l=ze.Z.getIfExists(r.transformation.id);return l?e.createElement(bs,{index:i,id:`${r.id}`,key:`${r.id}`,data:n,configs:s,uiConfig:l,onRemove:a,onChange:t}):null})),Ss="dashboard.components.TransformationEditor.featureInfoBox.isDismissed",ct="viewAll",Ts=[[ct,"View all"],...Object.entries(ds.Vx)];class xs extends e.PureComponent{constructor(t){super(t),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=ze.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,ae.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,ae.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,ae.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 r=Ce(M.default.theme2),{data:i,transformations:l,showPicker:d}=this.state,c=M.default.featureToggles.transformationsRedesign&&d;return e.createElement("div",{className:(0,m.cx)({[r.hide]:c})},e.createElement(un.Z5,{onDragEnd:this.onDragEnd},e.createElement(un.bK,{droppableId:"transformations-list",direction:"vertical"},u=>e.createElement("div",{ref:u.innerRef,...u.droppableProps},e.createElement(Ps,{configs:l,data:i,onRemove:this.onTransformationRemove,onChange:this.onTransformationChange}),u.placeholder))))};const a=t.panel.transformations||[],s=this.buildTransformationIds(a);this.state={transformations:a.map((r,i)=>({transformation:r,id:s[i]})),data:[],search:"",selectedFilter:ct,showIllustrations:!0}}buildTransformationIds(t){const a={},s=[];for(let r=0;r<t.length;r++){const i=t[r];a[i.id]===void 0?a[i.id]=0:a[i.id]+=1,s.push(`${t[r].id}-${a[t[r].id]}`)}return s}componentDidMount(){this.subscription=this.props.panel.getQueryRunner().getData({withTransforms:!1,withFieldConfig:!1}).subscribe({next:t=>this.setState({data:t.series})})}componentWillUnmount(){this.subscription&&this.subscription.unsubscribe()}componentDidUpdate(t,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(t){this.setState({transformations:t}),this.props.panel.setTransformations(t.map(a=>a.transformation))}renderTransformsPicker(){const t=Ce(M.default.theme2),{transformations:a,search:s}=this.state;let r=null,i=ze.Z.list().sort((c,u)=>c.name>u.name?1:u.name>c.name?-1:0);if(this.state.selectedFilter!==ct&&(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(Ee.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(Ee.h,{name:"times",onClick:()=>{this.setState({showPicker:!1})},tooltip:"Close picker"})),e.createElement(e.Fragment,null,l&&!M.default.featureToggles.transformationsRedesign&&e.createElement(k.W2,{grow:1},e.createElement(ht.G,{storageKey:Ss,defaultValue:!1},(c,u)=>c?null:e.createElement(X.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:pn(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(w.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:t.pickerInformationLine},e.createElement("a",{href:pn(ye.x.Transformations),className:"external-link",target:"_blank",rel:"noreferrer"},e.createElement("span",{className:t.pickerInformationLineHighlight},"Transformations")," ",e.createElement(U.J,{name:"external-link-alt"})),"\xA0allow you to manipulate your data before a visualization is applied.")),e.createElement(k.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(ws,{key:c.name,transform:c,onClick:()=>{this.onTransformationAdd({value:c.id})}})),M.default.featureToggles.transformationsRedesign&&e.createElement("div",{className:t.searchWrapper},e.createElement(re.I,{"data-testid":v.wl.components.Transforms.searchInput,className:t.searchInput,value:s??"",autoFocus:!l,placeholder:"Search for transformation",onChange:this.onSearchChange,onKeyDown:this.onSearchKeyDown,suffix:r}),e.createElement("div",{className:t.showImages},e.createElement("span",{className:t.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:t.filterWrapper},Ts.map(([c,u])=>e.createElement(ls.B,{key:c,onClick:()=>this.setState({selectedFilter:c}),label:u,selected:this.state.selectedFilter===c}))),M.default.featureToggles.transformationsRedesign&&e.createElement(Ds,{showIllustrations:this.state.showIllustrations,transformations:i,data:this.state.data,onClick:c=>{this.onTransformationAdd({value:c})}}))):e.createElement(w.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 t=Ce(M.default.theme2),{panel:{alert:a}}=this.props,{transformations:s}=this.state,r=s.length>0;return!r&&a?e.createElement(tn,{message:"Transformations can't be used on a panel with existing alerts"}):e.createElement(se.$,{scrollTop:this.state.scrollTop,autoHeightMin:"100%"},e.createElement(k.W2,{padding:"lg"},e.createElement("div",{"data-testid":v.wl.components.TransformTab.content},r&&a?e.createElement(X.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:t.listInformationLineWrapper},e.createElement("span",{className:t.listInformationLineText},"Transformations in use")," ",e.createElement(w.zx,{size:"sm",variant:"secondary",onClick:()=>{this.setState({showRemoveAllModal:!0})}},"Delete all transformations"),e.createElement(ke.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&&this.renderTransformationEditors(),this.renderTransformsPicker())))}}function ws({transform:n,onClick:t}){const a=(0,y.wW)(Ce);return e.createElement(ne.Z,{className:a.card,"data-testid":v.wl.components.TransformTab.newTransform(n.name),onClick:t},e.createElement(ne.Z.Heading,null,n.name),e.createElement(ne.Z.Description,null,n.description),n.state&&e.createElement(ne.Z.Tags,null,e.createElement(ot.u,{state:n.state})))}const Ce=n=>({hide:(0,m.css)({display:"none"}),card:(0,m.css)({margin:"0",padding:`${n.spacing(1)}`}),grid:(0,m.css)({display:"grid",gridTemplateColumns:"repeat(auto-fill, minmax(220px, 1fr))",gridAutoRows:"1fr",gap:`${n.spacing(2)} ${n.spacing(1)}`,width:"100%"}),newCard:(0,m.css)({gridTemplateRows:"min-content 0 1fr 0"}),cardDisabled:(0,m.css)({backgroundColor:"rgb(204, 204, 220, 0.045)",color:`${n.colors.text.disabled} !important`}),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)({fontSize:"12px",display:"flex",flexDirection:"column",justifyContent:"space-between"}),image:(0,m.css)({display:"block",maxEidth:"100%`",marginTop:`${n.spacing(2)}`}),searchWrapper:(0,m.css)({display:"flex",flexWrap:"wrap",columnGap:"27px",rowGap:"16px",width:"100%"}),searchInput:(0,m.css)({flexGrow:"1",width:"initial"}),showImages:(0,m.css)({flexBasis:"0",display:"flex",gap:"8px",alignItems:"center"}),pickerInformationLine:(0,m.css)({fontSize:"16px",marginBottom:`${n.spacing(2)}`}),pickerInformationLineHighlight:(0,m.css)({verticalAlign:"middle"}),illustationSwitchLabel:(0,m.css)({whiteSpace:"nowrap"}),filterWrapper:(0,m.css)({padding:`${n.spacing(1)} 0`,display:"flex",flexWrap:"wrap",rowGap:`${n.spacing(1)}`,columnGap:`${n.spacing(.5)}`}),listInformationLineWrapper:(0,m.css)({display:"flex",justifyContent:"space-between",marginBottom:"24px"}),listInformationLineText:(0,m.css)({fontSize:"16px"}),pluginStateInfoWrapper:(0,m.css)({marginLeft:"5px"}),cardApplicableInfo:(0,m.css)({position:"absolute",bottom:`${n.spacing(1)}`,right:`${n.spacing(1)}`})});function Ds({showIllustrations:n,transformations:t,onClick:a,data:s}){const r=(0,y.wW)(Ce);return e.createElement("div",{className:r.grid},t.map(i=>{let l=is.s.Applicable;i.transformation.isApplicable!==void 0&&(l=i.transformation.isApplicable(s));const d=l>0;let c=null;i.transformation.isApplicableDescription!==void 0&&(typeof i.transformation.isApplicableDescription=="function"?c=i.transformation.isApplicableDescription(s):c=i.transformation.isApplicableDescription);let u=r.newCard;return d||(u=(0,m.cx)(r.newCard,r.cardDisabled)),e.createElement(ne.Z,{className:u,"data-testid":v.wl.components.TransformTab.newTransform(i.name),onClick:()=>a(i.id),key:i.id},e.createElement(ne.Z.Heading,{className:r.heading},e.createElement(e.Fragment,null,e.createElement("span",null,i.name),e.createElement("span",{className:r.pluginStateInfoWrapper},e.createElement(ot.u,{state:i.state})))),e.createElement(ne.Z.Description,{className:r.description},e.createElement(e.Fragment,null,e.createElement("span",null,Ns(i.id)),n&&e.createElement("span",null,e.createElement("img",{className:r.image,src:Is(i.id,!d),alt:i.name})),!d&&c!==null&&e.createElement(Ee.h,{className:r.cardApplicableInfo,name:"info-circle",tooltip:c}))))}))}const Is=(n,t)=>{let a=null;return t?a="disabled":a=M.default.theme2.isDark?"dark":"light",`public/img/transformations/${a}/${n}.svg`},Ns=n=>({[L.W.concatenate]:"Combine all fields into a single frame.",[L.W.configFromData]:"Set unit, min, max and more.",[L.W.fieldLookup]:"Use a field value to lookup countries, states, or airports.",[L.W.filterFieldsByName]:"Remove parts of the query results using a regex pattern.",[L.W.filterByRefId]:"Remove rows from the data based on origin query",[L.W.filterByValue]:"Remove rows from the query results using user-defined filters.",[L.W.groupBy]:"Group data by a field value and create aggregate data.",[L.W.groupingToMatrix]:"Summarize and reorganize data based on three fields.",[L.W.joinByField]:"Combine rows from 2+ tables, based on a related field.",[L.W.labelsToFields]:"Group series by time and return labels or tags as fields.",[L.W.merge]:"Merge multiple series. Values will be combined into one row.",[L.W.organize]:"Re-order, hide, or rename fields.",[L.W.partitionByValues]:"Split a one-frame dataset into multiple series.",[L.W.prepareTimeSeries]:"Stretch data frames from the wide format into the long format.",[L.W.reduce]:"Reduce all rows or data points to a single value (ex. max, mean).",[L.W.renameByRegex]:"Rename parts of the query results using a regular expression and replacement pattern.",[L.W.seriesToRows]:"Merge multiple series. Return time, metric and values as a row."})[n]||ze.Z.getIfExists(n)?.description||"",Rs=(0,y.Zz)(xs);var Os=o(47635),dt=o(52436),As=o(21026),Ms=o(24677);class $s extends e.PureComponent{constructor(t){super(t),this.updateLastUsedDatasource=a=>{if(!a.uid)return;const s=(0,Fe.h4)().getCurrent()?.uid??"";if(a.uid===Ms.D)return(0,Se.$0)(s);(0,Se.yQ)(s,a.uid)},this.onRunQueries=()=>{this.props.panel.refresh()},this.onOpenQueryInspector=()=>{I.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(t){const a=t.datasource??{default:!0},s=(0,dt.ak)().getInstanceSettings(a);return this.updateLastUsedDatasource(a),{cacheTimeout:s?.meta.queryOptions?.cacheTimeout?t.cacheTimeout:void 0,dataSource:{default:s?.isDefault,type:s?.type,uid:s?.uid},queryCachingTTL:s?.cachingConfig?.enabled?t.queryCachingTTL:void 0,queries:t.targets,maxDataPoints:t.maxDataPoints,minInterval:t.interval,timeRange:{from:t.timeFrom,shift:t.timeShift,hide:t.hideTimeOverride}}}async componentDidMount(){const{panel:t}=this.props;if(!t.datasource){let a;const s=(0,Fe.h4)().getCurrent()?.uid??"",r=(0,Se.$N)(s);r?.datasourceUid!==null&&(a=(0,dt.ak)().getInstanceSettings(r?.datasourceUid)),a||(a=(0,dt.ak)().getInstanceSettings(null)),t.datasource=(0,Os.iU)(a),this.forceUpdate()}}render(){const{panel:t}=this.props;if(!t.datasource)return null;const a=this.buildQueryOptions(t);return e.createElement(As.D,{options:a,queryRunner:t.getQueryRunner(),onRunQueries:this.onRunQueries,onOpenQueryInspector:this.onOpenQueryInspector,onOptionsChange:this.onOptionsChange})}}const mn=e.memo(({panel:n,dashboard:t,tabs:a,onChangeTab:s})=>{const r=(0,en.N)(),i=(0,y.wW)(Fs),l=(0,e.useCallback)(c=>{let u="panel_editor_tabs_changed";S.config.featureToggles.transformationsRedesign&&(u="transformations_redesign_"+u),c.active||(0,ae.ff)(u,{tab_id:c.id}),s(c)},[s]);(0,e.useEffect)(()=>{const c=new $t.w0;return c.add(n.events.subscribe(Z.pO,r)),c.add(n.events.subscribe(Z.Xw,r)),()=>c.unsubscribe()},[n,t,r]);const d=a.find(c=>c.active);return a.length===0?null:e.createElement("div",{className:i.wrapper},e.createElement(Ke.J,{className:i.tabBar,hideBorder:!0},a.map(c=>c.id===D.Ip.Alert?Ls(c,n,t,l):e.createElement(fe.O,{key:c.id,label:c.text,active:c.active,onChangeTab:()=>l(c),icon:(0,nt.toIconName)(c.icon),counter:gn(n,c)}))),e.createElement(Wr.I,{className:i.tabContent},d.id===D.Ip.Query&&e.createElement($s,{panel:n,queries:n.targets}),d.id===D.Ip.Alert&&e.createElement(ss,{panel:n,dashboard:t}),d.id===D.Ip.Transform&&e.createElement(Rs,{panel:n})))});mn.displayName="PanelEditorTabs";function gn(n,t){switch(t.id){case D.Ip.Query:return n.targets.length;case D.Ip.Alert:return n.alert?1:0;case D.Ip.Transform:return(n.getTransformations()??[]).length}return null}function Ls(n,t,a,s){return!S.config.alertingEnabled&&!S.config.unifiedAlertingEnabled?null:S.config.unifiedAlertingEnabled?e.createElement(os,{key:n.id,label:n.text,active:n.active,onChangeTab:()=>s(n),icon:(0,nt.toIconName)(n.icon),panel:t,dashboard:a}):S.config.alertingEnabled?e.createElement(fe.O,{key:n.id,label:n.text,active:n.active,onChangeTab:()=>s(n),icon:(0,nt.toIconName)(n.icon),counter:gn(t,n)}):null}const Fs=n=>({wrapper:(0,m.css)`
      display: flex;
      flex-direction: column;
      height: 100%;
    `,tabBar:(0,m.css)`
      padding-left: ${n.spacing(2)};
    `,tabContent:(0,m.css)`
      padding: 0;
      display: flex;
      flex-direction: column;
      flex: 1;
      min-height: 0;
      background: ${n.colors.background.primary};
      border: 1px solid ${n.components.panel.borderColor};
      border-left: none;
      border-bottom: none;
      border-top-right-radius: ${n.shape.borderRadius(1.5)};
    `});var Ws=o(16360);const ks=(0,Ws.Z)((n,t)=>{const a=[];if(!t)return a;let s=D.Ip.Visualize;if(t.meta.skipDataQuery)return[];t.meta.skipDataQuery||(s=D.Ip.Query,a.push({id:D.Ip.Query,text:"Query",icon:"database",active:!1}),a.push({id:D.Ip.Transform,text:"Transform data",icon:"process",active:!1}));const{alertingEnabled:r,unifiedAlertingEnabled:i}=(0,M.iE)(),l=ge.contextSrv.hasPermission((0,dn.Bz)(de.GC).read),d=r||i&&l,c=t.meta.id==="graph",u=t.meta.id==="timeseries";(d&&c||u)&&a.push({id:D.Ip.Alert,text:"Alert",icon:"bell",active:!1});const p=a.find(g=>g.id===(n||s))??a[0];return p.active=!0,a});var zs=o(82247);const Bs=(n,t)=>{const a=n.panelEditor.getPanel(),s=(0,De.i)(n,a);return{panel:a,plugin:s?.plugin,instanceState:s?.instanceState,initDone:n.panelEditor.initDone,uiState:n.panelEditor.ui,tableViewEnabled:n.panelEditor.tableViewEnabled,variables:(0,qe.gt)(t.dashboard.uid,n)}},Us={initPanelEditor:Ln,discardPanelChanges:St,updatePanelEditorUIState:Ge,updateTimeZoneForSession:ba.YT,toggleTableView:Y.OT,notifyApp:Q.$l},Vs=(0,O.connect)(Bs,Us);class Hs extends e.PureComponent{constructor(){super(...arguments),this.state={showSaveLibraryPanelModal:!1},this.triggerForceUpdate=()=>{this.forceUpdate()},this.onBack=()=>{I.E1.partial({editPanel:null,tab:null,showCategory:null})},this.onDiscard=()=>{this.props.discardPanelChanges(),this.onBack()},this.onSaveDashboard=()=>{fa.h$.publish(new Z.Dn({component:Ta.d,props:{dashboard:this.props.dashboard}}))},this.onSaveLibraryPanel=async()=>{(0,ve.V)(this.props.panel)&&this.setState({showSaveLibraryPanelModal:!0})},this.onChangeTab=t=>{I.E1.partial({tab:t.id})},this.onFieldConfigChange=t=>{this.props.panel.updateFieldConfig({...t})},this.onPanelOptionsChanged=t=>{this.props.panel.updateOptions(t)},this.onPanelConfigChanged=(t,a)=>{this.props.panel.setProperty(t,a),this.props.panel.render(),this.forceUpdate()},this.onDisplayModeChange=t=>{const{updatePanelEditorUIState:a}=this.props;this.props.tableViewEnabled&&this.props.toggleTableView(),a({mode:t})},this.onToggleTableView=()=>{this.props.toggleTableView()},this.onGoBackToDashboard=()=>{I.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:t,initDone:a}=this.props;a&&!this.eventSubs&&(this.eventSubs=new $t.w0,this.eventSubs.add(t.events.subscribe(Z.Wj,this.triggerForceUpdate)))}componentWillUnmount(){this.eventSubs?.unsubscribe()}renderPanel(t,a){const{dashboard:s,panel:r,uiState:i,tableViewEnabled:l,theme:d}=this.props;return e.createElement("div",{className:t.mainPaneWrapper,key:"panel"},this.renderPanelToolbar(t),e.createElement("div",{className:t.panelWrapper},e.createElement(Ie.Z,null,({width:c,height:u})=>{if(c<3||u<3)return null;if(a&&(u-=d.spacing.gridSize*2),l)return e.createElement(Fr,{width:c,height:u,panel:r,dashboard:s});const p=(0,zs.jF)(i.mode,c,u,r);return e.createElement("div",{className:t.centeringContainer,style:{width:c,height:u}},e.createElement("div",{style:p,"data-panelid":r.id},e.createElement(Pa.l,{key:r.key,stateKey:r.key,dashboard:s,panel:r,isEditing:!0,isViewing:!1,lazy:!1,width:p.width,height:p.height})))})))}renderPanelAndEditor(t,a){const{panel:s,dashboard:r,plugin:i,tab:l}=this.props,d=ks(l,i),c=d.length===0,u=this.renderPanel(a,c);return d.length===0?e.createElement("div",{className:a.onlyPanel},u):e.createElement(Ft.U,{splitOrientation:"horizontal",maxSize:-200,paneSize:t.topPaneSize,primary:"first",secondaryPaneStyle:{minHeight:0},onDragFinished:p=>{p&&Ge({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(mn,{key:s.key,panel:s,dashboard:r,tabs:d,onChangeTab:this.onChangeTab})))}renderTemplateVariables(t){const{variables:a}=this.props;return a.length?e.createElement("div",{className:t.variablesWrapper},e.createElement(Wt,{variables:a})):null}renderPanelToolbar(t){const{dashboard:a,uiState:s,variables:r,updateTimeZoneForSession:i,panel:l,tableViewEnabled:d}=this.props;return e.createElement("div",{className:t.panelToolbar},e.createElement(k.Lh,{justify:r.length>0?"space-between":"flex-end",align:"flex-start"},this.renderTemplateVariables(t),e.createElement(Ne.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(Ae.S,{value:s.mode,options:D.d7,onChange:this.onDisplayModeChange}),e.createElement(Sa.C,{dashboard:a,onChangeTimeZone:i,isOnCanvas:!0}),!s.isPanelOptionsVisible&&e.createElement(et,{panel:l}))))}renderEditorActions(){const t="sm";let a=[e.createElement(w.zx,{onClick:this.onDiscard,title:"Undo all changes",key:"discard",size:t,variant:"destructive",fill:"outline"},"Discard"),this.props.panel.libraryPanel?e.createElement(w.zx,{onClick:this.onSaveLibraryPanel,variant:"primary",size:t,title:"Apply changes and save library panel",key:"save-panel"},"Save library panel"):e.createElement(w.zx,{onClick:this.onSaveDashboard,title:"Apply changes and save dashboard",key:"save",size:t,variant:"secondary"},"Save"),e.createElement(w.zx,{onClick:this.onBack,variant:"primary",title:"Apply changes and go back to dashboard","data-testid":v.wl.components.PanelEditor.applyButton,key:"apply",size:t},"Apply")];return this.props.panel.libraryPanel&&(a.splice(1,0,e.createElement(bt.JY,{key:"unlink-controller"},({showModal:s,hideModal:r})=>e.createElement(Me.h,{onClick:()=>{s(Ca.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:t,dashboard:a,panel:s,instanceState:r}=this.props;return t?e.createElement(Nr,{plugin:t,dashboard:a,panel:s,instanceState:r,onFieldConfigsChange:this.onFieldConfigChange,onPanelOptionsChanged:this.onPanelOptionsChanged,onPanelConfigChange:this.onPanelConfigChanged}):e.createElement("div",null)}render(){const{initDone:t,uiState:a,theme:s,sectionNav:r,pageNav:i,className:l,updatePanelEditorUIState:d}=this.props,c=Ks(s,this.props);return t?e.createElement(C.T,{navModel:r,pageNav:i,"aria-label":v.wl.components.PanelEditor.General.content,layout:F.Q.Custom,className:l},e.createElement(ga.A,{actions:e.createElement(ma.R,{alignment:"right"},this.renderEditorActions())}),e.createElement("div",{className:c.wrapper},e.createElement("div",{className:c.verticalSplitPanesWrapper},a.isPanelOptionsVisible?e.createElement(Ft.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(Ct,{panel:this.props.panel,folderUid:this.props.dashboard.meta.folderUid??"",onConfirm:this.onConfirmAndDismissLibarayPanelModel,onDiscard:this.onDiscard,onDismiss:this.onConfirmAndDismissLibarayPanelModel}))):null}}const Gs=(0,y.HE)(Vs(Hs)),Ks=(0,Lt.B)((n,t)=>{const{uiState:a}=t,s=n.spacing(2);return{wrapper:(0,m.css)({width:"100%",flexGrow:1,minHeight:0,display:"flex",paddingTop:n.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: ${n.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: ${n.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 js=o(74661),Js=o(69171),Qs=o(32961),Zs=o(32627);const Ys=({annotation:n,events:t,onEnabledChanged:a})=>{const[s,r]=(0,e.useState)(!1),i=(0,y.wW)(Xs),l=()=>(0,Zs.kt)().cancel(n);return(0,e.useEffect)(()=>{const d=t.getStream(Z.z).subscribe({next:u=>{u.payload===n&&r(!0)}}),c=t.getStream(Z.RB).subscribe({next:u=>{u.payload===n&&r(!1)}});return()=>{d.unsubscribe(),c.unsubscribe()}}),e.createElement("div",{key:n.name,className:i.annotation},e.createElement(js.Z,null,e.createElement(Js._,{label:n.name,disabled:s,"data-testid":v.wl.pages.Dashboard.SubMenu.Annotations.annotationLabel(n.name)},e.createElement(ee.x,{label:n.name,value:n.enable,onChange:()=>a(n),disabled:s,"data-testid":v.wl.pages.Dashboard.SubMenu.Annotations.annotationToggle(n.name)})),e.createElement("div",{className:i.indicator},e.createElement(Qs.T,{loading:s,onCancel:l}))))};function Xs(n){return{annotation:(0,m.css)`
      display: inline-block;
      margin-right: ${n.spacing(1)};

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

      .gf-form-inline .gf-form {
        margin-bottom: 0;
      }
    `,indicator:(0,m.css)`
      align-self: center;
      padding: 0 ${n.spacing(.5)};
    `}}const qs=({annotations:n,onAnnotationChanged:t,events:a})=>{const[s,r]=(0,e.useState)([]);return(0,e.useEffect)(()=>{r(n.filter(i=>i.hide!==!0))},[n]),s.length===0?null:e.createElement("div",{"data-testid":v.wl.pages.Dashboard.SubMenu.Annotations.annotationsWrapper},s.map(i=>e.createElement(Ys,{events:a,annotation:i,onEnabledChanged:t,key:i.name})))};var _s=o(45580),ut=o(69159),eo=o(34593),to=o(20367);const no=n=>{const{link:t,linkInfo:a}=n,s=(0,e.useRef)(null),[r,i]=(0,e.useState)("invisible"),[l,d]=(0,e.useState)(0),c=ao(n,l),u=(0,y.wW)(io);return(0,e.useLayoutEffect)(()=>{i(oo(s.current))},[c]),t.asDropdown?e.createElement(fn,{link:t,key:"dashlinks-dropdown","data-testid":v.wl.components.DashboardLinks.dropDown},e.createElement(e.Fragment,null,e.createElement(Me.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(U.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:t.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(fn,{link:t,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:t.targetBlank?"_blank":void 0,rel:"noreferrer","data-testid":v.wl.components.DashboardLinks.link,"aria-label":`${p.title} dashboard`},e.createElement(U.J,{"aria-hidden":!0,name:"apps",style:{marginRight:"4px"}}),e.createElement("span",null,p.title)))))},fn=n=>{const{link:t,children:a,...s}=n;return e.createElement("div",{...s,className:"gf-form"},t.tooltip&&e.createElement(ce.u,{content:t.tooltip},a),!t.tooltip&&e.createElement(e.Fragment,null,a))},ao=({link:n,dashboardUID:t},a)=>{const{tags:s}=n,r=(0,Te.Z)(()=>ro(s),[s,a]);return r.value?so(t,n,r.value):[]};async function ro(n,t={getBackendSrv:to.i}){return await t.getBackendSrv().search({tag:n,limit:100})}function so(n,t,a,s={getLinkSrv:Le.Bq,sanitize:ut.Nw,sanitizeUrl:ut.Nm}){return a.filter(r=>r.uid!==n).map(r=>{const i=r.uid,l=s.sanitize(r.title),d=s.getLinkSrv().getLinkUrl({...t,url:r.url}),c=s.sanitizeUrl(d);return{uid:i,title:l,url:c}})}function oo(n){if(!n)return"invisible";const t=n.parentElement.getBoundingClientRect(),a=n.getBoundingClientRect();return a.width===0?"invisible":t.left+a.width+10>window.innerWidth?"pull-left":"pull-right"}function io(n){return{iconMargin:(0,m.css)({marginRight:n.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:n.colors.text.primary})}}const lo=({dashboard:n,links:t})=>{const a=(0,en.N)();return(0,_s.Z)(()=>{const s=n.events.subscribe(_t.md,a);return()=>s.unsubscribe()}),t.length?e.createElement(e.Fragment,null,t.map((s,r)=>{const i=(0,Le.Bq)().getAnchorInfo(s),l=`${s.title}-$${r}`;if(s.type==="dashboards")return e.createElement(no,{key:l,link:s,linkInfo:i,dashboardUID:n.uid});const d=eo.xy[s.icon],c=e.createElement("a",{className:"gf-form-label gf-form-label--dashlink",href:(0,ut.Nm)(i.href),target:s.targetBlank?"_blank":void 0,rel:"noreferrer","data-testid":v.wl.components.DashboardLinks.link},d&&e.createElement(U.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(ce.u,{content:i.tooltip},c):c)})):null};class co extends e.PureComponent{constructor(){super(...arguments),this.onAnnotationStateChanged=t=>{for(let a=0;a<this.props.dashboard.annotations.list.length;a++){const s=this.props.dashboard.annotations.list[a];if(s.name===t.name){s.enable=!s.enable;break}}this.props.dashboard.startRefresh(),this.forceUpdate()},this.disableSubmitOnEnter=t=>{t.preventDefault()}}render(){const{dashboard:t,variables:a,links:s,annotations:r,theme:i}=this.props,l=po(i);if(!t.isSubMenuVisible())return null;const d=t.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(Wt,{variables:a,readOnly:d})),e.createElement(qs,{annotations:r,onAnnotationChanged:this.onAnnotationStateChanged,events:t.events}),e.createElement("div",{className:l.spacer}),t&&e.createElement(lo,{dashboard:t,links:s}))}}const uo=(n,t)=>{const{uid:a}=t.dashboard,s=(0,qe.AE)(a,n);return{variables:(0,qe.IV)(a,s.variables)}},po=(0,Lt.B)(n=>({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: ${n.spacing(1)} ${n.spacing(2)};
      padding: 0 0 ${n.spacing(1)} 0;
    `,spacer:(0,m.css)({flexGrow:1})})),hn=(0,y.HE)((0,O.connect)(uo)(co));hn.displayName="SubMenu";var mo=o(75671),go=o(74482),fo=o(34401);const vn=n=>({initPhase:n.dashboard.initPhase,initError:n.dashboard.initError,dashboard:n.dashboard.getModel(),navIndex:n.navIndex}),ho={initDashboard:Ot.mV,cleanUpDashboardAndVariables:fo.lw,notifyApp:Q.$l,cancelVariables:yt.wX,templateVarsChangedInUrl:yt.xs},vo=(0,O.connect)(vn,ho);class pt extends e.PureComponent{constructor(){super(...arguments),this.forceRouteReloadCounter=0,this.state=this.getCleanState(),this.updateLiveTimer=()=>{let t;this.props.dashboard?.liveNow&&(t=(0,le.$t)().timeRange()),go.A.setLiveTimeRange(t)},this.onAddPanel=()=>{const{dashboard:t}=this.props;t&&(t.panels.length>0&&t.panels[0].type==="add-panel"||(t.addPanel({type:"add-panel",gridPos:(0,He.lg)(t),title:"Panel Title"}),this.setState({updateScrollTop:0})))},this.setScrollRef=t=>{this.setState({scrollElement:t})}}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:t,match:a,queryParams:s}=this.props;t&&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(t,a){const{dashboard:s,match:r,templateVarsChangedInUrl:i}=this.props,l=this.props.history.location.state?.routeReloadCounter;if(s){if(t.match.params.uid!==r.params.uid||l!==void 0&&this.forceRouteReloadCounter!==l){this.initDashboard(),this.forceRouteReloadCounter=l;return}if(t.location.search!==this.props.location.search){const d=t.queryParams,c=this.props.queryParams;(c?.from!==d?.from||c?.to!==d?.to)&&((0,le.$t)().updateTimeRangeFromUrl(),this.updateLiveTimer()),!d?.refresh&&c?.refresh&&(0,le.$t)().setAutoRefresh(c.refresh);const u=(0,Pn.xT)(this.props.queryParams,t.queryParams);u&&i(s.uid,u)}this.state.editPanel&&!a.editPanel&&(ft.H.setEditingState(!0),this.props.dashboard?.events.publish(new Z.xF(this.state.editPanel.id))),!this.state.editPanel&&a.editPanel&&(ft.H.setEditingState(!1),this.props.dashboard?.events.publish(new Z.Yr(a.editPanel.id))),this.state.editPanelAccessDenied&&(this.props.notifyApp((0,W.t_)("Permission to edit panel denied")),I.E1.partial({editPanel:null})),this.state.panelNotFound&&(this.props.notifyApp((0,W.t_)("Panel not found")),I.E1.partial({editPanel:null,viewPanel:null}))}}static getDerivedStateFromProps(t,a){const{dashboard:s,queryParams:r}=t,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),Eo(t,d)}getInspectPanel(){const{dashboard:t,queryParams:a}=this.props,s=a.inspect;if(!t||!s)return null;const r=t.getPanelById(parseInt(s,10));return r||null}render(){const{dashboard:t,initError:a,queryParams:s}=this.props,{editPanel:r,viewPanel:i,updateScrollTop:l,pageNav:d,sectionNav:c}=this.state,u=B(this.props.queryParams);if(!t||!d||!c)return e.createElement(In.B,{initPhase:this.props.initPhase});const p=this.getInspectPanel(),g=!r&&!u&&!this.props.queryParams.editview,f=u!==b.KioskMode.Full&&!s.editview,h=(0,m.cx)({"panel-in-fullscreen":!!i,"page-hidden":!!(s.editview||r)});return t.meta.dashboardNotFound?e.createElement(C.T,{navId:"dashboards/browse",layout:F.Q.Canvas,pageNav:{text:"Not found"}},e.createElement(A.j,{entity:"Dashboard"})):e.createElement(e.Fragment,null,e.createElement(C.T,{navModel:c,pageNav:d,layout:F.Q.Canvas,className:h,scrollRef:this.setScrollRef,scrollTop:l},f&&e.createElement("header",{"data-testid":v.wl.pages.Dashboard.DashNav.navV2},e.createElement(wn.t,{dashboard:t,title:t.title,folderTitle:t.meta.folderTitle,isFullscreen:!!i,onAddPanel:this.onAddPanel,kioskMode:u,hideTimePicker:t.timepicker.hidden})),e.createElement(Tt,{dashboard:t}),a&&e.createElement(Dn.u,null),g&&e.createElement("section",{"aria-label":v.wl.pages.Dashboard.SubMenu.submenu},e.createElement(hn,{dashboard:t,annotations:t.annotations.list,links:t.links})),S.config.featureToggles.angularDeprecationUI&&t.hasAngularPlugins()&&t.uid!==null&&e.createElement(Cn,{dashboardUid:t.uid}),e.createElement(mo.Z,{dashboard:t,isEditable:!!t.meta.canEdit,viewPanel:i,editPanel:r}),p&&e.createElement(pa,{dashboard:t,panel:p})),r&&e.createElement(Gs,{dashboard:t,sourcePanel:r,tab:this.props.queryParams.tab,sectionNav:c,pageNav:d}),s.editview&&e.createElement(Vn.D,{dashboard:t,editview:s.editview,pageNav:d,sectionNav:c}),s.addWidget&&S.config.featureToggles.vizAndWidgetSplit&&e.createElement(Tn,null))}}pt.contextType=z.h;function Eo(n,t){const{dashboard:a,navIndex:s}=n;if(!a)return t;let r=t.pageNav,i=t.sectionNav;(!r||a.title!==r.text||a.meta.folderUrl!==r.parentItem?.url)&&(r={text:a.title,url:j.u.getUrlForPartial(n.history.location,{editview:null,editPanel:null,viewPanel:null})});const{folderTitle:l,folderUid:d}=a.meta;if(d&&r)if((0,En.v)()){const c=(0,me.ht)(s,`folder-dashboards-${d}`).main;c.id!=="not-found"&&(r={...r,parentItem:c})}else l&&r.parentItem?.text!==l&&(r={...r,parentItem:{text:l,url:`/dashboards/f/${a.meta.folderUid}`}});if(n.route.routeName===b.DashboardRoutes.Path){i=Et();const c=vt(n.match.params.slug);c?.parentItem&&(c.parentItem=c.parentItem)}else i=(0,me.ht)(n.navIndex,"dashboards/browse");return(t.editPanel||t.viewPanel)&&(r={...r,text:`${t.editPanel?"Edit":"View"} panel`,parentItem:r,url:void 0}),t.pageNav===r&&t.sectionNav===i?t:{...t,pageNav:r,sectionNav:i}}const mt=(0,y.HE)(pt);mt.displayName="DashboardPage";const yo=vo(mt)},74393:(Pe,G,o)=>{o.r(G),o.d(G,{default:()=>y});var m=o(39953),e=o(26205),O=o(32688),F=o(13601),j=o(13253),v=o(57721),I=o(35260),S=o(795);function y(Q){const[C,A]=(0,m.useState)(null),{datasourceUid:z}=Q.match.params,W=(0,v.useDispatch)();return(0,m.useEffect)(()=>{const b=(0,e.F)().getInstanceSettings(z);if(!b){A("Data source not found");return}if(O.config.featureToggles.emptyDashboardPage)W((0,S.Rd)(z));else{const B=(0,I.ZQ)(),{dashboard:me}=B;me.panels[0]={...me.panels[0],datasource:{uid:b.uid,type:b.type}},(0,I.$M)(B)}F.E1.replace("/dashboard/new")},[z,W]),C?m.createElement(j.T,{navId:"dashboards"},m.createElement(j.T.Contents,null,m.createElement("div",null,'Data source with UID "',z,'" not found.'))):null}},42410:(Pe,G,o)=>{o.d(G,{$:()=>y,J:()=>I});var m=o(93313),e=o(94123),O=o(4148),F=o(32688),j=o(20367);class v{constructor(){}async get(C){const A=`api/storage/read/${C}`.replace("//","/");return(0,O.i)().get(A)}async list(C){let A="api/storage/list/";C&&(A+=C+"/");const z=await(0,O.i)().get(A);if(z?.data){const W=(0,m.vP)(z);for(const b of W.fields)b.display=(0,e.U)({field:b,theme:F.config.theme2});return W}}async createFolder(C){const A=await(0,O.i)().post("/api/storage/createFolder",JSON.stringify({path:C}));return A.success?{}:{error:A.message??"unknown error"}}async deleteFolder(C){const A=await(0,O.i)().post("/api/storage/deleteFolder",JSON.stringify(C));return A.success?{}:{error:A.message??"unknown error"}}async deleteFile(C){const A=await(0,O.i)().post(`/api/storage/delete/${C.path}`);return A.success?{}:{error:A.message??"unknown error"}}async delete(C){return C.isFolder?this.deleteFolder({path:C.path,force:!0}):this.deleteFile({path:C.path})}async upload(C,A,z){const W=new FormData;W.append("folder",C),W.append("file",A),W.append("overwriteExistingFile",String(z));const b=await fetch("/api/storage/upload",{method:"POST",body:W});let B=await b.json();return B||(B={}),B.status=b.status,B.statusText=b.statusText,b.status!==200&&!B.err&&(B.err=!0),B}async write(C,A){return j.ae.post(`/api/storage/write/${C}`,A)}async getConfig(){return(0,O.i)().get("/api/storage/config")}async getOptions(C){return(0,O.i)().get(`/api/storage/options/${C}`)}}function I(Q,C){const z=Q.toLowerCase().trim();return C.map(b=>b.trim().toLowerCase()).includes(z)}let S;function y(){return S||(S=new v),S}},410:(Pe,G,o)=>{o.d(G,{M:()=>F});var m=o(39953),e=o(86981),O=o(77834);const F=({value:j,context:v,onChange:I})=>{const S=(0,m.useCallback)(y=>{I(y?.length?{id:e.E4.byRefId,options:y}:void 0)},[I]);return m.createElement(O.O,{value:j?.options,onChange:S,data:v.data,placeholder:"Change filter"})}}}]);

//# sourceMappingURL=DashboardPage.81c4034e62fa23cf19aa.js.map