fix(server-runtime): fix SerializeFrom type inference

.changeset/serialize-from-data-key.md

@@ -0,0 +1,6 @@
+---
+"@remix-run/react": patch
+"@remix-run/server-runtime": patch
+---
+
+better type discrimination when unwrapping loader return types

packages/remix-react/__tests__/hook-types-test.tsx

@@ -117,6 +117,12 @@ describe("type serializer", () => {
     type response = LoaderData<AppData>;
     isEqual<response, { arg1: string; arg2?: number }>(true);
   });
+
+  it("allows data key in value", () => {
+    type AppData = { data: { hello: string } };
+    type response = LoaderData<AppData>;
+    isEqual<response, { data: { hello: string } }>(true);
+  });
 });
 
 describe("deferred type serializer", () => {
@@ -261,4 +267,10 @@ describe("deferred type serializer", () => {
       { hello: SerializedAppData; lazy: Promise<SerializedAppData> }
     >(true);
   });
+
+  it("allows data key in value", () => {
+    type AppData = { data: Promise<{ hello: string }> };
+    type response = LoaderData<AppData>;
+    isEqual<response, { data: Promise<{ hello: string }> }>(true);
+  });
 });

packages/remix-server-runtime/__tests__/serialize-test.ts

@@ -0,0 +1,53 @@
+import type { SerializeFrom } from "../index";
+import { defer } from "../index";
+import { json } from "../index";
+import type { IsNever } from "./utils";
+import { isEqual } from "./utils";
+
+describe("SerializeFrom", () => {
+  it("infers types", () => {
+    isEqual<SerializeFrom<string>, string>(true);
+    isEqual<SerializeFrom<number>, number>(true);
+    isEqual<SerializeFrom<boolean>, boolean>(true);
+    isEqual<SerializeFrom<String>, String>(true);
+    isEqual<SerializeFrom<Number>, Number>(true);
+    isEqual<SerializeFrom<Boolean>, Boolean>(true);
+    isEqual<SerializeFrom<null>, null>(true);
+
+    isEqual<IsNever<SerializeFrom<undefined>>, true>(true);
+    isEqual<IsNever<SerializeFrom<Function>>, true>(true);
+    isEqual<IsNever<SerializeFrom<symbol>>, true>(true);
+
+    isEqual<SerializeFrom<[]>, []>(true);
+    isEqual<SerializeFrom<[string, number]>, [string, number]>(true);
+    isEqual<SerializeFrom<[number, number]>, [number, number]>(true);
+
+    isEqual<SerializeFrom<ReadonlyArray<string>>, string[]>(true);
+    isEqual<SerializeFrom<ReadonlyArray<Function>>, null[]>(true);
+
+    isEqual<SerializeFrom<{ hello: "remix" }>, { hello: "remix" }>(true);
+    isEqual<
+      SerializeFrom<{ data: { hello: "remix" } }>,
+      { data: { hello: "remix" } }
+    >(true);
+  });
+
+  it("infers type from json responses", () => {
+    let loader = () => json({ hello: "remix" });
+    isEqual<SerializeFrom<typeof loader>, { hello: string }>(true);
+
+    let asyncLoader = async () => json({ hello: "remix" });
+    isEqual<SerializeFrom<typeof asyncLoader>, { hello: string }>(true);
+  });
+
+  it("infers type from defer responses", () => {
+    let loader = async () => defer({ data: { hello: "remix" } });
+    isEqual<SerializeFrom<typeof loader>, { data: { hello: string } }>(true);
+  });
+
+  // Special case that covers https://github.com/remix-run/remix/issues/5211
+  it("infers type from json responses containing a data key", () => {
+    let loader = async () => json({ data: { hello: "remix" } });
+    isEqual<SerializeFrom<typeof loader>, { data: { hello: string } }>(true);
+  });
+});

packages/remix-server-runtime/__tests__/utils.ts

@@ -93,3 +93,5 @@ export function prettyHtml(source: string): string {
 export function isEqual<A, B>(
   arg: A extends B ? (B extends A ? true : false) : false
 ): void {}
+
+export type IsNever<T> = [T] extends [never] ? true : false;

packages/remix-server-runtime/responses.ts

@@ -9,11 +9,14 @@ import {
 import { serializeError } from "./errors";
 import type { ServerMode } from "./mode";
 
+declare const typedDeferredDataBrand: unique symbol;
+
 export type TypedDeferredData<Data extends Record<string, unknown>> = Pick<
   DeferredData,
   "init"
 > & {
   data: Data;
+  readonly [typedDeferredDataBrand]: "TypedDeferredData";
 };
 
 export type DeferFunction = <Data extends Record<string, unknown>>(
@@ -51,7 +54,7 @@ export const json: JsonFunction = (data, init = {}) => {
  * @see https://remix.run/docs/utils/defer
  */
 export const defer: DeferFunction = (data, init = {}) => {
-  return routerDefer(data, init) as TypedDeferredData<typeof data>;
+  return routerDefer(data, init) as unknown as TypedDeferredData<typeof data>;
 };
 
 export type RedirectFunction = (