123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504 |
- "use strict";(self.webpackChunkgrafana=self.webpackChunkgrafana||[]).push([[9782],{41952:(e,t,s)=>{s.r(t),s.d(t,{default:()=>hi});var i=s(68404),o=s(18745),r=s(90923),n=s(69783),a=s(24994),l=s(70064),c=s(8674),d=s(72707),h=s(72629),p=s(70229),u=s(16479);const g=e=>{let{exploreIdLeft:t,exploreIdRight:s}=e;const[r,n]=(0,i.useState)([]),{query:a}=(0,d.useKBar)(),l=(0,o.useDispatch)(),c=(0,o.useSelector)(u.p);return(0,i.useEffect)((()=>{const e={name:"Explore",priority:d.Priority.HIGH+1},i=[];c?(i.push({id:"explore/run-query-left",name:"Run query (left)",keywords:"query left",perform:()=>{l((0,p.aA)(t))},section:e}),s&&(i.push({id:"explore/run-query-right",name:"Run query (right)",keywords:"query right",perform:()=>{l((0,p.aA)(s))},section:e}),i.push({id:"explore/split-view-close-left",name:"Close split view left",keywords:"split",perform:()=>{l((0,h.YV)(t))},section:e}),i.push({id:"explore/split-view-close-right",name:"Close split view right",keywords:"split",perform:()=>{l((0,h.YV)(s))},section:e}))):(i.push({id:"explore/run-query",name:"Run query",keywords:"query",perform:()=>{l((0,p.aA)(t))},section:e}),i.push({id:"explore/split-view-open",name:"Open split view",keywords:"split",perform:()=>{l((0,h.bW)())},section:e})),n(i)}),[t,s,c,a,l]),(0,d.useRegisterActions)(a?r:[],[r,a]),null};var m=s(58635),f=s(43215),y=s(16695),x=s(17421),v=s(62236),b=s(78647),w=s(36636),S=s(87723),R=s(31259),j=s(9239),C=s(5831),T=s(36314),I=s(30804),z=s(21169),k=s(82897),F=s(20002),L=s(91312),O=s(40325),N=s(68793),D=s(75973);var $=s(45916);function E(e){let{data:t,height:s,width:o,timeZone:a,absoluteRange:l,onChangeTime:c,loadingState:d,annotations:h,onHiddenSeriesChanged:p,splitOpenFn:u,graphStyle:g,tooltipDisplayMode:m=L.f3.Single}=e;const y=(0,n.useTheme2)(),[x,v]=(0,i.useState)(!1),[b,S]=(0,i.useState)(1),R=(0,F.Z)(t),j=(0,i.useRef)(0);t&&R&&!(0,f.compareArrayValues)(R,t,f.compareDataFrameStructures)&&j.current++;const T=b+j.current,[I,z]=(0,i.useState)({defaults:{color:{mode:f.FieldColorModeId.PaletteClassic},custom:{drawStyle:L.l8.Line,fillOpacity:0,pointSize:5}},overrides:[]}),E=(0,n.useStyles2)(H),P={from:(0,f.dateTime)(l.from),to:(0,f.dateTime)(l.to),raw:{from:(0,f.dateTime)(l.from),to:(0,f.dateTime)(l.to)}},A=(0,i.useMemo)((()=>{const e=(0,f.createFieldConfigRegistry)((0,O.F)(O.r),"Explore"),s=function(e,t){return(0,D.ZP)(e,(e=>{void 0===e.defaults.custom&&(e.defaults.custom={});const{custom:s}=e.defaults;switch(void 0===s.stacking&&(s.stacking={group:"A"}),t){case"lines":s.drawStyle=L.l8.Line,s.stacking.mode=L.o0.None,s.fillOpacity=0;break;case"bars":s.drawStyle=L.l8.Bars,s.stacking.mode=L.o0.None,s.fillOpacity=100;break;case"points":s.drawStyle=L.l8.Points,s.stacking.mode=L.o0.None,s.fillOpacity=0;break;case"stacked_lines":s.drawStyle=L.l8.Line,s.stacking.mode=L.o0.Normal,s.fillOpacity=100;break;case"stacked_bars":s.drawStyle=L.l8.Bars,s.stacking.mode=L.o0.Normal,s.fillOpacity=100;break;default:throw new Error(`Invalid graph-style: ${t}`)}}))}(I,g);return(0,f.applyFieldOverrides)({fieldConfig:s,data:t,timeZone:a,replaceVariables:e=>e,theme:y,fieldConfigRegistry:e})}),[I,g,t,a,y]);(0,i.useEffect)((()=>{if(p){const e=[];A.forEach((t=>{t.fields.map((e=>{var t,s,i;return null===(t=e.config)||void 0===t||null===(s=t.custom)||void 0===s||null===(i=s.hideFrom)||void 0===i?void 0:i.viz})).every(k.identity)&&e.push((0,f.getFrameDisplayName)(t))})),p(e)}}),[A,p]);const M=x?A:A.slice(0,20),B={eventBus:C.Z,onSplitOpen:u,onToggleSeriesVisibility(e,s){S((e=>e+1)),z((0,N.N)(e,s,I,t))}};return(0,$.jsxs)(n.PanelContextProvider,{value:B,children:[A.length>20&&!x&&(0,$.jsxs)("div",{className:(0,w.cx)([E.timeSeriesDisclaimer]),children:[(0,$.jsx)(n.Icon,{className:E.disclaimerIcon,name:"exclamation-triangle"}),"Showing only 20 time series. ",(0,$.jsx)("span",{className:(0,w.cx)([E.showAllTimeSeries]),onClick:()=>{j.current++,v(!0)},children:`Show all ${A.length}`})]}),(0,$.jsx)(r.PanelRenderer,{data:{series:M,timeRange:P,structureRev:T,state:d,annotations:h},pluginId:"timeseries",title:"",width:o,height:s,onChangeTimeRange:c,timeZone:a,options:{tooltip:{mode:m,sort:L.As.None},legend:{displayMode:L.jK.List,placement:"bottom",calcs:[]}}})]})}const H=e=>({timeSeriesDisclaimer:w.css`
- label: time-series-disclaimer;
- width: 300px;
- margin: ${e.spacing(1)} auto;
- padding: 10px 0;
- border-radius: ${e.spacing(2)};
- text-align: center;
- background-color: ${e.colors.background.primary};
- `,disclaimerIcon:w.css`
- label: disclaimer-icon;
- color: ${e.colors.warning.main};
- margin-right: ${e.spacing(.5)};
- `,showAllTimeSeries:w.css`
- label: show-all-time-series;
- cursor: pointer;
- color: ${e.colors.text.link};
- `});var P=s(58170);const A=P.f0.map((e=>({value:e,label:e[0].toUpperCase()+e.slice(1).replace(/_/," ")}))),M=(0,w.css)({display:"flex",justifyContent:"space-between"});function B(e){const{graphStyle:t,onChangeGraphStyle:s}=e;return(0,$.jsxs)("div",{className:M,children:["Graph",(0,$.jsx)(n.RadioButtonGroup,{size:"sm",options:A,value:t,onChange:s})]})}var q,_=s(87524),W=(q=function(e,t){return q=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},q(e,t)},function(e,t){function s(){this.constructor=e}q(e,t),e.prototype=null===t?Object.create(t):(s.prototype=t.prototype,new s)}),Z=function(){return Z=Object.assign||function(e){for(var t,s=1,i=arguments.length;s<i;s++)for(var o in t=arguments[s])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},Z.apply(this,arguments)},Q={width:"100%",height:"10px",top:"0px",left:"0px",cursor:"row-resize"},U={width:"10px",height:"100%",top:"0px",left:"0px",cursor:"col-resize"},V={width:"20px",height:"20px",position:"absolute"},K={top:Z(Z({},Q),{top:"-5px"}),right:Z(Z({},U),{left:void 0,right:"-5px"}),bottom:Z(Z({},Q),{top:void 0,bottom:"-5px"}),left:Z(Z({},U),{left:"-5px"}),topRight:Z(Z({},V),{right:"-10px",top:"-10px",cursor:"ne-resize"}),bottomRight:Z(Z({},V),{right:"-10px",bottom:"-10px",cursor:"se-resize"}),bottomLeft:Z(Z({},V),{left:"-10px",bottom:"-10px",cursor:"sw-resize"}),topLeft:Z(Z({},V),{left:"-10px",top:"-10px",cursor:"nw-resize"})},G=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return t.onMouseDown=function(e){t.props.onResizeStart(e,t.props.direction)},t.onTouchStart=function(e){t.props.onResizeStart(e,t.props.direction)},t}return W(t,e),t.prototype.render=function(){return i.createElement("div",{className:this.props.className||"",style:Z(Z({position:"absolute",userSelect:"none"},K[this.props.direction]),this.props.replaceStyles||{}),onMouseDown:this.onMouseDown,onTouchStart:this.onTouchStart},this.props.children)},t}(i.PureComponent),Y=function(){var e=function(t,s){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s])},e(t,s)};return function(t,s){function i(){this.constructor=t}e(t,s),t.prototype=null===s?Object.create(s):(i.prototype=s.prototype,new i)}}(),X=function(){return X=Object.assign||function(e){for(var t,s=1,i=arguments.length;s<i;s++)for(var o in t=arguments[s])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},X.apply(this,arguments)},J={width:"auto",height:"auto"},ee=function(e,t,s){return Math.max(Math.min(e,s),t)},te=function(e,t){return Math.round(e/t)*t},se=function(e,t){return new RegExp(e,"i").test(t)},ie=function(e){return Boolean(e.touches&&e.touches.length)},oe=function(e,t,s){void 0===s&&(s=0);var i=t.reduce((function(s,i,o){return Math.abs(i-e)<Math.abs(t[s]-e)?o:s}),0),o=Math.abs(t[i]-e);return 0===s||o<s?t[i]:e},re=function(e){return"auto"===(e=e.toString())||e.endsWith("px")||e.endsWith("%")||e.endsWith("vh")||e.endsWith("vw")||e.endsWith("vmax")||e.endsWith("vmin")?e:e+"px"},ne=function(e,t,s,i){if(e&&"string"==typeof e){if(e.endsWith("px"))return Number(e.replace("px",""));if(e.endsWith("%"))return t*(Number(e.replace("%",""))/100);if(e.endsWith("vw"))return s*(Number(e.replace("vw",""))/100);if(e.endsWith("vh"))return i*(Number(e.replace("vh",""))/100)}return e},ae=["as","style","className","grid","snap","bounds","boundsByDirection","size","defaultSize","minWidth","minHeight","maxWidth","maxHeight","lockAspectRatio","lockAspectRatioExtraWidth","lockAspectRatioExtraHeight","enable","handleStyles","handleClasses","handleWrapperStyle","handleWrapperClass","children","onResizeStart","onResize","onResizeStop","handleComponent","scale","resizeRatio","snapGap"],le="__resizable_base__",ce=function(e){function t(t){var s=e.call(this,t)||this;return s.ratio=1,s.resizable=null,s.parentLeft=0,s.parentTop=0,s.resizableLeft=0,s.resizableRight=0,s.resizableTop=0,s.resizableBottom=0,s.targetLeft=0,s.targetTop=0,s.appendBase=function(){if(!s.resizable||!s.window)return null;var e=s.parentNode;if(!e)return null;var t=s.window.document.createElement("div");return t.style.width="100%",t.style.height="100%",t.style.position="absolute",t.style.transform="scale(0, 0)",t.style.left="0",t.style.flex="0 0 100%",t.classList?t.classList.add(le):t.className+=le,e.appendChild(t),t},s.removeBase=function(e){var t=s.parentNode;t&&t.removeChild(e)},s.ref=function(e){e&&(s.resizable=e)},s.state={isResizing:!1,width:void 0===(s.propsSize&&s.propsSize.width)?"auto":s.propsSize&&s.propsSize.width,height:void 0===(s.propsSize&&s.propsSize.height)?"auto":s.propsSize&&s.propsSize.height,direction:"right",original:{x:0,y:0,width:0,height:0},backgroundStyle:{height:"100%",width:"100%",backgroundColor:"rgba(0,0,0,0)",cursor:"auto",opacity:0,position:"fixed",zIndex:9999,top:"0",left:"0",bottom:"0",right:"0"},flexBasis:void 0},s.onResizeStart=s.onResizeStart.bind(s),s.onMouseMove=s.onMouseMove.bind(s),s.onMouseUp=s.onMouseUp.bind(s),s}return Y(t,e),Object.defineProperty(t.prototype,"parentNode",{get:function(){return this.resizable?this.resizable.parentNode:null},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"window",{get:function(){return this.resizable&&this.resizable.ownerDocument?this.resizable.ownerDocument.defaultView:null},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"propsSize",{get:function(){return this.props.size||this.props.defaultSize||J},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"size",{get:function(){var e=0,t=0;if(this.resizable&&this.window){var s=this.resizable.offsetWidth,i=this.resizable.offsetHeight,o=this.resizable.style.position;"relative"!==o&&(this.resizable.style.position="relative"),e="auto"!==this.resizable.style.width?this.resizable.offsetWidth:s,t="auto"!==this.resizable.style.height?this.resizable.offsetHeight:i,this.resizable.style.position=o}return{width:e,height:t}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"sizeStyle",{get:function(){var e=this,t=this.props.size,s=function(t){if(void 0===e.state[t]||"auto"===e.state[t])return"auto";if(e.propsSize&&e.propsSize[t]&&e.propsSize[t].toString().endsWith("%")){if(e.state[t].toString().endsWith("%"))return e.state[t].toString();var s=e.getParentSize();return Number(e.state[t].toString().replace("px",""))/s[t]*100+"%"}return re(e.state[t])};return{width:t&&void 0!==t.width&&!this.state.isResizing?re(t.width):s("width"),height:t&&void 0!==t.height&&!this.state.isResizing?re(t.height):s("height")}},enumerable:!1,configurable:!0}),t.prototype.getParentSize=function(){if(!this.parentNode)return this.window?{width:this.window.innerWidth,height:this.window.innerHeight}:{width:0,height:0};var e=this.appendBase();if(!e)return{width:0,height:0};var t=!1,s=this.parentNode.style.flexWrap;"wrap"!==s&&(t=!0,this.parentNode.style.flexWrap="wrap"),e.style.position="relative",e.style.minWidth="100%",e.style.minHeight="100%";var i={width:e.offsetWidth,height:e.offsetHeight};return t&&(this.parentNode.style.flexWrap=s),this.removeBase(e),i},t.prototype.bindEvents=function(){this.window&&(this.window.addEventListener("mouseup",this.onMouseUp),this.window.addEventListener("mousemove",this.onMouseMove),this.window.addEventListener("mouseleave",this.onMouseUp),this.window.addEventListener("touchmove",this.onMouseMove,{capture:!0,passive:!1}),this.window.addEventListener("touchend",this.onMouseUp))},t.prototype.unbindEvents=function(){this.window&&(this.window.removeEventListener("mouseup",this.onMouseUp),this.window.removeEventListener("mousemove",this.onMouseMove),this.window.removeEventListener("mouseleave",this.onMouseUp),this.window.removeEventListener("touchmove",this.onMouseMove,!0),this.window.removeEventListener("touchend",this.onMouseUp))},t.prototype.componentDidMount=function(){if(this.resizable&&this.window){var e=this.window.getComputedStyle(this.resizable);this.setState({width:this.state.width||this.size.width,height:this.state.height||this.size.height,flexBasis:"auto"!==e.flexBasis?e.flexBasis:void 0})}},t.prototype.componentWillUnmount=function(){this.window&&this.unbindEvents()},t.prototype.createSizeForCssProperty=function(e,t){var s=this.propsSize&&this.propsSize[t];return"auto"!==this.state[t]||this.state.original[t]!==e||void 0!==s&&"auto"!==s?e:"auto"},t.prototype.calculateNewMaxFromBoundary=function(e,t){var s,i,o=this.props.boundsByDirection,r=this.state.direction,n=o&&se("left",r),a=o&&se("top",r);if("parent"===this.props.bounds){var l=this.parentNode;l&&(s=n?this.resizableRight-this.parentLeft:l.offsetWidth+(this.parentLeft-this.resizableLeft),i=a?this.resizableBottom-this.parentTop:l.offsetHeight+(this.parentTop-this.resizableTop))}else"window"===this.props.bounds?this.window&&(s=n?this.resizableRight:this.window.innerWidth-this.resizableLeft,i=a?this.resizableBottom:this.window.innerHeight-this.resizableTop):this.props.bounds&&(s=n?this.resizableRight-this.targetLeft:this.props.bounds.offsetWidth+(this.targetLeft-this.resizableLeft),i=a?this.resizableBottom-this.targetTop:this.props.bounds.offsetHeight+(this.targetTop-this.resizableTop));return s&&Number.isFinite(s)&&(e=e&&e<s?e:s),i&&Number.isFinite(i)&&(t=t&&t<i?t:i),{maxWidth:e,maxHeight:t}},t.prototype.calculateNewSizeFromDirection=function(e,t){var s=this.props.scale||1,i=this.props.resizeRatio||1,o=this.state,r=o.direction,n=o.original,a=this.props,l=a.lockAspectRatio,c=a.lockAspectRatioExtraHeight,d=a.lockAspectRatioExtraWidth,h=n.width,p=n.height,u=c||0,g=d||0;return se("right",r)&&(h=n.width+(e-n.x)*i/s,l&&(p=(h-g)/this.ratio+u)),se("left",r)&&(h=n.width-(e-n.x)*i/s,l&&(p=(h-g)/this.ratio+u)),se("bottom",r)&&(p=n.height+(t-n.y)*i/s,l&&(h=(p-u)*this.ratio+g)),se("top",r)&&(p=n.height-(t-n.y)*i/s,l&&(h=(p-u)*this.ratio+g)),{newWidth:h,newHeight:p}},t.prototype.calculateNewSizeFromAspectRatio=function(e,t,s,i){var o=this.props,r=o.lockAspectRatio,n=o.lockAspectRatioExtraHeight,a=o.lockAspectRatioExtraWidth,l=void 0===i.width?10:i.width,c=void 0===s.width||s.width<0?e:s.width,d=void 0===i.height?10:i.height,h=void 0===s.height||s.height<0?t:s.height,p=n||0,u=a||0;if(r){var g=(d-p)*this.ratio+u,m=(h-p)*this.ratio+u,f=(l-u)/this.ratio+p,y=(c-u)/this.ratio+p,x=Math.max(l,g),v=Math.min(c,m),b=Math.max(d,f),w=Math.min(h,y);e=ee(e,x,v),t=ee(t,b,w)}else e=ee(e,l,c),t=ee(t,d,h);return{newWidth:e,newHeight:t}},t.prototype.setBoundingClientRect=function(){if("parent"===this.props.bounds){var e=this.parentNode;if(e){var t=e.getBoundingClientRect();this.parentLeft=t.left,this.parentTop=t.top}}if(this.props.bounds&&"string"!=typeof this.props.bounds){var s=this.props.bounds.getBoundingClientRect();this.targetLeft=s.left,this.targetTop=s.top}if(this.resizable){var i=this.resizable.getBoundingClientRect(),o=i.left,r=i.top,n=i.right,a=i.bottom;this.resizableLeft=o,this.resizableRight=n,this.resizableTop=r,this.resizableBottom=a}},t.prototype.onResizeStart=function(e,t){if(this.resizable&&this.window){var s,i=0,o=0;if(e.nativeEvent&&function(e){return Boolean((e.clientX||0===e.clientX)&&(e.clientY||0===e.clientY))}(e.nativeEvent)?(i=e.nativeEvent.clientX,o=e.nativeEvent.clientY):e.nativeEvent&&ie(e.nativeEvent)&&(i=e.nativeEvent.touches[0].clientX,o=e.nativeEvent.touches[0].clientY),this.props.onResizeStart)if(this.resizable)if(!1===this.props.onResizeStart(e,t,this.resizable))return;this.props.size&&(void 0!==this.props.size.height&&this.props.size.height!==this.state.height&&this.setState({height:this.props.size.height}),void 0!==this.props.size.width&&this.props.size.width!==this.state.width&&this.setState({width:this.props.size.width})),this.ratio="number"==typeof this.props.lockAspectRatio?this.props.lockAspectRatio:this.size.width/this.size.height;var r=this.window.getComputedStyle(this.resizable);if("auto"!==r.flexBasis){var n=this.parentNode;if(n){var a=this.window.getComputedStyle(n).flexDirection;this.flexDir=a.startsWith("row")?"row":"column",s=r.flexBasis}}this.setBoundingClientRect(),this.bindEvents();var l={original:{x:i,y:o,width:this.size.width,height:this.size.height},isResizing:!0,backgroundStyle:X(X({},this.state.backgroundStyle),{cursor:this.window.getComputedStyle(e.target).cursor||"auto"}),direction:t,flexBasis:s};this.setState(l)}},t.prototype.onMouseMove=function(e){var t=this;if(this.state.isResizing&&this.resizable&&this.window){if(this.window.TouchEvent&&ie(e))try{e.preventDefault(),e.stopPropagation()}catch(e){}var s=this.props,i=s.maxWidth,o=s.maxHeight,r=s.minWidth,n=s.minHeight,a=ie(e)?e.touches[0].clientX:e.clientX,l=ie(e)?e.touches[0].clientY:e.clientY,c=this.state,d=c.direction,h=c.original,p=c.width,u=c.height,g=this.getParentSize(),m=function(e,t,s,i,o,r,n){return i=ne(i,e.width,t,s),o=ne(o,e.height,t,s),r=ne(r,e.width,t,s),n=ne(n,e.height,t,s),{maxWidth:void 0===i?void 0:Number(i),maxHeight:void 0===o?void 0:Number(o),minWidth:void 0===r?void 0:Number(r),minHeight:void 0===n?void 0:Number(n)}}(g,this.window.innerWidth,this.window.innerHeight,i,o,r,n);i=m.maxWidth,o=m.maxHeight,r=m.minWidth,n=m.minHeight;var f=this.calculateNewSizeFromDirection(a,l),y=f.newHeight,x=f.newWidth,v=this.calculateNewMaxFromBoundary(i,o);this.props.snap&&this.props.snap.x&&(x=oe(x,this.props.snap.x,this.props.snapGap)),this.props.snap&&this.props.snap.y&&(y=oe(y,this.props.snap.y,this.props.snapGap));var b=this.calculateNewSizeFromAspectRatio(x,y,{width:v.maxWidth,height:v.maxHeight},{width:r,height:n});if(x=b.newWidth,y=b.newHeight,this.props.grid){var w=te(x,this.props.grid[0]),S=te(y,this.props.grid[1]),R=this.props.snapGap||0;x=0===R||Math.abs(w-x)<=R?w:x,y=0===R||Math.abs(S-y)<=R?S:y}var j={width:x-h.width,height:y-h.height};if(p&&"string"==typeof p)if(p.endsWith("%"))x=x/g.width*100+"%";else if(p.endsWith("vw")){x=x/this.window.innerWidth*100+"vw"}else if(p.endsWith("vh")){x=x/this.window.innerHeight*100+"vh"}if(u&&"string"==typeof u)if(u.endsWith("%"))y=y/g.height*100+"%";else if(u.endsWith("vw")){y=y/this.window.innerWidth*100+"vw"}else if(u.endsWith("vh")){y=y/this.window.innerHeight*100+"vh"}var C={width:this.createSizeForCssProperty(x,"width"),height:this.createSizeForCssProperty(y,"height")};"row"===this.flexDir?C.flexBasis=C.width:"column"===this.flexDir&&(C.flexBasis=C.height),(0,_.flushSync)((function(){t.setState(C)})),this.props.onResize&&this.props.onResize(e,d,this.resizable,j)}},t.prototype.onMouseUp=function(e){var t=this.state,s=t.isResizing,i=t.direction,o=t.original;if(s&&this.resizable){var r={width:this.size.width-o.width,height:this.size.height-o.height};this.props.onResizeStop&&this.props.onResizeStop(e,i,this.resizable,r),this.props.size&&this.setState(this.props.size),this.unbindEvents(),this.setState({isResizing:!1,backgroundStyle:X(X({},this.state.backgroundStyle),{cursor:"auto"})})}},t.prototype.updateSize=function(e){this.setState({width:e.width,height:e.height})},t.prototype.renderResizer=function(){var e=this,t=this.props,s=t.enable,o=t.handleStyles,r=t.handleClasses,n=t.handleWrapperStyle,a=t.handleWrapperClass,l=t.handleComponent;if(!s)return null;var c=Object.keys(s).map((function(t){return!1!==s[t]?i.createElement(G,{key:t,direction:t,onResizeStart:e.onResizeStart,replaceStyles:o&&o[t],className:r&&r[t]},l&&l[t]?l[t]:null):null}));return i.createElement("div",{className:a,style:n},c)},t.prototype.render=function(){var e=this,t=Object.keys(this.props).reduce((function(t,s){return-1!==ae.indexOf(s)||(t[s]=e.props[s]),t}),{}),s=X(X(X({position:"relative",userSelect:this.state.isResizing?"none":"auto"},this.props.style),this.sizeStyle),{maxWidth:this.props.maxWidth,maxHeight:this.props.maxHeight,minWidth:this.props.minWidth,minHeight:this.props.minHeight,boxSizing:"border-box",flexShrink:0});this.state.flexBasis&&(s.flexBasis=this.state.flexBasis);var o=this.props.as||"div";return i.createElement(o,X({ref:this.ref,style:s,className:this.props.className},t),this.state.isResizing&&i.createElement("div",{style:this.state.backgroundStyle}),this.props.children,this.renderResizer())},t.defaultProps={as:"div",onResizeStart:function(){},onResize:function(){},onResizeStop:function(){},enable:{top:!0,right:!0,bottom:!0,left:!0,topRight:!0,bottomRight:!0,bottomLeft:!0,topLeft:!0},style:{},grid:[1,1],lockAspectRatio:!1,lockAspectRatioExtraWidth:0,lockAspectRatioExtraHeight:0,scale:1,resizeRatio:1,snapGap:0},t}(i.PureComponent);const de=e=>w.keyframes`
- 0% {
- transform: translateY(${e.components.horizontalDrawer.defaultHeight}px);
- }
- 100% {
- transform: translateY(0px);
- }
- `,he=(0,n.stylesFactory)((e=>({container:w.css`
- position: fixed !important;
- bottom: 0;
- background: ${e.colors.background.primary};
- border-top: 1px solid ${e.colors.border.weak};
- margin: ${e.spacing(0,-2,0,-2)};
- box-shadow: ${e.shadows.z3};
- z-index: ${e.zIndex.sidemenu};
- `,drawerActive:w.css`
- opacity: 1;
- animation: 0.5s ease-out ${de(e)};
- `,rzHandle:w.css`
- background: ${e.colors.secondary.main};
- transition: 0.3s background ease-in-out;
- position: relative;
- width: 200px !important;
- height: 7px !important;
- left: calc(50% - 100px) !important;
- top: -4px !important;
- cursor: grab;
- border-radius: 4px;
- &:hover {
- background: ${e.colors.secondary.shade};
- }
- `})));function pe(e){const{width:t,children:s,onResize:i}=e,o=(0,n.useTheme2)(),r=he(o),a=`${t+31.5}px`;return(0,$.jsx)(ce,{className:(0,w.cx)(r.container,r.drawerActive),defaultSize:{width:a,height:`${o.components.horizontalDrawer.defaultHeight}px`},handleClasses:{top:r.rzHandle},enable:{top:!0,right:!1,bottom:!1,left:!1,topRight:!1,bottomRight:!1,bottomLeft:!1,topLeft:!1},maxHeight:"100vh",maxWidth:a,minWidth:a,onResize:i,children:s})}var ue=s(16618),ge=s(77967),me=s(81669),fe=s(59970),ye=s(73723);const xe={runQueries:p.aA},ve=(0,o.connect)((function(e,t){let{exploreId:s}=t;const i=e.explore[s],{loading:o,queryResponse:r}=i;return{loading:o,queryResponse:r}}),xe)((function(e){var t;const{loading:s,width:i,onClose:o,queryResponse:r,timeZone:a}=e,l=(null==r?void 0:r.series)||[],c=null==r?void 0:r.error,d={label:"Stats",value:"stats",icon:"chart-line",content:(0,$.jsx)(fe.f,{data:r,timeZone:null==r||null===(t=r.request)||void 0===t?void 0:t.timezone})},h={label:"JSON",value:"json",icon:"brackets-curly",content:(0,$.jsx)(me.W,{data:r,onClose:o})},p={label:"Data",value:"data",icon:"database",content:(0,$.jsx)(ue.E,{data:l,isLoading:s,options:{withTransforms:!1,withFieldConfig:!1},timeZone:a,app:f.CoreApp.Explore})},u=[d,{label:"Query",value:"query",icon:"info-circle",content:(0,$.jsx)(ye.D,{data:l,onRefreshQuery:()=>e.runQueries(e.exploreId)})},h,p];if(c){const e={label:"Error",value:"error",icon:"exclamation-triangle",content:(0,$.jsx)(ge.l,{error:c})};u.push(e)}return(0,$.jsx)(pe,{width:i,children:(0,$.jsx)(n.TabbedContainer,{tabs:u,onClose:o,closeIconTooltip:"Close query inspector"})})}));var be=s(74534),we=s(16461),Se=s(75478),Re=s(10603),je=s(43961),Ce=s(10416);function Te(e){const{onClick:t,isSynced:s}=e;return(0,$.jsx)(n.Tooltip,{content:()=>{const{isSynced:t}=e,s=t?"Unsync all views":"Sync all views to this time range";return(0,$.jsx)($.Fragment,{children:s})},placement:"bottom",children:(0,$.jsx)(n.ToolbarButton,{icon:"link",variant:s?"active":"default","aria-label":s?"Synced times":"Unsynced times",onClick:t})})}function Ie(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class ze extends i.Component{constructor(){super(...arguments),Ie(this,"onMoveTimePicker",(e=>{const{range:t,onChangeTime:s,timeZone:i}=this.props,{from:o,to:r}=(0,Ce.e)(e,t);s({from:(0,f.dateTimeForTimeZone)(i,o),to:(0,f.dateTimeForTimeZone)(i,r)})})),Ie(this,"onMoveForward",(()=>this.onMoveTimePicker(1))),Ie(this,"onMoveBack",(()=>this.onMoveTimePicker(-1))),Ie(this,"onChangeTimePicker",(e=>{const t=f.dateMath.isMathString(e.raw.from)?e.raw.from:e.from,s=f.dateMath.isMathString(e.raw.to)?e.raw.to:e.to;this.props.onChangeTime({from:t,to:s})})),Ie(this,"onZoom",(()=>{const{range:e,onChangeTime:t,timeZone:s}=this.props,{from:i,to:o}=(0,Ce.h)(e,2);t({from:(0,f.dateTimeForTimeZone)(s,i),to:(0,f.dateTimeForTimeZone)(s,o)})}))}render(){const{range:e,timeZone:t,fiscalYearStartMonth:s,splitted:i,syncedTimes:o,onChangeTimeSync:r,hideText:n,onChangeTimeZone:a,onChangeFiscalYearStartMonth:l}=this.props,c=i?(0,$.jsx)(Te,{onClick:r,isSynced:o}):void 0,d={value:e,timeZone:t,fiscalYearStartMonth:s,onMoveBackward:this.onMoveBack,onMoveForward:this.onMoveForward,onZoom:this.onZoom,hideText:n};return(0,$.jsx)(je.a,Object.assign({},d,{timeSyncButton:c,isSynced:o,widthOverride:i?window.innerWidth/2:void 0,onChange:this.onChangeTimePicker,onChangeTimeZone:a,onChangeFiscalYearStartMonth:l}))}}var ke=s(40284);function Fe(e){const{start:t,pause:s,resume:i,isLive:o,isPaused:r,stop:a,splitted:l}=e,c=o&&!r?"active":"default",d=o?r?i:s:t;return(0,$.jsxs)(n.ButtonGroup,{children:[(0,$.jsx)(n.Tooltip,{content:o&&!r?(0,$.jsx)($.Fragment,{children:"Pause the live stream"}):(0,$.jsx)($.Fragment,{children:"Start live stream your logs"}),placement:"bottom",children:(0,$.jsx)(n.ToolbarButton,{iconOnly:l,variant:c,icon:!o||r?"play":"pause",onClick:d,children:o&&r?"Paused":"Live"})}),(0,$.jsx)(ke.Z,{mountOnEnter:!0,unmountOnExit:!0,timeout:100,in:o,classNames:{enter:Le.stopButtonEnter,enterActive:Le.stopButtonEnterActive,exit:Le.stopButtonExit,exitActive:Le.stopButtonExitActive},children:(0,$.jsx)(n.Tooltip,{content:(0,$.jsx)($.Fragment,{children:"Stop and exit the live stream"}),placement:"bottom",children:(0,$.jsx)(n.ToolbarButton,{variant:c,onClick:a,icon:"square-shape"})})})]})}const Le={stopButtonEnter:w.css`
- label: stopButtonEnter;
- width: 0;
- opacity: 0;
- overflow: hidden;
- `,stopButtonEnterActive:w.css`
- label: stopButtonEnterActive;
- opacity: 1;
- width: 32px;
- `,stopButtonExit:w.css`
- label: stopButtonExit;
- width: 32px;
- opacity: 1;
- overflow: hidden;
- `,stopButtonExitActive:w.css`
- label: stopButtonExitActive;
- opacity: 0;
- width: 0;
- `};var Oe=s(20120),Ne=s(77377);function De(e){const t=function(e){const t=(0,o.useDispatch)(),s=(0,i.useCallback)((()=>{t((0,p.sQ)({exploreId:e,isPaused:!0}))}),[e,t]),r=(0,i.useCallback)((()=>{t((0,p.sQ)({exploreId:e,isPaused:!1}))}),[e,t]),a=(0,i.useCallback)((()=>{s(),t((0,Ne.oz)(e,n.RefreshPicker.offOption.value)),t((0,p.aA)(e))}),[e,t,s]),l=(0,i.useCallback)((()=>{t((0,Ne.oz)(e,n.RefreshPicker.liveOption.value))}),[e,t]);return{pause:s,resume:r,stop:a,start:l}}(e.exploreId);return e.children(t)}function $e(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}const Ee=(0,i.lazy)((()=>s.e(7885).then(s.bind(s,77885)).then((e=>{let{AddToDashboard:t}=e;return{default:t}}))));class He extends i.PureComponent{constructor(){var e;super(...arguments),e=this,$e(this,"onChangeDatasource",(async e=>{this.props.changeDatasource(this.props.exploreId,e.uid,{importQueries:!0})})),$e(this,"onRunQuery",(function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];const{runQueries:s,cancelQueries:i,exploreId:o}=e.props;return t?i(o):s(o)})),$e(this,"onChangeRefreshInterval",(e=>{const{changeRefreshInterval:t,exploreId:s}=this.props;t(s,e)})),$e(this,"onChangeTimeSync",(()=>{const{syncTimes:e,exploreId:t}=this.props;e(t)})),$e(this,"renderRefreshPicker",(e=>{const{loading:t,refreshInterval:s,isLive:i}=this.props;let o,r=t?"Cancel":"Run query",a="108px";return e&&(o=r,r=void 0,a="35px"),(0,$.jsx)(n.RefreshPicker,{onIntervalChanged:this.onChangeRefreshInterval,value:s,isLoading:t,text:r,tooltip:o,intervals:(0,Se.$t)().getValidIntervals(n.defaultIntervals),isLive:i,onRefresh:()=>this.onRunQuery(t),noIntervalPicker:i,primary:!0,width:a})}))}render(){const{datasourceMissing:e,closeSplit:t,exploreId:s,loading:o,range:l,timeZone:c,fiscalYearStartMonth:d,splitted:h,syncedTimes:p,refreshInterval:u,onChangeTime:g,split:m,hasLiveOption:f,isLive:y,isPaused:x,containerWidth:v,onChangeTimeZone:b,onChangeFiscalYearStartMonth:w,topOfViewRef:S}=this.props,R=(h?v<700:v<800)||!1,j=h||v<1210;return(0,$.jsx)("div",{ref:S,children:(0,$.jsx)(n.PageToolbar,{"aria-label":"Explore toolbar",title:s===a.K.left?"Explore":void 0,pageIcon:s===a.K.left?"compass":void 0,leftItems:[s===a.K.left&&(0,$.jsx)(we.u,{tooltip:"Copy shortened link",icon:"share-alt",onClick:()=>(0,be.L)(window.location.href),"aria-label":"Copy shortened link"},"share"),!e&&(0,$.jsx)(r.DataSourcePicker,{onChange:this.onChangeDatasource,current:this.props.datasourceName,hideTextValue:R,width:R?8:void 0},`${s}-ds-picker`)].filter(Boolean),children:(0,$.jsxs)(n.ToolbarButtonRow,{children:[h?(0,$.jsx)(n.ToolbarButton,{title:"Close split pane",onClick:()=>t(s),icon:"times",children:"Close"}):(0,$.jsx)(n.ToolbarButton,{title:"Split",onClick:()=>m(),icon:"columns",disabled:y,children:"Split"}),r.config.featureToggles.explore2Dashboard&&(0,$.jsx)(i.Suspense,{fallback:null,children:(0,$.jsx)(Ee,{exploreId:s})}),!y&&(0,$.jsx)(ze,{exploreId:s,range:l,timeZone:c,fiscalYearStartMonth:d,onChangeTime:g,splitted:h,syncedTimes:p,onChangeTimeSync:this.onChangeTimeSync,hideText:j,onChangeTimeZone:b,onChangeFiscalYearStartMonth:w}),this.renderRefreshPicker(j),u&&(0,$.jsx)(n.SetInterval,{func:this.onRunQuery,interval:u,loading:o}),f&&(0,$.jsx)(De,{exploreId:s,children:e=>{const t=Object.assign({},e,{start:()=>{(0,r.reportInteraction)("grafana_explore_logs_live_tailing_clicked",{datasourceType:this.props.datasourceType}),e.start()}});return(0,$.jsx)(Fe,{splitted:h,isLive:y,isPaused:x,start:t.start,pause:t.pause,resume:t.resume,stop:t.stop})}})]})})})}}const Pe={changeDatasource:Oe.zU,changeRefreshInterval:Ne.oz,cancelQueries:p.ci,runQueries:p.aA,closeSplit:h.YV,split:h.bW,syncTimes:Ne.mG,onChangeTimeZone:Re.YT,onChangeFiscalYearStartMonth:Re.rf},Ae=(0,o.connect)(((e,t)=>{var s;let{exploreId:i}=t;const{syncedTimes:o}=e.explore,r=e.explore[i],{datasourceInstance:n,datasourceMissing:a,range:l,refreshInterval:c,loading:d,isLive:h,isPaused:p,containerWidth:g}=r,m=!(null==n||null===(s=n.meta)||void 0===s||!s.streaming);return{datasourceMissing:a,datasourceName:null==n?void 0:n.name,datasourceType:null==n?void 0:n.type,loading:d,range:l,timeZone:(0,b.Z)(e.user),fiscalYearStartMonth:(0,b.i)(e.user),splitted:(0,u.p)(e),refreshInterval:c,hasLiveOption:m,isLive:h,isPaused:p,syncedTimes:o,containerWidth:g}}),Pe)(He);var Me=s(35008),Be=s.n(Me);const qe=function(e,t){var s=(0,i.useRef)((function(){}));(0,i.useEffect)((function(){s.current=e})),(0,i.useEffect)((function(){if(null!==t){var e=setInterval((function(){return s.current()}),t||0);return function(){return clearInterval(e)}}}),[t])},_e=e=>{let{timeInMs:t,className:s,humanize:i}=e;return(0,$.jsx)("span",{className:`elapsed-time ${s}`,children:We(t,i)})},We=function(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];const s=e/1e3;if(!t)return`${s.toFixed(1)}s`;const i=(0,f.toDuration)(s,"seconds"),o=i.hours(),r=i.minutes(),n=i.seconds();return o?`${o}h ${r}m ${n}s`:r?`${r}m ${n}s`:`${n}s`},Ze=e=>{let{resetKey:t,humanize:s,className:o}=e;const[r,n]=(0,i.useState)(0);return qe((()=>n(r+150)),150),(0,i.useEffect)((()=>n(0)),[t]),(0,$.jsx)(_e,{timeInMs:r,className:o,humanize:s})};var Qe;function Ue(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class Ve extends i.PureComponent{constructor(e){super(e),Ue(this,"liveEndDiv",null),Ue(this,"scrollContainerRef",i.createRef()),Ue(this,"onScroll",(e=>{const{isPaused:t,onPause:s}=this.props,{scrollTop:i,clientHeight:o,scrollHeight:r}=e.currentTarget;r-(i+o)>=5&&!t&&s()})),Ue(this,"rowsToRender",(()=>{const{isPaused:e}=this.props;let{logRowsToRender:t=[]}=this.state;return e||(t=t.slice(-100)),t})),this.state={logRowsToRender:e.logRows}}static getDerivedStateFromProps(e,t){return e.isPaused?null:{logRowsToRender:e.logRows}}render(){const{theme:e,timeZone:t,onPause:s,onResume:i,isPaused:o}=this.props,r=(e=>({logsRowsLive:w.css`
- label: logs-rows-live;
- font-family: ${e.typography.fontFamilyMonospace};
- font-size: ${e.typography.bodySmall.fontSize};
- display: flex;
- flex-flow: column nowrap;
- height: 60vh;
- overflow-y: scroll;
- :first-child {
- margin-top: auto !important;
- }
- `,logsRowFade:w.css`
- label: logs-row-fresh;
- color: ${e.colors.text};
- background-color: ${Be()(e.colors.info.transparent).setAlpha(.25).toString()};
- animation: fade 1s ease-out 1s 1 normal forwards;
- @keyframes fade {
- from {
- background-color: ${Be()(e.colors.info.transparent).setAlpha(.25).toString()};
- }
- to {
- background-color: transparent;
- }
- }
- `,logsRowsIndicator:w.css`
- font-size: ${e.typography.h6.fontSize};
- padding-top: ${e.spacing(1)};
- display: flex;
- align-items: center;
- `,button:w.css`
- margin-right: ${e.spacing(1)};
- `,fullWidth:w.css`
- width: 100%;
- `}))(e),{logsRow:a,logsRowLocalTime:l,logsRowMessage:c}=(0,n.getLogRowStyles)(e);return(0,$.jsxs)("div",{children:[(0,$.jsx)("table",{className:r.fullWidth,children:(0,$.jsxs)("tbody",{onScroll:o?void 0:this.onScroll,className:(0,w.cx)(["logs-rows",r.logsRowsLive]),ref:this.scrollContainerRef,children:[this.rowsToRender().map((e=>(0,$.jsxs)("tr",{className:(0,w.cx)(a,r.logsRowFade),children:[(0,$.jsx)("td",{className:(0,w.cx)(l),children:(0,f.dateTimeFormat)(e.timeEpochMs,{timeZone:t})}),(0,$.jsx)("td",{className:(0,w.cx)(c),children:e.hasAnsi?(0,$.jsx)(n.LogMessageAnsi,{value:e.raw}):e.entry})]},e.uid))),(0,$.jsx)("tr",{ref:e=>{var t,s;(this.liveEndDiv=e,this.liveEndDiv&&null!==(t=this.scrollContainerRef.current)&&void 0!==t&&t.scrollTo&&!o)&&(null===(s=this.scrollContainerRef.current)||void 0===s||s.scrollTo(0,this.scrollContainerRef.current.scrollHeight))}})]})}),(0,$.jsxs)("div",{className:r.logsRowsIndicator,children:[(0,$.jsxs)(n.Button,{variant:"secondary",onClick:o?i:s,className:r.button,children:[(0,$.jsx)(n.Icon,{name:o?"play":"pause"})," ",o?"Resume":"Pause"]}),(0,$.jsxs)(n.Button,{variant:"secondary",onClick:this.props.stopLive,className:r.button,children:[Qe||(Qe=(0,$.jsx)(n.Icon,{name:"square-shape",size:"lg",type:"mono"}))," Exit live mode"]}),o||(0,$.jsxs)("span",{children:["Last line received: ",(0,$.jsx)(Ze,{resetKey:this.props.logRows,humanize:!0})," ago"]})]})]})}}const Ke=(0,n.withTheme2)(Ve);var Ge=s(31359),Ye=s(88121);const Xe=e=>({metaContainer:w.css`
- flex: 1;
- color: ${e.colors.text.secondary};
- margin-bottom: ${e.spacing(2)};
- min-width: 30%;
- display: flex;
- flex-wrap: wrap;
- `,metaItem:w.css`
- margin-right: ${e.spacing(2)};
- margin-top: ${e.spacing(.5)};
- display: flex;
- align-items: baseline;
- .logs-meta-item__error {
- color: ${e.colors.error.text};
- }
- `,metaLabel:w.css`
- margin-right: calc(${e.spacing(2)} / 2);
- font-size: ${e.typography.bodySmall.fontSize};
- font-weight: ${e.typography.fontWeightMedium};
- `,metaValue:w.css`
- font-family: ${e.typography.fontFamilyMonospace};
- font-size: ${e.typography.bodySmall.fontSize};
- `}),Je=(0,i.memo)((function(e){const t=(0,n.useStyles2)(Xe),{label:s,value:i}=e;return(0,$.jsxs)("div",{"data-testid":"meta-info-text-item",className:t.metaItem,children:[s&&(0,$.jsxs)("span",{className:t.metaLabel,children:[s,":"]}),(0,$.jsx)("span",{className:t.metaValue,children:i})]})})),et=(0,i.memo)((function(e){const t=(0,n.useStyles2)(Xe),{metaItems:s}=e;return(0,$.jsx)("div",{className:t.metaContainer,"data-testid":"meta-info-text",children:s.map(((e,t)=>(0,$.jsx)(Je,{label:e.label,value:e.value},`${t}-${e.label}`)))})}));var tt;const st=i.memo((e=>{let{meta:t,dedupStrategy:s,dedupCount:i,showDetectedFields:o,clearDetectedFields:r,hasUnescapedContent:a,forceEscape:l,onEscapeNewlines:c,logRows:d}=e;const h=[...t];return s!==f.LogsDedupStrategy.none&&h.push({label:"Dedup count",value:i,kind:f.LogsMetaKind.Number}),d.some((e=>e.entry.length>Ye.n))&&h.push({label:"Info",value:"Logs with more than 100,000 characters could not be parsed and highlighted",kind:f.LogsMetaKind.String}),(null==o?void 0:o.length)>0&&h.push({label:"Showing only detected fields",value:it(o,f.LogsMetaKind.LabelsMap)},{label:"",value:(0,$.jsx)(n.Button,{variant:"secondary",size:"sm",onClick:r,children:"Show original line"})}),a&&h.push({label:"Your logs might have incorrectly escaped content",value:(0,$.jsx)(n.Tooltip,{content:"Fix incorrectly escaped newline and tab sequences in log lines. Manually review the results to confirm that the replacements are correct.",placement:"right",children:(0,$.jsxs)(n.Button,{variant:"secondary",size:"sm",onClick:c,children:[(0,$.jsxs)("span",{children:[l?"Remove escaping":"Escape newlines"," "]}),tt||(tt=(0,$.jsx)(n.Icon,{name:"exclamation-triangle",className:"muted",size:"sm"}))]})})}),(0,$.jsx)($.Fragment,{children:h&&(0,$.jsx)(et,{metaItems:h.map((e=>({label:e.label,value:"kind"in e?it(e.value,e.kind):e.value})))})})}));function it(e,t){return t===f.LogsMetaKind.LabelsMap?(0,$.jsx)("span",{className:"logs-meta-item__labels",children:(0,$.jsx)(n.LogLabels,{labels:e})}):t===f.LogsMetaKind.Error?(0,$.jsx)("span",{className:"logs-meta-item__error",children:e}):e}var ot;function rt(e){let{pages:t,currentPageIndex:s,oldestLogsFirst:i,timeZone:o,loading:a,changeTime:l}=e;const c=e=>`${(0,f.dateTimeFormat)(e,{format:f.systemDateFormats.interval.second,timeZone:o})}`,d=(e,t)=>{if(s===t&&a)return ot||(ot=(0,$.jsx)(n.Spinner,{}));return`${c(i?e.logsRange.from:e.logsRange.to)} — ${c(i?e.logsRange.to:e.logsRange.from)}`},h=(0,n.useTheme2)(),p=nt(h,a);return(0,$.jsx)(n.CustomScrollbar,{autoHide:!0,children:(0,$.jsx)("div",{className:p.pagesWrapper,"data-testid":"logsNavigationPages",children:(0,$.jsx)("div",{className:p.pagesContainer,children:t.map(((e,t)=>(0,$.jsxs)("div",{"data-testid":`page${t+1}`,className:p.page,onClick:()=>{(0,r.reportInteraction)("grafana_explore_logs_pagination_clicked",{pageType:"page",pageNumber:t+1}),!a&&l({from:e.queryRange.from,to:e.queryRange.to})},children:[(0,$.jsx)("div",{className:(0,w.cx)(p.line,{selectedBg:s===t})}),(0,$.jsx)("div",{className:(0,w.cx)(p.time,{selectedText:s===t}),children:d(e,t)})]},e.queryRange.to)))})})})}st.displayName="LogsMetaRow";const nt=(e,t)=>({pagesWrapper:w.css`
- height: 100%;
- padding-left: ${e.spacing(.5)};
- display: flex;
- flex-direction: column;
- overflow-y: scroll;
- &::after {
- content: '';
- display: block;
- background: repeating-linear-gradient(
- 135deg,
- ${e.colors.background.primary},
- ${e.colors.background.primary} 5px,
- ${e.colors.background.secondary} 5px,
- ${e.colors.background.secondary} 15px
- );
- width: 3px;
- height: inherit;
- margin-bottom: 8px;
- }
- `,pagesContainer:w.css`
- display: flex;
- padding: 0;
- flex-direction: column;
- `,page:w.css`
- display: flex;
- margin: ${e.spacing(2)} 0;
- cursor: ${t?"auto":"pointer"};
- white-space: normal;
- .selectedBg {
- background: ${e.colors.primary.main};
- }
- .selectedText {
- color: ${e.colors.primary.main};
- }
- `,line:w.css`
- width: 3px;
- height: 100%;
- align-items: center;
- background: ${e.colors.text.secondary};
- `,time:w.css`
- width: 60px;
- min-height: 80px;
- font-size: ${e.v1.typography.size.sm};
- padding-left: ${e.spacing(.5)};
- display: flex;
- align-items: center;
- `});var at,lt,ct;function dt(e){let{absoluteRange:t,logsSortOrder:s,timeZone:o,loading:a,onChangeTime:l,scrollToTopLogs:c,visibleRange:d,queries:h,clearCache:p,addResultsToCache:u}=e;const[g,m]=(0,i.useState)([]),[y,x]=(0,i.useState)(0),v=(0,i.useRef)(),b=(0,i.useRef)(),w=(0,i.useRef)(0),S=s===f.LogsSortOrder.Ascending,R=S?y===g.length-1:0===y,j=S?0===y:y===g.length-1,C=(0,n.useTheme2)(),T=pt(C,S,a);(0,i.useEffect)((()=>{const e={logsRange:d,queryRange:t};let i=[];if((0,k.isEqual)(b.current,t)&&(0,k.isEqual)(v.current,h)){m((t=>(i=t.filter((t=>!(0,k.isEqual)(e.queryRange,t.queryRange))),i=[...i,e].sort(((e,t)=>z(e,t,s))),i)));const o=i.findIndex((e=>e.queryRange.to===t.to));x(o)}else p(),m([e]),x(0),v.current=h,w.current=t.to-t.from;u()}),[d,t,s,h,p,u]),(0,i.useEffect)((()=>{p()}),[]);const I=e=>{let{from:t,to:s}=e;b.current={from:t,to:s},l({from:t,to:s})},z=(e,t,s)=>s===f.LogsSortOrder.Ascending?e.queryRange.to>t.queryRange.to?1:-1:e.queryRange.to>t.queryRange.to?-1:1,F=(0,$.jsx)(n.Button,{"data-testid":"olderLogsButton",className:T.navButton,variant:"secondary",onClick:()=>{if((0,r.reportInteraction)("grafana_explore_logs_pagination_clicked",{pageType:"olderLogsButton"}),j)I({from:d.from-w.current,to:d.from});else{const e=S?-1:1;I({from:g[y+e].queryRange.from,to:g[y+e].queryRange.to})}},disabled:a,children:(0,$.jsxs)("div",{className:T.navButtonContent,children:[a?at||(at=(0,$.jsx)(n.Spinner,{})):(0,$.jsx)(n.Icon,{name:S?"angle-up":"angle-down",size:"lg"}),"Older logs"]})}),L=(0,$.jsx)(n.Button,{"data-testid":"newerLogsButton",className:T.navButton,variant:"secondary",onClick:()=>{if((0,r.reportInteraction)("grafana_explore_logs_pagination_clicked",{pageType:"newerLogsButton"}),!R){const e=S?1:-1;I({from:g[y+e].queryRange.from,to:g[y+e].queryRange.to})}},disabled:a||R,children:(0,$.jsxs)("div",{className:T.navButtonContent,children:[a&&(lt||(lt=(0,$.jsx)(n.Spinner,{}))),R||a?null:(0,$.jsx)(n.Icon,{name:S?"angle-down":"angle-up",size:"lg"}),R?"Start of range":"Newer logs"]})});return(0,$.jsxs)("div",{className:T.navContainer,children:[S?F:L,(0,$.jsx)(rt,{pages:g,currentPageIndex:y,oldestLogsFirst:S,timeZone:o,loading:a,changeTime:I}),S?L:F,(0,$.jsx)(n.Button,{"data-testid":"scrollToTop",className:T.scrollToTopButton,variant:"secondary",onClick:c,title:"Scroll to top",children:ct||(ct=(0,$.jsx)(n.Icon,{name:"arrow-up",size:"lg"}))})]})}const ht=(0,i.memo)(dt),pt=(e,t,s)=>({navContainer:w.css`
- max-height: 95vh;
- display: flex;
- flex-direction: column;
- justify-content: ${t?"flex-start":"space-between"};
- position: sticky;
- top: ${e.spacing(2)};
- right: 0;
- `,navButton:w.css`
- width: 58px;
- height: 68px;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- line-height: 1;
- `,navButtonContent:w.css`
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- width: 100%;
- height: 100%;
- white-space: normal;
- `,scrollToTopButton:w.css`
- width: 40px;
- height: 40px;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- margin-top: ${e.spacing(1)};
- `});function ut(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}const gt="grafana.explore.logs.showLabels",mt="grafana.explore.logs.showTime",ft="grafana.explore.logs.wrapLogMessage",yt="grafana.explore.logs.prettifyLogMessage",xt="grafana.explore.logs.sortOrder";class vt extends i.PureComponent{constructor(){super(...arguments),ut(this,"flipOrderTimer",void 0),ut(this,"cancelFlippingTimer",void 0),ut(this,"topLogsRef",(0,i.createRef)()),ut(this,"state",{showLabels:x.Z.getBool(gt,!1),showTime:x.Z.getBool(mt,!0),wrapLogMessage:x.Z.getBool(ft,!0),prettifyLogMessage:x.Z.getBool(yt,!1),dedupStrategy:f.LogsDedupStrategy.none,hiddenLogLevels:[],logsSortOrder:x.Z.get(xt)||f.LogsSortOrder.Descending,isFlipping:!1,showDetectedFields:[],forceEscape:!1}),ut(this,"onChangeLogsSortOrder",(()=>{this.setState({isFlipping:!0}),this.flipOrderTimer=window.setTimeout((()=>{this.setState((e=>{const t=e.logsSortOrder===f.LogsSortOrder.Descending?f.LogsSortOrder.Ascending:f.LogsSortOrder.Descending;return x.Z.set(xt,t),{logsSortOrder:t}}))}),0),this.cancelFlippingTimer=window.setTimeout((()=>this.setState({isFlipping:!1})),1e3)})),ut(this,"onEscapeNewlines",(()=>{this.setState((e=>({forceEscape:!e.forceEscape})))})),ut(this,"onChangeDedup",(e=>{(0,r.reportInteraction)("grafana_explore_logs_deduplication_clicked",{deduplicationType:e,datasourceType:this.props.datasourceType}),this.setState({dedupStrategy:e})})),ut(this,"onChangeLabels",(e=>{const{target:t}=e;if(t){const e=t.checked;this.setState({showLabels:e}),x.Z.set(gt,e)}})),ut(this,"onChangeTime",(e=>{const{target:t}=e;if(t){const e=t.checked;this.setState({showTime:e}),x.Z.set(mt,e)}})),ut(this,"onChangeWrapLogMessage",(e=>{const{target:t}=e;if(t){const e=t.checked;this.setState({wrapLogMessage:e}),x.Z.set(ft,e)}})),ut(this,"onChangePrettifyLogMessage",(e=>{const{target:t}=e;if(t){const e=t.checked;this.setState({prettifyLogMessage:e}),x.Z.set(yt,e)}})),ut(this,"onToggleLogLevel",(e=>{const t=e.map((e=>f.LogLevel[e]));this.setState({hiddenLogLevels:t})})),ut(this,"onClickScan",(e=>{e.preventDefault(),this.props.onStartScanning&&this.props.onStartScanning()})),ut(this,"onClickStopScan",(e=>{e.preventDefault(),this.props.onStopScanning&&this.props.onStopScanning()})),ut(this,"showDetectedField",(e=>{-1===this.state.showDetectedFields.indexOf(e)&&this.setState((t=>({showDetectedFields:t.showDetectedFields.concat(e)})))})),ut(this,"hideDetectedField",(e=>{this.state.showDetectedFields.indexOf(e)>-1&&this.setState((t=>({showDetectedFields:t.showDetectedFields.filter((t=>e!==t))})))})),ut(this,"clearDetectedFields",(()=>{this.setState((e=>({showDetectedFields:[]})))})),ut(this,"checkUnescapedContent",(0,m.Z)((e=>!!e.some((e=>e.hasUnescapedContent))))),ut(this,"dedupRows",(0,m.Z)(((e,t)=>{const s=(0,Ge.UW)(e,t),i=s.reduce(((e,t)=>t.duplicates?e+t.duplicates:e),0);return{dedupedRows:s,dedupCount:i}}))),ut(this,"filterRows",(0,m.Z)(((e,t)=>(0,Ge.nu)(e,new Set(t))))),ut(this,"createNavigationRange",(0,m.Z)((e=>{if(!e||0===e.length)return;const t=e[0].timeEpochMs,s=e[e.length-1].timeEpochMs;return s<t?{from:s,to:t}:{from:t,to:s}}))),ut(this,"scrollToTopLogs",(()=>{var e;return null===(e=this.topLogsRef.current)||void 0===e?void 0:e.scrollIntoView()}))}componentWillUnmount(){this.flipOrderTimer&&window.clearTimeout(this.flipOrderTimer),this.cancelFlippingTimer&&window.clearTimeout(this.cancelFlippingTimer)}render(){const{width:e,logRows:t,logsMeta:s,logsSeries:i,visibleRange:o,loading:r=!1,loadingState:a,onClickFilterLabel:l,onClickFilterOutLabel:c,timeZone:d,scanning:h,scanRange:p,showContextToggle:u,absoluteRange:g,onChangeTime:m,getFieldLinks:y,theme:x,logsQueries:v,clearCache:b,addResultsToCache:w,exploreId:S}=this.props,{showLabels:R,showTime:j,wrapLogMessage:C,prettifyLogMessage:T,dedupStrategy:I,hiddenLogLevels:z,logsSortOrder:F,isFlipping:O,showDetectedFields:N,forceEscape:D}=this.state,H=wt(x,C),P=t&&t.length>0,A=this.checkUnescapedContent(t),M=this.filterRows(t,z),{dedupedRows:B,dedupCount:q}=this.dedupRows(M,I),_=this.createNavigationRange(t),W=p?`Scanning ${f.rangeUtil.describeTimeRange(p)}`:"Scanning...";return(0,$.jsxs)($.Fragment,{children:[i&&i.length?(0,$.jsxs)($.Fragment,{children:[(0,$.jsx)("div",{className:H.infoText,children:"This datasource does not support full-range histograms. The graph is based on the logs seen in the response."}),(0,$.jsx)(E,{graphStyle:"lines",data:i,height:150,width:e,tooltipDisplayMode:L.f3.Multi,absoluteRange:o||g,timeZone:d,loadingState:a,onChangeTime:m,onHiddenSeriesChanged:this.onToggleLogLevel})]}):void 0,(0,$.jsxs)("div",{className:H.logOptions,ref:this.topLogsRef,children:[(0,$.jsxs)(n.InlineFieldRow,{children:[(0,$.jsx)(n.InlineField,{label:"Time",className:H.horizontalInlineLabel,transparent:!0,children:(0,$.jsx)(n.InlineSwitch,{value:j,onChange:this.onChangeTime,className:H.horizontalInlineSwitch,transparent:!0,id:`show-time_${S}`})}),(0,$.jsx)(n.InlineField,{label:"Unique labels",className:H.horizontalInlineLabel,transparent:!0,children:(0,$.jsx)(n.InlineSwitch,{value:R,onChange:this.onChangeLabels,className:H.horizontalInlineSwitch,transparent:!0,id:`unique-labels_${S}`})}),(0,$.jsx)(n.InlineField,{label:"Wrap lines",className:H.horizontalInlineLabel,transparent:!0,children:(0,$.jsx)(n.InlineSwitch,{value:C,onChange:this.onChangeWrapLogMessage,className:H.horizontalInlineSwitch,transparent:!0,id:`wrap-lines_${S}`})}),(0,$.jsx)(n.InlineField,{label:"Prettify JSON",className:H.horizontalInlineLabel,transparent:!0,children:(0,$.jsx)(n.InlineSwitch,{value:T,onChange:this.onChangePrettifyLogMessage,className:H.horizontalInlineSwitch,transparent:!0,id:`prettify_${S}`})}),(0,$.jsx)(n.InlineField,{label:"Dedup",className:H.horizontalInlineLabel,transparent:!0,children:(0,$.jsx)(n.RadioButtonGroup,{options:Object.values(f.LogsDedupStrategy).map((e=>({label:(0,k.capitalize)(e),value:e,description:f.LogsDedupDescription[e]}))),value:I,onChange:this.onChangeDedup,className:H.radioButtons})})]}),(0,$.jsx)("div",{children:(0,$.jsx)(n.InlineField,{label:"Display results",className:H.horizontalInlineLabel,transparent:!0,children:(0,$.jsx)(n.RadioButtonGroup,{disabled:O,options:[{label:"Newest first",value:f.LogsSortOrder.Descending,description:"Show results newest to oldest"},{label:"Oldest first",value:f.LogsSortOrder.Ascending,description:"Show results oldest to newest"}],value:F,onChange:this.onChangeLogsSortOrder,className:H.radioButtons})})})]}),(0,$.jsx)(st,{logRows:t,meta:s||[],dedupStrategy:I,dedupCount:q,hasUnescapedContent:A,forceEscape:D,showDetectedFields:N,onEscapeNewlines:this.onEscapeNewlines,clearDetectedFields:this.clearDetectedFields}),(0,$.jsxs)("div",{className:H.logsSection,children:[(0,$.jsx)("div",{className:H.logRows,"data-testid":"logRows",children:(0,$.jsx)(n.LogRows,{logRows:t,deduplicatedRows:B,dedupStrategy:I,getRowContext:this.props.getRowContext,onClickFilterLabel:l,onClickFilterOutLabel:c,showContextToggle:u,showLabels:R,showTime:j,enableLogDetails:!0,forceEscape:D,wrapLogMessage:C,prettifyLogMessage:T,timeZone:d,getFieldLinks:y,logsSortOrder:F,showDetectedFields:N,onClickShowDetectedField:this.showDetectedField,onClickHideDetectedField:this.hideDetectedField})}),(0,$.jsx)(ht,{logsSortOrder:F,visibleRange:null!=_?_:g,absoluteRange:g,timeZone:d,onChangeTime:m,loading:r,queries:null!=v?v:[],scrollToTopLogs:this.scrollToTopLogs,addResultsToCache:w,clearCache:b})]}),!r&&!P&&!h&&(0,$.jsxs)("div",{className:H.noData,children:["No logs found.",(0,$.jsx)(n.Button,{size:"xs",fill:"text",onClick:this.onClickScan,children:"Scan for older logs"})]}),h&&(0,$.jsxs)("div",{className:H.noData,children:[(0,$.jsx)("span",{children:W}),(0,$.jsx)(n.Button,{size:"xs",fill:"text",onClick:this.onClickStopScan,children:"Stop scan"})]})]})}}const bt=(0,n.withTheme2)(vt),wt=(e,t)=>({noData:w.css`
- > * {
- margin-left: 0.5em;
- }
- `,logOptions:w.css`
- display: flex;
- justify-content: space-between;
- align-items: baseline;
- flex-wrap: wrap;
- background-color: ${e.colors.background.primary};
- padding: ${e.spacing(1,2)};
- border-radius: ${e.shape.borderRadius()};
- margin: ${e.spacing(2,0,1)};
- border: 1px solid ${e.colors.border.medium};
- `,headerButton:w.css`
- margin: ${e.spacing(.5,0,0,1)};
- `,horizontalInlineLabel:w.css`
- > label {
- margin-right: 0;
- }
- `,horizontalInlineSwitch:w.css`
- padding: 0 ${e.spacing(1)} 0 0;
- `,radioButtons:w.css`
- margin: 0;
- `,logsSection:w.css`
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- `,logRows:w.css`
- overflow-x: ${t?"unset":"scroll"};
- overflow-y: visible;
- width: 100%;
- `,infoText:w.css`
- font-size: ${e.typography.size.sm};
- color: ${e.colors.text.secondary};
- `}),St=(0,m.Z)((()=>({logsEnter:w.css`
- label: logsEnter;
- position: absolute;
- opacity: 0;
- height: auto;
- width: 100%;
- `,logsEnterActive:w.css`
- label: logsEnterActive;
- opacity: 1;
- transition: opacity ${500}ms ease-out ${100}ms;
- `,logsExit:w.css`
- label: logsExit;
- position: absolute;
- opacity: 1;
- height: auto;
- width: 100%;
- `,logsExitActive:w.css`
- label: logsExitActive;
- opacity: 0;
- transition: opacity ${500}ms ease-out ${100}ms;
- `})));function Rt(e){const{visible:t,children:s}=e,i=St();return(0,$.jsx)(ke.Z,{in:t,mountOnEnter:!0,unmountOnExit:!0,timeout:600,classNames:{enter:i.logsEnter,enterActive:i.logsEnterActive,exit:i.logsExit,exitActive:i.logsExitActive},children:s})}var jt=s(67892);function Ct(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class Tt extends i.PureComponent{constructor(){super(...arguments),Ct(this,"onChangeTime",(e=>{const{exploreId:t,updateTimeRange:s}=this.props;s({exploreId:t,absoluteRange:e})})),Ct(this,"getLogRowContext",(async(e,t)=>{const{datasourceInstance:s,logsQueries:i}=this.props;if((0,f.hasLogsContextSupport)(s)){const o=(null!=i?i:[]).find((t=>t.refId===e.dataFrame.refId&&null!=t.datasource&&t.datasource.type===s.type));return s.getLogRowContext(e,t,o)}return[]})),Ct(this,"showContextToggle",(e=>{const{datasourceInstance:t}=this.props;return!!(0,f.hasLogsContextSupport)(t)&&t.showContextToggle(e)})),Ct(this,"getFieldLinks",((e,t)=>{const{splitOpen:s,range:i}=this.props;return(0,jt.a)({field:e,rowIndex:t,splitOpenFn:s,range:i})}))}render(){var e;const{loading:t,loadingState:s,logRows:i,logsMeta:o,logsSeries:r,logsQueries:a,onClickFilterLabel:l,onClickFilterOutLabel:c,onStartScanning:d,onStopScanning:h,absoluteRange:p,timeZone:u,visibleRange:g,scanning:m,range:f,width:y,isLive:x,exploreId:v,addResultsToCache:b,clearCache:S}=this.props;if(!i)return null;const R=w.css`
- & > div {
- overflow: visible;
- & > div {
- overflow: visible;
- }
- }
- `;return(0,$.jsxs)($.Fragment,{children:[(0,$.jsx)(Rt,{visible:x,children:(0,$.jsx)(n.Collapse,{label:"Logs",loading:!1,isOpen:!0,children:(0,$.jsx)(De,{exploreId:v,children:e=>(0,$.jsx)(Ke,{logRows:i,timeZone:u,stopLive:e.stop,isPaused:this.props.isPaused,onPause:e.pause,onResume:e.resume})})})}),(0,$.jsx)(Rt,{visible:!x,children:(0,$.jsx)(n.Collapse,{label:"Logs",loading:t,isOpen:!0,className:R,children:(0,$.jsx)(bt,{exploreId:v,datasourceType:null===(e=this.props.datasourceInstance)||void 0===e?void 0:e.type,logRows:i,logsMeta:o,logsSeries:r,logsQueries:a,width:y,loading:t,loadingState:s,onChangeTime:this.onChangeTime,onClickFilterLabel:l,onClickFilterOutLabel:c,onStartScanning:d,onStopScanning:h,absoluteRange:p,visibleRange:g,timeZone:u,scanning:m,scanRange:f.raw,showContextToggle:this.showContextToggle,getRowContext:this.getLogRowContext,getFieldLinks:this.getFieldLinks,addResultsToCache:()=>b(v),clearCache:()=>S(v)})})})]})}}const It={updateTimeRange:Ne.cD,splitOpen:h.bW,addResultsToCache:p.K8,clearCache:p.LK},zt=(0,o.connect)((function(e,t){let{exploreId:s}=t;const i=e.explore[s],{logsResult:o,loading:r,scanning:n,datasourceInstance:a,isLive:l,isPaused:c,range:d,absoluteRange:h,logsVolumeDataProvider:p,logsVolumeData:u}=i,g=(0,b.Z)(e.user);return{loading:r,logRows:null==o?void 0:o.rows,logsMeta:null==o?void 0:o.meta,logsSeries:null==o?void 0:o.series,logsQueries:null==o?void 0:o.queries,visibleRange:null==o?void 0:o.visibleRange,scanning:n,timeZone:g,datasourceInstance:a,isLive:l,isPaused:c,range:d,absoluteRange:h,logsVolumeDataProvider:p,logsVolumeData:u}}),It)(Tt);var kt,Ft;function Lt(e){var t;const[s,o]=(0,i.useState)(!1),r=e.error.message||(null===(t=e.error.data)||void 0===t?void 0:t.message)||"",a=!s&&r.length>100;return(0,$.jsx)(n.Alert,{title:"Failed to load log volume for this query",severity:"warning",children:a?(0,$.jsx)(n.Button,{variant:"secondary",size:"xs",onClick:()=>{o(!0)},children:"Show details"}):r})}function Ot(e){const{width:t,logsVolumeData:s,absoluteRange:i,timeZone:o,splitOpen:r,onUpdateTimeRange:a,onLoadLogsVolume:l}=e,c=(0,n.useTheme2)(),d=(0,n.useStyles2)(Nt),h=parseInt(c.spacing(2).slice(0,-2),10);let p;if(!s)return null;if(null!=s&&s.error)return(0,$.jsx)(Lt,{error:null==s?void 0:s.error});(null==s?void 0:s.state)===f.LoadingState.Loading?p=kt||(kt=(0,$.jsx)("span",{children:"Log volume is loading..."})):null!=s&&s.data&&(p=s.data.length>0?(0,$.jsx)(E,{graphStyle:"lines",loadingState:f.LoadingState.Done,data:s.data,height:150,width:t-h,absoluteRange:i,onChangeTime:a,timeZone:o,splitOpenFn:r,tooltipDisplayMode:n.TooltipDisplayMode.Multi}):Ft||(Ft=(0,$.jsx)("span",{children:"No volume data."})));const u=function(e,t){var s,i;const o=e&&e.data[0]&&(null===(s=e.data[0].meta)||void 0===s||null===(i=s.custom)||void 0===i?void 0:i.absoluteRange);return o?(t.from-t.to)/(o.from-o.to):void 0}(s,i);let g;return void 0!==u&&u<1&&(g=(0,$.jsx)(n.InlineField,{label:"Reload log volume",transparent:!0,children:(0,$.jsx)(n.Button,{size:"xs",icon:"sync",variant:"secondary",onClick:l,id:"reload-volume"})})),(0,$.jsxs)(n.Collapse,{label:"Log volume",isOpen:!0,loading:(null==s?void 0:s.state)===f.LoadingState.Loading,children:[(0,$.jsx)("div",{style:{height:150},className:d.contentContainer,children:p}),(0,$.jsx)("div",{className:d.zoomInfoContainer,children:g})]})}const Nt=()=>({zoomInfoContainer:w.css`
- display: flex;
- justify-content: end;
- position: absolute;
- right: 5px;
- top: 5px;
- `,contentContainer:w.css`
- display: flex;
- align-items: center;
- justify-content: center;
- `});const Dt=()=>{const e=(0,n.useStyles2)($t);return(0,$.jsx)($.Fragment,{children:(0,$.jsx)(n.PanelContainer,{"data-testid":"explore-no-data",className:e.wrapper,children:(0,$.jsx)("span",{className:e.message,children:"No data"})})})},$t=e=>({wrapper:w.css`
- label: no-data-card;
- padding: ${e.spacing(3)};
- background: ${e.colors.background.primary};
- border-radius: ${e.shape.borderRadius(2)};
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- flex-grow: 1;
- `,message:w.css`
- font-size: ${e.typography.h2.fontSize};
- padding: ${e.spacing(4)};
- color: ${e.colors.text.disabled};
- `});var Et,Ht,Pt=s(98163);const At=()=>{const e=(0,n.useTheme2)(),t=Pt.Vt.hasPermission(P.bW.DataSourcesCreate)&&Pt.Vt.hasPermission(P.bW.DataSourcesWrite),s=(0,$.jsxs)($.Fragment,{children:[Et||(Et=(0,$.jsx)(n.Icon,{name:"rocket"})),(0,$.jsx)($.Fragment,{children:" ProTip: You can also define data sources through configuration files. "}),Ht||(Ht=(0,$.jsx)("a",{href:"http://docs.grafana.org/administration/provisioning/#datasources?utm_source=explore",target:"_blank",rel:"noreferrer",className:"text-link",children:"Learn more"}))]}),i=(0,$.jsx)(n.LinkButton,{size:"lg",href:"datasources/new",icon:"database",disabled:!t,children:"Add data source"}),o=w.css`
- max-width: ${e.breakpoints.values.lg}px;
- margin-top: ${e.spacing(2)};
- align-self: center;
- `;return(0,$.jsx)(n.CallToActionCard,{callToActionElement:i,className:o,footer:s,message:"Explore requires at least one data source. Once you have added a data source, you can query it here."})};var Mt,Bt=s(17433),qt=s(87900),_t=s(41073);const Wt=e=>({warningText:w.css`
- label: warningText;
- font-size: ${e.typography.bodySmall.fontSize};
- color: ${e.colors.text.secondary};
- `});const Zt={splitOpen:h.bW},Qt=(0,o.connect)((function(e,t){let{exploreId:s}=t;return{range:e.explore[s].range}}),Zt)((function(e){var t;const{dataFrames:s,range:i,splitOpen:o,withTraceView:a,datasourceType:l}=e,c=(0,jt.u)(i,o),d=(0,n.useTheme2)(),h=(0,n.useStyles2)(Wt),p=(0,f.applyFieldOverrides)({fieldConfig:{defaults:{},overrides:[]},data:s,replaceVariables:e=>e,theme:d}),{nodes:u}=(0,_t.Y)(p),[g,m]=(0,Bt.Z)(!1),y=a&&(null===(t=u[0])||void 0===t?void 0:t.length)>1e3?(0,$.jsxs)("span",{className:h.warningText,children:[" (",u[0].length," nodes, can be slow to load)"]}):null;return(0,$.jsx)(n.Collapse,{label:(0,$.jsxs)("span",{children:["Node graph",y," ",Mt||(Mt=(0,$.jsx)(n.Badge,{text:"Beta",color:"blue",icon:"rocket",tooltip:"This visualization is in beta"}))]}),collapsible:a,isOpen:!a||g,onToggle:a?()=>(m(),void(0,r.reportInteraction)("grafana_traces_node_graph_panel_clicked",{datasourceType:l,expanded:!g})):void 0,children:(0,$.jsx)("div",{style:{height:a?500:600},children:(0,$.jsx)(qt.E,{dataFrames:p,getLinks:c})})})}));var Ut=s(98335),Vt=s(65184),Kt=s(67436),Gt=s(56303);const Yt=e=>{let{exploreId:t}=e;const s=(0,o.useDispatch)(),{getQueries:r,getDatasourceInstanceSettings:n,getQueryResponse:a,getHistory:l,getEventBridge:c}=(0,i.useMemo)((()=>(e=>{const t=(0,u.F)(e);return{getQueries:(0,Ut.P1)(t,(e=>e.queries)),getQueryResponse:(0,Ut.P1)(t,(e=>e.queryResponse)),getHistory:(0,Ut.P1)(t,(e=>e.history)),getEventBridge:(0,Ut.P1)(t,(e=>e.eventBridge)),getDatasourceInstanceSettings:(0,Ut.P1)(t,(e=>{var t;return(0,Kt.ak)().getInstanceSettings(null===(t=e.datasourceInstance)||void 0===t?void 0:t.uid)}))}})(t)),[t]),d=(0,o.useSelector)(r),h=(0,o.useSelector)(n),g=(0,o.useSelector)(a),m=(0,o.useSelector)(l),y=(0,o.useSelector)(c),x=(0,i.useCallback)((()=>{s((0,p.aA)(t))}),[s,t]),v=(0,i.useCallback)((e=>{s((0,p.PM)({queries:e,exploreId:t})),e.length<d.length&&x()}),[s,t,x,d]),b=(0,i.useCallback)((e=>{v([...d,Object.assign({},e,{refId:(0,Vt.Hs)(d)})])}),[v,d]);return(0,$.jsx)(Gt.l,{dsSettings:h,queries:d,onQueriesChange:v,onAddQuery:b,onRunQueries:x,data:g,app:f.CoreApp.Explore,history:m,eventBus:y})};var Xt=s(88917);const Jt=e=>{const t={transition:`opacity ${e.duration}ms linear`,opacity:0},s={exited:{opacity:0,display:"none"},entering:{opacity:0},entered:{opacity:1},exiting:{opacity:0}};return(0,$.jsx)(Xt.ZP,{in:e.in,timeout:e.duration,unmountOnExit:e.unmountOnExit||!1,onExited:e.onExited,children:i=>(0,$.jsx)("div",{style:Object.assign({},t,s[i]),children:e.children})})},es=e=>{var t;const{queryError:s}=e,i=!!s,o=i?100:10,r=s?"Query error":"Unknown error",a=(null==s?void 0:s.message)||(null==s||null===(t=s.data)||void 0===t?void 0:t.message)||null;return(0,$.jsx)(Jt,{in:i,duration:o,children:(0,$.jsx)(n.Alert,{severity:"error",title:r,topSpacing:2,children:a})})};function ts(e){const t=(0,o.useSelector)((t=>{var s;return null===(s=t.explore[e.exploreId])||void 0===s?void 0:s.queryResponse})),s=(null==t?void 0:t.state)===f.LoadingState.Error?null==t?void 0:t.error:void 0;return null!=s&&s.refId?null:(0,$.jsx)(es,{queryError:s})}var ss=s(76223),is=s(17763),os=s(36537),rs=s(58257),ns=s(56340);const as={changeDatasource:Oe.zU,deleteHistoryItem:ss.NV,commentHistoryItem:ss.Ff,starHistoryItem:ss.ev,setQueries:p.KO},ls=(0,o.connect)((function(e,t){let{exploreId:s}=t;const i=e.explore,{datasourceInstance:o}=i[s];return{exploreId:s,datasourceInstance:o}}),as),cs=(0,n.stylesFactory)(((e,t)=>{const s="240px",i="170px",o=e.colors.bg2;return{queryCard:w.css`
- display: flex;
- flex-direction: column;
- border: 1px solid ${e.colors.border1};
- margin: ${e.spacing.sm} 0;
- background-color: ${o};
- border-radius: ${e.border.radius.sm};
- .starred {
- color: ${e.palette.orange};
- }
- `,cardRow:w.css`
- display: flex;
- align-items: center;
- justify-content: space-between;
- padding: ${e.spacing.sm};
- border-bottom: none;
- :first-of-type {
- border-bottom: 1px solid ${e.colors.border1};
- padding: ${e.spacing.xs} ${e.spacing.sm};
- }
- img {
- height: ${e.typography.size.base};
- max-width: ${e.typography.size.base};
- margin-right: ${e.spacing.sm};
- }
- `,datasourceContainer:w.css`
- display: flex;
- align-items: center;
- font-size: ${e.typography.size.sm};
- font-weight: ${e.typography.weight.semibold};
- `,queryActionButtons:w.css`
- max-width: ${i};
- display: flex;
- justify-content: flex-end;
- font-size: ${e.typography.size.base};
- button {
- margin-left: ${e.spacing.sm};
- }
- `,queryContainer:w.css`
- font-weight: ${e.typography.weight.semibold};
- width: calc(100% - ${s});
- `,queryRow:w.css`
- border-top: 1px solid ${e.colors.border1};
- word-break: break-all;
- padding: 4px 2px;
- :first-child {
- border-top: none;
- padding: 0 0 4px 0;
- }
- `,updateCommentContainer:w.css`
- width: calc(100% + ${s});
- margin-top: ${e.spacing.sm};
- `,comment:w.css`
- overflow-wrap: break-word;
- font-size: ${e.typography.size.sm};
- font-weight: ${e.typography.weight.regular};
- margin-top: ${e.spacing.xs};
- `,commentButtonRow:w.css`
- > * {
- margin-right: ${e.spacing.sm};
- }
- `,textArea:w.css`
- width: 100%;
- `,runButton:w.css`
- max-width: ${i};
- display: flex;
- justify-content: flex-end;
- button {
- height: auto;
- padding: ${e.spacing.xs} ${e.spacing.md};
- line-height: 1.4;
- span {
- white-space: normal !important;
- }
- }
- `}}));const ds=ls((function(e){var t;const{query:s,dsImg:o,isRemoved:a,commentHistoryItem:l,starHistoryItem:c,deleteHistoryItem:d,changeDatasource:h,exploreId:p,datasourceInstance:u,setQueries:g}=e,[m,f]=(0,i.useState)(!1),[y,x]=(0,i.useState)(s.comment),[b,S]=(0,i.useState)(void 0);(0,i.useEffect)((()=>{(async()=>{const e=await(0,r.getDataSourceSrv)().get(s.datasourceName);S(e)})()}),[s.datasourceName]);const R=(0,n.useTheme)(),j=cs(R,a),T=()=>{l(s.id,y),f(!1),(0,r.reportInteraction)("grafana_explore_query_history_commented",{queryHistoryEnabled:r.config.queryHistoryEnabled})},I=()=>{f(!1),x(s.comment)},k=(0,$.jsxs)("div",{className:j.updateCommentContainer,"aria-label":y?"Update comment form":"Add comment form",children:[(0,$.jsx)(n.TextArea,{value:y,placeholder:y?void 0:"An optional description of what the query does.",onChange:e=>x(e.currentTarget.value),className:j.textArea}),(0,$.jsxs)("div",{className:j.commentButtonRow,children:[(0,$.jsx)(n.Button,{onClick:T,"aria-label":"Submit button",children:"Save comment"}),(0,$.jsx)(n.Button,{variant:"secondary",onClick:I,children:"Cancel"})]})]}),F=(0,$.jsxs)("div",{className:j.queryActionButtons,children:[(0,$.jsx)(n.IconButton,{name:"comment-alt",onClick:()=>f(!m),title:(null===(t=s.comment)||void 0===t?void 0:t.length)>0?"Edit comment":"Add comment"}),(0,$.jsx)(n.IconButton,{name:"copy",onClick:()=>{const e=s.queries.map((e=>(0,is.OH)(e,b))).join("\n");(0,v.n9)(e),(0,ns.WI)((0,os.$l)((0,rs.AT)("Query copied to clipboard")))},title:"Copy query to clipboard"}),!a&&(0,$.jsx)(n.IconButton,{name:"share-alt",onClick:async()=>{const e=(0,is.t2)(s);await(0,be.L)(e)},title:"Copy shortened link to clipboard"}),(0,$.jsx)(n.IconButton,{name:"trash-alt",title:"Delete query",onClick:()=>{const e=e=>{d(e),(0,ns.WI)((0,os.$l)((0,rs.AT)("Query deleted"))),(0,r.reportInteraction)("grafana_explore_query_history_deleted",{queryHistoryEnabled:r.config.queryHistoryEnabled})};s.starred?C.Z.publish(new z.VJ({title:"Delete",text:"Are you sure you want to permanently delete your starred query?",yesText:"Delete",icon:"trash-alt",onConfirm:()=>e(s.id)})):e(s.id)}}),(0,$.jsx)(n.IconButton,{name:s.starred?"favorite":"star",iconType:s.starred?"mono":"default",onClick:()=>{c(s.id,!s.starred),(0,r.reportInteraction)("grafana_explore_query_history_starred",{queryHistoryEnabled:r.config.queryHistoryEnabled,newValue:!s.starred})},title:s.starred?"Unstar query":"Star query"})]});return(0,$.jsxs)("div",{className:j.queryCard,onKeyDown:e=>{"Enter"===e.key&&(e.shiftKey||e.ctrlKey)&&T(),"Escape"===e.key&&I()},children:[(0,$.jsxs)("div",{className:j.cardRow,children:[(0,$.jsxs)("div",{className:j.datasourceContainer,children:[(0,$.jsx)("img",{src:o,"aria-label":"Data source icon"}),(0,$.jsx)("div",{"aria-label":"Data source name",children:a?"Data source does not exist anymore":s.datasourceName})]}),F]}),(0,$.jsxs)("div",{className:(0,w.cx)(j.cardRow),children:[(0,$.jsxs)("div",{className:j.queryContainer,children:[s.queries.map(((e,t)=>{const s=(0,is.OH)(e,b);return(0,$.jsx)("div",{"aria-label":"Query text",className:j.queryRow,children:s},`${e}-${t}`)})),!m&&s.comment&&(0,$.jsx)("div",{"aria-label":"Query comment",className:j.comment,children:s.comment}),m&&k]}),!m&&(0,$.jsx)("div",{className:j.runButton,children:(0,$.jsx)(n.Button,{variant:"secondary",onClick:async()=>{const e=s.queries,t=s.datasourceName!==(null==u?void 0:u.name);t?(await h(p,s.datasourceName,{importQueries:!0}),g(p,e)):g(p,e),(0,r.reportInteraction)("grafana_explore_query_history_run",{queryHistoryEnabled:r.config.queryHistoryEnabled,differentDataSource:t})},disabled:a,children:(null==u?void 0:u.name)===s.datasourceName?"Run query":"Switch data source and run query"})})]})]})}));var hs,ps,us;const gs=(0,n.stylesFactory)(((e,t)=>{const s=e.isLight?e.palette.gray5:e.palette.dark4,i=t-180+"px";return{container:w.css`
- display: flex;
- .label-slider {
- font-size: ${e.typography.size.sm};
- &:last-of-type {
- margin-top: ${e.spacing.lg};
- }
- &:first-of-type {
- font-weight: ${e.typography.weight.semibold};
- margin-bottom: ${e.spacing.md};
- }
- }
- `,containerContent:w.css`
- width: calc(${"100% - 134px"});
- `,containerSlider:w.css`
- width: 129px;
- margin-right: ${e.spacing.sm};
- .slider {
- bottom: 10px;
- height: ${i};
- width: 129px;
- padding: ${e.spacing.sm} 0;
- }
- `,slider:w.css`
- position: fixed;
- `,selectors:w.css`
- display: flex;
- justify-content: space-between;
- flex-wrap: wrap;
- `,filterInput:w.css`
- margin-bottom: ${e.spacing.sm};
- `,multiselect:w.css`
- width: 100%;
- margin-bottom: ${e.spacing.sm};
- .gf-form-select-box__multi-value {
- background-color: ${s};
- padding: ${e.spacing.xxs} ${e.spacing.xs} ${e.spacing.xxs} ${e.spacing.sm};
- border-radius: ${e.border.radius.sm};
- }
- `,sort:w.css`
- width: 170px;
- `,sessionName:w.css`
- display: flex;
- align-items: flex-start;
- justify-content: flex-start;
- margin-top: ${e.spacing.lg};
- h4 {
- margin: 0 10px 0 0;
- }
- `,heading:w.css`
- font-size: ${e.typography.heading.h4};
- margin: ${e.spacing.md} ${e.spacing.xxs} ${e.spacing.sm} ${e.spacing.xxs};
- `,footer:w.css`
- height: 60px;
- margin: ${e.spacing.lg} auto;
- display: flex;
- justify-content: center;
- font-weight: ${e.typography.weight.light};
- font-size: ${e.typography.size.sm};
- a {
- font-weight: ${e.typography.weight.semibold};
- margin-left: ${e.spacing.xxs};
- }
- `,queries:w.css`
- font-size: ${e.typography.size.sm};
- font-weight: ${e.typography.weight.regular};
- margin-left: ${e.spacing.xs};
- `}}));function ms(e){const{queries:t,totalQueries:s,loading:o,richHistorySearchFilters:a,updateFilters:l,clearRichHistoryResults:c,loadMoreRichHistory:d,richHistorySettings:h,exploreId:p,height:u,activeDatasourceInstance:g}=e,m=(0,n.useTheme)(),f=gs(m,u),y=(0,is.DR)();if((0,i.useEffect)((()=>{const e=!h.activeDatasourceOnly&&h.lastUsedDatasourceFilters?h.lastUsedDatasourceFilters:[g],t={search:"",sortOrder:is.As.Descending,datasourceFilters:e,from:0,to:h.retentionPeriod,starred:!1};return l(t),()=>{c()}}),[]),!a)return hs||(hs=(0,$.jsx)("span",{children:"Loading..."}));const x=(0,is.k4)(t,a.sortOrder),v=Ts(),b=t.length&&t.length!==s;return(0,$.jsxs)("div",{className:f.container,children:[(0,$.jsx)("div",{className:f.containerSlider,children:(0,$.jsxs)("div",{className:f.slider,children:[ps||(ps=(0,$.jsx)("div",{className:"label-slider",children:"Filter history"})),(0,$.jsx)("div",{className:"label-slider",children:(0,is.bQ)(a.from)}),(0,$.jsx)("div",{className:"slider",children:(0,$.jsx)(n.RangeSlider,{tooltipAlwaysVisible:!1,min:0,max:h.retentionPeriod,value:[a.from,a.to],orientation:"vertical",formatTooltipResult:is.bQ,reverse:!0,onAfterChange:e=>{l({from:e[0],to:e[1]})}})}),(0,$.jsx)("div",{className:"label-slider",children:(0,is.bQ)(a.to)})]})}),(0,$.jsxs)("div",{className:f.containerContent,children:[(0,$.jsxs)("div",{className:f.selectors,children:[!h.activeDatasourceOnly&&(0,$.jsx)(n.MultiSelect,{className:f.multiselect,options:y.map((e=>({value:e.name,label:e.name}))),value:a.datasourceFilters,placeholder:"Filter queries for data sources(s)","aria-label":"Filter queries for data sources(s)",onChange:e=>{l({datasourceFilters:e.map((e=>e.value))})}}),(0,$.jsx)("div",{className:f.filterInput,children:(0,$.jsx)(n.FilterInput,{placeholder:"Search queries",value:a.search,onChange:e=>l({search:e})})}),(0,$.jsx)("div",{"aria-label":"Sort queries",className:f.sort,children:(0,$.jsx)(n.Select,{value:v.filter((e=>e.value===a.sortOrder)),options:v,placeholder:"Sort queries by",onChange:e=>l({sortOrder:e.value})})})]}),o&&(us||(us=(0,$.jsx)("span",{children:"Loading results..."}))),!o&&Object.keys(x).map((e=>(0,$.jsxs)("div",{children:[(0,$.jsxs)("div",{className:f.heading,children:[e," ",(0,$.jsxs)("span",{className:f.queries,children:[b?"Displaying ":"",x[e].length," queries"]})]}),x[e].map((e=>{const t=y.findIndex((t=>t.name===e.datasourceName));return(0,$.jsx)(ds,{query:e,exploreId:p,dsImg:-1===t?"public/img/icn-datasource.svg":y[t].imgUrl,isRemoved:-1===t},e.id)}))]},e))),b?(0,$.jsxs)("div",{children:["Showing ",t.length," of ",s," ",(0,$.jsx)(n.Button,{onClick:d,children:"Load more"})]}):null,(0,$.jsx)("div",{className:f.footer,children:r.config.queryHistoryEnabled?"":"The history is local to your browser and is not shared with others."})]})]})}var fs=s(57969);const ys=(0,n.stylesFactory)((e=>({container:w.css`
- font-size: ${e.typography.size.sm};
- .space-between {
- margin-bottom: ${e.spacing.lg};
- }
- `,input:w.css`
- max-width: 200px;
- `}))),xs=[{value:2,label:"2 days"},{value:5,label:"5 days"},{value:7,label:"1 week"},{value:14,label:"2 weeks"}];function vs(e){const{retentionPeriod:t,starredTabAsFirstTab:s,activeDatasourceOnly:i,onChangeRetentionPeriod:o,toggleStarredTabAsFirstTab:r,toggleactiveDatasourceOnly:a,deleteRichHistory:l}=e,c=(0,n.useTheme)(),d=ys(c),h=xs.find((e=>e.value===t));return(0,$.jsxs)("div",{className:d.container,children:[(0,T.X)().changeRetention?(0,$.jsx)(n.Field,{label:"History time span",description:`Select the period of time for which Grafana will save your query history. Up to ${fs.H6} entries will be stored.`,className:"space-between",children:(0,$.jsx)("div",{className:d.input,children:(0,$.jsx)(n.Select,{value:h,options:xs,onChange:o})})}):(0,$.jsxs)(n.Alert,{severity:"info",title:"History time span",children:["Grafana will keep entries up to ",null==h?void 0:h.label,"."]}),(0,$.jsx)(n.InlineField,{label:"Change the default active tab from “Query history” to “Starred”",className:"space-between",children:(0,$.jsx)(n.InlineSwitch,{id:"explore-query-history-settings-default-active-tab",value:s,onChange:r})}),(0,T.X)().onlyActiveDataSource&&(0,$.jsx)(n.InlineField,{label:"Only show queries for data source currently active in Explore",className:"space-between",children:(0,$.jsx)(n.InlineSwitch,{id:"explore-query-history-settings-data-source-behavior",value:i,onChange:a})}),(0,T.X)().clearHistory&&(0,$.jsxs)("div",{children:[(0,$.jsx)("div",{className:w.css`
- font-weight: ${c.typography.weight.bold};
- `,children:"Clear query history"}),(0,$.jsx)("div",{className:w.css`
- margin-bottom: ${c.spacing.sm};
- `,children:"Delete all of your query history, permanently."}),(0,$.jsx)(n.Button,{variant:"destructive",onClick:()=>{C.Z.publish(new z.VJ({title:"Delete",text:"Are you sure you want to permanently delete your query history?",yesText:"Delete",icon:"trash-alt",onConfirm:()=>{l(),(0,ns.WI)((0,os.$l)((0,rs.AT)("Query history deleted")))}}))},children:"Clear query history"})]})]})}var bs,ws;const Ss=(0,n.stylesFactory)((e=>{const t=e.isLight?e.palette.gray5:e.palette.dark4;return{container:w.css`
- display: flex;
- `,containerContent:w.css`
- width: 100%;
- `,selectors:w.css`
- display: flex;
- justify-content: space-between;
- flex-wrap: wrap;
- `,multiselect:w.css`
- width: 100%;
- margin-bottom: ${e.spacing.sm};
- .gf-form-select-box__multi-value {
- background-color: ${t};
- padding: ${e.spacing.xxs} ${e.spacing.xs} ${e.spacing.xxs} ${e.spacing.sm};
- border-radius: ${e.border.radius.sm};
- }
- `,filterInput:w.css`
- margin-bottom: ${e.spacing.sm};
- `,sort:w.css`
- width: 170px;
- `,footer:w.css`
- height: 60px;
- margin-top: ${e.spacing.lg};
- display: flex;
- justify-content: center;
- font-weight: ${e.typography.weight.light};
- font-size: ${e.typography.size.sm};
- a {
- font-weight: ${e.typography.weight.semibold};
- margin-left: ${e.spacing.xxs};
- }
- `}}));function Rs(e){const{updateFilters:t,clearRichHistoryResults:s,loadMoreRichHistory:o,activeDatasourceInstance:a,richHistorySettings:l,queries:c,totalQueries:d,loading:h,richHistorySearchFilters:p,exploreId:u}=e,g=(0,n.useTheme)(),m=Ss(g),f=(0,is.DR)();if((0,i.useEffect)((()=>{const e=l.activeDatasourceOnly&&l.lastUsedDatasourceFilters?l.lastUsedDatasourceFilters:[a],i={search:"",sortOrder:is.As.Descending,datasourceFilters:e,from:0,to:l.retentionPeriod,starred:!0};return t(i),()=>{s()}}),[]),!p)return bs||(bs=(0,$.jsx)("span",{children:"Loading..."}));const y=Ts();return(0,$.jsx)("div",{className:m.container,children:(0,$.jsxs)("div",{className:m.containerContent,children:[(0,$.jsxs)("div",{className:m.selectors,children:[!l.activeDatasourceOnly&&(0,$.jsx)(n.MultiSelect,{className:m.multiselect,options:f.map((e=>({value:e.name,label:e.name}))),value:p.datasourceFilters,placeholder:"Filter queries for data sources(s)","aria-label":"Filter queries for data sources(s)",onChange:e=>{t({datasourceFilters:e.map((e=>e.value))})}}),(0,$.jsx)("div",{className:m.filterInput,children:(0,$.jsx)(n.FilterInput,{placeholder:"Search queries",value:p.search,onChange:e=>t({search:e})})}),(0,$.jsx)("div",{"aria-label":"Sort queries",className:m.sort,children:(0,$.jsx)(n.Select,{value:y.filter((e=>e.value===p.sortOrder)),options:y,placeholder:"Sort queries by",onChange:e=>t({sortOrder:e.value})})})]}),h&&(ws||(ws=(0,$.jsx)("span",{children:"Loading results..."}))),!h&&c.map((e=>{const t=f.findIndex((t=>t.name===e.datasourceName));return(0,$.jsx)(ds,{query:e,exploreId:u,dsImg:-1===t?"public/img/icn-datasource.svg":f[t].imgUrl,isRemoved:-1===t},e.id)})),c.length&&c.length!==d?(0,$.jsxs)("div",{children:["Showing ",c.length," of ",d," ",(0,$.jsx)(n.Button,{onClick:o,children:"Load more"})]}):null,(0,$.jsx)("div",{className:m.footer,children:r.config.queryHistoryEnabled?"":"The history is local to your browser and is not shared with others."})]})})}function js(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}let Cs;!function(e){e.RichHistory="Query history",e.Starred="Starred",e.Settings="Settings"}(Cs||(Cs={}));const Ts=()=>[{label:"Newest first",value:is.As.Descending},{label:"Oldest first",value:is.As.Ascending},{label:"Data source A-Z",value:is.As.DatasourceAZ},{label:"Data source Z-A",value:is.As.DatasourceZA}].filter((e=>(0,T.X)().availableFilters.includes(e.value)));class Is extends i.PureComponent{constructor(){super(...arguments),js(this,"state",{loading:!1}),js(this,"updateSettings",(e=>{this.props.updateHistorySettings(Object.assign({},this.props.richHistorySettings,e))})),js(this,"updateFilters",(e=>{const t=Object.assign({},this.props.richHistorySearchFilters,e,{page:1});this.props.updateHistorySearchFilters(this.props.exploreId,t),this.loadRichHistory()})),js(this,"clearResults",(()=>{this.props.clearRichHistoryResults(this.props.exploreId)})),js(this,"loadRichHistory",(0,k.debounce)((()=>{this.props.loadRichHistory(this.props.exploreId),this.setState({loading:!0})}),300)),js(this,"onChangeRetentionPeriod",(e=>{void 0!==e.value&&this.updateSettings({retentionPeriod:e.value})})),js(this,"toggleStarredTabAsFirstTab",(()=>this.updateSettings({starredTabAsFirstTab:!this.props.richHistorySettings.starredTabAsFirstTab}))),js(this,"toggleActiveDatasourceOnly",(()=>this.updateSettings({activeDatasourceOnly:!this.props.richHistorySettings.activeDatasourceOnly})))}componentDidUpdate(e,t,s){e.richHistory!==this.props.richHistory&&this.setState({loading:!1})}render(){const{richHistory:e,richHistoryTotal:t,height:s,exploreId:i,deleteRichHistory:o,onClose:r,firstTab:a,activeDatasourceInstance:l}=this.props,{loading:c}=this.state;let d=[{label:"Query history",value:Cs.RichHistory,content:(0,$.jsx)(ms,{queries:e,totalQueries:t||0,loading:c,updateFilters:this.updateFilters,clearRichHistoryResults:()=>this.props.clearRichHistoryResults(this.props.exploreId),loadMoreRichHistory:()=>this.props.loadMoreRichHistory(this.props.exploreId),activeDatasourceInstance:l,richHistorySettings:this.props.richHistorySettings,richHistorySearchFilters:this.props.richHistorySearchFilters,exploreId:i,height:s}),icon:"history"},{label:"Starred",value:Cs.Starred,content:(0,$.jsx)(Rs,{queries:e,totalQueries:t||0,loading:c,activeDatasourceInstance:l,updateFilters:this.updateFilters,clearRichHistoryResults:()=>this.props.clearRichHistoryResults(this.props.exploreId),loadMoreRichHistory:()=>this.props.loadMoreRichHistory(this.props.exploreId),richHistorySettings:this.props.richHistorySettings,richHistorySearchFilters:this.props.richHistorySearchFilters,exploreId:i}),icon:"star"},{label:"Settings",value:Cs.Settings,content:(0,$.jsx)(vs,{retentionPeriod:this.props.richHistorySettings.retentionPeriod,starredTabAsFirstTab:this.props.richHistorySettings.starredTabAsFirstTab,activeDatasourceOnly:this.props.richHistorySettings.activeDatasourceOnly,onChangeRetentionPeriod:this.onChangeRetentionPeriod,toggleStarredTabAsFirstTab:this.toggleStarredTabAsFirstTab,toggleactiveDatasourceOnly:this.toggleActiveDatasourceOnly,deleteRichHistory:o}),icon:"sliders-v-alt"}];return(0,$.jsx)(n.TabbedContainer,{tabs:d,onClose:r,defaultTab:a,closeIconTooltip:"Close query history"})}}const zs=(0,n.withTheme)(Is);var ks;const Fs={initRichHistory:ss.sO,loadRichHistory:ss.TV,loadMoreRichHistory:ss.io,clearRichHistoryResults:ss.Cs,updateHistorySettings:ss.ch,updateHistorySearchFilters:ss.KZ,deleteRichHistory:ss.ik},Ls=(0,o.connect)((function(e,t){let{exploreId:s}=t;const i=e.explore,o=i[s],r=o.richHistorySearchFilters,n=i.richHistorySettings,{datasourceInstance:a}=o,l=null!=n&&n.starredTabAsFirstTab?Cs.Starred:Cs.RichHistory,{richHistory:c,richHistoryTotal:d}=o;return{richHistory:c,richHistoryTotal:d,firstTab:l,activeDatasourceInstance:a.name,richHistorySettings:n,richHistorySearchFilters:r}}),Fs);const Os=Ls((function(e){const t=(0,n.useTheme2)(),[s,o]=(0,i.useState)(t.components.horizontalDrawer.defaultHeight),{richHistory:a,richHistoryTotal:l,width:c,firstTab:d,activeDatasourceInstance:h,exploreId:p,deleteRichHistory:u,initRichHistory:g,loadRichHistory:m,loadMoreRichHistory:f,clearRichHistoryResults:y,richHistorySettings:x,updateHistorySettings:v,richHistorySearchFilters:b,updateHistorySearchFilters:w,onClose:S}=e;return(0,i.useEffect)((()=>{g(),(0,r.reportInteraction)("grafana_explore_query_history_opened",{queryHistoryEnabled:r.config.queryHistoryEnabled})}),[g]),x?(0,$.jsx)(pe,{width:c,onResize:(e,t,s)=>{o(Number(s.style.height.slice(0,-2)))},children:(0,$.jsx)(zs,{richHistory:a,richHistoryTotal:l,firstTab:d,activeDatasourceInstance:h,exploreId:p,onClose:S,height:s,deleteRichHistory:u,richHistorySettings:x,richHistorySearchFilters:b,updateHistorySettings:v,updateHistorySearchFilters:w,loadRichHistory:m,loadMoreRichHistory:f,clearRichHistoryResults:y})}):ks||(ks=(0,$.jsx)("span",{children:"Loading..."}))}));function Ns(e){const t=(e=>({containerMargin:w.css`
- margin-top: ${e.spacing(2)};
- `}))((0,n.useTheme2)());return(0,$.jsx)("div",{className:t.containerMargin,children:(0,$.jsxs)(n.HorizontalGroup,{children:[!e.addQueryRowButtonHidden&&(0,$.jsx)(n.Button,{variant:"secondary","aria-label":"Add row button",onClick:e.onClickAddQueryRowButton,disabled:e.addQueryRowButtonDisabled,icon:"plus",children:"Add query"}),!e.richHistoryRowButtonHidden&&(0,$.jsx)(n.Button,{variant:"secondary","aria-label":"Rich history button",className:(0,w.cx)({"explore-active-button":e.richHistoryButtonActive}),onClick:e.onClickRichHistoryButton,icon:"history",children:"Query history"}),(0,$.jsx)(n.Button,{variant:"secondary","aria-label":"Query inspector button",className:(0,w.cx)({"explore-active-button":e.queryInspectorButtonActive}),onClick:e.onClickQueryInspectorButton,icon:"info-circle",children:"Inspector"})]})})}var Ds=s(78837),$s=s(65747);const Es={splitOpen:h.bW},Hs=(0,o.connect)((function(e,t){let{exploreId:s}=t;const i=e.explore[s],{loading:o,tableResult:r,range:n}=i;return{loading:!(r&&r.length>0)&&o,tableResult:r,range:n}}),Es);class Ps extends i.PureComponent{getTableHeight(){const{tableResult:e}=this.props;return e&&0!==e.length?Math.max(Math.min(600,35*e.length)+35):200}render(){var e,t;const{loading:s,onCellFilterAdded:i,tableResult:o,width:r,splitOpen:a,range:l,ariaLabel:c,timeZone:d}=this.props,h=this.getTableHeight(),p=r-2*Ds.vc.theme.panelPadding-$s.QO;let u=o;if(null!==(e=u)&&void 0!==e&&e.length){u=(0,f.applyFieldOverrides)({data:[u],timeZone:d,theme:Ds.vc.theme2,replaceVariables:e=>e,fieldConfig:{defaults:{},overrides:[]}})[0];for(const e of u.fields)e.getLinks=t=>(0,jt.a)({field:e,rowIndex:t.valueRowIndex,splitOpenFn:a,range:l,dataFrame:u})}return(0,$.jsx)(n.Collapse,{label:"Table",loading:s,isOpen:!0,children:null!==(t=u)&&void 0!==t&&t.length?(0,$.jsx)(n.Table,{ariaLabel:c,data:u,width:p,height:h,onCellFilterAdded:i}):(0,$.jsx)(et,{metaItems:[{value:"0 series returned"}]})})}}const As=Hs(Ps);var Ms=s(85915),Bs=s(39306),qs=s(12579),_s=s(61597),Ws=s(91079);function Zs(e){const t=e.dataFrames[0],{dataFrames:s,splitOpenFn:r,exploreId:a,scrollElement:l,topOfViewRef:c,queryResponse:d}=e,h=(0,i.useMemo)((()=>(0,Ws.N)(t)),[t]),{search:p,setSearch:u,spanFindMatches:g}=(0,_s.R)(null==h?void 0:h.spans),[m,f]=(0,i.useState)(""),[y,x]=(0,i.useState)(""),v=(0,o.useSelector)((t=>{var s,i;return null!==(s=null===(i=t.explore[e.exploreId])||void 0===i?void 0:i.datasourceInstance)&&void 0!==s?s:void 0}));return h?(0,$.jsxs)($.Fragment,{children:[(0,$.jsx)(Ms.Z,{navigable:!0,searchValue:p,setSearch:u,spanFindMatches:g,searchBarSuffix:y,setSearchBarSuffix:x,focusedSpanIdForSearch:m,setFocusedSpanIdForSearch:f}),(0,$.jsx)(n.Collapse,{label:"Trace View",isOpen:!0,children:(0,$.jsx)(qs.m,{exploreId:a,dataFrames:s,splitOpenFn:r,scrollElement:l,traceProp:h,spanFindMatches:g,search:p,focusedSpanIdForSearch:m,queryResponse:d,datasource:v,topOfViewRef:c,topOfViewRefType:Bs.l4.Explore})})]}):null}var Qs,Us,Vs=s(52765);function Ks(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}var Gs;!function(e){e[e.RichHistory=0]="RichHistory",e[e.QueryInspector=1]="QueryInspector"}(Gs||(Gs={}));class Ys extends i.PureComponent{constructor(e){super(e),Ks(this,"scrollElement",void 0),Ks(this,"absoluteTimeUnsubsciber",void 0),Ks(this,"topOfViewRef",(0,i.createRef)()),Ks(this,"onChangeTime",(e=>{const{updateTimeRange:t,exploreId:s}=this.props;t({exploreId:s,rawRange:e})})),Ks(this,"onClickExample",(e=>{this.props.setQueries(this.props.exploreId,[e])})),Ks(this,"onCellFilterAdded",(e=>{const{value:t,key:s,operator:i}=e;i===j.PT&&this.onClickFilterLabel(s,t),i===j.tE&&this.onClickFilterOutLabel(s,t)})),Ks(this,"onClickFilterLabel",((e,t)=>{this.onModifyQueries({type:"ADD_FILTER",key:e,value:t})})),Ks(this,"onClickFilterOutLabel",((e,t)=>{this.onModifyQueries({type:"ADD_FILTER_OUT",key:e,value:t})})),Ks(this,"onClickAddQueryRowButton",(()=>{const{exploreId:e,queryKeys:t}=this.props;this.props.addQueryRow(e,t.length)})),Ks(this,"onMakeAbsoluteTime",(()=>{const{makeAbsoluteTime:e}=this.props;e()})),Ks(this,"onModifyQueries",((e,t)=>{const{datasourceInstance:s}=this.props;if(null!=s&&s.modifyQuery){const i=(e,t)=>s.modifyQuery(e,t);this.props.modifyQueries(this.props.exploreId,e,i,t)}})),Ks(this,"onResize",(e=>{this.props.changeSize(this.props.exploreId,e)})),Ks(this,"onStartScanning",(()=>{this.props.scanStart(this.props.exploreId)})),Ks(this,"onStopScanning",(()=>{this.props.scanStopAction({exploreId:this.props.exploreId})})),Ks(this,"onUpdateTimeRange",(e=>{const{exploreId:t,updateTimeRange:s}=this.props;s({exploreId:t,absoluteRange:e})})),Ks(this,"onChangeGraphStyle",(e=>{const{exploreId:t,changeGraphStyle:s}=this.props;s(t,e)})),Ks(this,"toggleShowRichHistory",(()=>{this.setState((e=>({openDrawer:e.openDrawer===Gs.RichHistory?void 0:Gs.RichHistory})))})),Ks(this,"toggleShowQueryInspector",(()=>{this.setState((e=>({openDrawer:e.openDrawer===Gs.QueryInspector?void 0:Gs.QueryInspector})))})),Ks(this,"memoizedGetNodeGraphDataFrames",(0,m.Z)(I.Ee)),this.state={openDrawer:void 0}}componentDidMount(){this.absoluteTimeUnsubsciber=C.Z.subscribe(z.QI,this.onMakeAbsoluteTime)}componentWillUnmount(){var e;null===(e=this.absoluteTimeUnsubsciber)||void 0===e||e.unsubscribe()}renderEmptyState(e){return(0,$.jsx)("div",{className:(0,w.cx)(e),children:Qs||(Qs=(0,$.jsx)(At,{}))})}renderNoData(){return Us||(Us=(0,$.jsx)(Dt,{}))}renderGraphPanel(e){const{graphResult:t,absoluteRange:s,timeZone:i,splitOpen:o,queryResponse:r,loading:a,theme:l,graphStyle:c}=this.props,d=parseInt(l.spacing(2).slice(0,-2),10),h=(0,$.jsx)(B,{graphStyle:c,onChangeGraphStyle:this.onChangeGraphStyle});return(0,$.jsx)(n.Collapse,{label:h,loading:a,isOpen:!0,children:(0,$.jsx)(E,{graphStyle:c,data:t,height:400,width:e-d,absoluteRange:s,onChangeTime:this.onUpdateTimeRange,timeZone:i,annotations:r.annotations,splitOpenFn:o,loadingState:r.state})})}renderLogsVolume(e){const{logsVolumeData:t,exploreId:s,loadLogsVolumeData:i,absoluteRange:o,timeZone:r,splitOpen:n}=this.props;return(0,$.jsx)(Ot,{absoluteRange:o,width:e,logsVolumeData:t,onUpdateTimeRange:this.onUpdateTimeRange,timeZone:r,splitOpen:n,onLoadLogsVolume:()=>i(s)})}renderTablePanel(e){const{exploreId:t,datasourceInstance:s,timeZone:i}=this.props;return(0,$.jsx)(As,{ariaLabel:y.wl.pages.Explore.General.table,width:e,exploreId:t,onCellFilterAdded:null!=s&&s.modifyQuery?this.onCellFilterAdded:void 0,timeZone:i})}renderLogsPanel(e){const{exploreId:t,syncedTimes:s,theme:i,queryResponse:o}=this.props,r=parseInt(i.spacing(2).slice(0,-2),10);return(0,$.jsx)(zt,{exploreId:t,loadingState:o.state,syncedTimes:s,width:e-r,onClickFilterLabel:this.onClickFilterLabel,onClickFilterOutLabel:this.onClickFilterOutLabel,onStartScanning:this.onStartScanning,onStopScanning:this.onStopScanning})}renderNodeGraphPanel(){const{exploreId:e,showTrace:t,queryResponse:s,datasourceInstance:i}=this.props,o=i?null==i?void 0:i.type:"unknown";return(0,$.jsx)(Qt,{dataFrames:this.memoizedGetNodeGraphDataFrames(s.series),exploreId:e,withTraceView:t,datasourceType:o})}renderTraceViewPanel(){const{queryResponse:e,splitOpen:t,exploreId:s}=this.props,i=e.series.filter((e=>{var t;return"trace"===(null===(t=e.meta)||void 0===t?void 0:t.preferredVisualisationType)}));return i.length&&(0,$.jsx)(Zs,{exploreId:s,dataFrames:i,splitOpenFn:t,scrollElement:this.scrollElement,queryResponse:e,topOfViewRef:this.topOfViewRef})}render(){const{datasourceInstance:e,datasourceMissing:t,exploreId:s,graphResult:i,queryResponse:o,isLive:r,theme:a,showMetrics:l,showTable:c,showLogs:d,showTrace:h,showNodeGraph:p,timeZone:u}=this.props,{openDrawer:g}=this.state,m=(e=>({exploreMain:w.css`
- label: exploreMain;
- // Is needed for some transition animations to work.
- position: relative;
- margin-top: 21px;
- `,button:w.css`
- label: button;
- margin: 1em 4px 0 0;
- `,queryContainer:w.css`
- label: queryContainer;
- // Need to override normal css class and don't want to count on ordering of the classes in html.
- height: auto !important;
- flex: unset !important;
- display: unset !important;
- padding: ${e.spacing(1)};
- `,exploreContainer:w.css`
- display: flex;
- flex: 1 1 auto;
- flex-direction: column;
- padding: ${e.spacing(2)};
- padding-top: 0;
- `}))(a),x=o&&o.state!==f.LoadingState.NotStarted,v=g===Gs.RichHistory,b=!(0,T.X)().queryHistoryAvailable,R=g===Gs.QueryInspector,j=o.state===f.LoadingState.Done&&[o.logsFrames,o.graphFrames,o.nodeGraphFrames,o.tableFrames,o.traceFrames].every((e=>0===e.length));return(0,$.jsxs)(n.CustomScrollbar,{testId:y.wl.pages.Explore.General.scrollView,autoHeightMin:"100%",scrollRefCallback:e=>this.scrollElement=e||void 0,children:[(0,$.jsx)(Ae,{exploreId:s,onChangeTime:this.onChangeTime,topOfViewRef:this.topOfViewRef}),t?this.renderEmptyState(m.exploreContainer):null,e&&(0,$.jsxs)("div",{className:(0,w.cx)(m.exploreContainer),children:[(0,$.jsxs)(n.PanelContainer,{className:m.queryContainer,children:[(0,$.jsx)(Yt,{exploreId:s}),(0,$.jsx)(Ns,{addQueryRowButtonDisabled:r,addQueryRowButtonHidden:!1,richHistoryRowButtonHidden:b,richHistoryButtonActive:v,queryInspectorButtonActive:R,onClickAddQueryRowButton:this.onClickAddQueryRowButton,onClickRichHistoryButton:this.toggleShowRichHistory,onClickQueryInspectorButton:this.toggleShowQueryInspector}),(0,$.jsx)(ts,{exploreId:s})]}),(0,$.jsx)(S.Z,{onResize:this.onResize,disableHeight:!0,children:e=>{let{width:t}=e;return 0===t?null:(0,$.jsx)("main",{className:(0,w.cx)(m.exploreMain),style:{width:t},children:(0,$.jsxs)(n.ErrorBoundaryAlert,{children:[x&&(0,$.jsxs)($.Fragment,{children:[l&&i&&(0,$.jsx)(n.ErrorBoundaryAlert,{children:this.renderGraphPanel(t)}),(0,$.jsx)(n.ErrorBoundaryAlert,{children:this.renderLogsVolume(t)}),c&&(0,$.jsx)(n.ErrorBoundaryAlert,{children:this.renderTablePanel(t)}),d&&(0,$.jsx)(n.ErrorBoundaryAlert,{children:this.renderLogsPanel(t)}),p&&(0,$.jsx)(n.ErrorBoundaryAlert,{children:this.renderNodeGraphPanel()}),h&&(0,$.jsx)(n.ErrorBoundaryAlert,{children:this.renderTraceViewPanel()}),j&&(0,$.jsx)(n.ErrorBoundaryAlert,{children:this.renderNoData()})]}),v&&(0,$.jsx)(Os,{width:t,exploreId:s,onClose:this.toggleShowRichHistory}),R&&(0,$.jsx)(ve,{exploreId:s,width:t,onClose:this.toggleShowQueryInspector,timeZone:u})]})})}})]})]})}}const Xs={changeSize:Vs.qN,changeGraphStyle:Vs.Rl,modifyQueries:p.sK,scanStart:p.EA,scanStopAction:p.P4,setQueries:p.KO,updateTimeRange:Ne.cD,makeAbsoluteTime:Ne.F9,loadLogsVolumeData:p.QH,addQueryRow:p.CS,splitOpen:h.bW},Js=(0,o.connect)((function(e,t){let{exploreId:s}=t;const i=e.explore,{syncedTimes:o}=i,r=i[s],n=(0,b.Z)(e.user),{datasourceInstance:a,datasourceMissing:l,queryKeys:c,isLive:d,graphResult:h,logsVolumeData:p,logsResult:u,showLogs:g,showMetrics:m,showTable:f,showTrace:y,absoluteRange:x,queryResponse:v,showNodeGraph:w,loading:S,graphStyle:R}=r;return{datasourceInstance:a,datasourceMissing:l,queryKeys:c,isLive:d,graphResult:h,logsVolumeData:p,logsResult:null!=u?u:void 0,absoluteRange:x,queryResponse:v,syncedTimes:o,timeZone:n,showLogs:g,showMetrics:m,showTable:f,showTrace:y,showNodeGraph:w,loading:S,graphStyle:R}}),Xs),ei=(0,R.compose)(Js,n.withTheme2)(Ys);function ti(e,t,s){return t in e?Object.defineProperty(e,t,{value:s,enumerable:!0,configurable:!0,writable:!0}):e[t]=s,e}class si extends i.PureComponent{constructor(e){super(e),ti(this,"el",void 0),ti(this,"exploreEvents",void 0),ti(this,"refreshExplore",(e=>{const{exploreId:t,urlQuery:s}=this.props;s!==e&&s!==h.IS[t]&&this.props.refreshExplore(t,s)})),ti(this,"getRef",(e=>{this.el=e})),this.exploreEvents=new f.EventBusSrv,this.state={openDrawer:void 0}}componentDidMount(){var e,t;const{initialized:s,exploreId:i,initialDatasource:o,initialQueries:r,initialRange:n,panelsState:a}=this.props,l=null!==(e=null===(t=this.el)||void 0===t?void 0:t.offsetWidth)&&void 0!==e?e:0;s||this.props.initializeExplore(i,o,r,n,l,this.exploreEvents,a)}componentWillUnmount(){this.exploreEvents.removeAllListeners(),this.props.cleanupPaneAction({exploreId:this.props.exploreId})}componentDidUpdate(e){this.refreshExplore(e.urlQuery)}render(){const e=this.props.split?"explore explore-split":"explore";return(0,$.jsx)("div",{className:e,ref:this.getRef,"data-testid":y.wl.pages.Explore.General.container,children:this.props.initialized&&(0,$.jsx)(ei,{exploreId:this.props.exploreId})})}}const ii=(0,m.Z)(v.Z8),oi=(0,m.Z)(v.vP);const ri={initializeExplore:Vs.CK,refreshExplore:Vs.Om,cleanupPaneAction:h.Jt},ni=(0,o.connect)((function(e,t){var s;const i=(0,v.J5)(t.urlQuery),o=(0,b.Z)(e.user),r=(0,b.i)(e.user),{datasource:n,queries:a,range:l,panelsState:c}=i||{},d=n||x.Z.get((0,v.I$)(e.user.orgId)),h=ii(a),p=l?oi(l,o,r):(0,v.OQ)(o,v.UI,r);return{initialized:null===(s=e.explore[t.exploreId])||void 0===s?void 0:s.initialized,initialDatasource:d,initialQueries:h,initialRange:p,panelsState:c}}),ri),ai=ni(si),li={resetExploreAction:h.WK,richHistoryUpdatedAction:h.ZU},ci=(0,o.connect)((e=>({navModel:(0,c.h)(e.navIndex,"explore"),exploreState:e.explore})),li);class di extends i.PureComponent{componentWillUnmount(){this.props.resetExploreAction({})}componentDidMount(){h.IS.left=void 0,h.IS.right=void 0;const e=r.locationService.getSearchObject();(e.from||e.to)&&r.locationService.partial({from:void 0,to:void 0},!0)}componentDidUpdate(e){var t,s,i,o;const{left:r,right:n}=this.props.queryParams,a=Boolean(r)&&Boolean(n)?`${null===(t=this.props.exploreState.left.datasourceInstance)||void 0===t?void 0:t.name} | ${null===(s=this.props.exploreState.right)||void 0===s||null===(i=s.datasourceInstance)||void 0===i?void 0:i.name}`:`${null===(o=this.props.exploreState.left.datasourceInstance)||void 0===o?void 0:o.name}`,c=`${this.props.navModel.main.text} - ${a} - ${l.c.AppTitle}`;document.title=c}render(){const{left:e,right:t}=this.props.queryParams,s=Boolean(e)&&Boolean(t);return(0,$.jsxs)("div",{className:"page-scrollbar-wrapper",children:[(0,$.jsx)(g,{exploreIdLeft:a.K.left,exploreIdRight:a.K.right}),(0,$.jsxs)("div",{className:"explore-wrapper",children:[(0,$.jsx)(n.ErrorBoundaryAlert,{style:"page",children:(0,$.jsx)(ai,{split:s,exploreId:a.K.left,urlQuery:e})}),s&&(0,$.jsx)(n.ErrorBoundaryAlert,{style:"page",children:(0,$.jsx)(ai,{split:s,exploreId:a.K.right,urlQuery:t})})]})]})}}const hi=ci(di)},16479:(e,t,s)=>{s.d(t,{F:()=>r,p:()=>o});var i=s(58170);const o=e=>Boolean(e.explore[i.Kd.left]&&e.explore[i.Kd.right]),r=e=>t=>t.explore[e]},20002:(e,t,s)=>{s.d(t,{Z:()=>o});var i=s(68404);function o(e){var t=(0,i.useRef)();return(0,i.useEffect)((function(){t.current=e})),t.current}},75973:(e,t,s)=>{function i(e){for(var t=arguments.length,s=Array(t>1?t-1:0),i=1;i<t;i++)s[i-1]=arguments[i];throw Error("[Immer] minified error nr: "+e+(s.length?" "+s.map((function(e){return"'"+e+"'"})).join(","):"")+". Find the full error at: https://bit.ly/3cXEKWf")}function o(e){return!!e&&!!e[Z]}function r(e){return!!e&&(function(e){if(!e||"object"!=typeof e)return!1;var t=Object.getPrototypeOf(e);if(null===t)return!0;var s=Object.hasOwnProperty.call(t,"constructor")&&t.constructor;return s===Object||"function"==typeof s&&Function.toString.call(s)===Q}(e)||Array.isArray(e)||!!e[W]||!!e.constructor[W]||p(e)||u(e))}function n(e,t,s){void 0===s&&(s=!1),0===a(e)?(s?Object.keys:U)(e).forEach((function(i){s&&"symbol"==typeof i||t(i,e[i],e)})):e.forEach((function(s,i){return t(i,s,e)}))}function a(e){var t=e[Z];return t?t.i>3?t.i-4:t.i:Array.isArray(e)?1:p(e)?2:u(e)?3:0}function l(e,t){return 2===a(e)?e.has(t):Object.prototype.hasOwnProperty.call(e,t)}function c(e,t){return 2===a(e)?e.get(t):e[t]}function d(e,t,s){var i=a(e);2===i?e.set(t,s):3===i?(e.delete(t),e.add(s)):e[t]=s}function h(e,t){return e===t?0!==e||1/e==1/t:e!=e&&t!=t}function p(e){return M&&e instanceof Map}function u(e){return B&&e instanceof Set}function g(e){return e.o||e.t}function m(e){if(Array.isArray(e))return Array.prototype.slice.call(e);var t=V(e);delete t[Z];for(var s=U(t),i=0;i<s.length;i++){var o=s[i],r=t[o];!1===r.writable&&(r.writable=!0,r.configurable=!0),(r.get||r.set)&&(t[o]={configurable:!0,writable:!0,enumerable:r.enumerable,value:e[o]})}return Object.create(Object.getPrototypeOf(e),t)}function f(e,t){return void 0===t&&(t=!1),x(e)||o(e)||!r(e)||(a(e)>1&&(e.set=e.add=e.clear=e.delete=y),Object.freeze(e),t&&n(e,(function(e,t){return f(t,!0)}),!0)),e}function y(){i(2)}function x(e){return null==e||"object"!=typeof e||Object.isFrozen(e)}function v(e){var t=K[e];return t||i(18,e),t}function b(){return P}function w(e,t){t&&(v("Patches"),e.u=[],e.s=[],e.v=t)}function S(e){R(e),e.p.forEach(C),e.p=null}function R(e){e===P&&(P=e.l)}function j(e){return P={p:[],l:P,h:e,m:!0,_:0}}function C(e){var t=e[Z];0===t.i||1===t.i?t.j():t.O=!0}function T(e,t){t._=t.p.length;var s=t.p[0],o=void 0!==e&&e!==s;return t.h.g||v("ES5").S(t,e,o),o?(s[Z].P&&(S(t),i(4)),r(e)&&(e=I(t,e),t.l||k(t,e)),t.u&&v("Patches").M(s[Z].t,e,t.u,t.s)):e=I(t,s,[]),S(t),t.u&&t.v(t.u,t.s),e!==_?e:void 0}function I(e,t,s){if(x(t))return t;var i=t[Z];if(!i)return n(t,(function(o,r){return z(e,i,t,o,r,s)}),!0),t;if(i.A!==e)return t;if(!i.P)return k(e,i.t,!0),i.t;if(!i.I){i.I=!0,i.A._--;var o=4===i.i||5===i.i?i.o=m(i.k):i.o;n(3===i.i?new Set(o):o,(function(t,r){return z(e,i,o,t,r,s)})),k(e,o,!1),s&&e.u&&v("Patches").R(i,s,e.u,e.s)}return i.o}function z(e,t,s,i,n,a){if(o(n)){var c=I(e,n,a&&t&&3!==t.i&&!l(t.D,i)?a.concat(i):void 0);if(d(s,i,c),!o(c))return;e.m=!1}if(r(n)&&!x(n)){if(!e.h.F&&e._<1)return;I(e,n),t&&t.A.l||k(e,n)}}function k(e,t,s){void 0===s&&(s=!1),e.h.F&&e.m&&f(t,s)}function F(e,t){var s=e[Z];return(s?g(s):e)[t]}function L(e,t){if(t in e)for(var s=Object.getPrototypeOf(e);s;){var i=Object.getOwnPropertyDescriptor(s,t);if(i)return i;s=Object.getPrototypeOf(s)}}function O(e){e.P||(e.P=!0,e.l&&O(e.l))}function N(e){e.o||(e.o=m(e.t))}function D(e,t,s){var i=p(t)?v("MapSet").N(t,s):u(t)?v("MapSet").T(t,s):e.g?function(e,t){var s=Array.isArray(e),i={i:s?1:0,A:t?t.A:b(),P:!1,I:!1,D:{},l:t,t:e,k:null,o:null,j:null,C:!1},o=i,r=G;s&&(o=[i],r=Y);var n=Proxy.revocable(o,r),a=n.revoke,l=n.proxy;return i.k=l,i.j=a,l}(t,s):v("ES5").J(t,s);return(s?s.A:b()).p.push(i),i}function $(e){return o(e)||i(22,e),function e(t){if(!r(t))return t;var s,i=t[Z],o=a(t);if(i){if(!i.P&&(i.i<4||!v("ES5").K(i)))return i.t;i.I=!0,s=E(t,o),i.I=!1}else s=E(t,o);return n(s,(function(t,o){i&&c(i.t,t)===o||d(s,t,e(o))})),3===o?new Set(s):s}(e)}function E(e,t){switch(t){case 2:return new Map(e);case 3:return Array.from(e)}return m(e)}s.d(t,{ZP:()=>te});var H,P,A="undefined"!=typeof Symbol&&"symbol"==typeof Symbol("x"),M="undefined"!=typeof Map,B="undefined"!=typeof Set,q="undefined"!=typeof Proxy&&void 0!==Proxy.revocable&&"undefined"!=typeof Reflect,_=A?Symbol.for("immer-nothing"):((H={})["immer-nothing"]=!0,H),W=A?Symbol.for("immer-draftable"):"__$immer_draftable",Z=A?Symbol.for("immer-state"):"__$immer_state",Q=("undefined"!=typeof Symbol&&Symbol.iterator,""+Object.prototype.constructor),U="undefined"!=typeof Reflect&&Reflect.ownKeys?Reflect.ownKeys:void 0!==Object.getOwnPropertySymbols?function(e){return Object.getOwnPropertyNames(e).concat(Object.getOwnPropertySymbols(e))}:Object.getOwnPropertyNames,V=Object.getOwnPropertyDescriptors||function(e){var t={};return U(e).forEach((function(s){t[s]=Object.getOwnPropertyDescriptor(e,s)})),t},K={},G={get:function(e,t){if(t===Z)return e;var s=g(e);if(!l(s,t))return function(e,t,s){var i,o=L(t,s);return o?"value"in o?o.value:null===(i=o.get)||void 0===i?void 0:i.call(e.k):void 0}(e,s,t);var i=s[t];return e.I||!r(i)?i:i===F(e.t,t)?(N(e),e.o[t]=D(e.A.h,i,e)):i},has:function(e,t){return t in g(e)},ownKeys:function(e){return Reflect.ownKeys(g(e))},set:function(e,t,s){var i=L(g(e),t);if(null==i?void 0:i.set)return i.set.call(e.k,s),!0;if(!e.P){var o=F(g(e),t),r=null==o?void 0:o[Z];if(r&&r.t===s)return e.o[t]=s,e.D[t]=!1,!0;if(h(s,o)&&(void 0!==s||l(e.t,t)))return!0;N(e),O(e)}return e.o[t]===s&&"number"!=typeof s&&(void 0!==s||t in e.o)||(e.o[t]=s,e.D[t]=!0,!0)},deleteProperty:function(e,t){return void 0!==F(e.t,t)||t in e.t?(e.D[t]=!1,N(e),O(e)):delete e.D[t],e.o&&delete e.o[t],!0},getOwnPropertyDescriptor:function(e,t){var s=g(e),i=Reflect.getOwnPropertyDescriptor(s,t);return i?{writable:!0,configurable:1!==e.i||"length"!==t,enumerable:i.enumerable,value:s[t]}:i},defineProperty:function(){i(11)},getPrototypeOf:function(e){return Object.getPrototypeOf(e.t)},setPrototypeOf:function(){i(12)}},Y={};n(G,(function(e,t){Y[e]=function(){return arguments[0]=arguments[0][0],t.apply(this,arguments)}})),Y.deleteProperty=function(e,t){return Y.set.call(this,e,t,void 0)},Y.set=function(e,t,s){return G.set.call(this,e[0],t,s,e[0])};var X=function(){function e(e){var t=this;this.g=q,this.F=!0,this.produce=function(e,s,o){if("function"==typeof e&&"function"!=typeof s){var n=s;s=e;var a=t;return function(e){var t=this;void 0===e&&(e=n);for(var i=arguments.length,o=Array(i>1?i-1:0),r=1;r<i;r++)o[r-1]=arguments[r];return a.produce(e,(function(e){var i;return(i=s).call.apply(i,[t,e].concat(o))}))}}var l;if("function"!=typeof s&&i(6),void 0!==o&&"function"!=typeof o&&i(7),r(e)){var c=j(t),d=D(t,e,void 0),h=!0;try{l=s(d),h=!1}finally{h?S(c):R(c)}return"undefined"!=typeof Promise&&l instanceof Promise?l.then((function(e){return w(c,o),T(e,c)}),(function(e){throw S(c),e})):(w(c,o),T(l,c))}if(!e||"object"!=typeof e){if(void 0===(l=s(e))&&(l=e),l===_&&(l=void 0),t.F&&f(l,!0),o){var p=[],u=[];v("Patches").M(e,l,p,u),o(p,u)}return l}i(21,e)},this.produceWithPatches=function(e,s){if("function"==typeof e)return function(s){for(var i=arguments.length,o=Array(i>1?i-1:0),r=1;r<i;r++)o[r-1]=arguments[r];return t.produceWithPatches(s,(function(t){return e.apply(void 0,[t].concat(o))}))};var i,o,r=t.produce(e,s,(function(e,t){i=e,o=t}));return"undefined"!=typeof Promise&&r instanceof Promise?r.then((function(e){return[e,i,o]})):[r,i,o]},"boolean"==typeof(null==e?void 0:e.useProxies)&&this.setUseProxies(e.useProxies),"boolean"==typeof(null==e?void 0:e.autoFreeze)&&this.setAutoFreeze(e.autoFreeze)}var t=e.prototype;return t.createDraft=function(e){r(e)||i(8),o(e)&&(e=$(e));var t=j(this),s=D(this,e,void 0);return s[Z].C=!0,R(t),s},t.finishDraft=function(e,t){var s=(e&&e[Z]).A;return w(s,t),T(void 0,s)},t.setAutoFreeze=function(e){this.F=e},t.setUseProxies=function(e){e&&!q&&i(20),this.g=e},t.applyPatches=function(e,t){var s;for(s=t.length-1;s>=0;s--){var i=t[s];if(0===i.path.length&&"replace"===i.op){e=i.value;break}}s>-1&&(t=t.slice(s+1));var r=v("Patches").$;return o(e)?r(e,t):this.produce(e,(function(e){return r(e,t)}))},e}(),J=new X,ee=J.produce;J.produceWithPatches.bind(J),J.setAutoFreeze.bind(J),J.setUseProxies.bind(J),J.applyPatches.bind(J),J.createDraft.bind(J),J.finishDraft.bind(J);const te=ee}}]);
- //# sourceMappingURL=explore.e4eaed23335c5562b9d9.js.map
|