@tinkoff/router 0.1.77 → 0.1.80

package/lib/components/react/provider.d.ts

@@ -1,6 +1,12 @@
-import React from 'react';
+import type { FunctionComponent, ReactNode } from 'react';
+import type { Url } from '@tinkoff/url';
 import type { AbstractRouter } from '../../router/abstract';
-export declare const Provider: React.FunctionComponent<{
+import type { NavigationRoute } from '../../types';
+export declare const Provider: FunctionComponent<{
     router: AbstractRouter;
-    children?: React.ReactNode;
+    serverState?: {
+        currentRoute: NavigationRoute;
+        currentUrl: Url;
+    };
+    children?: ReactNode;
 }>;

package/lib/index.browser.js

@@ -8,8 +8,9 @@ import each from '@tinkoff/utils/array/each';
 import find from '@tinkoff/utils/array/find';
 import findIndex from '@tinkoff/utils/array/findIndex';
 import { jsx } from 'react/jsx-runtime';
-import { createContext, useState, useContext, useCallback, isValidElement, cloneElement } from 'react';
-import { useIsomorphicLayoutEffect, useShallowEqual } from '@tinkoff/react-hooks';
+import { useSyncExternalStore } from 'use-sync-external-store/shim';
+import { createContext, useContext, useCallback, isValidElement, cloneElement } from 'react';
+import { useShallowEqual } from '@tinkoff/react-hooks';
 
 const PARAMETER_DELIMITER = ':';
 const WILDCARD_REGEXP = /\*/;
@@ -173,6 +174,14 @@ class AbstractRouter {
         // same as getCurrentRoute
         return (_b = (_a = this.currentNavigation) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : (_c = this.lastNavigation) === null || _c === void 0 ? void 0 : _c.url;
     }
+    getLastRoute() {
+        var _a;
+        return (_a = this.lastNavigation) === null || _a === void 0 ? void 0 : _a.to;
+    }
+    getLastUrl() {
+        var _a;
+        return (_a = this.lastNavigation) === null || _a === void 0 ? void 0 : _a.url;
+    }
     commitNavigation(navigation) {
         logger.debug({
             event: 'commit-navigation',
@@ -182,9 +191,9 @@ class AbstractRouter {
             // in case we came from history do not history back to prevent infinity recursive calls
             this.history.save(navigation);
         }
-        this.runSyncHooks('change', navigation);
         this.lastNavigation = navigation;
         this.currentNavigation = null;
+        this.runSyncHooks('change', navigation);
     }
     async updateCurrentRoute(updateRouteOptions) {
         return this.internalUpdateCurrentRoute(updateRouteOptions, {});
@@ -221,17 +230,20 @@ class AbstractRouter {
         await this.runHooks('afterUpdateCurrent', navigation);
     }
     async navigate(navigateOptions) {
-        return this.internalNavigate(typeof navigateOptions === 'string' ? { url: navigateOptions } : navigateOptions, {});
+        return this.internalNavigate(makeNavigateOptions(navigateOptions), {});
     }
-    async internalNavigate(navigateOptions, { history }) {
+    async internalNavigate(navigateOptions, { history, redirect }) {
         var _a;
         const { url, replace, params, navigateState, code } = navigateOptions;
-        const prevNavigation = (_a = this.currentNavigation) !== null && _a !== void 0 ? _a : this.lastNavigation;
+        const prevNavigation = redirect
+            ? this.lastNavigation
+            : (_a = this.currentNavigation) !== null && _a !== void 0 ? _a : this.lastNavigation;
         if (!url && !prevNavigation) {
             throw new Error('Navigate url should be specified and cannot be omitted for first navigation');
         }
         const resolvedUrl = this.resolveUrl(navigateOptions);
         const { to: from, url: fromUrl } = prevNavigation !== null && prevNavigation !== void 0 ? prevNavigation : {};
+        const redirectFrom = redirect ? this.currentNavigation.to : undefined;
         let navigation = {
             type: 'navigate',
             from,
@@ -241,6 +253,8 @@ class AbstractRouter {
             history,
             navigateState,
             code,
+            redirect,
+            redirectFrom,
         };
         await this.runHooks('beforeResolve', navigation);
         const to = this.resolveRoute({ url: resolvedUrl, params, navigateState }, { wildcard: true });
@@ -792,7 +806,12 @@ class ClientRouter extends AbstractRouter {
     }
     async redirect(navigation, target) {
         await super.redirect(navigation, target);
-        return this.navigate({ ...target, replace: target.replace || navigation.replace });
+        return this.internalNavigate({
+            ...target,
+            replace: target.replace || navigation.replace,
+        }, {
+            redirect: true,
+        });
     }
 }
 
@@ -1116,17 +1135,10 @@ const RouterContext = createContext(null);
 const RouteContext = createContext(null);
 const UrlContext = createContext(null);
 
-const Provider = ({ router, children }) => {
-    const [state, setState] = useState({
-        route: router.getCurrentRoute(),
-        url: router.getCurrentUrl(),
-    });
-    useIsomorphicLayoutEffect(() => {
-        return router.registerSyncHook('change', ({ to, url }) => {
-            setState({ route: to, url });
-        });
-    }, [router]);
-    return (jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsx(RouteContext.Provider, Object.assign({ value: state.route }, { children: jsx(UrlContext.Provider, Object.assign({ value: state.url }, { children: children }), void 0) }), void 0) }), void 0));
+const Provider = ({ router, serverState, children }) => {
+    const route = useSyncExternalStore((cb) => router.registerSyncHook('change', cb), () => router.getLastRoute(), serverState ? () => serverState.currentRoute : () => router.getLastRoute());
+    const url = useSyncExternalStore((cb) => router.registerSyncHook('change', cb), () => router.getLastUrl(), serverState ? () => serverState.currentUrl : () => router.getLastUrl());
+    return (jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsx(RouteContext.Provider, Object.assign({ value: route }, { children: jsx(UrlContext.Provider, Object.assign({ value: url }, { children: children }), void 0) }), void 0) }), void 0));
 };
 Provider.displayName = 'Provider';
 

package/lib/index.es.js

@@ -8,8 +8,9 @@ import each from '@tinkoff/utils/array/each';
 import find from '@tinkoff/utils/array/find';
 import findIndex from '@tinkoff/utils/array/findIndex';
 import { jsx } from 'react/jsx-runtime';
-import { createContext, useState, useContext, useCallback, isValidElement, cloneElement } from 'react';
-import { useIsomorphicLayoutEffect, useShallowEqual } from '@tinkoff/react-hooks';
+import { useSyncExternalStore } from 'use-sync-external-store/shim';
+import { createContext, useContext, useCallback, isValidElement, cloneElement } from 'react';
+import { useShallowEqual } from '@tinkoff/react-hooks';
 
 const PARAMETER_DELIMITER = ':';
 const WILDCARD_REGEXP = /\*/;
@@ -173,6 +174,14 @@ class AbstractRouter {
         // same as getCurrentRoute
         return (_b = (_a = this.currentNavigation) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : (_c = this.lastNavigation) === null || _c === void 0 ? void 0 : _c.url;
     }
+    getLastRoute() {
+        var _a;
+        return (_a = this.lastNavigation) === null || _a === void 0 ? void 0 : _a.to;
+    }
+    getLastUrl() {
+        var _a;
+        return (_a = this.lastNavigation) === null || _a === void 0 ? void 0 : _a.url;
+    }
     commitNavigation(navigation) {
         logger.debug({
             event: 'commit-navigation',
@@ -182,9 +191,9 @@ class AbstractRouter {
             // in case we came from history do not history back to prevent infinity recursive calls
             this.history.save(navigation);
         }
-        this.runSyncHooks('change', navigation);
         this.lastNavigation = navigation;
         this.currentNavigation = null;
+        this.runSyncHooks('change', navigation);
     }
     async updateCurrentRoute(updateRouteOptions) {
         return this.internalUpdateCurrentRoute(updateRouteOptions, {});
@@ -221,17 +230,20 @@ class AbstractRouter {
         await this.runHooks('afterUpdateCurrent', navigation);
     }
     async navigate(navigateOptions) {
-        return this.internalNavigate(typeof navigateOptions === 'string' ? { url: navigateOptions } : navigateOptions, {});
+        return this.internalNavigate(makeNavigateOptions(navigateOptions), {});
     }
-    async internalNavigate(navigateOptions, { history }) {
+    async internalNavigate(navigateOptions, { history, redirect }) {
         var _a;
         const { url, replace, params, navigateState, code } = navigateOptions;
-        const prevNavigation = (_a = this.currentNavigation) !== null && _a !== void 0 ? _a : this.lastNavigation;
+        const prevNavigation = redirect
+            ? this.lastNavigation
+            : (_a = this.currentNavigation) !== null && _a !== void 0 ? _a : this.lastNavigation;
         if (!url && !prevNavigation) {
             throw new Error('Navigate url should be specified and cannot be omitted for first navigation');
         }
         const resolvedUrl = this.resolveUrl(navigateOptions);
         const { to: from, url: fromUrl } = prevNavigation !== null && prevNavigation !== void 0 ? prevNavigation : {};
+        const redirectFrom = redirect ? this.currentNavigation.to : undefined;
         let navigation = {
             type: 'navigate',
             from,
@@ -241,6 +253,8 @@ class AbstractRouter {
             history,
             navigateState,
             code,
+            redirect,
+            redirectFrom,
         };
         await this.runHooks('beforeResolve', navigation);
         const to = this.resolveRoute({ url: resolvedUrl, params, navigateState }, { wildcard: true });
@@ -1022,7 +1036,12 @@ class ClientRouter extends AbstractRouter {
     }
     async redirect(navigation, target) {
         await super.redirect(navigation, target);
-        return this.navigate({ ...target, replace: target.replace || navigation.replace });
+        return this.internalNavigate({
+            ...target,
+            replace: target.replace || navigation.replace,
+        }, {
+            redirect: true,
+        });
     }
 }
 
@@ -1044,17 +1063,10 @@ const RouterContext = createContext(null);
 const RouteContext = createContext(null);
 const UrlContext = createContext(null);
 
-const Provider = ({ router, children }) => {
-    const [state, setState] = useState({
-        route: router.getCurrentRoute(),
-        url: router.getCurrentUrl(),
-    });
-    useIsomorphicLayoutEffect(() => {
-        return router.registerSyncHook('change', ({ to, url }) => {
-            setState({ route: to, url });
-        });
-    }, [router]);
-    return (jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsx(RouteContext.Provider, Object.assign({ value: state.route }, { children: jsx(UrlContext.Provider, Object.assign({ value: state.url }, { children: children }), void 0) }), void 0) }), void 0));
+const Provider = ({ router, serverState, children }) => {
+    const route = useSyncExternalStore((cb) => router.registerSyncHook('change', cb), () => router.getLastRoute(), serverState ? () => serverState.currentRoute : () => router.getLastRoute());
+    const url = useSyncExternalStore((cb) => router.registerSyncHook('change', cb), () => router.getLastUrl(), serverState ? () => serverState.currentUrl : () => router.getLastUrl());
+    return (jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsx(RouteContext.Provider, Object.assign({ value: route }, { children: jsx(UrlContext.Provider, Object.assign({ value: url }, { children: children }), void 0) }), void 0) }), void 0));
 };
 Provider.displayName = 'Provider';
 

package/lib/index.js

@@ -12,6 +12,7 @@ var each = require('@tinkoff/utils/array/each');
 var find = require('@tinkoff/utils/array/find');
 var findIndex = require('@tinkoff/utils/array/findIndex');
 var jsxRuntime = require('react/jsx-runtime');
+var shim = require('use-sync-external-store/shim');
 var react = require('react');
 var reactHooks = require('@tinkoff/react-hooks');
 
@@ -188,6 +189,14 @@ class AbstractRouter {
         // same as getCurrentRoute
         return (_b = (_a = this.currentNavigation) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : (_c = this.lastNavigation) === null || _c === void 0 ? void 0 : _c.url;
     }
+    getLastRoute() {
+        var _a;
+        return (_a = this.lastNavigation) === null || _a === void 0 ? void 0 : _a.to;
+    }
+    getLastUrl() {
+        var _a;
+        return (_a = this.lastNavigation) === null || _a === void 0 ? void 0 : _a.url;
+    }
     commitNavigation(navigation) {
         exports.logger.debug({
             event: 'commit-navigation',
@@ -197,9 +206,9 @@ class AbstractRouter {
             // in case we came from history do not history back to prevent infinity recursive calls
             this.history.save(navigation);
         }
-        this.runSyncHooks('change', navigation);
         this.lastNavigation = navigation;
         this.currentNavigation = null;
+        this.runSyncHooks('change', navigation);
     }
     async updateCurrentRoute(updateRouteOptions) {
         return this.internalUpdateCurrentRoute(updateRouteOptions, {});
@@ -236,17 +245,20 @@ class AbstractRouter {
         await this.runHooks('afterUpdateCurrent', navigation);
     }
     async navigate(navigateOptions) {
-        return this.internalNavigate(typeof navigateOptions === 'string' ? { url: navigateOptions } : navigateOptions, {});
+        return this.internalNavigate(makeNavigateOptions(navigateOptions), {});
     }
-    async internalNavigate(navigateOptions, { history }) {
+    async internalNavigate(navigateOptions, { history, redirect }) {
         var _a;
         const { url, replace, params, navigateState, code } = navigateOptions;
-        const prevNavigation = (_a = this.currentNavigation) !== null && _a !== void 0 ? _a : this.lastNavigation;
+        const prevNavigation = redirect
+            ? this.lastNavigation
+            : (_a = this.currentNavigation) !== null && _a !== void 0 ? _a : this.lastNavigation;
         if (!url && !prevNavigation) {
             throw new Error('Navigate url should be specified and cannot be omitted for first navigation');
         }
         const resolvedUrl = this.resolveUrl(navigateOptions);
         const { to: from, url: fromUrl } = prevNavigation !== null && prevNavigation !== void 0 ? prevNavigation : {};
+        const redirectFrom = redirect ? this.currentNavigation.to : undefined;
         let navigation = {
             type: 'navigate',
             from,
@@ -256,6 +268,8 @@ class AbstractRouter {
             history,
             navigateState,
             code,
+            redirect,
+            redirectFrom,
         };
         await this.runHooks('beforeResolve', navigation);
         const to = this.resolveRoute({ url: resolvedUrl, params, navigateState }, { wildcard: true });
@@ -1037,7 +1051,12 @@ class ClientRouter extends AbstractRouter {
     }
     async redirect(navigation, target) {
         await super.redirect(navigation, target);
-        return this.navigate({ ...target, replace: target.replace || navigation.replace });
+        return this.internalNavigate({
+            ...target,
+            replace: target.replace || navigation.replace,
+        }, {
+            redirect: true,
+        });
     }
 }
 
@@ -1059,17 +1078,10 @@ const RouterContext = react.createContext(null);
 const RouteContext = react.createContext(null);
 const UrlContext = react.createContext(null);
 
-const Provider = ({ router, children }) => {
-    const [state, setState] = react.useState({
-        route: router.getCurrentRoute(),
-        url: router.getCurrentUrl(),
-    });
-    reactHooks.useIsomorphicLayoutEffect(() => {
-        return router.registerSyncHook('change', ({ to, url }) => {
-            setState({ route: to, url });
-        });
-    }, [router]);
-    return (jsxRuntime.jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsxRuntime.jsx(RouteContext.Provider, Object.assign({ value: state.route }, { children: jsxRuntime.jsx(UrlContext.Provider, Object.assign({ value: state.url }, { children: children }), void 0) }), void 0) }), void 0));
+const Provider = ({ router, serverState, children }) => {
+    const route = shim.useSyncExternalStore((cb) => router.registerSyncHook('change', cb), () => router.getLastRoute(), serverState ? () => serverState.currentRoute : () => router.getLastRoute());
+    const url = shim.useSyncExternalStore((cb) => router.registerSyncHook('change', cb), () => router.getLastUrl(), serverState ? () => serverState.currentUrl : () => router.getLastUrl());
+    return (jsxRuntime.jsx(RouterContext.Provider, Object.assign({ value: router }, { children: jsxRuntime.jsx(RouteContext.Provider, Object.assign({ value: route }, { children: jsxRuntime.jsx(UrlContext.Provider, Object.assign({ value: url }, { children: children }), void 0) }), void 0) }), void 0));
 };
 Provider.displayName = 'Provider';
 

package/lib/router/abstract.d.ts

@@ -20,6 +20,7 @@ export interface Options {
 }
 interface InternalOptions {
     history?: boolean;
+    redirect?: boolean;
 }
 export declare abstract class AbstractRouter {
     protected started: boolean;
@@ -40,12 +41,14 @@ export declare abstract class AbstractRouter {
     start(): Promise<void>;
     getCurrentRoute(): import("../types").NavigationRoute;
     getCurrentUrl(): Url;
+    getLastRoute(): import("../types").NavigationRoute;
+    getLastUrl(): Url;
     protected commitNavigation(navigation: Navigation): void;
     updateCurrentRoute(updateRouteOptions: UpdateCurrentRouteOptions): Promise<void>;
     protected internalUpdateCurrentRoute(updateRouteOptions: UpdateCurrentRouteOptions, { history }: InternalOptions): Promise<void>;
     protected runUpdateCurrentRoute(navigation: Navigation): Promise<void>;
     navigate(navigateOptions: NavigateOptions | string): Promise<void>;
-    protected internalNavigate(navigateOptions: NavigateOptions, { history }: InternalOptions): Promise<void>;
+    protected internalNavigate(navigateOptions: NavigateOptions, { history, redirect }: InternalOptions): Promise<void>;
     protected runNavigate(navigation: Navigation): Promise<void>;
     protected run(navigation: Navigation): Promise<void>;
     resolve(resolveOptions: NavigateOptions | string, options?: Parameters<AbstractRouter['resolveRoute']>[1]): import("../types").NavigationRoute;

package/lib/types.d.ts

@@ -40,6 +40,8 @@ export interface Navigation {
     history?: boolean;
     cancelled?: boolean;
     code?: number;
+    redirect?: boolean;
+    redirectFrom?: NavigationRoute;
 }
 export declare type NavigationGuard = (navigation: Navigation) => Promise<void | NavigateOptions | string | boolean>;
 export declare type NavigationHook = (navigation: Navigation) => Promise<void>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tinkoff/router",
-  "version": "0.1.77",
+  "version": "0.1.80",
   "description": "router",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -22,9 +22,10 @@
     "build-for-publish": "true"
   },
   "dependencies": {
-    "@tinkoff/react-hooks": "0.0.26",
-    "@tinkoff/url": "0.7.38",
-    "@tinkoff/utils": "^2.1.2"
+    "@tinkoff/react-hooks": "0.0.27",
+    "@tinkoff/url": "0.7.39",
+    "@tinkoff/utils": "^2.1.2",
+    "use-sync-external-store": "^1.2.0"
   },
   "peerDependencies": {
     "react": ">=16.14.0",
@@ -32,6 +33,7 @@
   },
   "sideEffects": false,
   "devDependencies": {
+    "@types/use-sync-external-store": "^0.0.3",
     "object-sizeof": "^1.6.1"
   },
   "license": "Apache-2.0"