feat: router with as const type parameters

Author: ismanapa

src/const-type-parameter/basic-example.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
 // Example with "as const"
 export type User = { name: string; age: number };
 

src/const-type-parameter/router/router-with-extract-params.ts

@@ -0,0 +1,65 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+type ExtractRouteParams<T> = T extends `:${infer P}/${infer Rest}`
+  ? P | ExtractRouteParams<`${Rest}`>
+  : T extends `:${infer P}`
+  ? P
+  : T extends `${infer _Start}/${infer Rest}`
+  ? ExtractRouteParams<Rest>
+  : never;
+
+type RouteParamsObject<T extends string> = {
+  [key in T]: string;
+};
+
+export type Route = {
+  name: string;
+  path: string;
+};
+
+function buildRouter<const T extends Route>(routes: T[]) {
+  const getRoute = <
+    RouteName extends T["name"],
+    RouteParams extends RouteParamsObject<
+      ExtractRouteParams<Extract<T, { name: RouteName }>["path"]>
+    >
+  >(
+    name: RouteName,
+    params: RouteParams
+  ): string => {
+    const route = routes.find((n) => n.name && n.name === name)!.path;
+
+    Object.entries<string>(params).forEach(([key, value]) => {
+      route.replace(`:${key}`, value);
+    });
+
+    return route;
+  };
+  return { getRoute };
+}
+
+// Ejemplo de narrowing que explicando el porque funciona la firma anterior
+type GeneratedRoutesType =
+  | { name: "login"; path: "/login"; params: [] }
+  | { name: "courses"; path: "/courses/:category/:year"; params: ["category"] };
+
+type RouteNames = GeneratedRoutesType["name"];
+//     ^?
+
+type RouteParams = Extract<GeneratedRoutesType, { name: "courses" }>["params"];
+//     ^?
+
+type RoutePath = Extract<GeneratedRoutesType, { name: "courses" }>["path"];
+//     ^?
+
+const { getRoute } = buildRouter([
+  {
+    name: "login",
+    path: "/login",
+  },
+  {
+    name: "courses",
+    path: "/courses/:category",
+  },
+]);
+
+const route = getRoute("courses", { category: "TypeScript" });

src/const-type-parameter/router/router.ts

@@ -0,0 +1,51 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+export type Route = {
+  name: string;
+  path: string;
+  params: readonly string[];
+};
+
+function buildRouter<const T extends Route>(routes: T[]) {
+  const getRoute = <
+    RouteName extends T["name"],
+    RouteParams extends Extract<T, { name: RouteName }>["params"]
+  >(
+    name: RouteName,
+    params: { [key in RouteParams[number]]: string }
+  ): string => {
+    const route = routes.find((n) => n.name && n.name === name)!.path;
+
+    Object.entries<string>(params).forEach(([key, value]) => {
+      route.replace(`:${key}`, value);
+    });
+
+    return route;
+  };
+  return { getRoute };
+}
+
+// Ejemplo de narrowing que explicando el porque funciona la firma anterior
+type GeneratedRoutesType =
+  | { name: "login"; path: "/login"; params: [] }
+  | { name: "courses"; path: "/courses"; params: ["category"] };
+
+type RouteNames = GeneratedRoutesType["name"];
+//     ^?
+
+type RouteParams = Extract<GeneratedRoutesType, { name: "courses" }>["params"];
+//     ^?
+
+const { getRoute } = buildRouter([
+  {
+    name: "login",
+    path: "/login",
+    params: [],
+  },
+  {
+    name: "courses",
+    path: "/courses/:category",
+    params: ["category"],
+  },
+]);
+
+const route = getRoute("courses", { category: "typescript" });