Skip to content

Commit 1e56d29

Browse files
posvaposva
committed
chore: update vue router usage
1 parent cb8b200 commit 1e56d29

File tree

5 files changed

+143
-62
lines changed

5 files changed

+143
-62
lines changed

‎src/codegen/generateRouteResolver.spec.ts‎

Lines changed: 29 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ describe('generateRouteRecordPath', () => {
5656
expect(
5757
generateRouteRecordPath({ importsMap, node, paramParsersMap: new Map() })
5858
).toMatchInlineSnapshot(`
59-
"path: new MatcherPatternPathCustomParams(
59+
"path: new MatcherPatternPathDynamic(
6060
/^\\/a\\/([^/]+?)$/i,
6161
{
6262
b: {},
@@ -75,7 +75,7 @@ describe('generateRouteRecordPath', () => {
7575
paramParsersMap: new Map(),
7676
})
7777
).toMatchInlineSnapshot(`
78-
"path: new MatcherPatternPathCustomParams(
78+
"path: new MatcherPatternPathDynamic(
7979
/^\\/a\\/([^/]+?)\\/([^/]+?)$/i,
8080
{
8181
b: {},
@@ -91,7 +91,7 @@ describe('generateRouteRecordPath', () => {
9191
expect(
9292
generateRouteRecordPath({ importsMap, node, paramParsersMap: new Map() })
9393
).toMatchInlineSnapshot(`
94-
"path: new MatcherPatternPathCustomParams(
94+
"path: new MatcherPatternPathDynamic(
9595
/^\\/a\\/([^/]+?)?$/i,
9696
{
9797
b: {},
@@ -106,7 +106,7 @@ describe('generateRouteRecordPath', () => {
106106
expect(
107107
generateRouteRecordPath({ importsMap, node, paramParsersMap: new Map() })
108108
).toMatchInlineSnapshot(`
109-
"path: new MatcherPatternPathCustomParams(
109+
"path: new MatcherPatternPathDynamic(
110110
/^\\/a\\/(.+?)$/i,
111111
{
112112
b: {repeat: true, },
@@ -121,7 +121,7 @@ describe('generateRouteRecordPath', () => {
121121
expect(
122122
generateRouteRecordPath({ importsMap, node, paramParsersMap: new Map() })
123123
).toMatchInlineSnapshot(`
124-
"path: new MatcherPatternPathCustomParams(
124+
"path: new MatcherPatternPathDynamic(
125125
/^\\/a\\/(.+?)?$/i,
126126
{
127127
b: {repeat: true, },
@@ -139,7 +139,7 @@ describe('generateRouteRecordPath', () => {
139139
expect(
140140
generateRouteRecordPath({ importsMap, node, paramParsersMap: new Map() })
141141
).toMatchInlineSnapshot(`
142-
"path: new MatcherPatternPathCustomParams(
142+
"path: new MatcherPatternPathDynamic(
143143
/^\\/a\\/a-([^/]+?)-c-([^/]+?)$/i,
144144
{
145145
b: {},
@@ -243,7 +243,7 @@ describe('generateRouteResolver', () => {
243243
},
244244
})
245245
246-
export const resolver = createStaticResolver([
246+
export const resolver = createFixedResolver([
247247
r_2, // /b/c/d
248248
r_3, // /b/e/f
249249
r_1, // /b/c
@@ -274,7 +274,7 @@ describe('generateRouteResolver', () => {
274274
new Map()
275275
)
276276

277-
expect(resolver.replace(/^.*?createStaticResolver/s, ''))
277+
expect(resolver.replace(/^.*?createFixedResolver/s, ''))
278278
.toMatchInlineSnapshot(`
279279
"([
280280
r_10, // /b/a-b
@@ -340,7 +340,7 @@ describe('generateRouteResolver', () => {
340340
},
341341
})
342342
343-
export const resolver = createStaticResolver([
343+
export const resolver = createFixedResolver([
344344
r_2, // /b/c/d
345345
r_3, // /b/e/f
346346
r_1, // /b/c
@@ -381,7 +381,7 @@ describe('generateRouteResolver', () => {
381381
parent: r_0,
382382
})
383383
384-
export const resolver = createStaticResolver([
384+
export const resolver = createFixedResolver([
385385
r_1, // /a/b/c/e
386386
r_0, // /a
387387
])
@@ -422,7 +422,7 @@ describe('generateRouteResolver', () => {
422422
parent: r_0,
423423
})
424424
425-
export const resolver = createStaticResolver([
425+
export const resolver = createFixedResolver([
426426
r_1, // /a/b/c
427427
])
428428
"
@@ -460,7 +460,7 @@ describe('generateRouteResolver', () => {
460460
},
461461
})
462462
463-
export const resolver = createStaticResolver([
463+
export const resolver = createFixedResolver([
464464
r_0, // /users
465465
])
466466
"
@@ -494,14 +494,13 @@ describe('generateRouteResolver', () => {
494494
components: {
495495
'default': () => import('profile.vue')
496496
},
497-
498497
},
499498
_definePage_default_0
500499
)
501500
)
502501
503502
504-
export const resolver = createStaticResolver([
503+
export const resolver = createFixedResolver([
505504
r_0, // /profile
506505
])
507506
"
@@ -605,6 +604,22 @@ describe('route prioritization in resolver', () => {
605604
])
606605
})
607606

607+
it('handles catch all with prefix before generic param', () => {
608+
const tree = new PrefixTree(DEFAULT_OPTIONS)
609+
610+
tree.insert('api/v1/users', 'api/v1/users.vue')
611+
tree.insert('api/v1/[type]', 'api/v1/[type].vue')
612+
tree.insert('api/v1/[type]/c', 'api/v1/[type].vue')
613+
tree.insert('api/v1/teams/[...id]', 'api/v1/teams/[...id].vue')
614+
615+
expect(getRouteOrderFromResolver(tree)).toEqual([
616+
'/api/v1/users',
617+
'/api/v1/teams/:id(.*)',
618+
'/api/v1/:type/c',
619+
'/api/v1/:type',
620+
])
621+
})
622+
608623
it('handles complex subsegments in deeply nested routes', () => {
609624
const tree = new PrefixTree(DEFAULT_OPTIONS)
610625

‎src/codegen/generateRouteResolver.ts‎

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -77,16 +77,15 @@ export function generateRouteResolver(
7777
})
7878
)
7979

80-
importsMap.add('vue-router/experimental', 'createStaticResolver')
80+
importsMap.add('vue-router/experimental', 'createFixedResolver')
8181
importsMap.add('vue-router/experimental', 'MatcherPatternPathStatic')
82-
importsMap.add('vue-router/experimental', 'MatcherPatternPathCustomParams')
83-
importsMap.add('vue-router/experimental', 'MatcherPatternPathStar')
82+
importsMap.add('vue-router/experimental', 'MatcherPatternPathDynamic')
8483
importsMap.add('vue-router/experimental', 'normalizeRouteRecord')
8584

8685
return ts`
8786
${records.join('\n\n')}
8887
89-
export const resolver = createStaticResolver([
88+
export const resolver = createFixedResolver([
9089
${state.matchableRecords
9190
.sort((a, b) => compareRouteScore(a.score, b.score))
9291
.map(
@@ -168,8 +167,7 @@ export function generateRouteRecord({
168167
const routeRecordObject = `{
169168
${recordName}
170169
${generateRouteRecordPath({ node, importsMap, paramParsersMap })}${formatMeta(node, ' ')}
171-
${recordComponents}
172-
${parentVar ? `parent: ${parentVar},` : ''}
170+
${recordComponents}${parentVar ? `\n parent: ${parentVar},` : ''}
173171
}`
174172

175173
recordDeclaration =
@@ -247,7 +245,7 @@ export function generateRouteRecordPath({
247245
}
248246
const params = node.params
249247
if (params.length > 0) {
250-
return `path: new MatcherPatternPathCustomParams(
248+
return `path: new MatcherPatternPathDynamic(
251249
${node.regexp},
252250
${generateParamsOptions(node.params, importsMap, paramParsersMap)},
253251
${JSON.stringify(node.matcherParts)},

‎src/core/context.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,10 @@ export function createRoutesContext(options: ResolvedOptions) {
140140
relativePath: relative(options.root, absolutePath),
141141
})
142142
}
143-
logger.log('Parsed param parsers', [...paramParsers])
143+
logger.log(
144+
'Parsed param parsers',
145+
[...paramParsers].map((p) => p[0])
146+
)
144147
})
145148
}) || []),
146149
])

‎src/runtime-experimental.ts‎

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
import { EXPERIMENTAL_RouteRecord_Matchable } from 'vue-router/dist/router-DpX2dUg6.mjs'
2+
3+
/**
4+
* Defines properties of the route for the current page component.
5+
*
6+
* @param route - route information to be added to this page
7+
* @deprecated - use `definePage` instead
8+
*/
9+
export const _definePage = (route: DefinePage) => route
10+
11+
/**
12+
* Defines properties of the route for the current page component.
13+
*
14+
* @param route - route information to be added to this page
15+
*/
16+
export const definePage = (route: DefinePage) => route
17+
18+
/**
19+
* Type to define a page. Can be augmented to add custom properties.
20+
*/
21+
export interface DefinePage
22+
extends Partial<
23+
Pick<EXPERIMENTAL_RouteRecord_Matchable, 'meta' | 'redirect'>
24+
> {
25+
/**
26+
* A route name. If not provided, the name will be generated based on the file path.
27+
* Can be set to `false` to remove the name from types.
28+
*/
29+
name?: string | false
30+
31+
// TODO: figure out a syntax that makes sense and is type safe:
32+
// - should allow to change the type of path params either to a src/params file or just write
33+
// the function inline (which means we need to extract the function type). The issue is that there might be a lot of edge cases about imports and local declarations of variables and types
34+
params?: {}
35+
// TODO: add a custom serialization based on the query object completely that
36+
// allows and extracts a function
37+
// query?: Record<string, QueryParamType | DefinePageQueryParamOptions>
38+
}
39+
40+
/**
41+
* TODO:
42+
* - User should be able to define a lax object matcher with a validation library
43+
* - should be easy to use if they throw inside the param
44+
*/
45+
46+
export type QueryParamType = 'int' | 'bool'
47+
48+
/**
49+
* Configures how to extract a route param from a specific query parameter.
50+
*/
51+
export interface DefinePageQueryParamOptions {
52+
/**
53+
* The type of the query parameter. Allowed values are native param parsers
54+
* and any parser in the {@link https://uvr.esm.is/TODO | params folder }.
55+
*/
56+
type: QueryParamType
57+
58+
/**
59+
* Defines whether the query parameter can be omitted or not. If false, the
60+
* route won't match if the query parameter is not present.
61+
*
62+
* @default false
63+
*/
64+
optional?: boolean
65+
66+
/**
67+
* Can the query parameter be repeated? If true, it will always return an
68+
* array of values. If false, it will return the first value and ignore the
69+
* rest.
70+
*
71+
* @default false
72+
*/
73+
repeatable?: boolean
74+
}
75+
76+
/**
77+
* Merges route record objects for the experimental resolver format.
78+
* This function is specifically designed to work with objects that will be passed to normalizeRouteRecord().
79+
*
80+
* @internal
81+
*
82+
* @param main - main route record object
83+
* @param routeRecords - route records to merge (from definePage imports)
84+
* @returns merged route record object
85+
*/
86+
export function _mergeRouteRecord(
87+
// NOTE: we can't import from experimental because it changes the types of `children`
88+
// import type { EXPERIMENTAL_RouteRecordRaw } from 'vue-router/experimental'
89+
main: {
90+
[x: string]: unknown
91+
meta?: Record<string, unknown>
92+
},
93+
...routeRecords: Partial<DefinePage>[]
94+
) {
95+
return routeRecords.reduce((acc, routeRecord) => {
96+
Object.assign(acc, routeRecord)
97+
acc.meta = { ...acc.meta, ...routeRecord.meta }
98+
99+
return acc
100+
}, main)
101+
}
102+
103+
// FIXME: refactor and remove
104+
export const _mergeRouteRecordExperimental = _mergeRouteRecord

‎src/runtime.ts‎

Lines changed: 1 addition & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -58,48 +58,9 @@ export interface DefinePage
5858
* Can be set to `false` to remove the name from types.
5959
*/
6060
name?: string | false
61-
62-
// TODO: add a custom serialization based on the query object completely that
63-
// allows and extracts a function
64-
query?: Record<string, QueryParamType | DefinePageQueryParamOptions>
65-
}
66-
67-
/**
68-
* TODO:
69-
* - User should be able to define a lax object matcher with a validation library
70-
* - should be easy to use if they throw inside the param
71-
*/
72-
73-
export type QueryParamType = 'int' | 'bool'
74-
75-
/**
76-
* Configures how to extract a route param from a specific query parameter.
77-
*/
78-
export interface DefinePageQueryParamOptions {
79-
/**
80-
* The type of the query parameter. Allowed values are native param parsers
81-
* and any parser in the {@link https://uvr.esm.is/TODO | params folder }.
82-
*/
83-
type: QueryParamType
84-
85-
/**
86-
* Defines whether the query parameter can be omitted or not. If false, the
87-
* route won't match if the query parameter is not present.
88-
*
89-
* @default false
90-
*/
91-
optional?: boolean
92-
93-
/**
94-
* Can the query parameter be repeated? If true, it will always return an
95-
* array of values. If false, it will return the first value and ignore the
96-
* rest.
97-
*
98-
* @default false
99-
*/
100-
repeatable?: boolean
10161
}
10262

63+
// TODO: remove as it's in runtime-experimental
10364
/**
10465
* Merges route record objects for the experimental resolver format.
10566
* This function is specifically designed to work with objects that will be passed to normalizeRouteRecord().

0 commit comments

Comments
 (0)