diff --git a/packages/builder/src/components/login/LoginForm.svelte b/packages/builder/src/components/login/LoginForm.svelte index e81c3411cd..f3ecf5397b 100644 --- a/packages/builder/src/components/login/LoginForm.svelte +++ b/packages/builder/src/components/login/LoginForm.svelte @@ -1,5 +1,5 @@ diff --git a/packages/builder/src/pages/builder/auth/_layout.svelte b/packages/builder/src/pages/builder/auth/_layout.svelte new file mode 100644 index 0000000000..ac224a41db --- /dev/null +++ b/packages/builder/src/pages/builder/auth/_layout.svelte @@ -0,0 +1,18 @@ + + +{#if !$auth.user} + +{/if} diff --git a/packages/builder/src/pages/builder/portal/_layout.svelte b/packages/builder/src/pages/builder/portal/_layout.svelte index b6bc1b07bf..2137ccc199 100644 --- a/packages/builder/src/pages/builder/portal/_layout.svelte +++ b/packages/builder/src/pages/builder/portal/_layout.svelte @@ -37,11 +37,13 @@ onMount(async () => { // Prevent non-builders from accessing the portal - if (!$auth.user?.builder?.global) { - $redirect("../") - } else { - await organisation.init() - loaded = true + if ($auth.user) { + if (!$auth.user?.builder?.global) { + $redirect("../") + } else { + await organisation.init() + loaded = true + } } }) diff --git a/packages/client/src/components/ClientApp.svelte b/packages/client/src/components/ClientApp.svelte index 5d07754f49..a375852dab 100644 --- a/packages/client/src/components/ClientApp.svelte +++ b/packages/client/src/components/ClientApp.svelte @@ -10,6 +10,8 @@ initialise, screenStore, authStore, + routeStore, + builderStore, } from "../store" import { TableNames, ActionTypes } from "../constants" @@ -18,13 +20,13 @@ setContext("component", writable({})) setContext("context", createContextStore()) - let loaded = false + let dataLoaded = false // Load app config onMount(async () => { await initialise() await authStore.actions.fetchUser() - loaded = true + dataLoaded = true }) // Register this as a refreshable datasource so that user changes cause @@ -36,9 +38,22 @@ metadata: { dataSource: { type: "table", tableId: TableNames.USERS } }, }, ] + + // Redirect to home layout if no matching route + $: { + if (dataLoaded && $routeStore.routerLoaded && !$routeStore.activeRoute) { + if ($authStore) { + routeStore.actions.navigate("/") + } else { + const returnUrl = `${window.location.pathname}${window.location.hash}` + const encodedUrl = encodeURIComponent(returnUrl) + window.location = `/builder/auth/login?returnUrl=${encodedUrl}` + } + } + } -{#if loaded && $screenStore.activeLayout} +{#if dataLoaded && $screenStore.activeLayout}
diff --git a/packages/client/src/components/Router.svelte b/packages/client/src/components/Router.svelte index ddbe7b77e9..545fae79d6 100644 --- a/packages/client/src/components/Router.svelte +++ b/packages/client/src/components/Router.svelte @@ -3,6 +3,7 @@ import Router from "svelte-spa-router" import { routeStore } from "../store" import Screen from "./Screen.svelte" + import { onMount } from "svelte" const { styleable } = getContext("sdk") const component = getContext("component") diff --git a/packages/client/src/components/Screen.svelte b/packages/client/src/components/Screen.svelte index e0e6cdb62e..f97fcb52af 100644 --- a/packages/client/src/components/Screen.svelte +++ b/packages/client/src/components/Screen.svelte @@ -1,8 +1,8 @@ diff --git a/packages/client/src/store/routes.js b/packages/client/src/store/routes.js index aa86718ec0..d0e848b68e 100644 --- a/packages/client/src/store/routes.js +++ b/packages/client/src/store/routes.js @@ -8,6 +8,7 @@ const createRouteStore = () => { routeParams: {}, activeRoute: null, routeSessionId: Math.random(), + routerLoaded: false, } const store = writable(initialState) @@ -47,10 +48,19 @@ const createRouteStore = () => { }) } const navigate = push + const setRouterLoaded = () => { + store.update(state => ({ ...state, routerLoaded: true })) + } return { subscribe: store.subscribe, - actions: { fetchRoutes, navigate, setRouteParams, setActiveRoute }, + actions: { + fetchRoutes, + navigate, + setRouteParams, + setActiveRoute, + setRouterLoaded, + }, } } diff --git a/packages/client/src/store/screens.js b/packages/client/src/store/screens.js index 49927db9d7..04ed9ca52f 100644 --- a/packages/client/src/store/screens.js +++ b/packages/client/src/store/screens.js @@ -18,12 +18,11 @@ const createScreenStore = () => { activeLayout = $builderStore.layout activeScreen = $builderStore.screen } else { - // Otherwise find the correct screen by matching the current route + activeLayout = { props: { _component: "screenslot" } } + + // Find the correct screen by matching the current route const { screens, layouts } = $config - activeLayout = layouts[0] - if (screens.length === 1) { - activeScreen = screens[0] - } else if ($routeStore.activeRoute) { + if ($routeStore.activeRoute) { activeScreen = screens.find( screen => screen._id === $routeStore.activeRoute.screenId )