fix: too many suspenses! · evdeveloper/Tanstack-Router-@a7d5975 · GitHub

evdeveloper / Tanstack-Router- Public

forked from TanStack/router

• Notifications You must be signed in to change notification settings
• Fork 0
• Star 0

• Code
• Pull requests
• Actions
• Projects
• Security and quality
• Insights

Additional navigation options

Commit a7d5975

Browse filesBrowse the repository at this point in the historyBrowse files

tannerlinsley

committed

fix: too many suspenses!

1 parent 642a334 commit a7d5975
Copy full SHA for a7d5975

4 files changed

+406-425Lines changed: 406 additions & 425 deletions

File tree

Expand file treeCollapse file tree

Open diff view settings

Filter options

• examples/react/quickstart/src
  • main.tsx
• packages/router
  • __tests__
    • createRoutes.test.ts
  • src
    • router.ts
• pnpm-lock.yaml

Expand file treeCollapse file tree

Open diff view settings

Collapse file

‎examples/react/quickstart/src/main.tsx‎

Copy file name to clipboardExpand all lines: examples/react/quickstart/src/main.tsx

+8-14Lines changed: 8 additions & 14 deletions

Original file line number	Diff line number	Diff line change
@@ -17,8 +17,8 @@ const rootRoute = new RootRoute({
17	17	<>
18	18	<div>
19	19	<Link to="/">Home</Link>{' '}
20		- <Link to="/lazy-without-suspsense">Lazy without suspense</Link>{' '}
21		- <Link to="/lazy-with-suspsense">Lazy with suspense</Link>{' '}
	20	+ <Link to="/lazy-without-suspense">Lazy without suspense</Link>{' '}
	21	+ <Link to="/lazy-with-suspense">Lazy with suspense</Link>{' '}
22	22	<Link to="/with-loader">With loader</Link>
23	23	</div>
24	24	<hr />
@@ -38,31 +38,31 @@ const indexRoute = new Route({
38	38
39	39	const lazyWithoutSuspense = new Route({
40	40	getParentRoute: () => rootRoute,
41		- path: '/lazy-without-suspsense',
	41	+ path: '/lazy-without-suspense',
42	42	component: lazyRouteComponent(
43	43	() =>
44	44	new Promise<Record<string, SyncRouteComponent<any>>>((res) => {
45	45	setTimeout(() => {
46	46	res({
47	47	default: () => <h1>Hello world from "lazy-without-suspense"</h1>,
48	48	})
49		- }, 1500)
	49	+ }, 1000)
50	50	}),
51	51	),
52		- wrapInSuspense: false,
53	52	})
54	53
55	54	const lazyWithSuspense = new Route({
56	55	getParentRoute: () => rootRoute,
57		- path: '/lazy-with-suspsense',
	56	+ path: '/lazy-with-suspense',
58	57	component: lazyRouteComponent(
59	58	() =>
60	59	new Promise<Record<string, SyncRouteComponent<any>>>((res) => {
61	60	setTimeout(() => {
	61	+ console.log('res')
62	62	res({
63	63	default: () => <h1>Hello world from "lazy-with-suspense"</h1>,
64	64	})
65		- }, 1500)
	65	+ }, 1000)
66	66	}),
67	67	),
68	68	pendingComponent: () => <h1>I'm loading</h1>,
@@ -98,11 +98,5 @@ declare module '@tanstack/router' {
98	98	const rootElement = document.getElementById('app')!
99	99	if (!rootElement.innerHTML) {
100	100	const root = ReactDOM.createRoot(rootElement)
101		- root.render(
102		- <StrictMode>
103		- <Suspense>
104		- <RouterProvider router={router} />
105		- </Suspense>
106		- </StrictMode>,
107		- )
	101	+ root.render(<RouterProvider router={router} />)
108	102	}

Collapse file

‎packages/router/__tests__/createRoutes.test.ts‎

Copy file name to clipboardExpand all lines: packages/router/__tests__/createRoutes.test.ts

+12-3Lines changed: 12 additions & 3 deletions

Original file line number	Diff line number	Diff line change
@@ -1,6 +1,12 @@
1		- import { describe, it, expect } from 'vitest'
	1	+ import { describe, it } from 'vitest'
2	2	import { z } from 'zod'
3		- import { createMemoryHistory, RootRoute, Route, Router, lazy } from '../src'
	3	+ import {
	4	+ createMemoryHistory,
	5	+ RootRoute,
	6	+ Route,
	7	+ Router,
	8	+ lazyRouteComponent,
	9	+ } from '../src'
4	10
5	11	// Write a test
6	12	describe('everything', () => {
@@ -20,7 +26,10 @@ describe('everything', () => {
20	26
21	27	const testRoute = new Route({
22	28	getParentRoute: () => rootRoute,
23		- component: lazy(() => import('./TestComponent'), 'NamedComponent'),
	29	+ component: lazyRouteComponent(
	30	+ () => import('./TestComponent'),
	31	+ 'NamedComponent',
	32	+ ),
24	33	path: 'test',
25	34	validateSearch: (search) =>
26	35	z

Collapse file

‎packages/router/src/router.ts‎

Copy file name to clipboardExpand all lines: packages/router/src/router.ts

+9-14Lines changed: 9 additions & 14 deletions

Original file line number	Diff line number	Diff line change
@@ -431,7 +431,7 @@ export class Router<
431	431	this.state.location.pathname,
432	432	this.state.location.search,
433	433	{
434		- // throwOnError: true,
	434	+ throwOnError: true,
435	435	},
436	436	)
437	437
@@ -781,20 +781,15 @@ export class Router<
781	781
782	782	let latestPromise
783	783
784		- const componentsPromise = (async () => {
785		- // then run all component and data loaders in parallel
786		- // For each component type, potentially load it asynchronously
	784	+ const componentsPromise = Promise.all(
	785	+ componentTypes.map(async (type) => {
	786	+ const component = route.options[type]
787	787
788		- await Promise.all(
789		- componentTypes.map(async (type) => {
790		- const component = route.options[type]
791		-
792		- if (component?.preload) {
793		- await component.preload()
794		- }
795		- }),
796		- )
797		- })()
	788	+ if (component?.preload) {
	789	+ await component.preload()
	790	+ }
	791	+ }),
	792	+ )
798	793
799	794	const loaderPromise = Promise.resolve().then(() => {
800	795	if (route.options.loader) {

0 commit comments

Comments

0 (0)