fix: no longer require pathParams if not dynamic url

Author: fredericoo

.changeset/silly-baboons-film.md

@@ -0,0 +1,5 @@
+---
+'react-router-typesafe': patch
+---
+
+`typesafeBrowserRouter`: no longer requires `pathParams` to be passed as an empty object when route does not have dynamic segments

src/__tests__/browser-router.test.ts

@@ -0,0 +1,40 @@
+import { test, expect } from 'bun:test';
+import { typesafeBrowserRouter } from '../browser-router';
+
+test('returns pathname with replaced params', () => {
+	const { href } = typesafeBrowserRouter([
+		{ path: '/blog', children: [{ path: '/blog/:postId', children: [{ path: '/blog/:postId/:commentId' }] }] },
+	]);
+
+	const output = href({ path: '/blog/:postId/:commentId', pathParams: { postId: 'foo', commentId: 'bar' } });
+
+	expect(output).toEqual('/blog/foo/bar');
+});
+
+test('returns pathname with search params if object is passed', () => {
+	const { href } = typesafeBrowserRouter([{ path: '/blog', children: [{ path: '/blog/:postId' }] }]);
+
+	const output = href({ path: '/blog/:postId', pathParams: { postId: 'foo' }, searchParams: { foo: 'bar' } });
+
+	expect(output).toEqual('/blog/foo?foo=bar');
+});
+
+test('returns pathname with search params if URLSearchParams is passed', () => {
+	const { href } = typesafeBrowserRouter([{ path: '/blog', children: [{ path: '/blog/:postId' }] }]);
+
+	const output = href({
+		path: '/blog/:postId',
+		pathParams: { postId: 'foo' },
+		searchParams: new URLSearchParams({ foo: 'bar' }),
+	});
+
+	expect(output).toEqual('/blog/foo?foo=bar');
+});
+
+test('returns pathname with hash', () => {
+	const { href } = typesafeBrowserRouter([{ path: '/blog', children: [{ path: '/blog/:postId' }] }]);
+
+	const output = href({ path: '/blog/:postId', pathParams: { postId: 'foo' }, hash: '#foo' });
+
+	expect(output).toEqual('/blog/foo#foo');
+});

src/browser-router.ts

@@ -1,51 +1,43 @@
 import { RouteObject, createBrowserRouter } from 'react-router-dom';
 import { F } from 'ts-toolbelt';
 
+type PathParams<T> = keyof T extends never ? { pathParams?: never } : { pathParams: T };
+
 type ExtractParam<Path, NextPart> = Path extends `:${infer Param}` ? Record<Param, string> & NextPart : NextPart;
 
 type ExtractParams<Path> = Path extends `${infer Segment}/${infer Rest}`
 	? ExtractParam<Segment, ExtractParams<Rest>>
 	: ExtractParam<Path, {}>;
 
+type PathWithParams<P extends string | undefined> = P extends string
+	? { path: P } & PathParams<ExtractParams<P>>
+	: never;
+
 type TypesafeRouteParams<Routes extends RouteObject[]> = {
-	[K in keyof Routes]: Routes[K] extends { path: string; children: RouteObject[] }
-		?
-				| { path: Routes[K]['path']; pathParams: ExtractParams<Routes[K]['path']> }
-				| TypesafeRouteParams<Routes[K]['children']>
-		: Routes[K] extends { path: string }
-		? { path: Routes[K]['path']; pathParams: ExtractParams<Routes[K]['path']> }
-		: never;
+	[K in keyof Routes]: Routes[K] extends { children: infer C extends RouteObject[] }
+		? PathWithParams<Routes[K]['path']> | TypesafeRouteParams<C>
+		: PathWithParams<Routes[K]['path']>;
 }[number];
 
 type TypesafeSearchParams = Record<string, string> | URLSearchParams;
 export type RouteExtraParams = { hash?: string; searchParams?: TypesafeSearchParams };
 
-function invariant(condition: any, message?: string): asserts condition {
-	if (condition) return;
-	throw new Error(message);
-}
-
 const joinValidWith =
 	(separator: string) =>
 	(...valid: any[]) =>
 		valid.filter(Boolean).join(separator);
 
-function assertPathAndParams(params: unknown): asserts params is { path: string; pathParams: Record<string, string> } {
-	invariant(params && typeof params === 'object' && 'path' in params && 'pathParams' in params);
-	invariant(typeof params.path === 'string');
-	invariant(typeof params.pathParams === 'object' && params.pathParams !== null);
-}
-
 export const typesafeBrowserRouter = <R extends RouteObject>(routes: F.Narrow<R[]>) => {
 	return {
 		router: createBrowserRouter(routes as RouteObject[]),
 		href: (route: TypesafeRouteParams<R[]> & RouteExtraParams) => {
-			assertPathAndParams(route);
-			let path = route.path;
 			// applies all params to the path
-			for (const param in route.pathParams) {
-				path = route.path.replace(`:${param}`, route.pathParams[param] as string);
-			}
+			const path = route.pathParams
+				? Object.keys(route.pathParams).reduce((path, param) => {
+						return path.replace(`:${param}`, route.pathParams![param as keyof typeof route.pathParams]);
+				  }, route.path)
+				: route.path;
+
 			const searchParams = new URLSearchParams(route.searchParams);
 			const hash = route.hash?.replace(/^#/, '');