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