Merge pull request #2630 from mslourens/invalid_route_settings_section

Sanitise urls after change

packages/builder/src/components/design/NavigationPanel/NewScreenModal.svelte

@@ -5,6 +5,7 @@
   import { Input, Select, ModalContent, Toggle } from "@budibase/bbui"
   import getTemplates from "builderStore/store/screenTemplates"
   import analytics, { Events } from "analytics"
+  import sanitizeUrl from "builderStore/store/screenTemplates/utils/sanitizeUrl"
 
   const CONTAINER = "@budibase/standard-components/container"
 
@@ -84,7 +85,7 @@
     if (!event.detail.startsWith("/")) {
       route = "/" + event.detail
     }
-    route = route.replace(/ +/g, "-")
+    route = sanitizeUrl(route)
   }
 </script>
 

packages/builder/src/components/design/PropertiesPanel/ScreenSettingsSection.svelte

@@ -7,6 +7,7 @@
   import RoleSelect from "./PropertyControls/RoleSelect.svelte"
   import { currentAsset, store } from "builderStore"
   import { FrontendTypes } from "constants"
+  import sanitizeUrl from "builderStore/store/screenTemplates/utils/sanitizeUrl"
 
   export let componentInstance
   export let bindings
@@ -37,7 +38,12 @@
       key: "routing.route",
       label: "Route",
       control: Input,
-      parser: val => val.replace(/ +/g, "-"),
+      parser: val => {
+        if (!val.startsWith("/")) {
+          val = "/" + val
+        }
+        return sanitizeUrl(val)
+      },
     },
     { key: "routing.roleId", label: "Access", control: RoleSelect },
     { key: "layoutId", label: "Layout", control: LayoutSelect },