"use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[2859],{50749(y,g,t){t.d(g,{EmbeddedDashboard:()=>x});var e=t(74848),d=t(22803),o=t(96540),P=t(91715),M=t(52358),i=t(36736),O=t(46633),u=t(57007),v=t(33100),R=t(91660),C=t(49439),T=t(25948),m=t(82311),A=t(46333),h=t(74352);function x(a){const s=(0,A.sP)(),{dashboard:r,loadError:n}=s.useState();return(0,h.kt)(),(0,o.useEffect)(()=>(s.loadDashboard({uid:a.uid,route:m.Z4.Embedded}),()=>{s.clearState()}),[s,a.uid]),n?(0,e.jsx)(v.F,{severity:"error",title:(0,M.t)("dashboard.errors.failed-to-load","Failed to load dashboard"),children:(0,T.q6)(n)}):r?(0,e.jsx)(U,{model:r,...a}):(0,e.jsx)(R.y,{})}function U({model:a,initialState:s,onStateChange:r,timeRange:n,refreshToken:c}){const[l,_]=(0,o.useState)(!1),{controls:E,body:D}=a.useState(),f=(0,C.of)(I);return(0,o.useEffect)(()=>{if(_(!0),s){const L=new URLSearchParams(s);i.Go.syncStateFromSearchParams(a,L)}return a.activate()},[a]),W(r,a),b(n,a,l),B(c,a,l),l?(0,e.jsxs)("div",{className:(0,d.cx)(f.canvas,E&&f.canvasWithControls),children:[E&&(0,e.jsx)("div",{className:f.controlsWrapper,children:(0,e.jsx)(E.Component,{model:E})}),(0,e.jsx)("div",{className:f.body,children:(0,e.jsx)(D.Component,{model:D})})]}):null}function W(a,s){(0,o.useEffect)(()=>{if(!a)return;let r="";const n=s.subscribeToEvent(O.b,c=>{if(c.payload.changedObject.urlSync){const l=i.Go.getUrlState(s),_=P.kM.renderUrl("",l);r!==_&&(r=_,a(_))}});return()=>n.unsubscribe()},[s,a])}function b(a,s,r){(0,o.useEffect)(()=>{!r||!a||u.j.getTimeRange(s).onTimeRangeChange(a)},[a,s,r])}function B(a,s,r){const n=(0,o.useRef)(a);(0,o.useEffect)(()=>{if(a===void 0)return;const c=a!==n.current;n.current=a,r&&c&&u.j.getTimeRange(s).onRefresh()},[a,s,r])}function I(a){return{canvas:(0,d.css)({label:"canvas-content",display:"grid",gridTemplateAreas:`
        "panels"`,gridTemplateColumns:"1fr",gridTemplateRows:"1fr",flexBasis:"100%",flexGrow:1}),canvasWithControls:(0,d.css)({gridTemplateAreas:`
        "controls"
        "panels"`,gridTemplateRows:"auto 1fr"}),body:(0,d.css)({label:"body",flexGrow:1,display:"flex",flexDirection:"column",gap:"8px",gridArea:"panels",marginBottom:a.spacing(2)}),controlsWrapper:(0,d.css)({display:"flex",flexDirection:"column",flexGrow:0,gridArea:"controls",padding:a.spacing(2,0,2,2)})}}}}]);

//# sourceMappingURL=EmbeddedDashboard.3c2be70e4241511e0e57.js.map