Skip to content

Commit 12decde

Browse files
author
Jacek
committed
chore(nuxt): Deprecate createRouteMatcher
1 parent 7c56495 commit 12decde

5 files changed

Lines changed: 134 additions & 0 deletions

File tree

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
---
2+
'@clerk/nuxt': patch
3+
---
4+
5+
Deprecate `createRouteMatcher()` in favor of Nuxt's native route matching.
6+
7+
To protect API routes, match paths natively inside `clerkMiddleware()`:
8+
9+
```ts
10+
import { clerkMiddleware } from '@clerk/nuxt/server';
11+
12+
export default clerkMiddleware(event => {
13+
const { isAuthenticated } = event.context.auth();
14+
const { pathname } = getRequestURL(event);
15+
16+
if (!isAuthenticated && pathname.startsWith('/api/admin')) {
17+
throw createError({ statusCode: 401, statusMessage: 'Unauthorized' });
18+
}
19+
});
20+
```
21+
22+
To protect pages, use Nuxt's built-in route middleware: create a named middleware that checks the user's authentication status and opt pages into it with `definePageMeta({ middleware: 'auth' })`. Child routes inherit the middleware applied to their parent, so a single declaration can protect a whole section.
23+
24+
```ts
25+
// app/middleware/auth.ts
26+
export default defineNuxtRouteMiddleware(() => {
27+
const { isSignedIn } = useAuth();
28+
29+
if (!isSignedIn.value) {
30+
return navigateTo('/sign-in');
31+
}
32+
});
33+
```
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import { beforeEach, describe, expect, it, vi } from 'vitest';
2+
3+
import { createRouteMatcher } from '../routeMatcher';
4+
5+
const { mockDeprecated } = vi.hoisted(() => ({
6+
mockDeprecated: vi.fn(),
7+
}));
8+
9+
vi.mock('@clerk/shared/deprecated', () => ({
10+
deprecated: mockDeprecated,
11+
}));
12+
13+
describe('createRouteMatcher', () => {
14+
beforeEach(() => {
15+
mockDeprecated.mockClear();
16+
});
17+
18+
it('should emit a deprecation warning when called', () => {
19+
createRouteMatcher(['/dashboard(.*)']);
20+
21+
expect(mockDeprecated).toHaveBeenCalledWith(
22+
'createRouteMatcher',
23+
"Use Nuxt's built-in route middleware to protect pages instead: create a named middleware that checks the user's authentication status and opt pages into it with `definePageMeta({ middleware: 'auth' })`.",
24+
);
25+
});
26+
});

‎packages/nuxt/src/runtime/client/routeMatcher.ts‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { deprecated } from '@clerk/shared/deprecated';
12
import { createPathMatcher, type PathMatcherParam } from '@clerk/shared/pathMatcher';
23
import type { RouteMiddleware } from 'nuxt/app';
34

@@ -14,8 +15,29 @@ export type RouteMatcherParam = PathMatcherParam;
1415
* ['/foo', '/bar(.*)']
1516
* @example
1617
* [/^\/foo\/.*$/]
18+
*
19+
* @deprecated This function will be removed in the next major version. Use Nuxt's built-in
20+
* route middleware to protect pages instead: create a named middleware that checks the user's
21+
* authentication status and opt pages into it with `definePageMeta()`. Child routes inherit
22+
* the middleware applied to their parent, so a single declaration can protect a whole section.
23+
*
24+
* ```ts
25+
* // app/middleware/auth.ts
26+
* export default defineNuxtRouteMiddleware(() => {
27+
* const { isSignedIn } = useAuth();
28+
*
29+
* if (!isSignedIn.value) {
30+
* return navigateTo('/sign-in');
31+
* }
32+
* });
33+
* ```
1734
*/
1835
export const createRouteMatcher = (routes: RouteMatcherParam) => {
36+
deprecated(
37+
'createRouteMatcher',
38+
"Use Nuxt's built-in route middleware to protect pages instead: create a named middleware that checks the user's authentication status and opt pages into it with `definePageMeta({ middleware: 'auth' })`.",
39+
);
40+
1941
const matcher = createPathMatcher(routes);
2042
return (to: RouteLocation) => matcher(to.path);
2143
};
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import { getRequestURL } from 'h3';
2+
import { beforeEach, describe, expect, it, vi } from 'vitest';
3+
4+
import { createRouteMatcher } from '../routeMatcher';
5+
6+
const { mockDeprecated } = vi.hoisted(() => ({
7+
mockDeprecated: vi.fn(),
8+
}));
9+
10+
vi.mock('@clerk/shared/deprecated', () => ({
11+
deprecated: mockDeprecated,
12+
}));
13+
14+
vi.mock('#imports', () => ({
15+
getRequestURL,
16+
}));
17+
18+
describe('createRouteMatcher', () => {
19+
beforeEach(() => {
20+
mockDeprecated.mockClear();
21+
});
22+
23+
it('should emit a deprecation warning when called', () => {
24+
createRouteMatcher(['/api/admin(.*)']);
25+
26+
expect(mockDeprecated).toHaveBeenCalledWith(
27+
'createRouteMatcher',
28+
"Match API route paths natively inside `clerkMiddleware()` instead, for example: `getRequestURL(event).pathname.startsWith('/api/admin')`. To protect pages, use Nuxt's built-in route middleware.",
29+
);
30+
});
31+
});

‎packages/nuxt/src/runtime/server/routeMatcher.ts‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { deprecated } from '@clerk/shared/deprecated';
12
import type { PathMatcherParam } from '@clerk/shared/pathMatcher';
23
import { createPathMatcher } from '@clerk/shared/pathMatcher';
34
import type { H3Event } from 'h3';
@@ -15,8 +16,29 @@ export type RouteMatcherParam = PathMatcherParam;
1516
* ['/foo', '/bar(.*)']
1617
* @example
1718
* [/^\/foo\/.*$/]
19+
*
20+
* @deprecated This function will be removed in the next major version. Match API route paths natively
21+
* inside `clerkMiddleware()` instead, and protect pages with Nuxt's built-in route middleware:
22+
*
23+
* ```ts
24+
* import { clerkMiddleware } from '@clerk/nuxt/server';
25+
*
26+
* export default clerkMiddleware(event => {
27+
* const { isAuthenticated } = event.context.auth();
28+
* const { pathname } = getRequestURL(event);
29+
*
30+
* if (!isAuthenticated && pathname.startsWith('/api/admin')) {
31+
* throw createError({ statusCode: 401, statusMessage: 'Unauthorized' });
32+
* }
33+
* });
34+
* ```
1835
*/
1936
export const createRouteMatcher = (routes: RouteMatcherParam) => {
37+
deprecated(
38+
'createRouteMatcher',
39+
"Match API route paths natively inside `clerkMiddleware()` instead, for example: `getRequestURL(event).pathname.startsWith('/api/admin')`. To protect pages, use Nuxt's built-in route middleware.",
40+
);
41+
2042
const matcher = createPathMatcher(routes);
2143
return (event: H3Event) => {
2244
const url = getRequestURL(event);

0 commit comments

Comments
 (0)