Fix Content route commits on slow networks

templates/content/app/components/editor/DocumentEditor.tsx

@@ -85,6 +85,7 @@ import { cn } from "@/lib/utils";
 import {
   documentBodyHydrationIsPending,
   isEffectivelyEmptyDocumentContent,
+  newDocumentPageChoiceIsDisabled,
 } from "./body-hydration";
 import { BuilderBodySyncingNotice } from "./BuilderBodySyncingNotice";
 import type { CommentTextAnchor } from "./comment-anchors";
@@ -1779,9 +1780,12 @@ function DocumentEditorBody({ documentId, document }: DocumentEditorBodyProps) {
                               type="button"
                               variant="outline"
                               className="justify-start gap-2"
-                              disabled={
-                                !editorCanEdit || createDatabase.isPending
-                              }
+                              disabled={newDocumentPageChoiceIsDisabled({
+                                canEdit,
+                                bodyHydrationPending,
+                                databaseCreationPending:
+                                  createDatabase.isPending,
+                              })}
                               onClick={handleChoosePage}
                             >
                               <IconFileText />

templates/content/app/components/editor/body-hydration.test.ts

@@ -7,6 +7,7 @@ import {
   databaseItemBodyHydrationIsPending,
   documentBodyHydrationIsPending,
   isEffectivelyEmptyDocumentContent,
+  newDocumentPageChoiceIsDisabled,
   previewBodyHydrationIsPending,
   previewBodyHydrationIsTerminalError,
   previewDraftConflictsWithHydratedBody,
@@ -291,6 +292,40 @@ describe("body hydration editing gates", () => {
     expect(isEffectivelyEmptyDocumentContent("Hydrated body")).toBe(false);
   });
 
+  it("keeps the page choice usable while collaboration connects", () => {
+    expect(
+      newDocumentPageChoiceIsDisabled({
+        canEdit: true,
+        bodyHydrationPending: false,
+        databaseCreationPending: false,
+      }),
+    ).toBe(false);
+  });
+
+  it("disables the page choice for viewers, body hydration, or database conversion", () => {
+    expect(
+      newDocumentPageChoiceIsDisabled({
+        canEdit: false,
+        bodyHydrationPending: false,
+        databaseCreationPending: false,
+      }),
+    ).toBe(true);
+    expect(
+      newDocumentPageChoiceIsDisabled({
+        canEdit: true,
+        bodyHydrationPending: true,
+        databaseCreationPending: false,
+      }),
+    ).toBe(true);
+    expect(
+      newDocumentPageChoiceIsDisabled({
+        canEdit: true,
+        bodyHydrationPending: false,
+        databaseCreationPending: true,
+      }),
+    ).toBe(true);
+  });
+
   it("ignores untouched empty preview normalization before it can dirty-save", () => {
     expect(
       shouldIgnorePreviewEmptyNormalization({

templates/content/app/components/editor/body-hydration.ts

@@ -69,6 +69,16 @@ export function documentBodyHydrationIsPending(
   return builderBodyHydrationIsPending(hydration);
 }
 
+export function newDocumentPageChoiceIsDisabled(args: {
+  canEdit: boolean;
+  bodyHydrationPending: boolean;
+  databaseCreationPending: boolean;
+}) {
+  return (
+    !args.canEdit || args.bodyHydrationPending || args.databaseCreationPending
+  );
+}
+
 export function previewBodyHydrationIsPending(args: {
   item: Pick<ContentDatabaseItem, "bodyHydration" | "document">;
   document: Pick<Document, "content" | "databaseMembership"> | null | undefined;

templates/content/app/root.revalidation.test.ts

@@ -0,0 +1,39 @@
+import type { ShouldRevalidateFunctionArgs } from "react-router";
+import { describe, expect, it } from "vitest";
+
+import { shouldRevalidate } from "./root";
+
+function revalidationArgs(
+  overrides: Partial<ShouldRevalidateFunctionArgs> = {},
+): ShouldRevalidateFunctionArgs {
+  return {
+    currentUrl: new URL("https://content.test/page/previous"),
+    currentParams: { id: "previous" },
+    nextUrl: new URL("https://content.test/page/next"),
+    nextParams: { id: "next" },
+    defaultShouldRevalidate: true,
+    ...overrides,
+  } as ShouldRevalidateFunctionArgs;
+}
+
+describe("root route revalidation", () => {
+  it("does not block ordinary page navigations on bootstrap locale data", () => {
+    expect(shouldRevalidate(revalidationArgs())).toBe(false);
+  });
+
+  it("retains React Router's default revalidation for action submissions", () => {
+    expect(
+      shouldRevalidate(
+        revalidationArgs({ formMethod: "POST", defaultShouldRevalidate: true }),
+      ),
+    ).toBe(true);
+    expect(
+      shouldRevalidate(
+        revalidationArgs({
+          formMethod: "POST",
+          defaultShouldRevalidate: false,
+        }),
+      ),
+    ).toBe(false);
+  });
+});

templates/content/app/root.tsx

@@ -49,7 +49,11 @@ import {
   useRouteLoaderData,
   useRouteError,
 } from "react-router";
-import type { LinksFunction, LoaderFunctionArgs } from "react-router";
+import type {
+  LinksFunction,
+  LoaderFunctionArgs,
+  ShouldRevalidateFunctionArgs,
+} from "react-router";
 
 // Styled sonner wrapper — passed via AppProviders `toaster` prop to avoid duplicate.
 import { Toaster as Sonner } from "@/components/ui/sonner";
@@ -105,6 +109,13 @@ export async function loader({
   };
 }
 
+export function shouldRevalidate({
+  defaultShouldRevalidate,
+  formMethod,
+}: ShouldRevalidateFunctionArgs) {
+  return formMethod ? defaultShouldRevalidate : false;
+}
+
 // Pass args to match content's 3-way theme-cycle UX (no disableTransitionOnChange).
 const THEME_INIT_SCRIPT = getThemeInitScript("system", true);
 

templates/content/changelog/2026-07-23-new-pages-open-immediately-while-slow-network-work-continues.md

@@ -0,0 +1,6 @@
+---
+type: fixed
+date: 2026-07-23
+---
+
+New pages open immediately while slow network work continues