create-zerotal 1.8.1 → 1.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-zerotal",
-  "version": "1.8.1",
+  "version": "1.10.0",
   "description": "Create a new Zerotal application",
   "license": "MIT",
   "maturity": "stable",

package/src/scaffold.ts

@@ -13,7 +13,7 @@ export type Template = 'minimal' | 'api' | 'admin' | 'flow' | 'react' | 'vue';
 // "^1.1.0" found for specifier "zerotal"` — the first thing anyone trying the
 // framework saw. `scaffold.test.ts` now asserts the two agree, so CI fails rather
 // than the user's install.
-export const ZT_VERSION = "^1.8.1";
+export const ZT_VERSION = "^1.10.0";
 
 export interface ScaffoldOptions {
   name:     string;

package/templates/react/resources/js/app.tsx

@@ -1,5 +1,5 @@
 import { createInertiaApp, type ResolvedComponent } from "@inertiajs/react";
-import { createRoot } from "react-dom/client";
+import { createRoot, hydrateRoot } from "react-dom/client";
 import { defineRoutes } from "zerotal/routes";
 import { pages } from "./pages.generated.ts";
 import { ROUTES } from "../../types/routes.generated.ts";
@@ -34,6 +34,15 @@ createInertiaApp({
   },
 
   setup({ el, App, props }) {
-    createRoot(el).render(<App {...props} />);
+    // `inertiaStream()` and endpoint SSR mark the root they rendered into. Hydrate
+    // that markup rather than replacing it: it is already the right page, a scraper
+    // has already read the head tags out of it, and rendering a second time throws
+    // away the first paint the server just paid for.
+    const app = <App {...props} />;
+    if (el.hasAttribute("data-server-rendered")) {
+      hydrateRoot(el, app);
+    } else {
+      createRoot(el).render(app);
+    }
   },
 });