Upgrade Remix to 3.0.0 beta 4 (#74)

kentcdodds · cursoragent · web-flow · commit 830418ab7fff · 2026-06-08T14:34:22.000-06:00
* Upgrade Remix to beta 4

Co-authored-by: Kent C. Dodds &lt;me+github@kentcdodds.com&gt;

* Adapt Remix beta 4 API changes

Co-authored-by: Kent C. Dodds &lt;me+github@kentcdodds.com&gt;

* Format Remix beta API updates

Co-authored-by: Kent C. Dodds &lt;me+github@kentcdodds.com&gt;

---------

Co-authored-by: Cursor Agent &lt;cursoragent@cursor.com&gt;
diff --git a/bun.lock b/bun.lock
diff --git a/client/editable-text.tsx b/client/editable-text.tsx
@@ -17,7 +17,7 @@ const inheritTextStyles = {
 	lineHeight: 'inherit',
 	color: 'inherit',
 } as const
-export function EditableText(handle: Handle) {
+export function EditableText(handle: Handle<EditableTextProps>) {
 	let isEditing = false
 	let draftValue = ''
 	let isSaving = false
@@ -36,7 +36,8 @@ export function EditableText(handle: Handle) {
 			button.focus()
 		})
 	}
-	return (props: EditableTextProps) => {
+	return () => {
+		const props = handle.props
 		const buttonId = `${props.id}-button`
 		function startEditing() {
 			if (isSaving) return
diff --git a/package.json b/package.json
@@ -69,7 +69,7 @@
     "@modelcontextprotocol/sdk": "1.26.0",
     "agents": "^0.7.6",
     "get-port": "^7.1.0",
-    "remix": "3.0.0-beta.0",
+    "remix": "3.0.0-beta.4",
     "workers-ai-provider": "^3.1.2",
     "zod": "^4.3.6"
   }
diff --git a/server/handlers/account.ts b/server/handlers/account.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { readAuthSessionResult } from '#server/auth-session.ts'
 import { redirectToLogin } from '#server/auth-redirect.ts'
 import { Layout } from '#server/layout.ts'
@@ -25,7 +25,4 @@ export const account = {
 
 		return response
 	},
-} satisfies BuildAction<
-	typeof routes.account.method,
-	typeof routes.account.pattern
->
+} satisfies Action<typeof routes.account>
diff --git a/server/handlers/auth-handler.test.ts b/server/handlers/auth-handler.test.ts
@@ -1,6 +1,6 @@
 /// <reference types="bun" />
 import { beforeAll, expect, test } from 'vitest'
-import { RequestContext } from 'remix/fetch-router'
+import { RequestContext } from 'remix/router'
 import { setAuthSessionSecret } from '#server/auth-session.ts'
 import { createPasswordHash } from '#server/password-hash.ts'
 import { createAuthHandler } from './auth.ts'
diff --git a/server/handlers/auth.ts b/server/handlers/auth.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { enum_, object, parseSafe, string } from 'remix/data-schema'
 import { createAuthCookie, isSecureRequest } from '#server/auth-session.ts'
 import { getRequestIp, logAuditEvent } from '#server/audit-log.ts'
@@ -235,5 +235,5 @@ export function createAuthHandler(appEnv: AppEnv) {
 				},
 			)
 		},
-	} satisfies BuildAction<typeof routes.auth.method, typeof routes.auth.pattern>
+	} satisfies Action<typeof routes.auth>
 }
diff --git a/server/handlers/chat-threads.ts b/server/handlers/chat-threads.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { readAuthenticatedAppUser } from '#server/authenticated-user.ts'
 import { type routes } from '#server/routes.ts'
 import { createChatThreadsStore } from '#server/chat-threads.ts'
@@ -58,10 +58,7 @@ export function createChatThreadsHandler(appEnv: AppEnv) {
 			const thread = await store.createForUser(user.userId)
 			return jsonResponse({ ok: true, thread }, { status: 201 })
 		},
-	} satisfies BuildAction<
-		typeof routes.chatThreadsCreate.method | typeof routes.chatThreads.method,
-		typeof routes.chatThreads.pattern
-	>
+	} satisfies Action<typeof routes.chatThreads>
 }
 
 export function createDeleteChatThreadHandler(appEnv: AppEnv) {
@@ -111,10 +108,7 @@ export function createDeleteChatThreadHandler(appEnv: AppEnv) {
 
 			return jsonResponse({ ok: true })
 		},
-	} satisfies BuildAction<
-		typeof routes.chatThreadsDelete.method,
-		typeof routes.chatThreadsDelete.pattern
-	>
+	} satisfies Action<typeof routes.chatThreadsDelete>
 }
 
 export function createUpdateChatThreadHandler(appEnv: AppEnv) {
@@ -176,8 +170,5 @@ export function createUpdateChatThreadHandler(appEnv: AppEnv) {
 
 			return jsonResponse({ ok: true, thread })
 		},
-	} satisfies BuildAction<
-		typeof routes.chatThreadsUpdate.method,
-		typeof routes.chatThreadsUpdate.pattern
-	>
+	} satisfies Action<typeof routes.chatThreadsUpdate>
 }
diff --git a/server/handlers/chat.ts b/server/handlers/chat.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { readAuthSessionResult } from '#server/auth-session.ts'
 import { redirectToLogin } from '#server/auth-redirect.ts'
 import { Layout } from '#server/layout.ts'
@@ -21,4 +21,4 @@ export const chat = {
 
 		return response
 	},
-} satisfies BuildAction<typeof routes.chat.method, typeof routes.chat.pattern>
+} satisfies Action<typeof routes.chat>
diff --git a/server/handlers/health-handler.test.ts b/server/handlers/health-handler.test.ts
@@ -1,6 +1,6 @@
 /// <reference types="bun" />
 import { expect, test } from 'vitest'
-import { RequestContext } from 'remix/fetch-router'
+import { RequestContext } from 'remix/router'
 import { createHealthHandler } from './health.ts'
 
 function createHealthRequestContext() {
diff --git a/server/handlers/health.ts b/server/handlers/health.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { type routes } from '#server/routes.ts'
 import { type AppEnv } from '#types/env-schema.ts'
 
@@ -21,8 +21,5 @@ export function createHealthHandler(appEnv: HealthEnv) {
 				},
 			)
 		},
-	} satisfies BuildAction<
-		typeof routes.health.method,
-		typeof routes.health.pattern
-	>
+	} satisfies Action<typeof routes.health>
 }
diff --git a/server/handlers/home.ts b/server/handlers/home.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { Layout } from '#server/layout.ts'
 import { render } from '#server/render.ts'
 import { type routes } from '#server/routes.ts'
@@ -8,4 +8,4 @@ export const home = {
 	async handler() {
 		return render(Layout({}))
 	},
-} satisfies BuildAction<typeof routes.home.method, typeof routes.home.pattern>
+} satisfies Action<typeof routes.home>
diff --git a/server/handlers/login.ts b/server/handlers/login.ts
@@ -1,8 +1,7 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { type routes } from '#server/routes.ts'
 import { createAuthPageHandler } from './auth-page.ts'
 
-export const login = createAuthPageHandler() satisfies BuildAction<
-	typeof routes.login.method,
-	typeof routes.login.pattern
+export const login = createAuthPageHandler() satisfies Action<
+	typeof routes.login
 >
diff --git a/server/handlers/logout.ts b/server/handlers/logout.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { destroyAuthCookie, isSecureRequest } from '#server/auth-session.ts'
 import { type routes } from '#server/routes.ts'
 
@@ -16,7 +16,4 @@ export const logout = {
 			},
 		})
 	},
-} satisfies BuildAction<
-	typeof routes.logout.method,
-	typeof routes.logout.pattern
->
+} satisfies Action<typeof routes.logout>
diff --git a/server/handlers/password-reset.ts b/server/handlers/password-reset.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { object, parseSafe, string } from 'remix/data-schema'
 import { type AppEnv } from '#types/env-schema.ts'
 import { createDb, passwordResetsTable, usersTable } from '#worker/db.ts'
@@ -181,10 +181,7 @@ export function createPasswordResetRequestHandler(appEnv: AppEnv) {
 				message: 'If the account exists, a reset email has been sent.',
 			})
 		},
-	} satisfies BuildAction<
-		typeof routes.passwordResetRequest.method,
-		typeof routes.passwordResetRequest.pattern
-	>
+	} satisfies Action<typeof routes.passwordResetRequest>
 }
 
 export function createPasswordResetConfirmHandler(appEnv: AppEnv) {
@@ -265,8 +262,5 @@ export function createPasswordResetConfirmHandler(appEnv: AppEnv) {
 
 			return Response.json({ ok: true })
 		},
-	} satisfies BuildAction<
-		typeof routes.passwordResetConfirm.method,
-		typeof routes.passwordResetConfirm.pattern
-	>
+	} satisfies Action<typeof routes.passwordResetConfirm>
 }
diff --git a/server/handlers/session-handler.test.ts b/server/handlers/session-handler.test.ts
@@ -1,6 +1,6 @@
 /// <reference types="bun" />
 import { beforeAll, expect, test } from 'vitest'
-import { RequestContext } from 'remix/fetch-router'
+import { RequestContext } from 'remix/router'
 import {
 	createAuthCookie,
 	setAuthSessionSecret,
diff --git a/server/handlers/session.ts b/server/handlers/session.ts
@@ -1,4 +1,4 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { readAuthSessionResult } from '#server/auth-session.ts'
 import { type routes } from '#server/routes.ts'
 
@@ -32,7 +32,4 @@ export const session = {
 				: undefined,
 		)
 	},
-} satisfies BuildAction<
-	typeof routes.session.method,
-	typeof routes.session.pattern
->
+} satisfies Action<typeof routes.session>
diff --git a/server/handlers/signup.ts b/server/handlers/signup.ts
@@ -1,8 +1,7 @@
-import { type BuildAction } from 'remix/fetch-router'
+import { type Action } from 'remix/router'
 import { type routes } from '#server/routes.ts'
 import { createAuthPageHandler } from './auth-page.ts'
 
-export const signup = createAuthPageHandler() satisfies BuildAction<
-	typeof routes.signup.method,
-	typeof routes.signup.pattern
+export const signup = createAuthPageHandler() satisfies Action<
+	typeof routes.signup
 >
diff --git a/server/router.ts b/server/router.ts
@@ -1,4 +1,4 @@
-import { createRouter } from 'remix/fetch-router'
+import { createRouter } from 'remix/router'
 import { type AppEnv } from '#types/env-schema.ts'
 import { account } from './handlers/account.ts'
 import { createAuthHandler } from './handlers/auth.ts'
diff --git a/server/routes.ts b/server/routes.ts
@@ -1,4 +1,4 @@
-import { post, route } from 'remix/fetch-router/routes'
+import { post, route } from 'remix/routes'
 
 export const routes = route({
 	home: '/',
diff --git a/worker/d1-data-table-adapter.ts b/worker/d1-data-table-adapter.ts

Original file line number	Diff line number	Diff line change
`@@ -69,7 +69,7 @@`
`69`	`69`	`"@modelcontextprotocol/sdk": "1.26.0",`
`70`	`70`	`"agents": "^0.7.6",`
`71`	`71`	`"get-port": "^7.1.0",`
`72`		`- "remix": "3.0.0-beta.0",`
	`72`	`+ "remix": "3.0.0-beta.4",`
`73`	`73`	`"workers-ai-provider": "^3.1.2",`
`74`	`74`	`"zod": "^4.3.6"`
`75`	`75`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { type BuildAction } from 'remix/fetch-router'`
	`1`	`+import { type Action } from 'remix/router'`
`2`	`2`	`import { enum_, object, parseSafe, string } from 'remix/data-schema'`
`3`	`3`	`import { createAuthCookie, isSecureRequest } from '#server/auth-session.ts'`
`4`	`4`	`import { getRequestIp, logAuditEvent } from '#server/audit-log.ts'`
`@@ -235,5 +235,5 @@ export function createAuthHandler(appEnv: AppEnv) {`
`235`	`235`	`},`
`236`	`236`	`)`
`237`	`237`	`},`
`238`		`- } satisfies BuildAction<typeof routes.auth.method, typeof routes.auth.pattern>`
	`238`	`+ } satisfies Action<typeof routes.auth>`
`239`	`239`	`}`