@pylonsync/react 0.8.3 → 0.9.1

package/dist/index.d.ts

@@ -1,5 +1,6 @@
-export { defineRoute } from "@pylonsync/sdk";
-export type { RouteMode, AppManifest } from "@pylonsync/sdk";
+export { defineRoute } from "@pylonsync/sdk/route";
+export type { RouteMode } from "@pylonsync/sdk/route";
+export type { AppManifest } from "@pylonsync/sdk";
 export { Link } from "./Link";
 export type { LinkProps } from "./Link";
 export { dynamic } from "./dynamic";

package/dist/useSession.d.ts

@@ -3,6 +3,15 @@ export type { ResolvedSession };
 export interface UseSessionReturn {
     /** Server-resolved session. `userId=null` means anonymous. */
     session: ResolvedSession;
+    /**
+     * True once `/api/auth/me` has answered during this engine run. Until
+     * then `session` is the empty placeholder: `userId` is null because the
+     * answer has not arrived, not because the user is anonymous. Route
+     * guards must not send a user to sign-in while this is false. Stays
+     * false on an offline start; the persisted token still authenticates
+     * the replica and the next successful pull resolves it.
+     */
+    resolved: boolean;
     /** Convenience accessors. */
     userId: string | null;
     tenantId: string | null;

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.8.3",
+  "version": "0.9.1",
   "type": "module",
   "main": "./src/index.ts",
   "types": "./dist/index.d.ts",
@@ -14,8 +14,8 @@
     "prepack": "bun run build"
   },
   "dependencies": {
-    "@pylonsync/sdk": "0.8.3",
-    "@pylonsync/sync": "0.8.3"
+    "@pylonsync/sdk": "0.9.1",
+    "@pylonsync/sync": "0.9.1"
   },
   "peerDependencies": {
     "react": ">=19.0.0"

package/src/index.ts

@@ -1,5 +1,11 @@
-export { defineRoute } from "@pylonsync/sdk";
-export type { RouteMode, AppManifest } from "@pylonsync/sdk";
+// `defineRoute` comes from the sdk's `route` entry, not its root. The root
+// module contains the filesystem-backed discovery helpers, which reference
+// `import.meta` and Node builtins that Metro cannot bundle. Keep every
+// runtime import in this package off the sdk root so React Native apps
+// can import `@pylonsync/react` (and `@pylonsync/react-native`).
+export { defineRoute } from "@pylonsync/sdk/route";
+export type { RouteMode } from "@pylonsync/sdk/route";
+export type { AppManifest } from "@pylonsync/sdk";
 
 // SSR primitives — Next.js-style <Link> and <Image>. Both render
 // progressively (work without JS) and enhance on the client.

package/src/native-import-graph.test.ts

@@ -0,0 +1,95 @@
+// The React Native entry points must bundle under Metro. Metro resolves
+// every static and dynamic import at build time and has no `import.meta`,
+// so one Node-only module anywhere in the runtime import graph breaks
+// every native build. This walks the graph from the two client entries
+// through the workspace packages and fails on the first offender.
+//
+// It caught the sdk root (`discoverAppRoutes` uses `import.meta.url` and
+// `node:module`) being pulled in through a `defineRoute` re-export.
+
+import { expect, test } from "bun:test";
+import { existsSync, readFileSync } from "node:fs";
+import { dirname, join, relative, resolve } from "node:path";
+
+const PACKAGES = resolve(import.meta.dir, "..", "..");
+const ENTRIES = [
+  join(PACKAGES, "react", "src", "index.ts"),
+  join(PACKAGES, "react-native", "src", "index.ts"),
+  join(PACKAGES, "plugins", "revenuecat", "src", "client.ts"),
+];
+const NODE_BUILTINS = new Set([
+  "assert", "buffer", "child_process", "crypto", "events", "fs", "http",
+  "https", "module", "net", "os", "path", "stream", "url", "util",
+  "worker_threads", "zlib",
+]);
+
+function packageDir(name: string): string {
+  const plugin = join(PACKAGES, "plugins", name);
+  return existsSync(plugin) ? plugin : join(PACKAGES, name);
+}
+
+/** Resolve an import specifier to a workspace source file, or null for
+ *  an external dependency (react, react-native, async-storage, ...). */
+function resolveImport(spec: string, fromFile: string): string | null {
+  if (spec.startsWith(".")) {
+    const base = resolve(dirname(fromFile), spec);
+    for (const candidate of [base, `${base}.ts`, `${base}.tsx`, join(base, "index.ts")]) {
+      if (existsSync(candidate) && !candidate.endsWith("/")) {
+        try {
+          readFileSync(candidate);
+          return candidate;
+        } catch {
+          /* directory */
+        }
+      }
+    }
+    throw new Error(`cannot resolve ${spec} from ${fromFile}`);
+  }
+  const m = /^@pylonsync\/([^/]+)(?:\/(.+))?$/.exec(spec);
+  if (!m) return null;
+  const dir = packageDir(m[1]);
+  const pkg = JSON.parse(readFileSync(join(dir, "package.json"), "utf8")) as {
+    main?: string;
+    exports?: Record<string, string | { default?: string }>;
+  };
+  const key = m[2] ? `./${m[2]}` : ".";
+  const entry = pkg.exports?.[key];
+  const target =
+    typeof entry === "string" ? entry : entry?.default ?? (key === "." ? pkg.main : undefined);
+  if (!target) throw new Error(`${spec}: no "${key}" export in ${dir}/package.json`);
+  return resolve(dir, target);
+}
+
+test("the React Native entry points import no Node-only code", () => {
+  const seen = new Set<string>();
+  const queue = [...ENTRIES];
+  const offenders: string[] = [];
+  const rel = (f: string) => relative(PACKAGES, f);
+
+  while (queue.length > 0) {
+    const file = queue.pop()!;
+    if (seen.has(file)) continue;
+    seen.add(file);
+    const source = readFileSync(file, "utf8");
+    // Erase types first so `import type` / `export type ... from` do not
+    // count — Babel drops them before Metro ever sees the specifier.
+    const loader = file.endsWith(".tsx") ? "tsx" : "ts";
+    const js = new Bun.Transpiler({ loader }).transformSync(source);
+    if (/\bimport\.meta\b/.test(js)) offenders.push(`${rel(file)} uses import.meta`);
+    for (const imp of new Bun.Transpiler({ loader: "js" }).scanImports(js)) {
+      const spec = imp.path;
+      if (spec.startsWith("node:") || NODE_BUILTINS.has(spec)) {
+        offenders.push(`${rel(file)} imports ${spec}`);
+        continue;
+      }
+      const next = resolveImport(spec, file);
+      if (next) queue.push(next);
+    }
+  }
+
+  expect(offenders).toEqual([]);
+  // Sanity: the walk actually crossed into @pylonsync/sync and the sdk.
+  expect([...seen].some((f) => f.includes("/sync/src/"))).toBe(true);
+  expect([...seen].some((f) => f.endsWith("/sdk/src/route.ts"))).toBe(true);
+  expect([...seen].some((f) => f.endsWith("/sdk/src/index.ts"))).toBe(false);
+});

package/src/useRouter.ts

@@ -17,7 +17,14 @@ import { use, useEffect, useMemo, useRef, useState, useSyncExternalStore } from
 // `Window.__pylon` is globally augmented in ./Link (same package, ambient).
 
 function subscribe(onChange: () => void): () => void {
-  if (typeof window === "undefined") return () => {};
+  // React Native has a `window` global with no event API; treat it
+  // like the server and never subscribe.
+  if (
+    typeof window === "undefined" ||
+    typeof window.addEventListener !== "function"
+  ) {
+    return () => {};
+  }
   window.addEventListener("popstate", onChange);
   window.addEventListener("pylon:navigation", onChange);
   return () => {

package/src/useSession.native.test.tsx

@@ -0,0 +1,47 @@
+// React Native defines `window` as an alias of the global object with no
+// `addEventListener`. `useSession` used to subscribe to `storage` events
+// whenever `window` existed, which threw inside its mount effect and
+// crashed every native app on startup. This mounts the hook under that
+// shape of `window` and checks the session still resolves.
+
+import { afterEach, expect, test } from "bun:test";
+import { act, cleanup, render, screen, waitFor } from "@testing-library/react";
+import React from "react";
+import type { SyncEngine } from "@pylonsync/sync";
+import { createTestEnv, type TestEnv } from "@pylonsync/sync/src/test-harness";
+
+import { useSession } from "./useSession";
+
+let env: TestEnv | null = null;
+
+afterEach(async () => {
+  cleanup();
+  if (env) {
+    await env.dispose();
+    env = null;
+  }
+});
+
+function Probe({ engine }: { engine: SyncEngine }) {
+  const s = useSession(engine);
+  return <span data-testid="s">{s.resolved ? (s.userId ?? "anonymous") : "pending"}</span>;
+}
+
+test("mounts where window has no event API and reports resolution", async () => {
+  env = await createTestEnv({ transport: "poll" });
+  env.signIn({ userId: "u1" });
+  const engine = env.engine as unknown as SyncEngine;
+
+  const original = window.addEventListener;
+  (window as unknown as { addEventListener: unknown }).addEventListener = undefined;
+  try {
+    render(<Probe engine={engine} />);
+    expect(screen.getByTestId("s").textContent).toBe("pending");
+    await act(async () => {
+      await engine.start();
+    });
+    await waitFor(() => expect(screen.getByTestId("s").textContent).toBe("u1"));
+  } finally {
+    window.addEventListener = original;
+  }
+});

package/src/useSession.ts

@@ -8,6 +8,15 @@ export type { ResolvedSession };
 export interface UseSessionReturn {
   /** Server-resolved session. `userId=null` means anonymous. */
   session: ResolvedSession;
+  /**
+   * True once `/api/auth/me` has answered during this engine run. Until
+   * then `session` is the empty placeholder: `userId` is null because the
+   * answer has not arrived, not because the user is anonymous. Route
+   * guards must not send a user to sign-in while this is false. Stays
+   * false on an offline start; the persisted token still authenticates
+   * the replica and the next successful pull resolves it.
+   */
+  resolved: boolean;
   /** Convenience accessors. */
   userId: string | null;
   tenantId: string | null;
@@ -50,6 +59,11 @@ export function useSession(sync: SyncEngine): UseSessionReturn {
     () => sync.resolvedSession(),
     () => sync.resolvedSession(),
   );
+  const resolved = useSyncExternalStore(
+    (cb) => sync.store.subscribe(cb),
+    () => sync.sessionResolved(),
+    () => false,
+  );
 
   // Watch the localStorage token key. If another tab signs in/out, or the
   // app writes a new token without going through `notifySessionChanged`,
@@ -69,7 +83,13 @@ export function useSession(sync: SyncEngine): UseSessionReturn {
         }
       }
     };
-    if (typeof window !== "undefined") {
+    // React Native defines `window` as an alias of the global object,
+    // without `addEventListener`. Only browsers deliver `storage` events,
+    // so subscribe only where the listener API exists.
+    if (
+      typeof window !== "undefined" &&
+      typeof window.addEventListener === "function"
+    ) {
       window.addEventListener("storage", onStorage);
       return () => window.removeEventListener("storage", onStorage);
     }
@@ -78,6 +98,7 @@ export function useSession(sync: SyncEngine): UseSessionReturn {
 
   return {
     session,
+    resolved,
     userId: session.userId,
     tenantId: session.tenantId,
     isAdmin: session.isAdmin,