From 236fc7d7396e68ab4e06146bef680d333222b468 Mon Sep 17 00:00:00 2001
From: Yury Molodov <yurymolodov@gmail.com>
Date: Fri, 6 Aug 2021 12:06:08 +0300
Subject: [PATCH] vmui: fix layout and add server url by default (#1519)

* fix: change layout for correctly display big query

* fix: set default server from url

* fix: change get default server url
---
 app/vmui/packages/vmui/src/components/Home/HomeLayout.tsx | 5 +++--
 app/vmui/packages/vmui/src/state/common/reducer.ts        | 4 +++-
 app/vmui/packages/vmui/src/utils/default-server-url.ts    | 6 ++++++
 3 files changed, 12 insertions(+), 3 deletions(-)
 create mode 100644 app/vmui/packages/vmui/src/utils/default-server-url.ts

diff --git a/app/vmui/packages/vmui/src/components/Home/HomeLayout.tsx b/app/vmui/packages/vmui/src/components/Home/HomeLayout.tsx
index 309d764f36..bf523b9a3d 100644
--- a/app/vmui/packages/vmui/src/components/Home/HomeLayout.tsx
+++ b/app/vmui/packages/vmui/src/components/Home/HomeLayout.tsx
@@ -50,17 +50,18 @@ const HomeLayout: FC = () => {
           <UrlCopy url={fetchUrl}/>
         </Toolbar>
       </AppBar>
-      <Box display="flex" flexDirection="column" style={{height: "calc(100vh - 64px)"}}>
+      <Box display="flex" flexDirection="column" style={{minHeight: "calc(100vh - 64px)"}}>
         <Box m={2}>
           <QueryConfigurator/>
         </Box>
-        <Box flexShrink={1} style={{overflowY: "scroll"}}>
+        <Box flexShrink={1}>
           {isLoading && <Fade in={isLoading} style={{
             transitionDelay: isLoading ? "300ms" : "0ms",
           }}>
             <Box alignItems="center" flexDirection="column" display="flex"
               style={{
                 width: "100%",
+                maxWidth: "calc(100vh - 32px)",
                 position: "absolute",
                 height: "150px",
                 background: "linear-gradient(rgba(255,255,255,.7), rgba(255,255,255,.7), rgba(255,255,255,0))"
diff --git a/app/vmui/packages/vmui/src/state/common/reducer.ts b/app/vmui/packages/vmui/src/state/common/reducer.ts
index af981a6541..6534539c13 100644
--- a/app/vmui/packages/vmui/src/state/common/reducer.ts
+++ b/app/vmui/packages/vmui/src/state/common/reducer.ts
@@ -2,6 +2,7 @@ import {DisplayType} from "../../components/Home/Configurator/DisplayTypeSwitch"
 import {TimeParams, TimePeriod} from "../../types";
 import {dateFromSeconds, getDurationFromPeriod, getTimeperiodForDuration} from "../../utils/time";
 import {getFromStorage} from "../../utils/storage";
+import {getDefaultServer} from "../../utils/default-server-url";
 
 export interface TimeState {
   duration: string;
@@ -31,8 +32,9 @@ export type Action =
     | { type: "TOGGLE_AUTOREFRESH"}
     | { type: "TOGGLE_AUTOCOMPLETE"}
 
+
 export const initialState: AppState = {
-  serverUrl: getFromStorage("PREFERRED_URL") as string || "https://", // https://demo.promlabs.com or https://play.victoriametrics.com/select/accounting/1/6a716b0f-38bc-4856-90ce-448fd713e3fe/prometheus",
+  serverUrl: getFromStorage("PREFERRED_URL") as string || getDefaultServer(), // https://demo.promlabs.com or https://play.victoriametrics.com/select/accounting/1/6a716b0f-38bc-4856-90ce-448fd713e3fe/prometheus",
   displayType: "chart",
   query: getFromStorage("LAST_QUERY") as string || "\n", // demo_memory_usage_bytes
   time: {
diff --git a/app/vmui/packages/vmui/src/utils/default-server-url.ts b/app/vmui/packages/vmui/src/utils/default-server-url.ts
new file mode 100644
index 0000000000..d0eb3aca8e
--- /dev/null
+++ b/app/vmui/packages/vmui/src/utils/default-server-url.ts
@@ -0,0 +1,6 @@
+export const getDefaultServer = (): string => {
+  const {href} = window.location;
+  const regexp = /^http.+\/vmui/;
+  const [result] = href.match(regexp) || ["https://"];
+  return result.replace("vmui", "prometheus");
+};
\ No newline at end of file