fix loading styles from subpaths

netdata · Mar 28, 2020 · 7b90880 · 7b90880
1 parent fb54d4b
commit 7b90880
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 10 deletions.
diff --git a/dashboard-react.js b/dashboard-react.js
@@ -246,12 +246,10 @@ NETDATA.statistics = {
   refreshes_active_max: 0
 };
 
-// todo
-const serverStatic = '/'
 NETDATA.themes = {
   white: {
-    bootstrap_css: serverStatic + 'css/bootstrap-3.3.7.css',
-    dashboard_css: serverStatic + 'css/dashboard.css?v20180210-1',
+    bootstrap_css: 'css/bootstrap-3.3.7.css',
+    dashboard_css: 'css/dashboard.css?v20180210-1',
     background: '#FFFFFF',
     foreground: '#000000',
     grid: '#F0F0F0',
@@ -281,8 +279,8 @@ NETDATA.themes = {
     }
   },
   slate: {
-    bootstrap_css: serverStatic + 'css/bootstrap-slate-flat-3.3.7.css?v20161229-1',
-    dashboard_css: serverStatic + 'css/dashboard.slate.css?v20180210-1',
+    bootstrap_css: 'css/bootstrap-slate-flat-3.3.7.css?v20161229-1',
+    dashboard_css: 'css/dashboard.slate.css?v20180210-1',
     background: '#272b30',
     foreground: '#C8C8C8',
     grid: '#283236',

diff --git a/src/App.tsx b/src/App.tsx
@@ -26,6 +26,7 @@ import { useAlarms } from "hooks/use-alarms"
 import "./types/global"
 
 import { useInfo } from "hooks/use-info"
+import { serverStatic } from "utils/server-detection"
 import {
   netdataCallback,
   updateLocaleFunctions,
@@ -84,8 +85,8 @@ const App: React.FC = () => { // eslint-disable-line arrow-body-style
   const [hasFetchDependencies, setHasFetchDependencies] = useState(false)
   useLayoutEffect(() => {
     Promise.all([
-      loadCss(window.NETDATA.themes.current.bootstrap_css),
-      loadCss(window.NETDATA.themes.current.dashboard_css),
+      loadCss(serverStatic + window.NETDATA.themes.current.bootstrap_css),
+      loadCss(serverStatic + window.NETDATA.themes.current.dashboard_css),
     ]).then(() => {
       setHasFetchDependencies(true)
     })

diff --git a/src/utils/server-detection.ts b/src/utils/server-detection.ts
@@ -42,7 +42,7 @@ const getDefaultServer = () => {
   // Agent Dashboard does not need sophisticated server-detection, which is causing problems
   // when navigating through streamed nodes. Let's overwrite that setting
   if (isMainJs) {
-    return window.location.origin + window.location.pathname
+    return window.location.origin + window.location.pathname.replace("index.html", "")
   }
 
   const source = getScriptSource()
@@ -59,4 +59,6 @@ export const serverDefault: string = alwaysEndWithSlash(
   window.netdataServer || getDefaultServer(),
 )
 
-export const serverStatic: string = alwaysEndWithSlash(getDefaultServer())
+export const serverStatic: string = isDevelopmentEnv
+  ? "/" // for localhost:3000/css/...
+  : alwaysEndWithSlash(getDefaultServer()) // by default, load from netdata server