@uxf/router 11.72.4 → 11.78.0

package/README.md

@@ -119,6 +119,62 @@ export default () => (
 )
 ```
 
+## RouteMatcher
+
+```tsx
+import { createRouteMatcher } from "@app-routes";
+
+// create active resolver
+const routeMatcher = createRouteMatcher("admin/index", { param1: 123 });
+// or
+const routeMatcher = createRouteMatcher("admin/index");
+
+// how to use in component
+
+function MyComponent() {
+    const router = useRouter();
+    const isRouteActive = routeMatcher(router);
+    
+    return <div>{isRouteActive ? "active" : "not active"}</div>;
+}
+```
+
+### Custom route matchers
+
+```tsx
+function createPathnameRouteMatcher(path: string): RouteMatcher {
+    return (router) => {
+        return router.pathname.startsWith(path);
+    }
+}
+```
+
+```tsx
+import { getCurrentRoute } from "@app-routes";
+
+function createCustomRouteMatcher(): RouteMatcher {
+    return (router) => {
+        const { route, params } = getCurrentRoute(router);
+        if (route === "admin/index") {
+            // do something
+        } else if (route === "admin/form") {
+            // do something
+        }
+    }
+}
+```
+
+### Merge multiple route matchers
+
+```tsx
+import { mergeRouteMatchers } from "@uxf/router";
+
+const routeMatcher = mergeRouteMatchers([
+    createRouteMatcher("admin/index"), 
+    createRouteMatcher("admin/form"),
+]);
+```
+
 ## GetStaticProps
 
 ```tsx

package/index.d.ts

@@ -1,3 +1,4 @@
 export * from "./helper";
+export * from "./merge-route-matchers";
 export * from "./router";
 export * from "./types";

package/index.js

@@ -15,5 +15,6 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./helper"), exports);
+__exportStar(require("./merge-route-matchers"), exports);
 __exportStar(require("./router"), exports);
 __exportStar(require("./types"), exports);

package/merge-route-matchers.d.ts

@@ -0,0 +1,2 @@
+import { RouteMatcher } from "./router";
+export declare function mergeRouteMatchers(routeMatchers: RouteMatcher[]): RouteMatcher;

package/merge-route-matchers.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mergeRouteMatchers = mergeRouteMatchers;
+function mergeRouteMatchers(routeMatchers) {
+    return (router) => routeMatchers.some((routeMatcher) => routeMatcher(router));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@uxf/router",
-    "version": "11.72.4",
+    "version": "11.78.0",
     "description": "UXF Router",
     "author": "UXFans <dev@uxf.cz>",
     "homepage": "https://gitlab.com/uxf-npm/router#readme",

package/router.d.ts

@@ -1,4 +1,5 @@
 import { LinkProps } from "next/link";
+import { NextRouter } from "next/router";
 import { Infer, Struct } from "superstruct";
 import { SitemapGeneratorOptions, SitemapGeneratorType, SitemapRouteResolvers } from "./sitemap-generator";
 import { QueryParams, RoutesDefinition } from "./types";
@@ -14,6 +15,9 @@ type LocaleOptions<Locales extends string[]> = {
 export type FunctionParametersGenerator<Locales extends string[], RouteList extends RoutesDefinition<Locales>> = {
     [K in keyof RouteList]: RouteList[K]["path"] extends string ? "schema" extends keyof RouteList[K] ? [K, ExtractSchema<RouteList[K]>, Options?] : [K, null?, Options?] : "schema" extends keyof RouteList[K] ? [K, ExtractSchema<RouteList[K]>, Options & LocaleOptions<Locales>] : [K, null, Options & LocaleOptions<Locales>];
 }[keyof RouteList];
+export type FunctionParametersGeneratorWithPartialParams<Locales extends string[], RouteList extends RoutesDefinition<Locales>> = {
+    [K in keyof RouteList]: "schema" extends keyof RouteList[K] ? [K, Partial<ExtractSchema<RouteList[K]>>?] : [K, null?];
+}[keyof RouteList];
 type RouteFunction<Locales extends string[], RouteList extends RoutesDefinition<Locales>> = (...args: FunctionParametersGenerator<Locales, RouteList>) => LinkProps["href"];
 type RouteToUrlFunction<Locales extends string[], RouteList extends RoutesDefinition<Locales>> = (...args: FunctionParametersGenerator<Locales, RouteList>) => string;
 type QueryParamsResult<Nullable extends boolean, T extends keyof RouteList, Locales extends string[], RouteList extends RoutesDefinition<Locales>> = [
@@ -23,11 +27,20 @@ type QueryParamsResult<Nullable extends boolean, T extends keyof RouteList, Loca
         replace: (params: Infer<NonNullable<RouteList[T]["schema"]>>) => Promise<boolean>;
     }
 ];
+type SimplyNextRouter = Pick<NextRouter, "pathname" | "query" | "isReady">;
+export type RouteMatcher = (router: SimplyNextRouter) => boolean;
+type CurrentRoute<RouteList extends RoutesDefinition<any>> = {
+    [K in keyof RouteList]: {
+        route: K;
+        params: "schema" extends keyof RouteList[K] ? ExtractSchema<RouteList[K]> | null : null;
+    };
+}[keyof RouteList];
 type Router<Locales extends string[], RouteList extends RoutesDefinition<Locales>> = {
     route: RouteFunction<Locales, RouteList>;
     routeToUrl: RouteToUrlFunction<Locales, RouteList>;
     createSitemapGenerator: (resolvers: SitemapRouteResolvers<Locales, RouteList>, options?: SitemapGeneratorOptions) => SitemapGeneratorType;
     routes: RouteList;
+    getCurrentRoute: (router: SimplyNextRouter) => CurrentRoute<RouteList>;
     useActiveRoute: () => ActiveRoute<Locales, RouteList>;
     /**
      * @deprecated use useQueryParamsStatic or useQueryParams instead
@@ -35,6 +48,7 @@ type Router<Locales extends string[], RouteList extends RoutesDefinition<Locales
     useQueryParamsDeprecated: <T extends keyof RouteList>() => QueryParams<RouteList, T>;
     useQueryParams: <T extends keyof RouteList>(routeName: T) => QueryParamsResult<false, T, Locales, RouteList>;
     useQueryParamsStatic: <T extends keyof RouteList>(routeName: T) => QueryParamsResult<true, T, Locales, RouteList>;
+    createRouteMatcher: (...args: FunctionParametersGeneratorWithPartialParams<Locales, RouteList>) => RouteMatcher;
 };
 type RouterOptions<L extends string[]> = {
     baseUrl?: string;

package/router.js

@@ -16,6 +16,72 @@ function decodeArgs(args) {
     return { route: args[0], params: args[1], options: args[2] };
 }
 function createRouter(routes, routerOptions) {
+    const routeToUrl = (...args) => {
+        var _a;
+        const { route, params, options } = decodeArgs(args);
+        let pathname = typeof routes[route].path === "string"
+            ? routes[route].path
+            : routes[route].path[(_a = options === null || options === void 0 ? void 0 : options.locale) !== null && _a !== void 0 ? _a : (0, throw_error_1.throwError)("Locale is required")];
+        if (!pathname) {
+            throw new Error(`Route '${String(route)}' not found.`);
+        }
+        const restParams = {};
+        // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+        Object.keys(params !== null && params !== void 0 ? params : empty_object_1.EMPTY_OBJECT).forEach((key) => {
+            const value = params[key];
+            const segment = `[${key}]`;
+            const catchAllSegments = `[...${key}]`;
+            const catchAllSegmentsOptional = `[[...${key}]]`;
+            if (pathname.includes(segment)) {
+                pathname = pathname.replace(segment, value);
+            }
+            else if (pathname.includes(catchAllSegmentsOptional)) {
+                if ((Array.isArray(value) && value.length === 0) ||
+                    value === null ||
+                    value === undefined ||
+                    value === "") {
+                    pathname = pathname.replace(`/${catchAllSegmentsOptional}`, "");
+                }
+                else if (Array.isArray(value)) {
+                    // catch all segments optional
+                    pathname = pathname.replace(catchAllSegmentsOptional, value.join("/"));
+                }
+                else {
+                    pathname = pathname.replace(catchAllSegmentsOptional, value);
+                }
+            }
+            else if (pathname.includes(catchAllSegments)) {
+                // catch all segments
+                if (Array.isArray(value)) {
+                    if (value.length === 0) {
+                        throw new Error(`Parameter '${key}' can not be empty array for route '${String(route)}'`);
+                    }
+                    pathname = pathname.replace(catchAllSegments, value.join("/"));
+                }
+                else {
+                    pathname = pathname.replace(catchAllSegments, value);
+                }
+            }
+            else {
+                restParams[key] = value;
+            }
+        });
+        if (Object.keys(restParams).length > 0) {
+            pathname = `${pathname}?${(0, qs_1.stringify)(restParams, { arrayFormat: "repeat" })}`;
+        }
+        return (options === null || options === void 0 ? void 0 : options.shouldBeAbsolute) ? `${routerOptions.baseUrl}${pathname}` : pathname;
+    };
+    const getCurrentRoute = (router) => {
+        const activeRoute = Object.keys(routes).find((route) => typeof routes[route].path === "string"
+            ? routes[route].path === router.pathname
+            : Object.values(routes[route].path).includes(router.pathname));
+        if (!activeRoute) {
+            throw new Error("Active route not found.");
+        }
+        const schema = routes[activeRoute].schema;
+        const params = router.isReady && schema ? (0, superstruct_1.mask)(router.query, schema) : null;
+        return { route: activeRoute, params };
+    };
     return {
         route(...args) {
             var _a;
@@ -28,61 +94,7 @@ function createRouter(routes, routerOptions) {
                 query: params !== null && params !== void 0 ? params : null,
             };
         },
-        routeToUrl(...args) {
-            var _a;
-            const { route, params, options } = decodeArgs(args);
-            let pathname = typeof routes[route].path === "string"
-                ? routes[route].path
-                : routes[route].path[(_a = options === null || options === void 0 ? void 0 : options.locale) !== null && _a !== void 0 ? _a : (0, throw_error_1.throwError)("Locale is required")];
-            if (!pathname) {
-                throw new Error(`Route '${String(route)}' not found.`);
-            }
-            const restParams = {};
-            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-            Object.keys(params !== null && params !== void 0 ? params : empty_object_1.EMPTY_OBJECT).forEach((key) => {
-                const value = params[key];
-                const segment = `[${key}]`;
-                const catchAllSegments = `[...${key}]`;
-                const catchAllSegmentsOptional = `[[...${key}]]`;
-                if (pathname.includes(segment)) {
-                    pathname = pathname.replace(segment, value);
-                }
-                else if (pathname.includes(catchAllSegmentsOptional)) {
-                    if ((Array.isArray(value) && value.length === 0) ||
-                        value === null ||
-                        value === undefined ||
-                        value === "") {
-                        pathname = pathname.replace(`/${catchAllSegmentsOptional}`, "");
-                    }
-                    else if (Array.isArray(value)) {
-                        // catch all segments optional
-                        pathname = pathname.replace(catchAllSegmentsOptional, value.join("/"));
-                    }
-                    else {
-                        pathname = pathname.replace(catchAllSegmentsOptional, value);
-                    }
-                }
-                else if (pathname.includes(catchAllSegments)) {
-                    // catch all segments
-                    if (Array.isArray(value)) {
-                        if (value.length === 0) {
-                            throw new Error(`Parameter '${key}' can not be empty array for route '${String(route)}'`);
-                        }
-                        pathname = pathname.replace(catchAllSegments, value.join("/"));
-                    }
-                    else {
-                        pathname = pathname.replace(catchAllSegments, value);
-                    }
-                }
-                else {
-                    restParams[key] = value;
-                }
-            });
-            if (Object.keys(restParams).length > 0) {
-                pathname = `${pathname}?${(0, qs_1.stringify)(restParams, { arrayFormat: "repeat" })}`;
-            }
-            return (options === null || options === void 0 ? void 0 : options.shouldBeAbsolute) ? `${routerOptions.baseUrl}${pathname}` : pathname;
-        },
+        routeToUrl,
         useActiveRoute() {
             var _a;
             const router = (0, router_1.useRouter)();
@@ -114,8 +126,8 @@ function createRouter(routes, routerOptions) {
             return [
                 (0, superstruct_1.mask)(router.query, schema),
                 {
-                    push: (params) => router.push(this.routeToUrl(routeName, params, {})),
-                    replace: (params) => router.replace(this.routeToUrl(routeName, params, {})),
+                    push: (params) => router.push(routeToUrl(routeName, params, {})),
+                    replace: (params) => router.replace(routeToUrl(routeName, params, {})),
                 },
             ];
         },
@@ -128,10 +140,29 @@ function createRouter(routes, routerOptions) {
             return [
                 router.isReady ? (0, superstruct_1.mask)(router.query, schema) : null,
                 {
-                    push: (params) => router.push(this.routeToUrl(routeName, params, {})),
-                    replace: (params) => router.replace(this.routeToUrl(routeName, params, {})),
+                    push: (params) => router.push(routeToUrl(routeName, params, {})),
+                    replace: (params) => router.replace(routeToUrl(routeName, params, {})),
                 },
             ];
         },
+        getCurrentRoute,
+        createRouteMatcher(...args) {
+            const [requiredRouteName, requiredParams] = args;
+            return (router) => {
+                const { route, params } = getCurrentRoute(router);
+                if (route !== requiredRouteName) {
+                    return false;
+                }
+                if (!requiredParams || Object.keys(requiredParams).length === 0) {
+                    return true;
+                }
+                for (const [paramName, paramValue] of Object.entries(requiredParams)) {
+                    if ((params === null || params === void 0 ? void 0 : params[paramName]) !== paramValue) {
+                        return false;
+                    }
+                }
+                return true;
+            };
+        },
     };
 }

package/router.test.js

@@ -1,15 +1,25 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const superstruct_1 = require("superstruct");
+const merge_route_matchers_1 = require("./merge-route-matchers");
 const router_1 = require("./router");
 const superstruct_2 = require("./superstruct");
-const { routeToUrl } = (0, router_1.createRouter)({
+const { routeToUrl, createRouteMatcher } = (0, router_1.createRouter)({
     index: {
         path: "/",
         schema: (0, superstruct_1.object)({
             queryParam: (0, superstruct_1.optional)((0, superstruct_1.string)()),
         }),
     },
+    manyParameters: {
+        path: "/many-parameters/[param1]/form/[param2]",
+        schema: (0, superstruct_1.object)({
+            param1: (0, superstruct_1.string)(),
+            param2: (0, superstruct_1.string)(),
+            queryParam1: (0, superstruct_1.optional)((0, superstruct_1.string)()),
+            queryParam2: (0, superstruct_1.optional)((0, superstruct_1.string)()),
+        }),
+    },
     catchAllSegments: {
         path: "/catch-all/[...pathParams]",
         schema: (0, superstruct_1.object)({
@@ -127,3 +137,40 @@ const DATA = [
 test("routeToUrl", () => {
     DATA.map(({ actual, expected }) => expect(actual).toBe(expected));
 });
+test("create route matcher", () => {
+    expect(createRouteMatcher("manyParameters", { param1: "value-1" })({
+        isReady: true,
+        pathname: "/many-parameters/[param1]/form/[param2]",
+        query: { param1: "value-1", param2: "any", queryParam1: "any", queryParam2: "any" },
+    })).toBe(true);
+    expect(createRouteMatcher("manyParameters", { param1: "value-1" })({
+        isReady: true,
+        pathname: "/many-parameters/[param1]/form/[param2]",
+        query: { param1: "any", param2: "any" },
+    })).toBe(false);
+    expect(createRouteMatcher("manyParameters", { param1: "value-1", queryParam1: "query-1" })({
+        isReady: true,
+        pathname: "/many-parameters/[param1]/form/[param2]",
+        query: { param1: "value-1", param2: "any", queryParam1: "query-1" },
+    })).toBe(true);
+});
+test("merge route matchers", () => {
+    const routeMatcher1 = createRouteMatcher("manyParameters", { param1: "value-1", queryParam1: "query-1" });
+    const routeMatcher2 = createRouteMatcher("manyParameters", { param1: "value-2", queryParam1: "query-2" });
+    const routeMatcher = (0, merge_route_matchers_1.mergeRouteMatchers)([routeMatcher1, routeMatcher2]);
+    expect(routeMatcher({
+        pathname: "/many-parameters/[param1]/form/[param2]",
+        query: { param1: "value-1", queryParam1: "query-1", param2: "any" },
+        isReady: true,
+    })).toBe(true);
+    expect(routeMatcher({
+        pathname: "/many-parameters/[param1]/form/[param2]",
+        query: { param1: "value-2", queryParam1: "query-2", param2: "any" },
+        isReady: true,
+    })).toBe(true);
+    expect(routeMatcher({
+        pathname: "/many-parameters/[param1]/form/[param2]",
+        query: { param1: "value-3", queryParam1: "query-3", param2: "any" },
+        isReady: true,
+    })).toBe(false);
+});