Skip to content

Commit dcc2e5c

Browse files
cursoragentcursoragent
committed
fix(nextjs-mf): unblock next16 dev e2e startup
1 parent fdf08b0 commit dcc2e5c

File tree

14 files changed

+603
-56
lines changed

14 files changed

+603
-56
lines changed

‎apps/3000-home/components/SharedNav.tsx‎

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,21 @@
11
import React from 'react';
22
import { Menu, Layout } from 'antd';
3-
import { useRouter } from 'next/router';
3+
import Router from 'next/router';
44
import './menu';
55

66
const SharedNav = () => {
7-
const { asPath, push } = useRouter();
7+
const router = (
8+
Router as typeof Router & {
9+
router?: {
10+
asPath?: string;
11+
push: (url: string) => Promise<boolean>;
12+
};
13+
}
14+
).router;
15+
const asPath =
16+
typeof window !== 'undefined'
17+
? window.location.pathname || router?.asPath || '/'
18+
: router?.asPath || '/';
819
let activeMenu;
920

1021
if (asPath === '/' || asPath.startsWith('/home')) {
@@ -53,7 +64,13 @@ const SharedNav = () => {
5364
mode="horizontal"
5465
selectedKeys={activeMenu ? [activeMenu] : undefined}
5566
onClick={({ key }) => {
56-
push(key);
67+
if (router) {
68+
void router.push(String(key));
69+
return;
70+
}
71+
if (typeof window !== 'undefined') {
72+
window.location.assign(String(key));
73+
}
5774
}}
5875
items={menuItems}
5976
/>

‎apps/3000-home/components/menu.tsx‎

Lines changed: 24 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { ItemType } from 'antd/es/menu/interface';
22

3-
import { useRouter } from 'next/router';
3+
import Router from 'next/router';
44
import { Menu } from 'antd';
55

66
const menuItems: ItemType[] = [
@@ -16,7 +16,18 @@ const menuItems: ItemType[] = [
1616
];
1717

1818
export default function AppMenu() {
19-
const router = useRouter();
19+
const router = (
20+
Router as typeof Router & {
21+
router?: {
22+
asPath?: string;
23+
push: (url: string) => Promise<boolean>;
24+
};
25+
}
26+
).router;
27+
const selectedKey =
28+
typeof window !== 'undefined'
29+
? window.location.pathname || router?.asPath || '/'
30+
: router?.asPath || '/';
2031

2132
return (
2233
<>
@@ -27,9 +38,18 @@ export default function AppMenu() {
2738
</div>
2839
<Menu
2940
mode="inline"
30-
selectedKeys={[router.asPath]}
41+
selectedKeys={[selectedKey]}
3142
style={{ height: '100%' }}
32-
onClick={({ key }) => router.push(key)}
43+
onClick={({ key }) => {
44+
if (typeof window === 'undefined') {
45+
return;
46+
}
47+
if (router) {
48+
void router.push(String(key));
49+
return;
50+
}
51+
window.location.assign(String(key));
52+
}}
3353
items={menuItems}
3454
/>
3555
</>

‎apps/3000-home/pages/_app.tsx‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,11 @@ import App from 'next/app';
66
import { Layout, version, ConfigProvider } from 'antd';
77
import { StyleProvider } from '@ant-design/cssinjs';
88

9-
import Router, { useRouter } from 'next/router';
9+
import Router from 'next/router';
1010
const SharedNav = React.lazy(() => import('../components/SharedNav'));
1111
import HostAppMenu from '../components/menu';
1212
function MyApp(props) {
1313
const { Component, pageProps } = props;
14-
const { asPath } = useRouter();
1514
const [MenuComponent, setMenuComponent] = useState(() => HostAppMenu);
1615
const handleRouteChange = async (url) => {
1716
if (url.startsWith('/shop')) {
@@ -28,8 +27,16 @@ function MyApp(props) {
2827
};
2928
// handle first route hit.
3029
React.useEffect(() => {
31-
handleRouteChange(asPath);
32-
}, [asPath]);
30+
const initialPath =
31+
(
32+
Router as typeof Router & {
33+
router?: {
34+
asPath?: string;
35+
};
36+
}
37+
).router?.asPath || '/';
38+
handleRouteChange(initialPath);
39+
}, []);
3340

3441
//handle route change
3542
React.useEffect(() => {

‎apps/3001-shop/components/menu.tsx‎

Lines changed: 24 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { ItemType } from 'antd/es/menu/interface';
22

3-
import { useRouter } from 'next/router';
3+
import Router from 'next/router';
44
import { Menu } from 'antd';
55

66
const menuItems: ItemType[] = [
@@ -19,7 +19,18 @@ const menuItems: ItemType[] = [
1919
];
2020

2121
export default function AppMenu() {
22-
const router = useRouter();
22+
const router = (
23+
Router as typeof Router & {
24+
router?: {
25+
asPath?: string;
26+
push: (url: string) => Promise<boolean>;
27+
};
28+
}
29+
).router;
30+
const selectedKey =
31+
typeof window !== 'undefined'
32+
? window.location.pathname || router?.asPath || '/shop'
33+
: router?.asPath || '/shop';
2334

2435
return (
2536
<>
@@ -30,9 +41,18 @@ export default function AppMenu() {
3041
</div>
3142
<Menu
3243
mode="inline"
33-
selectedKeys={[router.asPath]}
44+
selectedKeys={[selectedKey]}
3445
style={{ height: '100%' }}
35-
onClick={({ key }) => router.push(key)}
46+
onClick={({ key }) => {
47+
if (typeof window === 'undefined') {
48+
return;
49+
}
50+
if (router) {
51+
void router.push(String(key));
52+
return;
53+
}
54+
window.location.assign(String(key));
55+
}}
3656
items={menuItems}
3757
/>
3858
</>

‎apps/3001-shop/pages/_app.tsx‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
11
import React, { Suspense, useState, lazy } from 'react';
22
import App from 'next/app';
33
import { Layout, version, ConfigProvider } from 'antd';
4-
import Router, { useRouter } from 'next/router';
4+
import Router from 'next/router';
55
import { StyleProvider } from '@ant-design/cssinjs';
66
import HostAppMenu from '../components/menu';
77

88
const SharedNav = lazy(() => import('home/SharedNav'));
99

1010
function MyApp({ Component, pageProps }) {
11-
const { asPath } = useRouter();
1211
const [MenuComponent, setMenuComponent] = useState(() => HostAppMenu);
1312
const handleRouteChange = async (url) => {
1413
if (url.startsWith('/home') || url === '/') {
@@ -25,8 +24,16 @@ function MyApp({ Component, pageProps }) {
2524
};
2625
// handle first route hit.
2726
React.useEffect(() => {
28-
handleRouteChange(asPath);
29-
}, [asPath]);
27+
const initialPath =
28+
(
29+
Router as typeof Router & {
30+
router?: {
31+
asPath?: string;
32+
};
33+
}
34+
).router?.asPath || '/shop';
35+
handleRouteChange(initialPath);
36+
}, []);
3037

3138
//handle route change
3239
React.useEffect(() => {

‎apps/3002-checkout/components/menu.tsx‎

Lines changed: 24 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { ItemType } from 'antd/es/menu/interface';
22

3-
import { useRouter } from 'next/router';
3+
import Router from 'next/router';
44
import { Menu } from 'antd';
55

66
const menuItems: ItemType[] = [
@@ -17,7 +17,18 @@ const menuItems: ItemType[] = [
1717
];
1818

1919
export default function AppMenu() {
20-
const router = useRouter();
20+
const router = (
21+
Router as typeof Router & {
22+
router?: {
23+
asPath?: string;
24+
push: (url: string) => Promise<boolean>;
25+
};
26+
}
27+
).router;
28+
const selectedKey =
29+
typeof window !== 'undefined'
30+
? window.location.pathname || router?.asPath || '/checkout'
31+
: router?.asPath || '/checkout';
2132

2233
return (
2334
<>
@@ -28,9 +39,18 @@ export default function AppMenu() {
2839
</div>
2940
<Menu
3041
mode="inline"
31-
selectedKeys={[router.asPath]}
42+
selectedKeys={[selectedKey]}
3243
style={{ height: '100%' }}
33-
onClick={({ key }) => router.push(key)}
44+
onClick={({ key }) => {
45+
if (typeof window === 'undefined') {
46+
return;
47+
}
48+
if (router) {
49+
void router.push(String(key));
50+
return;
51+
}
52+
window.location.assign(String(key));
53+
}}
3454
items={menuItems}
3555
/>
3656
</>

‎apps/3002-checkout/pages/_app.tsx‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,14 @@
11
import React, { Suspense, lazy, useState } from 'react';
22
import App from 'next/app';
33
import { Layout, version, ConfigProvider } from 'antd';
4-
import Router, { useRouter } from 'next/router';
4+
import Router from 'next/router';
55
import { StyleProvider } from '@ant-design/cssinjs';
66

77
import HostAppMenu from '../components/menu';
88

99
const SharedNav = lazy(() => import('home/SharedNav'));
1010

1111
function MyApp({ Component, pageProps }) {
12-
const { asPath } = useRouter();
1312
const [MenuComponent, setMenuComponent] = useState(() => HostAppMenu);
1413
const handleRouteChange = async (url) => {
1514
if (url.startsWith('/home') || url === '/') {
@@ -26,8 +25,16 @@ function MyApp({ Component, pageProps }) {
2625
};
2726
// handle first route hit.
2827
React.useEffect(() => {
29-
handleRouteChange(asPath);
30-
}, [asPath]);
28+
const initialPath =
29+
(
30+
Router as typeof Router & {
31+
router?: {
32+
asPath?: string;
33+
};
34+
}
35+
).router?.asPath || '/checkout';
36+
handleRouteChange(initialPath);
37+
}, []);
3138

3239
//handle route change
3340
React.useEffect(() => {

0 commit comments

Comments
 (0)