From d271ed6a50e922cc64570b3d2483f798459883d6 Mon Sep 17 00:00:00 2001
From: Michael Shanks <mike@budibase.com>
Date: Fri, 21 Feb 2020 16:52:29 +0000
Subject: [PATCH] some more routing fixes - css now loaded at runtime

---
 packages/client/src/createApp.js                      | 6 +++++-
 packages/client/src/render/screenRouter.js            | 8 +++++++-
 packages/server/middleware/routers.js                 | 8 +++++++-
 packages/server/utilities/builder/index.template.html | 6 ++++--
 4 files changed, 23 insertions(+), 5 deletions(-)

diff --git a/packages/client/src/createApp.js b/packages/client/src/createApp.js
index 9cf6757c3b..ff409b36ed 100644
--- a/packages/client/src/createApp.js
+++ b/packages/client/src/createApp.js
@@ -50,7 +50,11 @@ export const createApp = (
       onScreenSelected,
       frontendDefinition.appRootPath
     )
-    routeTo(currentUrl || window.location.pathname)
+    const fallbackPath = window.location.pathname.replace(
+      frontendDefinition.appRootPath,
+      ""
+    )
+    routeTo(currentUrl || fallbackPath)
   }
 
   const attachChildrenParams = stateManager => {
diff --git a/packages/client/src/render/screenRouter.js b/packages/client/src/render/screenRouter.js
index 7feb12b8c0..0ca8a25cab 100644
--- a/packages/client/src/render/screenRouter.js
+++ b/packages/client/src/render/screenRouter.js
@@ -2,7 +2,13 @@ import regexparam from "regexparam"
 import { writable } from "svelte/store"
 
 export const screenRouter = (screens, onScreenSelected, appRootPath) => {
-  const makeRootedPath = url => (appRootPath ? `${appRootPath}/${url}` : url)
+  const makeRootedPath = url => {
+    if (appRootPath) {
+      if (url) return `${appRootPath}${url.startsWith("/") ? "" : "/"}${url}`
+      return appRootPath
+    }
+    return url
+  }
 
   const routes = screens.map(s => makeRootedPath(s.route))
   let fallback = routes.findIndex(([p]) => p === "*")
diff --git a/packages/server/middleware/routers.js b/packages/server/middleware/routers.js
index 6e25ab9275..299f10d655 100644
--- a/packages/server/middleware/routers.js
+++ b/packages/server/middleware/routers.js
@@ -231,8 +231,14 @@ module.exports = (config, app) => {
         await next()
       } else if (path.startsWith("/_shared/")) {
         await send(ctx, path.replace(`/_shared/`, ""), { root: ctx.sharedPath })
-      } else {
+      } else if (
+        path.endsWith(".js") ||
+        path.endsWith(".map") ||
+        path.endsWith(".css")
+      ) {
         await send(ctx, path, { root: ctx.publicPath })
+      } else {
+        await send(ctx, "/index.html", { root: ctx.publicPath })
       }
     })
     .use(async (ctx, next) => {
diff --git a/packages/server/utilities/builder/index.template.html b/packages/server/utilities/builder/index.template.html
index e6f2ab4280..60540727c7 100644
--- a/packages/server/utilities/builder/index.template.html
+++ b/packages/server/utilities/builder/index.template.html
@@ -11,6 +11,8 @@
         html, body {
             height: 100%;
             width: 100%;
+            margin: 0px;
+            padding: 0px;
         }
     </style>
 
@@ -19,11 +21,11 @@
     {{ /each }}
 
     {{ each(options.screenStyles) }}
-    <link rel='stylesheet' href='{{ @this }}'>
+    <link rel='stylesheet' href='{{ appRootPath }}{{ @this }}'>
     {{ /each }}
 
     {{ if(options.pageStyle) }}
-    <link rel='stylesheet' href='{{ pageStyle }}'>
+    <link rel='stylesheet' href='{{ appRootPath }}{{ pageStyle }}'>
     {{ /if }}