better routes config
This commit is contained in:
parent
ce296cce9e
commit
5166634e23
|
@ -7,7 +7,6 @@
|
||||||
/** layout */
|
/** layout */
|
||||||
import routes from './__routes'
|
import routes from './__routes'
|
||||||
import Error from './__error.svelte'
|
import Error from './__error.svelte'
|
||||||
import LazyRoute from '$lib/router/LazyRoute.svelte'
|
|
||||||
import LazyRouteGuard from '$lib/router/LazyRouteGuard.svelte'
|
import LazyRouteGuard from '$lib/router/LazyRouteGuard.svelte'
|
||||||
|
|
||||||
let isMounted = false
|
let isMounted = false
|
||||||
|
@ -30,9 +29,13 @@
|
||||||
{#if !$isLoading && isMounted}
|
{#if !$isLoading && isMounted}
|
||||||
{#each routes as { path, layout, component, loading }}
|
{#each routes as { path, layout, component, loading }}
|
||||||
<Route {path} let:location let:params>
|
<Route {path} let:location let:params>
|
||||||
<svelte:component this={layout}>
|
{#if layout}
|
||||||
|
<svelte:component this={layout}>
|
||||||
|
<LazyRouteGuard {location} {params} {component} {loading} />
|
||||||
|
</svelte:component>
|
||||||
|
{:else}
|
||||||
<LazyRouteGuard {location} {params} {component} {loading} />
|
<LazyRouteGuard {location} {params} {component} {loading} />
|
||||||
</svelte:component>
|
{/if}
|
||||||
</Route>
|
</Route>
|
||||||
{/each}
|
{/each}
|
||||||
<Route path="/*" component={Error} />
|
<Route path="/*" component={Error} />
|
||||||
|
|
|
@ -1,8 +1,27 @@
|
||||||
import { defineRoutes } from '$lib/router';
|
import { defineRoutes } from '$lib/router';
|
||||||
|
|
||||||
export default defineRoutes([
|
import Layout from '$src/__layout.svelte'
|
||||||
{ path: '/', component: () => import('$routes/index.svelte') },
|
import Loading from '$src/__loading.svelte'
|
||||||
{ path: '/oauth', component: () => import('$routes/oauth/index.svelte') },
|
|
||||||
{ path: '/oauth/failure', component: () => import('$routes/oauth/failure.svelte') },
|
export default defineRoutes({
|
||||||
{ path: '/oauth/success', component: () => import('$routes/oauth/success.svelte') },
|
routes: [
|
||||||
])
|
{
|
||||||
|
path: '/',
|
||||||
|
component: () => import('./routes/index.svelte')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/oauth',
|
||||||
|
component: () => import('$routes/oauth/index.svelte')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/oauth/failure',
|
||||||
|
component: () => import('$routes/oauth/failure.svelte')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/oauth/success',
|
||||||
|
component: () => import('$routes/oauth/success.svelte')
|
||||||
|
},
|
||||||
|
],
|
||||||
|
layout: Layout,
|
||||||
|
loading: Loading,
|
||||||
|
})
|
||||||
|
|
|
@ -1,6 +1,3 @@
|
||||||
import Layout from '$src/__layout.svelte'
|
|
||||||
import Loading from '$src/__loading.svelte'
|
|
||||||
|
|
||||||
import { ComponentType, SvelteComponentTyped } from 'svelte'
|
import { ComponentType, SvelteComponentTyped } from 'svelte'
|
||||||
|
|
||||||
export interface Route {
|
export interface Route {
|
||||||
|
@ -13,16 +10,18 @@ export interface Route {
|
||||||
interface RouteDefinition {
|
interface RouteDefinition {
|
||||||
component: () => Promise<any>,
|
component: () => Promise<any>,
|
||||||
path: string,
|
path: string,
|
||||||
layout: ComponentType<SvelteComponentTyped<any>>,
|
layout: ComponentType<SvelteComponentTyped<any>> | null,
|
||||||
loading: ComponentType<SvelteComponentTyped<any>>,
|
loading: ComponentType<SvelteComponentTyped<any>> | null,
|
||||||
}
|
}
|
||||||
|
|
||||||
interface RouteDefault {
|
interface RouteConfig {
|
||||||
layout: ComponentType<SvelteComponentTyped<any>>,
|
routes: Route[],
|
||||||
loading: ComponentType<SvelteComponentTyped<any>>,
|
layout?: ComponentType<SvelteComponentTyped<any>> | null,
|
||||||
|
loading?: ComponentType<SvelteComponentTyped<any>> | null,
|
||||||
}
|
}
|
||||||
|
|
||||||
const defineRoutes = (routes: Route[], { layout = Layout, loading = Loading }: RouteDefault = { layout: Layout, loading: Loading }): RouteDefinition[] =>
|
const defineRoutes = (config: RouteConfig): RouteDefinition[] => {
|
||||||
routes.map(route => ({ ...route, layout: route?.layout ?? layout, loading: route?.loading ?? loading }))
|
return config.routes.map(route => ({ ...route, layout: route?.layout ?? config?.layout ?? null, loading: route?.loading ?? config?.loading ?? null }))
|
||||||
|
}
|
||||||
|
|
||||||
export default defineRoutes
|
export default defineRoutes
|
||||||
|
|
Loading…
Reference in New Issue