Skip to content

Commit 749ebe9

Browse files
committed
refactor!: upgrade to react-router 6
1 parent d9d9db9 commit 749ebe9

File tree

3 files changed

+65
-63
lines changed

3 files changed

+65
-63
lines changed

package.json

+4-4
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,11 @@
1515
"update": "yarn upgrade-interactive --latest"
1616
},
1717
"peerDependencies": {
18-
"react-router": ">=5.1"
18+
"react-router": ">=6"
1919
},
2020
"devDependencies": {
21-
"@types/react-router": "5.1.13",
22-
"@types/react-router-config": "5.0.2",
23-
"typescript": "4.2.4"
21+
"@types/react": "17.0.35",
22+
"react-router": "6.0.2",
23+
"typescript": "4.5.2"
2424
}
2525
}

src/index.ts

+15-15
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,36 @@
1-
import { useEffect } from "react";
2-
import { match, matchPath, useLocation } from "react-router";
3-
import { RouteConfig } from "react-router-config";
4-
import { Location } from "history";
1+
import { useEffect } from 'react';
2+
import { PathMatch, matchPath, useLocation, RouteObject } from 'react-router';
3+
import { Location } from 'history';
54

65
export interface TitleObject {
76
title: string;
87
titles: string[];
9-
params: match["params"];
8+
params: PathMatch['params'];
109
}
1110

1211
type Routes = RouteConfigExtended[] | {
1312
[name: string]: RouteConfigExtended,
1413
};
1514

16-
export interface RouteConfigExtended extends Omit<RouteConfig, "routes"> {
15+
export interface RouteConfigExtended extends Omit<RouteObject, 'children'> {
1716
title: string;
1817
titleConcat?: boolean;
19-
routes?: Routes;
18+
children?: Routes;
19+
path: string;
2020
}
2121

22-
const getRoute = (routesConfig: Routes, path: string): { route: RouteConfigExtended, currentMatch: match } => {
22+
const getRoute = (routesConfig: Routes, path: string): { route: RouteConfigExtended, currentMatch: PathMatch } => {
2323
let route: RouteConfigExtended;
24-
let currentMatch: match;
24+
let currentMatch: PathMatch;
2525

2626
if (Array.isArray(routesConfig)) {
2727
route = routesConfig.find((routeConfig) => {
28-
currentMatch = matchPath(path, routeConfig as RouteConfig);
28+
currentMatch = matchPath(routeConfig, path);
2929
return currentMatch;
3030
});
3131
} else {
3232
const id: string = Object.keys(routesConfig).find((key) => {
33-
currentMatch = matchPath(path, routesConfig[key] as RouteConfig);
33+
currentMatch = matchPath(routesConfig[key], path);
3434
return currentMatch;
3535
});
3636
route = routesConfig[id];
@@ -47,7 +47,7 @@ const getTitle = (
4747
path: string,
4848
divider: string,
4949
titles: string[] = [],
50-
matchCache?: match,
50+
matchCache?: PathMatch,
5151
): TitleObject => {
5252
const { route, currentMatch } = getRoute(routesConfig, path);
5353

@@ -56,8 +56,8 @@ const getTitle = (
5656
if (route && concatenateTitles) {
5757
if (route.title) { titles.push(route.title); }
5858

59-
if (route.routes) {
60-
return getTitle(route.routes, path, divider, titles, currentMatch || matchCache);
59+
if (route.children) {
60+
return getTitle(route.children, path, divider, titles, currentMatch || matchCache);
6161
}
6262
}
6363

@@ -80,7 +80,7 @@ const RouterTitle = ({
8080
pageTitle,
8181
routesConfig,
8282
callback = ({ title }) => title,
83-
divider = "·",
83+
divider = '·',
8484
prefix,
8585
}: RouterTitleProps) => {
8686
const location = useLocation();

yarn.lock

+46-44
Original file line numberDiff line numberDiff line change
@@ -2,55 +2,57 @@
22
# yarn lockfile v1
33

44

5-
"@types/history@*":
6-
version "4.7.3"
7-
resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.3.tgz#856c99cdc1551d22c22b18b5402719affec9839a"
8-
integrity sha512-cS5owqtwzLN5kY+l+KgKdRJ/Cee8tlmQoGQuIE9tWnSmS3JMKzmxo2HIAk2wODMifGwO20d62xZQLYz+RLfXmw==
5+
"@babel/runtime@^7.7.6":
6+
version "7.16.3"
7+
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.16.3.tgz#b86f0db02a04187a3c17caa77de69840165d42d5"
8+
integrity sha512-WBwekcqacdY2e9AF/Q7WLFUWmdJGJTkbjqTjoMDgXkVZ3ZRUvOPsLb5KdwISoQVsbP+DQzVZW4Zhci0DvpbNTQ==
9+
dependencies:
10+
regenerator-runtime "^0.13.4"
911

1012
"@types/prop-types@*":
11-
version "15.7.3"
12-
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.3.tgz#2ab0d5da2e5815f94b0b9d4b95d1e5f243ab2ca7"
13-
integrity sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==
14-
15-
16-
version "5.0.2"
17-
resolved "https://registry.yarnpkg.com/@types/react-router-config/-/react-router-config-5.0.2.tgz#4d3b52e71ed363a1976a12321e67b09a99ad6d10"
18-
integrity sha512-WOSetDV3YPxbkVJAdv/bqExJjmcdCi/vpCJh3NfQOy1X15vHMSiMioXIcGekXDJJYhqGUMDo9e337mh508foAA==
19-
dependencies:
20-
"@types/history" "*"
21-
"@types/react" "*"
22-
"@types/react-router" "*"
23-
24-
"@types/react-router@*":
25-
version "5.1.1"
26-
resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-5.1.1.tgz#e0b827556abc70da3473d05daf074c839d6852aa"
27-
integrity sha512-S7SlFAPb7ZKr6HHMW0kLHGcz8pyJSL0UdM+JtlWthDqKUWwr7E6oPXuHgkofDI8dKCm16slg8K8VCf5pZJquaA==
13+
version "15.7.4"
14+
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11"
15+
integrity sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==
16+
17+
18+
version "17.0.35"
19+
resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.35.tgz#217164cf830267d56cd1aec09dcf25a541eedd4c"
20+
integrity sha512-r3C8/TJuri/SLZiiwwxQoLAoavaczARfT9up9b4Jr65+ErAUX3MIkU0oMOQnrpfgHme8zIqZLX7O5nnjm5Wayw==
2821
dependencies:
29-
"@types/history" "*"
30-
"@types/react" "*"
31-
32-
33-
version "5.1.13"
34-
resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-5.1.13.tgz#051c0d229bd48ad90558a1db500708127cc512f7"
35-
integrity sha512-ZIuaO9Yrln54X6elg8q2Ivp6iK6p4syPsefEYAhRDAoqNh48C8VYUmB9RkXjKSQAJSJV0mbIFCX7I4vZDcHrjg==
22+
"@types/prop-types" "*"
23+
"@types/scheduler" "*"
24+
csstype "^3.0.2"
25+
26+
"@types/scheduler@*":
27+
version "0.16.2"
28+
resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39"
29+
integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==
30+
31+
csstype@^3.0.2:
32+
version "3.0.10"
33+
resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.10.tgz#2ad3a7bed70f35b965707c092e5f30b327c290e5"
34+
integrity sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==
35+
36+
history@^5.1.0:
37+
version "5.1.0"
38+
resolved "https://registry.yarnpkg.com/history/-/history-5.1.0.tgz#2e93c09c064194d38d52ed62afd0afc9d9b01ece"
39+
integrity sha512-zPuQgPacm2vH2xdORvGGz1wQMuHSIB56yNAy5FnLuwOwgSYyPKptJtcMm6Ev+hRGeS+GzhbmRacHzvlESbFwDg==
3640
dependencies:
37-
"@types/history" "*"
38-
"@types/react" "*"
41+
"@babel/runtime" "^7.7.6"
3942

40-
"@types/react@*":
41-
version "16.9.4"
42-
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.4.tgz#de8cf5e5e2838659fb78fa93181078469eeb19fc"
43-
integrity sha512-ItGNmJvQ0IvWt8rbk5PLdpdQhvBVxAaXI9hDlx7UMd8Ie1iMIuwMNiKeTfmVN517CdplpyXvA22X4zm4jGGZnw==
43+
44+
version "6.0.2"
45+
resolved "https://registry.yarnpkg.com/react-router/-/react-router-6.0.2.tgz#bd2b0fa84fd1d152671e9f654d9c0b1f5a7c86da"
46+
integrity sha512-8/Wm3Ed8t7TuedXjAvV39+c8j0vwrI5qVsYqjFr5WkJjsJpEvNSoLRUbtqSEYzqaTUj1IV+sbPJxvO+accvU0Q==
4447
dependencies:
45-
"@types/prop-types" "*"
46-
csstype "^2.2.0"
48+
history "^5.1.0"
4749

48-
csstype@^2.2.0:
49-
version "2.6.6"
50-
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.6.tgz#c34f8226a94bbb10c32cc0d714afdf942291fc41"
51-
integrity sha512-RpFbQGUE74iyPgvr46U9t1xoQBM8T4BL8SxrN66Le2xYAPSaDJJKeztV3awugusb3g3G9iL8StmkBBXhcbbXhg==
50+
regenerator-runtime@^0.13.4:
51+
version "0.13.9"
52+
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz#8925742a98ffd90814988d7566ad30ca3b263b52"
53+
integrity sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==
5254

53-
typescript@4.2.4:
54-
version "4.2.4"
55-
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.2.4.tgz#8610b59747de028fda898a8aef0e103f156d0961"
56-
integrity sha512-V+evlYHZnQkaz8TRBuxTA92yZBPotr5H+WhQ7bD3hZUndx5tGOa1fuCgeSjxAzM1RiN5IzvadIXTVefuuwZCRg==
55+
typescript@4.5.2:
56+
version "4.5.2"
57+
resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.5.2.tgz#8ac1fba9f52256fdb06fb89e4122fa6a346c2998"
58+
integrity sha512-5BlMof9H1yGt0P8/WF+wPNw6GfctgGjXp5hkblpyT+8rkASSmkUKMXrxR0Xg8ThVCi/JnHQiKXeBaEwCeQwMFw==

0 commit comments

Comments
 (0)