mirror of
https://github.com/VictoriaMetrics/VictoriaMetrics.git
synced 2025-01-19 23:09:18 +01:00
vmui: migration MUI Core v4 to v5 (#1795)
* migration MUI Core v4 to v5 * app/vmui: `make vmui-update` Co-authored-by: Aliaksandr Valialkin <valyala@victoriametrics.com>
This commit is contained in:
Yury Molodov
GitHub
parent
fd596945e7
commit
b78ab88a1c
@ -1,19 +1,19 @@
|
|||||||
{
|
{
|
||||||
"files": {
|
"files": {
|
||||||
"main.css": "./static/css/main.23671ff2.chunk.css",
|
"main.css": "./static/css/main.674f8c98.chunk.css",
|
||||||
"main.js": "./static/js/main.3039190d.chunk.js",
|
"main.js": "./static/js/main.9d24c3b2.chunk.js",
|
||||||
"runtime-main.js": "./static/js/runtime-main.3e786f5f.js",
|
"runtime-main.js": "./static/js/runtime-main.c0002ac8.js",
|
||||||
"static/css/2.81b2a0ac.chunk.css": "./static/css/2.81b2a0ac.chunk.css",
|
"static/css/2.81b2a0ac.chunk.css": "./static/css/2.81b2a0ac.chunk.css",
|
||||||
"static/js/2.a835ef7b.chunk.js": "./static/js/2.a835ef7b.chunk.js",
|
"static/js/2.8fa069e1.chunk.js": "./static/js/2.8fa069e1.chunk.js",
|
||||||
"static/js/3.b7e923a6.chunk.js": "./static/js/3.b7e923a6.chunk.js",
|
"static/js/3.0dc73915.chunk.js": "./static/js/3.0dc73915.chunk.js",
|
||||||
"index.html": "./index.html",
|
"index.html": "./index.html",
|
||||||
"static/js/2.a835ef7b.chunk.js.LICENSE.txt": "./static/js/2.a835ef7b.chunk.js.LICENSE.txt"
|
"static/js/2.8fa069e1.chunk.js.LICENSE.txt": "./static/js/2.8fa069e1.chunk.js.LICENSE.txt"
|
||||||
},
|
},
|
||||||
"entrypoints": [
|
"entrypoints": [
|
||||||
"static/js/runtime-main.3e786f5f.js",
|
"static/js/runtime-main.c0002ac8.js",
|
||||||
"static/css/2.81b2a0ac.chunk.css",
|
"static/css/2.81b2a0ac.chunk.css",
|
||||||
"static/js/2.a835ef7b.chunk.js",
|
"static/js/2.8fa069e1.chunk.js",
|
||||||
"static/css/main.23671ff2.chunk.css",
|
"static/css/main.674f8c98.chunk.css",
|
||||||
"static/js/main.3039190d.chunk.js"
|
"static/js/main.9d24c3b2.chunk.js"
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
@ -1 +1 @@
|
|||||||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="VM-UI is a metric explorer for Victoria Metrics"/><link rel="apple-touch-icon" href="./apple-touch-icon.png"/><link rel="icon" type="image/png" sizes="32x32" href="./favicon-32x32.png"><link rel="manifest" href="./manifest.json"/><title>VM UI</title><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"/><link href="./static/css/2.81b2a0ac.chunk.css" rel="stylesheet"><link href="./static/css/main.23671ff2.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function r(r){for(var n,i,a=r[0],c=r[1],l=r[2],s=0,p=[];s<a.length;s++)i=a[s],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&p.push(o[i][0]),o[i]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(f&&f(r);p.length;)p.shift()();return u.push.apply(u,l||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,a=1;a<t.length;a++){var c=t[a];0!==o[c]&&(n=!1)}n&&(u.splice(r--,1),e=i(i.s=t[0]))}return e}var n={},o={1:0},u=[];function i(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,i),t.l=!0,t.exports}i.e=function(e){var r=[],t=o[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=o[e]=[r,n]}));r.push(t[2]=n);var u,a=document.createElement("script");a.charset="utf-8",a.timeout=120,i.nc&&a.setAttribute("nonce",i.nc),a.src=function(e){return i.p+"static/js/"+({}[e]||e)+"."+{3:"b7e923a6"}[e]+".chunk.js"}(e);var c=new Error;u=function(r){a.onerror=a.onload=null,clearTimeout(l);var t=o[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),u=r&&r.target&&r.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,t[1](c)}o[e]=void 0}};var l=setTimeout((function(){u({type:"timeout",target:a})}),12e4);a.onerror=a.onload=u,document.head.appendChild(a)}return Promise.all(r)},i.m=e,i.c=n,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,r){if(1&r&&(e=i(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)i.d(t,n,function(r){return e[r]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="./",i.oe=function(e){throw console.error(e),e};var a=this.webpackJsonpvmui=this.webpackJsonpvmui||[],c=a.push.bind(a);a.push=r,a=a.slice();for(var l=0;l<a.length;l++)r(a[l]);var f=c;t()}([])</script><script src="./static/js/2.a835ef7b.chunk.js"></script><script src="./static/js/main.3039190d.chunk.js"></script></body></html>
|
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="VM-UI is a metric explorer for Victoria Metrics"/><link rel="apple-touch-icon" href="./apple-touch-icon.png"/><link rel="icon" type="image/png" sizes="32x32" href="./favicon-32x32.png"><link rel="manifest" href="./manifest.json"/><title>VM UI</title><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"/><link href="./static/css/2.81b2a0ac.chunk.css" rel="stylesheet"><link href="./static/css/main.674f8c98.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function r(r){for(var n,i,a=r[0],c=r[1],l=r[2],s=0,p=[];s<a.length;s++)i=a[s],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&p.push(o[i][0]),o[i]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(f&&f(r);p.length;)p.shift()();return u.push.apply(u,l||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,a=1;a<t.length;a++){var c=t[a];0!==o[c]&&(n=!1)}n&&(u.splice(r--,1),e=i(i.s=t[0]))}return e}var n={},o={1:0},u=[];function i(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,i),t.l=!0,t.exports}i.e=function(e){var r=[],t=o[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=o[e]=[r,n]}));r.push(t[2]=n);var u,a=document.createElement("script");a.charset="utf-8",a.timeout=120,i.nc&&a.setAttribute("nonce",i.nc),a.src=function(e){return i.p+"static/js/"+({}[e]||e)+"."+{3:"0dc73915"}[e]+".chunk.js"}(e);var c=new Error;u=function(r){a.onerror=a.onload=null,clearTimeout(l);var t=o[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),u=r&&r.target&&r.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,t[1](c)}o[e]=void 0}};var l=setTimeout((function(){u({type:"timeout",target:a})}),12e4);a.onerror=a.onload=u,document.head.appendChild(a)}return Promise.all(r)},i.m=e,i.c=n,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,r){if(1&r&&(e=i(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)i.d(t,n,function(r){return e[r]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="./",i.oe=function(e){throw console.error(e),e};var a=this.webpackJsonpvmui=this.webpackJsonpvmui||[],c=a.push.bind(a);a.push=r,a=a.slice();for(var l=0;l<a.length;l++)r(a[l]);var f=c;t()}([])</script><script src="./static/js/2.8fa069e1.chunk.js"></script><script src="./static/js/main.9d24c3b2.chunk.js"></script></body></html>
|
||||||
@ -1 +1 @@
|
|||||||
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}.MuiAccordionSummary-content{margin:10px 0!important}.cm-activeLine{background-color:inherit!important}.cm-editor{border-radius:4px;border:1px solid #b9b9b9;font-size:10px}.one-line-scroll .cm-editor{height:24px}.cm-gutters{border-radius:4px 0 0 4px;height:100%}.multi-line-scroll .cm-content,.multi-line-scroll .cm-gutters{min-height:51px!important}.one-line-scroll .cm-content,.one-line-scroll .cm-gutters{min-height:auto}.u-tooltip{position:absolute;display:none;grid-gap:12px;max-width:300px;padding:8px;border-radius:4px;background:rgba(57,57,57,.9);color:#fff;font-size:10px;line-height:1.4em;font-weight:500;word-wrap:break-word;font-family:monospace;pointer-events:none;z-index:100}.u-tooltip-data{display:flex;flex-wrap:wrap;align-items:center;font-size:11px;line-height:150%}.u-tooltip-data__value{padding:4px;font-weight:700}.u-tooltip__info{display:grid;grid-gap:4px}.u-tooltip__marker{width:12px;height:12px;margin-right:4px}.legendWrapper{margin-top:20px}.legendItem{display:inline-grid;grid-template-columns:auto auto;grid-gap:4px;align-items:center;justify-content:start;padding:5px 10px;background-color:#fff;cursor:pointer;transition:.2s ease}.legendItemHide{text-decoration:line-through;opacity:.5}.legendItem:hover{background-color:rgba(0,0,0,.1)}.legendMarker{width:12px;height:12px;border-width:2px;border-style:solid;box-sizing:border-box;transition:.2s ease}.legendLabel{font-size:12px;font-weight:600}
|
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}.MuiAccordionSummary-content{margin:10px 0!important}.cm-activeLine{background-color:inherit!important}.cm-editor{border-radius:4px;border:1px solid #b9b9b9;font-size:10px}.one-line-scroll .cm-editor{height:24px}.cm-gutters{border-radius:4px 0 0 4px;height:100%}.multi-line-scroll .cm-content,.multi-line-scroll .cm-gutters{min-height:64px!important}.one-line-scroll .cm-content,.one-line-scroll .cm-gutters{min-height:auto}.u-tooltip{position:absolute;display:none;grid-gap:12px;max-width:300px;padding:8px;border-radius:4px;background:rgba(57,57,57,.9);color:#fff;font-size:10px;line-height:1.4em;font-weight:500;word-wrap:break-word;font-family:monospace;pointer-events:none;z-index:100}.u-tooltip-data{display:flex;flex-wrap:wrap;align-items:center;font-size:11px;line-height:150%}.u-tooltip-data__value{padding:4px;font-weight:700}.u-tooltip__info{display:grid;grid-gap:4px}.u-tooltip__marker{width:12px;height:12px;margin-right:4px}.legendWrapper{margin-top:20px}.legendItem{display:inline-grid;grid-template-columns:auto auto;grid-gap:4px;align-items:center;justify-content:start;padding:5px 10px;background-color:#fff;cursor:pointer;transition:.2s ease}.legendItemHide{text-decoration:line-through;opacity:.5}.legendItem:hover{background-color:rgba(0,0,0,.1)}.legendMarker{width:12px;height:12px;border-width:2px;border-style:solid;box-sizing:border-box;transition:.2s ease}.legendLabel{font-size:12px;font-weight:600}
|
||||||
2
app/vmselect/vmui/static/js/2.8fa069e1.chunk.js
Normal file
2
app/vmselect/vmui/static/js/2.8fa069e1.chunk.js
Normal file
File diff suppressed because one or more lines are too long
@ -48,6 +48,12 @@ object-assign
|
|||||||
* @license MIT
|
* @license MIT
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
/** @license MUI v5.0.2
|
||||||
|
*
|
||||||
|
* This source code is licensed under the MIT license found in the
|
||||||
|
* LICENSE file in the root directory of this source tree.
|
||||||
|
*/
|
||||||
|
|
||||||
/** @license React v0.20.2
|
/** @license React v0.20.2
|
||||||
* scheduler.production.min.js
|
* scheduler.production.min.js
|
||||||
*
|
*
|
||||||
@ -101,28 +107,3 @@ object-assign
|
|||||||
* This source code is licensed under the MIT license found in the
|
* This source code is licensed under the MIT license found in the
|
||||||
* LICENSE file in the root directory of this source tree.
|
* LICENSE file in the root directory of this source tree.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/**!
|
|
||||||
* @fileOverview Kickass library to create and place poppers near their reference elements.
|
|
||||||
* @version 1.16.1-lts
|
|
||||||
* @license
|
|
||||||
* Copyright (c) 2016 Federico Zivolo and contributors
|
|
||||||
*
|
|
||||||
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
||||||
* of this software and associated documentation files (the "Software"), to deal
|
|
||||||
* in the Software without restriction, including without limitation the rights
|
|
||||||
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
||||||
* copies of the Software, and to permit persons to whom the Software is
|
|
||||||
* furnished to do so, subject to the following conditions:
|
|
||||||
*
|
|
||||||
* The above copyright notice and this permission notice shall be included in all
|
|
||||||
* copies or substantial portions of the Software.
|
|
||||||
*
|
|
||||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
||||||
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
||||||
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
||||||
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
||||||
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
||||||
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
||||||
* SOFTWARE.
|
|
||||||
*/
|
|
||||||
File diff suppressed because one or more lines are too long
@ -1 +1 @@
|
|||||||
(this.webpackJsonpvmui=this.webpackJsonpvmui||[]).push([[3],{288:function(e,t,n){"use strict";n.r(t),n.d(t,"getCLS",(function(){return y})),n.d(t,"getFCP",(function(){return g})),n.d(t,"getFID",(function(){return C})),n.d(t,"getLCP",(function(){return k})),n.d(t,"getTTFB",(function(){return D}));var i,r,a,o,u=function(e,t){return{name:e,value:void 0===t?-1:t,delta:0,entries:[],id:"v2-".concat(Date.now(),"-").concat(Math.floor(8999999999999*Math.random())+1e12)}},c=function(e,t){try{if(PerformanceObserver.supportedEntryTypes.includes(e)){if("first-input"===e&&!("PerformanceEventTiming"in self))return;var n=new PerformanceObserver((function(e){return e.getEntries().map(t)}));return n.observe({type:e,buffered:!0}),n}}catch(e){}},f=function(e,t){var n=function n(i){"pagehide"!==i.type&&"hidden"!==document.visibilityState||(e(i),t&&(removeEventListener("visibilitychange",n,!0),removeEventListener("pagehide",n,!0)))};addEventListener("visibilitychange",n,!0),addEventListener("pagehide",n,!0)},s=function(e){addEventListener("pageshow",(function(t){t.persisted&&e(t)}),!0)},m=function(e,t,n){var i;return function(r){t.value>=0&&(r||n)&&(t.delta=t.value-(i||0),(t.delta||void 0===i)&&(i=t.value,e(t)))}},v=-1,p=function(){return"hidden"===document.visibilityState?0:1/0},d=function(){f((function(e){var t=e.timeStamp;v=t}),!0)},l=function(){return v<0&&(v=p(),d(),s((function(){setTimeout((function(){v=p(),d()}),0)}))),{get firstHiddenTime(){return v}}},g=function(e,t){var n,i=l(),r=u("FCP"),a=function(e){"first-contentful-paint"===e.name&&(f&&f.disconnect(),e.startTime<i.firstHiddenTime&&(r.value=e.startTime,r.entries.push(e),n(!0)))},o=window.performance&&performance.getEntriesByName&&performance.getEntriesByName("first-contentful-paint")[0],f=o?null:c("paint",a);(o||f)&&(n=m(e,r,t),o&&a(o),s((function(i){r=u("FCP"),n=m(e,r,t),requestAnimationFrame((function(){requestAnimationFrame((function(){r.value=performance.now()-i.timeStamp,n(!0)}))}))})))},h=!1,T=-1,y=function(e,t){h||(g((function(e){T=e.value})),h=!0);var n,i=function(t){T>-1&&e(t)},r=u("CLS",0),a=0,o=[],v=function(e){if(!e.hadRecentInput){var t=o[0],i=o[o.length-1];a&&e.startTime-i.startTime<1e3&&e.startTime-t.startTime<5e3?(a+=e.value,o.push(e)):(a=e.value,o=[e]),a>r.value&&(r.value=a,r.entries=o,n())}},p=c("layout-shift",v);p&&(n=m(i,r,t),f((function(){p.takeRecords().map(v),n(!0)})),s((function(){a=0,T=-1,r=u("CLS",0),n=m(i,r,t)})))},E={passive:!0,capture:!0},w=new Date,L=function(e,t){i||(i=t,r=e,a=new Date,F(removeEventListener),S())},S=function(){if(r>=0&&r<a-w){var e={entryType:"first-input",name:i.type,target:i.target,cancelable:i.cancelable,startTime:i.timeStamp,processingStart:i.timeStamp+r};o.forEach((function(t){t(e)})),o=[]}},b=function(e){if(e.cancelable){var t=(e.timeStamp>1e12?new Date:performance.now())-e.timeStamp;"pointerdown"==e.type?function(e,t){var n=function(){L(e,t),r()},i=function(){r()},r=function(){removeEventListener("pointerup",n,E),removeEventListener("pointercancel",i,E)};addEventListener("pointerup",n,E),addEventListener("pointercancel",i,E)}(t,e):L(t,e)}},F=function(e){["mousedown","keydown","touchstart","pointerdown"].forEach((function(t){return e(t,b,E)}))},C=function(e,t){var n,a=l(),v=u("FID"),p=function(e){e.startTime<a.firstHiddenTime&&(v.value=e.processingStart-e.startTime,v.entries.push(e),n(!0))},d=c("first-input",p);n=m(e,v,t),d&&f((function(){d.takeRecords().map(p),d.disconnect()}),!0),d&&s((function(){var a;v=u("FID"),n=m(e,v,t),o=[],r=-1,i=null,F(addEventListener),a=p,o.push(a),S()}))},P={},k=function(e,t){var n,i=l(),r=u("LCP"),a=function(e){var t=e.startTime;t<i.firstHiddenTime&&(r.value=t,r.entries.push(e)),n()},o=c("largest-contentful-paint",a);if(o){n=m(e,r,t);var v=function(){P[r.id]||(o.takeRecords().map(a),o.disconnect(),P[r.id]=!0,n(!0))};["keydown","click"].forEach((function(e){addEventListener(e,v,{once:!0,capture:!0})})),f(v,!0),s((function(i){r=u("LCP"),n=m(e,r,t),requestAnimationFrame((function(){requestAnimationFrame((function(){r.value=performance.now()-i.timeStamp,P[r.id]=!0,n(!0)}))}))}))}},D=function(e){var t,n=u("TTFB");t=function(){try{var t=performance.getEntriesByType("navigation")[0]||function(){var e=performance.timing,t={entryType:"navigation",startTime:0};for(var n in e)"navigationStart"!==n&&"toJSON"!==n&&(t[n]=Math.max(e[n]-e.navigationStart,0));return t}();if(n.value=n.delta=t.responseStart,n.value<0||n.value>performance.now())return;n.entries=[t],e(n)}catch(e){}},"complete"===document.readyState?setTimeout(t,0):addEventListener("pageshow",t)}}}]);
|
(this.webpackJsonpvmui=this.webpackJsonpvmui||[]).push([[3],{341:function(e,t,n){"use strict";n.r(t),n.d(t,"getCLS",(function(){return y})),n.d(t,"getFCP",(function(){return g})),n.d(t,"getFID",(function(){return C})),n.d(t,"getLCP",(function(){return k})),n.d(t,"getTTFB",(function(){return D}));var i,r,a,o,u=function(e,t){return{name:e,value:void 0===t?-1:t,delta:0,entries:[],id:"v2-".concat(Date.now(),"-").concat(Math.floor(8999999999999*Math.random())+1e12)}},c=function(e,t){try{if(PerformanceObserver.supportedEntryTypes.includes(e)){if("first-input"===e&&!("PerformanceEventTiming"in self))return;var n=new PerformanceObserver((function(e){return e.getEntries().map(t)}));return n.observe({type:e,buffered:!0}),n}}catch(e){}},f=function(e,t){var n=function n(i){"pagehide"!==i.type&&"hidden"!==document.visibilityState||(e(i),t&&(removeEventListener("visibilitychange",n,!0),removeEventListener("pagehide",n,!0)))};addEventListener("visibilitychange",n,!0),addEventListener("pagehide",n,!0)},s=function(e){addEventListener("pageshow",(function(t){t.persisted&&e(t)}),!0)},m=function(e,t,n){var i;return function(r){t.value>=0&&(r||n)&&(t.delta=t.value-(i||0),(t.delta||void 0===i)&&(i=t.value,e(t)))}},v=-1,p=function(){return"hidden"===document.visibilityState?0:1/0},d=function(){f((function(e){var t=e.timeStamp;v=t}),!0)},l=function(){return v<0&&(v=p(),d(),s((function(){setTimeout((function(){v=p(),d()}),0)}))),{get firstHiddenTime(){return v}}},g=function(e,t){var n,i=l(),r=u("FCP"),a=function(e){"first-contentful-paint"===e.name&&(f&&f.disconnect(),e.startTime<i.firstHiddenTime&&(r.value=e.startTime,r.entries.push(e),n(!0)))},o=window.performance&&performance.getEntriesByName&&performance.getEntriesByName("first-contentful-paint")[0],f=o?null:c("paint",a);(o||f)&&(n=m(e,r,t),o&&a(o),s((function(i){r=u("FCP"),n=m(e,r,t),requestAnimationFrame((function(){requestAnimationFrame((function(){r.value=performance.now()-i.timeStamp,n(!0)}))}))})))},h=!1,T=-1,y=function(e,t){h||(g((function(e){T=e.value})),h=!0);var n,i=function(t){T>-1&&e(t)},r=u("CLS",0),a=0,o=[],v=function(e){if(!e.hadRecentInput){var t=o[0],i=o[o.length-1];a&&e.startTime-i.startTime<1e3&&e.startTime-t.startTime<5e3?(a+=e.value,o.push(e)):(a=e.value,o=[e]),a>r.value&&(r.value=a,r.entries=o,n())}},p=c("layout-shift",v);p&&(n=m(i,r,t),f((function(){p.takeRecords().map(v),n(!0)})),s((function(){a=0,T=-1,r=u("CLS",0),n=m(i,r,t)})))},E={passive:!0,capture:!0},w=new Date,L=function(e,t){i||(i=t,r=e,a=new Date,F(removeEventListener),S())},S=function(){if(r>=0&&r<a-w){var e={entryType:"first-input",name:i.type,target:i.target,cancelable:i.cancelable,startTime:i.timeStamp,processingStart:i.timeStamp+r};o.forEach((function(t){t(e)})),o=[]}},b=function(e){if(e.cancelable){var t=(e.timeStamp>1e12?new Date:performance.now())-e.timeStamp;"pointerdown"==e.type?function(e,t){var n=function(){L(e,t),r()},i=function(){r()},r=function(){removeEventListener("pointerup",n,E),removeEventListener("pointercancel",i,E)};addEventListener("pointerup",n,E),addEventListener("pointercancel",i,E)}(t,e):L(t,e)}},F=function(e){["mousedown","keydown","touchstart","pointerdown"].forEach((function(t){return e(t,b,E)}))},C=function(e,t){var n,a=l(),v=u("FID"),p=function(e){e.startTime<a.firstHiddenTime&&(v.value=e.processingStart-e.startTime,v.entries.push(e),n(!0))},d=c("first-input",p);n=m(e,v,t),d&&f((function(){d.takeRecords().map(p),d.disconnect()}),!0),d&&s((function(){var a;v=u("FID"),n=m(e,v,t),o=[],r=-1,i=null,F(addEventListener),a=p,o.push(a),S()}))},P={},k=function(e,t){var n,i=l(),r=u("LCP"),a=function(e){var t=e.startTime;t<i.firstHiddenTime&&(r.value=t,r.entries.push(e)),n()},o=c("largest-contentful-paint",a);if(o){n=m(e,r,t);var v=function(){P[r.id]||(o.takeRecords().map(a),o.disconnect(),P[r.id]=!0,n(!0))};["keydown","click"].forEach((function(e){addEventListener(e,v,{once:!0,capture:!0})})),f(v,!0),s((function(i){r=u("LCP"),n=m(e,r,t),requestAnimationFrame((function(){requestAnimationFrame((function(){r.value=performance.now()-i.timeStamp,P[r.id]=!0,n(!0)}))}))}))}},D=function(e){var t,n=u("TTFB");t=function(){try{var t=performance.getEntriesByType("navigation")[0]||function(){var e=performance.timing,t={entryType:"navigation",startTime:0};for(var n in e)"navigationStart"!==n&&"toJSON"!==n&&(t[n]=Math.max(e[n]-e.navigationStart,0));return t}();if(n.value=n.delta=t.responseStart,n.value<0||n.value>performance.now())return;n.entries=[t],e(n)}catch(e){}},"complete"===document.readyState?setTimeout(t,0):addEventListener("pageshow",t)}}}]);
|
||||||
File diff suppressed because one or more lines are too long
1
app/vmselect/vmui/static/js/main.9d24c3b2.chunk.js
Normal file
1
app/vmselect/vmui/static/js/main.9d24c3b2.chunk.js
Normal file
File diff suppressed because one or more lines are too long
@ -1 +1 @@
|
|||||||
!function(e){function r(r){for(var n,i,a=r[0],c=r[1],l=r[2],s=0,p=[];s<a.length;s++)i=a[s],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&p.push(o[i][0]),o[i]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(f&&f(r);p.length;)p.shift()();return u.push.apply(u,l||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,a=1;a<t.length;a++){var c=t[a];0!==o[c]&&(n=!1)}n&&(u.splice(r--,1),e=i(i.s=t[0]))}return e}var n={},o={1:0},u=[];function i(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,i),t.l=!0,t.exports}i.e=function(e){var r=[],t=o[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=o[e]=[r,n]}));r.push(t[2]=n);var u,a=document.createElement("script");a.charset="utf-8",a.timeout=120,i.nc&&a.setAttribute("nonce",i.nc),a.src=function(e){return i.p+"static/js/"+({}[e]||e)+"."+{3:"b7e923a6"}[e]+".chunk.js"}(e);var c=new Error;u=function(r){a.onerror=a.onload=null,clearTimeout(l);var t=o[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),u=r&&r.target&&r.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,t[1](c)}o[e]=void 0}};var l=setTimeout((function(){u({type:"timeout",target:a})}),12e4);a.onerror=a.onload=u,document.head.appendChild(a)}return Promise.all(r)},i.m=e,i.c=n,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,r){if(1&r&&(e=i(e)),8&r)return e;if(4&r&&"object"===typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)i.d(t,n,function(r){return e[r]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="./",i.oe=function(e){throw console.error(e),e};var a=this.webpackJsonpvmui=this.webpackJsonpvmui||[],c=a.push.bind(a);a.push=r,a=a.slice();for(var l=0;l<a.length;l++)r(a[l]);var f=c;t()}([]);
|
!function(e){function r(r){for(var n,i,a=r[0],c=r[1],l=r[2],s=0,p=[];s<a.length;s++)i=a[s],Object.prototype.hasOwnProperty.call(o,i)&&o[i]&&p.push(o[i][0]),o[i]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(f&&f(r);p.length;)p.shift()();return u.push.apply(u,l||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,a=1;a<t.length;a++){var c=t[a];0!==o[c]&&(n=!1)}n&&(u.splice(r--,1),e=i(i.s=t[0]))}return e}var n={},o={1:0},u=[];function i(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,i),t.l=!0,t.exports}i.e=function(e){var r=[],t=o[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=o[e]=[r,n]}));r.push(t[2]=n);var u,a=document.createElement("script");a.charset="utf-8",a.timeout=120,i.nc&&a.setAttribute("nonce",i.nc),a.src=function(e){return i.p+"static/js/"+({}[e]||e)+"."+{3:"0dc73915"}[e]+".chunk.js"}(e);var c=new Error;u=function(r){a.onerror=a.onload=null,clearTimeout(l);var t=o[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),u=r&&r.target&&r.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,t[1](c)}o[e]=void 0}};var l=setTimeout((function(){u({type:"timeout",target:a})}),12e4);a.onerror=a.onload=u,document.head.appendChild(a)}return Promise.all(r)},i.m=e,i.c=n,i.d=function(e,r,t){i.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},i.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,r){if(1&r&&(e=i(e)),8&r)return e;if(4&r&&"object"===typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(i.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)i.d(t,n,function(r){return e[r]}.bind(null,n));return t},i.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(r,"a",r),r},i.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},i.p="./",i.oe=function(e){throw console.error(e),e};var a=this.webpackJsonpvmui=this.webpackJsonpvmui||[],c=a.push.bind(a);a.push=r,a=a.slice();for(var l=0;l<a.length;l++)r(a[l]);var f=c;t()}([]);
|
||||||
1355
app/vmui/packages/vmui/package-lock.json
generated
1355
app/vmui/packages/vmui/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -8,14 +8,16 @@
|
|||||||
"@codemirror/basic-setup": "^0.19.0",
|
"@codemirror/basic-setup": "^0.19.0",
|
||||||
"@codemirror/commands": "^0.19.5",
|
"@codemirror/commands": "^0.19.5",
|
||||||
"@codemirror/highlight": "^0.19.6",
|
"@codemirror/highlight": "^0.19.6",
|
||||||
"@codemirror/state": "^0.19.2",
|
"@codemirror/state": "^0.19.4",
|
||||||
"@codemirror/view": "^0.19.9",
|
"@codemirror/view": "^0.19.14",
|
||||||
"@date-io/dayjs": "^1.3.13",
|
"@date-io/dayjs": "^2.11.0",
|
||||||
"@material-ui/core": "^4.12.3",
|
"@emotion/react": "^11.5.0",
|
||||||
"@material-ui/icons": "^4.11.2",
|
"@emotion/styled": "^11.3.0",
|
||||||
"@material-ui/lab": "^4.0.0-alpha.60",
|
"@mui/icons-material": "^5.0.5",
|
||||||
"@material-ui/pickers": "^3.3.10",
|
"@mui/lab": "^5.0.0-alpha.53",
|
||||||
"@testing-library/jest-dom": "^5.14.1",
|
"@mui/material": "^5.0.6",
|
||||||
|
"@mui/styles": "^5.0.2",
|
||||||
|
"@testing-library/jest-dom": "^5.15.0",
|
||||||
"@testing-library/react": "^12.1.2",
|
"@testing-library/react": "^12.1.2",
|
||||||
"@testing-library/user-event": "^13.5.0",
|
"@testing-library/user-event": "^13.5.0",
|
||||||
"@types/jest": "^27.0.2",
|
"@types/jest": "^27.0.2",
|
||||||
@ -24,8 +26,8 @@
|
|||||||
"@types/node": "^16.11.6",
|
"@types/node": "^16.11.6",
|
||||||
"@types/numeral": "^2.0.2",
|
"@types/numeral": "^2.0.2",
|
||||||
"@types/qs": "^6.9.7",
|
"@types/qs": "^6.9.7",
|
||||||
"@types/react": "^17.0.33",
|
"@types/react": "^17.0.34",
|
||||||
"@types/react-dom": "^17.0.10",
|
"@types/react-dom": "^17.0.11",
|
||||||
"@types/react-measure": "^2.0.8",
|
"@types/react-measure": "^2.0.8",
|
||||||
"codemirror-promql": "^0.18.0",
|
"codemirror-promql": "^0.18.0",
|
||||||
"dayjs": "^1.10.7",
|
"dayjs": "^1.10.7",
|
||||||
@ -71,7 +73,7 @@
|
|||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.0",
|
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.0",
|
||||||
"@typescript-eslint/eslint-plugin": "^5.3.0",
|
"@typescript-eslint/eslint-plugin": "^5.3.0",
|
||||||
"@typescript-eslint/parser": "^5.2.0",
|
"@typescript-eslint/parser": "^5.3.0",
|
||||||
"customize-cra": "^1.0.0",
|
"customize-cra": "^1.0.0",
|
||||||
"eslint-plugin-react": "^7.26.1",
|
"eslint-plugin-react": "^7.26.1",
|
||||||
"react-app-rewired": "^2.1.8"
|
"react-app-rewired": "^2.1.8"
|
||||||
|
|||||||
@ -4,28 +4,49 @@ import HomeLayout from "./components/Home/HomeLayout";
|
|||||||
import {StateProvider} from "./state/common/StateContext";
|
import {StateProvider} from "./state/common/StateContext";
|
||||||
import {AuthStateProvider} from "./state/auth/AuthStateContext";
|
import {AuthStateProvider} from "./state/auth/AuthStateContext";
|
||||||
import {GraphStateProvider} from "./state/graph/GraphStateContext";
|
import {GraphStateProvider} from "./state/graph/GraphStateContext";
|
||||||
import {MuiThemeProvider} from "@material-ui/core";
|
import { ThemeProvider, Theme, StyledEngineProvider, createTheme } from "@mui/material/styles";
|
||||||
import {createTheme} from "@material-ui/core/styles";
|
|
||||||
|
|
||||||
import CssBaseline from "@material-ui/core/CssBaseline";
|
import CssBaseline from "@mui/material/CssBaseline";
|
||||||
|
|
||||||
import {MuiPickersUtilsProvider} from "@material-ui/pickers";
|
import LocalizationProvider from "@mui/lab/LocalizationProvider";
|
||||||
// pick a date util library
|
// pick a date util library
|
||||||
import DayJsUtils from "@date-io/dayjs";
|
import DayjsUtils from "@date-io/dayjs";
|
||||||
|
|
||||||
|
|
||||||
|
declare module "@mui/styles/defaultTheme" {
|
||||||
|
// eslint-disable-next-line @typescript-eslint/no-empty-interface
|
||||||
|
interface DefaultTheme extends Theme {}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
const App: FC = () => {
|
const App: FC = () => {
|
||||||
|
|
||||||
const THEME = createTheme({
|
const THEME = createTheme({
|
||||||
|
palette: {
|
||||||
|
primary: {
|
||||||
|
main: "#3F51B5"
|
||||||
|
},
|
||||||
|
secondary: {
|
||||||
|
main: "#F50057"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
MuiSwitch: {
|
||||||
|
defaultProps: {
|
||||||
|
color: "secondary"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
typography: {
|
typography: {
|
||||||
"fontSize": 10
|
"fontSize": 10
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
return <>
|
||||||
<>
|
<CssBaseline /> {/* CSS Baseline: kind of normalize.css made by materialUI team - can be scoped */}
|
||||||
<CssBaseline /> {/* CSS Baseline: kind of normalize.css made by materialUI team - can be scoped */}
|
<LocalizationProvider dateAdapter={DayjsUtils}> {/* Allows datepicker to work with DayJS */}
|
||||||
<MuiPickersUtilsProvider utils={DayJsUtils}> {/* Allows datepicker to work with DayJS */}
|
<StyledEngineProvider injectFirst>
|
||||||
<MuiThemeProvider theme={THEME}> {/* Material UI theme customization */}
|
<ThemeProvider theme={THEME}> {/* Material UI theme customization */}
|
||||||
<StateProvider> {/* Serialized into query string, common app settings */}
|
<StateProvider> {/* Serialized into query string, common app settings */}
|
||||||
<AuthStateProvider> {/* Auth related info - optionally persisted to Local Storage */}
|
<AuthStateProvider> {/* Auth related info - optionally persisted to Local Storage */}
|
||||||
<GraphStateProvider> {/* Graph settings */}
|
<GraphStateProvider> {/* Graph settings */}
|
||||||
@ -35,10 +56,10 @@ const App: FC = () => {
|
|||||||
</GraphStateProvider>
|
</GraphStateProvider>
|
||||||
</AuthStateProvider>
|
</AuthStateProvider>
|
||||||
</StateProvider>
|
</StateProvider>
|
||||||
</MuiThemeProvider>
|
</ThemeProvider>
|
||||||
</MuiPickersUtilsProvider>
|
</StyledEngineProvider>
|
||||||
</>
|
</LocalizationProvider>
|
||||||
);
|
</>;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default App;
|
export default App;
|
||||||
|
|||||||
@ -1,13 +1,12 @@
|
|||||||
/* eslint max-lines: ["error", {"max": 300}] */
|
/* eslint max-lines: ["error", {"max": 300}] */
|
||||||
|
|
||||||
import React, {useState} from "react";
|
import React, {useState} from "react";
|
||||||
import DialogTitle from "@material-ui/core/DialogTitle";
|
import DialogTitle from "@mui/material/DialogTitle";
|
||||||
import Dialog from "@material-ui/core/Dialog";
|
import Dialog from "@mui/material/Dialog";
|
||||||
import {
|
import {
|
||||||
Box,
|
Box,
|
||||||
Button,
|
Button,
|
||||||
Checkbox,
|
Checkbox,
|
||||||
createStyles,
|
|
||||||
DialogActions,
|
DialogActions,
|
||||||
DialogContent,
|
DialogContent,
|
||||||
DialogContentText,
|
DialogContentText,
|
||||||
@ -20,12 +19,13 @@ import {
|
|||||||
Tab,
|
Tab,
|
||||||
Tabs,
|
Tabs,
|
||||||
TextField,
|
TextField,
|
||||||
Typography
|
Typography,
|
||||||
} from "@material-ui/core";
|
} from "@mui/material";
|
||||||
|
import createStyles from "@mui/styles/createStyles";
|
||||||
import TabPanel from "./AuthTabPanel";
|
import TabPanel from "./AuthTabPanel";
|
||||||
import PersonIcon from "@material-ui/icons/Person";
|
import PersonIcon from "@mui/icons-material/Person";
|
||||||
import LockIcon from "@material-ui/icons/Lock";
|
import LockIcon from "@mui/icons-material/Lock";
|
||||||
import {makeStyles} from "@material-ui/core/styles";
|
import makeStyles from "@mui/styles/makeStyles";
|
||||||
import {useAuthDispatch, useAuthState} from "../../../state/auth/AuthStateContext";
|
import {useAuthDispatch, useAuthState} from "../../../state/auth/AuthStateContext";
|
||||||
import {AUTH_METHOD, WithCheckbox} from "../../../state/auth/reducer";
|
import {AUTH_METHOD, WithCheckbox} from "../../../state/auth/reducer";
|
||||||
|
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import Box from "@material-ui/core/Box";
|
import Box from "@mui/material/Box";
|
||||||
|
|
||||||
interface TabPanelProps {
|
interface TabPanelProps {
|
||||||
index: number;
|
index: number;
|
||||||
|
|||||||
@ -1,12 +1,12 @@
|
|||||||
import React, {FC} from "react";
|
import React, {FC} from "react";
|
||||||
|
|
||||||
import TableChartIcon from "@material-ui/icons/TableChart";
|
import TableChartIcon from "@mui/icons-material/TableChart";
|
||||||
import ShowChartIcon from "@material-ui/icons/ShowChart";
|
import ShowChartIcon from "@mui/icons-material/ShowChart";
|
||||||
import CodeIcon from "@material-ui/icons/Code";
|
import CodeIcon from "@mui/icons-material/Code";
|
||||||
|
|
||||||
import {ToggleButton, ToggleButtonGroup} from "@material-ui/lab";
|
import { ToggleButton, ToggleButtonGroup } from "@mui/material";
|
||||||
import {useAppDispatch, useAppState} from "../../../state/common/StateContext";
|
import {useAppDispatch, useAppState} from "../../../state/common/StateContext";
|
||||||
import {withStyles} from "@material-ui/core";
|
import withStyles from "@mui/styles/withStyles";
|
||||||
|
|
||||||
export type DisplayType = "table" | "chart" | "code";
|
export type DisplayType = "table" | "chart" | "code";
|
||||||
|
|
||||||
|
|||||||
@ -1,9 +1,9 @@
|
|||||||
import React, {FC, useEffect, useState} from "react";
|
import React, {FC, useEffect, useState} from "react";
|
||||||
import {Box, FormControlLabel, IconButton, Switch, Tooltip} from "@material-ui/core";
|
import {Box, FormControlLabel, IconButton, Switch, Tooltip} from "@mui/material";
|
||||||
import EqualizerIcon from "@material-ui/icons/Equalizer";
|
import EqualizerIcon from "@mui/icons-material/Equalizer";
|
||||||
import {useAppDispatch, useAppState} from "../../../state/common/StateContext";
|
import {useAppDispatch, useAppState} from "../../../state/common/StateContext";
|
||||||
import CircularProgressWithLabel from "../../common/CircularProgressWithLabel";
|
import CircularProgressWithLabel from "../../common/CircularProgressWithLabel";
|
||||||
import {makeStyles} from "@material-ui/core/styles";
|
import makeStyles from "@mui/styles/makeStyles";
|
||||||
|
|
||||||
const useStyles = makeStyles({
|
const useStyles = makeStyles({
|
||||||
colorizing: {
|
colorizing: {
|
||||||
@ -78,7 +78,7 @@ export const ExecutionControls: FC = () => {
|
|||||||
onClick={() => {iterateDelays();}} />
|
onClick={() => {iterateDelays();}} />
|
||||||
<Tooltip title="Change delay refresh">
|
<Tooltip title="Change delay refresh">
|
||||||
<Box ml={1}>
|
<Box ml={1}>
|
||||||
<IconButton onClick={() => {iterateDelays();}}><EqualizerIcon style={{color: "white"}} /></IconButton>
|
<IconButton onClick={() => {iterateDelays();}} size="large"><EqualizerIcon style={{color: "white"}} /></IconButton>
|
||||||
</Box>
|
</Box>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</>}
|
</>}
|
||||||
|
|||||||
@ -1,14 +1,14 @@
|
|||||||
import React, {FC, useRef, useState} from "react";
|
import React, {FC, useRef, useState} from "react";
|
||||||
import { Accordion, AccordionDetails, AccordionSummary, Box, Grid, IconButton, TextField, Typography, FormControlLabel,
|
import { Accordion, AccordionDetails, AccordionSummary, Box, Grid, IconButton, TextField, Typography, FormControlLabel,
|
||||||
Tooltip, Switch } from "@material-ui/core";
|
Tooltip, Switch } from "@mui/material";
|
||||||
import QueryEditor from "./QueryEditor";
|
import QueryEditor from "./QueryEditor";
|
||||||
import {TimeSelector} from "./TimeSelector";
|
import {TimeSelector} from "./TimeSelector";
|
||||||
import {useAppDispatch, useAppState} from "../../../state/common/StateContext";
|
import {useAppDispatch, useAppState} from "../../../state/common/StateContext";
|
||||||
import ExpandMoreIcon from "@material-ui/icons/ExpandMore";
|
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
||||||
import SecurityIcon from "@material-ui/icons/Security";
|
import SecurityIcon from "@mui/icons-material/Security";
|
||||||
import {AuthDialog} from "./AuthDialog";
|
import {AuthDialog} from "./AuthDialog";
|
||||||
import PlayCircleOutlineIcon from "@material-ui/icons/PlayCircleOutline";
|
import PlayCircleOutlineIcon from "@mui/icons-material/PlayCircleOutline";
|
||||||
import Portal from "@material-ui/core/Portal";
|
import Portal from "@mui/material/Portal";
|
||||||
import {saveToStorage} from "../../../utils/storage";
|
import {saveToStorage} from "../../../utils/storage";
|
||||||
import {useGraphDispatch, useGraphState} from "../../../state/graph/GraphStateContext";
|
import {useGraphDispatch, useGraphState} from "../../../state/graph/GraphStateContext";
|
||||||
import debounce from "lodash.debounce";
|
import debounce from "lodash.debounce";
|
||||||
@ -73,7 +73,7 @@ const QueryConfigurator: FC = () => {
|
|||||||
aria-controls="panel1a-content"
|
aria-controls="panel1a-content"
|
||||||
id="panel1a-header"
|
id="panel1a-header"
|
||||||
>
|
>
|
||||||
<Box mr={2}><Typography variant="h6" component="h2">Query Configuration</Typography></Box>
|
<Box display="flex" alignItems="center" mr={2}><Typography variant="h6" component="h2">Query Configuration</Typography></Box>
|
||||||
<Box flexGrow={1} onClick={e => e.stopPropagation()} onFocusCapture={e => e.stopPropagation()}>
|
<Box flexGrow={1} onClick={e => e.stopPropagation()} onFocusCapture={e => e.stopPropagation()}>
|
||||||
<Portal disablePortal={!expanded} container={queryContainer.current}>
|
<Portal disablePortal={!expanded} container={queryContainer.current}>
|
||||||
<Box display="flex" alignItems="center">
|
<Box display="flex" alignItems="center">
|
||||||
@ -82,7 +82,7 @@ const QueryConfigurator: FC = () => {
|
|||||||
queryHistory={queryHistory} setHistoryIndex={setHistoryIndex} runQuery={onRunQuery} setQuery={onSetQuery}/>
|
queryHistory={queryHistory} setHistoryIndex={setHistoryIndex} runQuery={onRunQuery} setQuery={onSetQuery}/>
|
||||||
</Box>
|
</Box>
|
||||||
<Tooltip title="Execute Query">
|
<Tooltip title="Execute Query">
|
||||||
<IconButton onClick={onRunQuery}><PlayCircleOutlineIcon /></IconButton>
|
<IconButton onClick={onRunQuery} size="large"><PlayCircleOutlineIcon /></IconButton>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</Box>
|
</Box>
|
||||||
</Portal>
|
</Portal>
|
||||||
@ -91,14 +91,14 @@ const QueryConfigurator: FC = () => {
|
|||||||
<AccordionDetails>
|
<AccordionDetails>
|
||||||
<Grid container spacing={2}>
|
<Grid container spacing={2}>
|
||||||
<Grid item xs={12} md={6}>
|
<Grid item xs={12} md={6}>
|
||||||
<Box display="grid" gridGap={16}>
|
<Box display="grid" gap={2} gridTemplateRows="auto 1fr">
|
||||||
<Box display="flex" alignItems="center">
|
<Box display="flex" alignItems="center">
|
||||||
<TextField variant="outlined" fullWidth label="Server URL" value={serverUrl}
|
<TextField variant="outlined" fullWidth label="Server URL" value={serverUrl}
|
||||||
inputProps={{style: {fontFamily: "Monospace"}}}
|
inputProps={{style: {fontFamily: "Monospace"}}}
|
||||||
onChange={onSetServer}/>
|
onChange={onSetServer}/>
|
||||||
<Box>
|
<Box>
|
||||||
<Tooltip title="Request Auth Settings">
|
<Tooltip title="Request Auth Settings">
|
||||||
<IconButton onClick={() => setDialogOpen(true)}><SecurityIcon/></IconButton>
|
<IconButton onClick={() => setDialogOpen(true)} size="large"><SecurityIcon/></IconButton>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</Box>
|
</Box>
|
||||||
</Box>
|
</Box>
|
||||||
@ -107,28 +107,29 @@ const QueryConfigurator: FC = () => {
|
|||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={8} md={6} >
|
<Grid item xs={8} md={6} >
|
||||||
<Box style={{
|
<Box style={{
|
||||||
|
minHeight: "128px",
|
||||||
|
padding: "10px 0",
|
||||||
borderRadius: "4px",
|
borderRadius: "4px",
|
||||||
borderColor: "#b9b9b9",
|
borderColor: "#b9b9b9",
|
||||||
borderStyle: "solid",
|
borderStyle: "solid",
|
||||||
borderWidth: "1px",
|
borderWidth: "1px"}}>
|
||||||
height: "100%",}}>
|
|
||||||
<TimeSelector setDuration={onSetDuration} duration={duration}/>
|
<TimeSelector setDuration={onSetDuration} duration={duration}/>
|
||||||
</Box>
|
</Box>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12}>
|
<Grid item xs={12}>
|
||||||
<Box px={1} display="flex" alignItems="center" minHeight={52}>
|
<Box px={1} display="flex" alignItems="center" minHeight={52}>
|
||||||
<Box><FormControlLabel
|
<Box><FormControlLabel label="Enable autocomplete"
|
||||||
control={<Switch size="small" checked={autocomplete} onChange={onChangeAutocomplete}/>} label="Enable autocomplete"
|
control={<Switch size="small" checked={autocomplete} onChange={onChangeAutocomplete}/>}
|
||||||
/></Box>
|
/></Box>
|
||||||
<Box ml={4}><FormControlLabel
|
<Box ml={2}><FormControlLabel label="Enable cache"
|
||||||
control={<Switch size="small" checked={!nocache} onChange={onChangeCache}/>} label="Enable cache"
|
control={<Switch size="small" checked={!nocache} onChange={onChangeCache}/>}
|
||||||
/></Box>
|
/></Box>
|
||||||
<Box ml={4} display="flex" alignItems="center">
|
<Box ml={2} display="flex" alignItems="center">
|
||||||
<FormControlLabel
|
<FormControlLabel
|
||||||
control={<Switch size="small" checked={yaxis.limits.enable} onChange={onChangeYaxisLimits}/>}
|
control={<Switch size="small" checked={yaxis.limits.enable} onChange={onChangeYaxisLimits}/>}
|
||||||
label="fix the limits for y-axis"
|
label="Fix the limits for y-axis"
|
||||||
/>
|
/>
|
||||||
{yaxis.limits.enable && <Box display="grid" gridTemplateColumns="120px 120px" gridGap={10}>
|
{yaxis.limits.enable && <Box display="grid" gridTemplateColumns="120px 120px" gap={1}>
|
||||||
<TextField label="Min" type="number" size="small" variant="outlined"
|
<TextField label="Min" type="number" size="small" variant="outlined"
|
||||||
defaultValue={yaxis.limits.range[0]} onChange={debounce(setMinLimit, 750)}/>
|
defaultValue={yaxis.limits.range[0]} onChange={debounce(setMinLimit, 750)}/>
|
||||||
<TextField label="Max" type="number" size="small" variant="outlined"
|
<TextField label="Max" type="number" size="small" variant="outlined"
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
import React, {FC} from "react";
|
import React, {FC} from "react";
|
||||||
import {Paper, Table, TableBody, TableCell, TableContainer, TableHead, TableRow} from "@material-ui/core";
|
import {Paper, Table, TableBody, TableCell, TableContainer, TableHead, TableRow} from "@mui/material";
|
||||||
import {supportedDurations} from "../../../utils/time";
|
import {supportedDurations} from "../../../utils/time";
|
||||||
|
|
||||||
export const TimeDurationPopover: FC = () => {
|
export const TimeDurationPopover: FC = () => {
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import React, {FC, useEffect, useState} from "react";
|
import React, {FC, useEffect, useState} from "react";
|
||||||
import {Box, Popover, TextField, Typography} from "@material-ui/core";
|
import {Box, Popover, TextField, Typography} from "@mui/material";
|
||||||
import { KeyboardDateTimePicker } from "@material-ui/pickers";
|
import DateTimePicker from "@mui/lab/DateTimePicker";
|
||||||
import {TimeDurationPopover} from "./TimeDurationPopover";
|
import {TimeDurationPopover} from "./TimeDurationPopover";
|
||||||
import {useAppDispatch, useAppState} from "../../../state/common/StateContext";
|
import {useAppDispatch, useAppState} from "../../../state/common/StateContext";
|
||||||
import {checkDurationLimit, dateFromSeconds, formatDateForNativeInput} from "../../../utils/time";
|
import {checkDurationLimit, dateFromSeconds, formatDateForNativeInput} from "../../../utils/time";
|
||||||
@ -58,6 +58,7 @@ export const TimeSelector: FC<TimeSelectorProps> = ({setDuration}) => {
|
|||||||
<Box px={1}>
|
<Box px={1}>
|
||||||
<Box>
|
<Box>
|
||||||
<TextField label="Duration" value={durationString} onChange={handleDurationChange}
|
<TextField label="Duration" value={durationString} onChange={handleDurationChange}
|
||||||
|
variant="standard"
|
||||||
fullWidth={true}
|
fullWidth={true}
|
||||||
onBlur={() => {
|
onBlur={() => {
|
||||||
setFocused(false);
|
setFocused(false);
|
||||||
@ -69,11 +70,13 @@ export const TimeSelector: FC<TimeSelectorProps> = ({setDuration}) => {
|
|||||||
</Box>
|
</Box>
|
||||||
<Box my={2}>
|
<Box my={2}>
|
||||||
<Typography variant="body2">
|
<Typography variant="body2">
|
||||||
Possible options<span aria-owns={open ? "mouse-over-popover" : undefined}
|
<span aria-owns={open ? "mouse-over-popover" : undefined}
|
||||||
aria-haspopup="true"
|
aria-haspopup="true"
|
||||||
style={{cursor: "pointer"}}
|
style={{cursor: "pointer"}}
|
||||||
onMouseEnter={handlePopoverOpen}
|
onMouseEnter={handlePopoverOpen}
|
||||||
onMouseLeave={handlePopoverClose}>: </span>
|
onMouseLeave={handlePopoverClose}>
|
||||||
|
Possible options:
|
||||||
|
</span>
|
||||||
<Popover
|
<Popover
|
||||||
open={open}
|
open={open}
|
||||||
anchorEl={anchorEl}
|
anchorEl={anchorEl}
|
||||||
@ -100,14 +103,15 @@ export const TimeSelector: FC<TimeSelectorProps> = ({setDuration}) => {
|
|||||||
{/*setup end time*/}
|
{/*setup end time*/}
|
||||||
<Box px={1}>
|
<Box px={1}>
|
||||||
<Box>
|
<Box>
|
||||||
<KeyboardDateTimePicker
|
<DateTimePicker
|
||||||
variant="inline"
|
|
||||||
ampm={false}
|
|
||||||
label="Until"
|
label="Until"
|
||||||
|
ampm={false}
|
||||||
value={until}
|
value={until}
|
||||||
onChange={date => dispatch({type: "SET_UNTIL", payload: date as unknown as Date})}
|
onChange={date => dispatch({type: "SET_UNTIL", payload: date as unknown as Date})}
|
||||||
onError={console.log}
|
onError={console.log}
|
||||||
format="DD/MM/YYYY HH:mm:ss"
|
inputFormat="DD/MM/YYYY HH:mm:ss"
|
||||||
|
mask="__/__/____ __:__:__"
|
||||||
|
renderInput={(params) => <TextField {...params} variant="standard"/>}
|
||||||
/>
|
/>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
import React, {FC} from "react";
|
import React, {FC} from "react";
|
||||||
import {AppBar, Box, CircularProgress, Fade, Link, Toolbar, Typography} from "@material-ui/core";
|
import {Alert, AppBar, Box, CircularProgress, Fade, Link, Toolbar, Typography} from "@mui/material";
|
||||||
import {ExecutionControls} from "./Configurator/ExecutionControls";
|
import {ExecutionControls} from "./Configurator/ExecutionControls";
|
||||||
import {DisplayTypeSwitch} from "./Configurator/DisplayTypeSwitch";
|
import {DisplayTypeSwitch} from "./Configurator/DisplayTypeSwitch";
|
||||||
import GraphView from "./Views/GraphView";
|
import GraphView from "./Views/GraphView";
|
||||||
@ -9,7 +9,6 @@ import QueryConfigurator from "./Configurator/QueryConfigurator";
|
|||||||
import {useFetchQuery} from "./Configurator/useFetchQuery";
|
import {useFetchQuery} from "./Configurator/useFetchQuery";
|
||||||
import JsonView from "./Views/JsonView";
|
import JsonView from "./Views/JsonView";
|
||||||
import {UrlCopy} from "./UrlCopy";
|
import {UrlCopy} from "./UrlCopy";
|
||||||
import {Alert} from "@material-ui/lab";
|
|
||||||
|
|
||||||
const HomeLayout: FC = () => {
|
const HomeLayout: FC = () => {
|
||||||
|
|
||||||
@ -40,7 +39,7 @@ const HomeLayout: FC = () => {
|
|||||||
opacity: ".4"
|
opacity: ".4"
|
||||||
}}>
|
}}>
|
||||||
<Link color="inherit" href="https://github.com/VictoriaMetrics/VictoriaMetrics/issues/new" target="_blank">
|
<Link color="inherit" href="https://github.com/VictoriaMetrics/VictoriaMetrics/issues/new" target="_blank">
|
||||||
Create an issue
|
Create an issue
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
<Box ml={4} flexGrow={1}>
|
<Box ml={4} flexGrow={1}>
|
||||||
@ -50,7 +49,7 @@ const HomeLayout: FC = () => {
|
|||||||
<UrlCopy url={fetchUrl}/>
|
<UrlCopy url={fetchUrl}/>
|
||||||
</Toolbar>
|
</Toolbar>
|
||||||
</AppBar>
|
</AppBar>
|
||||||
<Box p={2} display="grid" gridTemplateRows="auto 1fr" gridGap={"20px"} style={{minHeight: "calc(100vh - 64px)"}}>
|
<Box p={2} display="grid" gridTemplateRows="auto 1fr" gap={"20px"} style={{minHeight: "calc(100vh - 64px)"}}>
|
||||||
<Box>
|
<Box>
|
||||||
<QueryConfigurator/>
|
<QueryConfigurator/>
|
||||||
</Box>
|
</Box>
|
||||||
@ -71,9 +70,9 @@ const HomeLayout: FC = () => {
|
|||||||
</Fade>}
|
</Fade>}
|
||||||
{<Box height={"100%"} p={3} bgcolor={"#fff"}>
|
{<Box height={"100%"} p={3} bgcolor={"#fff"}>
|
||||||
{error &&
|
{error &&
|
||||||
<Alert color="error" severity="error" style={{fontSize: "14px"}}>
|
<Alert color="error" severity="error" style={{fontSize: "14px"}}>
|
||||||
{error}
|
{error}
|
||||||
</Alert>}
|
</Alert>}
|
||||||
{graphData && period && (displayType === "chart") &&
|
{graphData && period && (displayType === "chart") &&
|
||||||
<GraphView data={graphData}/>}
|
<GraphView data={graphData}/>}
|
||||||
{liveData && (displayType === "code") && <JsonView data={liveData}/>}
|
{liveData && (displayType === "code") && <JsonView data={liveData}/>}
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import React, {FC} from "react";
|
import React, {FC} from "react";
|
||||||
import {Box, IconButton, Tooltip} from "@material-ui/core";
|
import {Box, IconButton, Tooltip} from "@mui/material";
|
||||||
import FileCopyIcon from "@material-ui/icons/FileCopy";
|
import FileCopyIcon from "@mui/icons-material/FileCopy";
|
||||||
import {useSnack} from "../../contexts/Snackbar";
|
import {useSnack} from "../../contexts/Snackbar";
|
||||||
|
|
||||||
interface UrlCopyProps {
|
interface UrlCopyProps {
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
import React, {FC} from "react";
|
import React, {FC} from "react";
|
||||||
import {Box, Button, Grid, Typography} from "@material-ui/core";
|
import {Box, Button, Grid, Typography} from "@mui/material";
|
||||||
import {useSnack} from "../../contexts/Snackbar";
|
import {useSnack} from "../../contexts/Snackbar";
|
||||||
|
|
||||||
interface UrlLineProps {
|
interface UrlLineProps {
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import React, {FC, useMemo} from "react";
|
import React, {FC, useMemo} from "react";
|
||||||
import {InstantMetricResult} from "../../../api/types";
|
import {InstantMetricResult} from "../../../api/types";
|
||||||
import {Box, Button} from "@material-ui/core";
|
import {Box, Button} from "@mui/material";
|
||||||
import {useSnack} from "../../../contexts/Snackbar";
|
import {useSnack} from "../../../contexts/Snackbar";
|
||||||
|
|
||||||
export interface JsonViewProps {
|
export interface JsonViewProps {
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
import React, {FC, useMemo} from "react";
|
import React, {FC, useMemo} from "react";
|
||||||
import {InstantMetricResult} from "../../../api/types";
|
import {InstantMetricResult} from "../../../api/types";
|
||||||
import {InstantDataSeries} from "../../../types";
|
import {InstantDataSeries} from "../../../types";
|
||||||
import {Paper, Table, TableBody, TableCell, TableContainer, TableHead, TableRow} from "@material-ui/core";
|
import {Paper, Table, TableBody, TableCell, TableContainer, TableHead, TableRow} from "@mui/material";
|
||||||
import {makeStyles} from "@material-ui/core/styles";
|
import makeStyles from "@mui/styles/makeStyles";
|
||||||
import {useSortedCategories} from "../../../hooks/useSortedCategories";
|
import {useSortedCategories} from "../../../hooks/useSortedCategories";
|
||||||
|
|
||||||
export interface GraphViewProps {
|
export interface GraphViewProps {
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import CircularProgress, {CircularProgressProps} from "@material-ui/core/CircularProgress";
|
import CircularProgress, {CircularProgressProps} from "@mui/material/CircularProgress";
|
||||||
import {Box} from "@material-ui/core";
|
import {Box} from "@mui/material";
|
||||||
import Typography from "@material-ui/core/Typography";
|
import Typography from "@mui/material/Typography";
|
||||||
import React, {FC} from "react";
|
import React, {FC} from "react";
|
||||||
|
|
||||||
const CircularProgressWithLabel: FC<CircularProgressProps & { label: number }> = (props) => {
|
const CircularProgressWithLabel: FC<CircularProgressProps & { label: number }> = (props) => {
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import {makeStyles} from "@material-ui/core/styles";
|
import makeStyles from "@mui/styles/makeStyles";
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import {Link} from "@material-ui/core";
|
import {Link} from "@mui/material";
|
||||||
|
|
||||||
const useStyles = makeStyles({
|
const useStyles = makeStyles({
|
||||||
inlineBtn: {
|
inlineBtn: {
|
||||||
|
|||||||
@ -1,6 +1,5 @@
|
|||||||
import React, {createContext, FC, useContext, useEffect, useState} from "react";
|
import React, {createContext, FC, useContext, useEffect, useState} from "react";
|
||||||
import {Snackbar} from "@material-ui/core";
|
import {Alert, Snackbar} from "@mui/material";
|
||||||
import {Alert} from "@material-ui/lab";
|
|
||||||
|
|
||||||
export interface SnackModel {
|
export interface SnackModel {
|
||||||
message?: string;
|
message?: string;
|
||||||
|
|||||||
@ -40,7 +40,7 @@ code {
|
|||||||
|
|
||||||
.multi-line-scroll .cm-content,
|
.multi-line-scroll .cm-content,
|
||||||
.multi-line-scroll .cm-gutters {
|
.multi-line-scroll .cm-gutters {
|
||||||
min-height: 51px !important;
|
min-height: 64px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.one-line-scroll .cm-content,
|
.one-line-scroll .cm-content,
|
||||||
|
|||||||
@ -41,7 +41,7 @@ export const setQueryStringValue = (newValue: Record<string, unknown>): void =>
|
|||||||
const queryMap = new Map(Object.entries(stateToUrlParams));
|
const queryMap = new Map(Object.entries(stateToUrlParams));
|
||||||
const newQsValue: string[] = [];
|
const newQsValue: string[] = [];
|
||||||
queryMap.forEach((queryKey, stateKey) => {
|
queryMap.forEach((queryKey, stateKey) => {
|
||||||
const queryKeyEncoded = encodeURIComponent(queryKey);
|
// const queryKeyEncoded = encodeURIComponent(queryKey);
|
||||||
const value = get(newValue, stateKey, "") as string;
|
const value = get(newValue, stateKey, "") as string;
|
||||||
if (value) {
|
if (value) {
|
||||||
const valueEncoded = encodeURIComponent(value);
|
const valueEncoded = encodeURIComponent(value);
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user