@pylonsync/react 0.3.189 → 0.3.192

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "0.3.189",
+  "version": "0.3.192",
   "type": "module",
   "main": "src/index.ts",
   "types": "src/index.ts",
@@ -12,8 +12,8 @@
     "check": "tsc -p tsconfig.json --noEmit"
   },
   "dependencies": {
-    "@pylonsync/sdk": "0.3.189",
-    "@pylonsync/sync": "0.3.189"
+    "@pylonsync/sdk": "0.3.192",
+    "@pylonsync/sync": "0.3.192"
   },
   "peerDependencies": {
     "react": ">=19.0.0"

package/src/hooks.ts

@@ -1,6 +1,6 @@
 "use client";
 
-import { SyncEngine, generateId, type Row } from "@pylonsync/sync";
+import { SyncEngine, generateId, pylonFetch, type Row } from "@pylonsync/sync";
 import { useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import { callFn, getBaseUrl, getReactStorage, storageKey } from "./index";
 
@@ -905,20 +905,17 @@ export function useAggregate<Row = Record<string, unknown>>(
     setLoading(true);
     setError(null);
     try {
-      const baseUrl = getBaseUrl();
-      const token = getReactStorage().get(storageKey("token"));
-      const res = await fetch(`${baseUrl}/api/aggregate/${entity}`, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-          ...(token ? { Authorization: `Bearer ${token}` } : {}),
+      const json = await pylonFetch<{ rows?: Row[] }>(
+        {
+          baseUrl: getBaseUrl(),
+          getToken: () =>
+            (getReactStorage().get(storageKey("token")) ?? undefined) as
+              | string
+              | undefined,
         },
-        body: specKey,
-      });
-      const json = (await res.json()) as { rows?: Row[]; error?: { message: string } };
-      if (!res.ok) {
-        throw new Error(json.error?.message || `HTTP ${res.status}`);
-      }
+        `/api/aggregate/${entity}`,
+        { method: "POST", body: specKey },
+      );
       setData(json.rows ?? []);
     } catch (e) {
       setError(e instanceof Error ? e : new Error(String(e)));
@@ -1051,36 +1048,34 @@ export function useSearch<T = Row>(
     setLoading(true);
     setError(null);
     try {
-      const baseUrl = getBaseUrl();
-      const token = getReactStorage().get(storageKey("token"));
-      const body = JSON.stringify({
-        query: spec.query ?? "",
-        filters: spec.filters ?? {},
-        facets: spec.facets ?? [],
-        sort: spec.sort,
-        page: spec.page ?? 0,
-        page_size: spec.pageSize ?? 20,
-      });
-      const res = await fetch(`${baseUrl}/api/search/${entity}`, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/json",
-          ...(token ? { Authorization: `Bearer ${token}` } : {}),
-        },
-        body,
-        signal: controller.signal,
-      });
-      const json = (await res.json()) as {
+      const json = await pylonFetch<{
         hits?: T[];
         facetCounts?: Record<string, Record<string, number>>;
         total?: number;
         tookMs?: number;
-        error?: { message: string };
-      };
+      }>(
+        {
+          baseUrl: getBaseUrl(),
+          getToken: () =>
+            (getReactStorage().get(storageKey("token")) ?? undefined) as
+              | string
+              | undefined,
+        },
+        `/api/search/${entity}`,
+        {
+          method: "POST",
+          json: {
+            query: spec.query ?? "",
+            filters: spec.filters ?? {},
+            facets: spec.facets ?? [],
+            sort: spec.sort,
+            page: spec.page ?? 0,
+            page_size: spec.pageSize ?? 20,
+          },
+          signal: controller.signal,
+        },
+      );
       if (myId !== requestIdRef.current) return; // stale — newer in flight
-      if (!res.ok) {
-        throw new Error(json.error?.message ?? `HTTP ${res.status}`);
-      }
       setHits(json.hits ?? []);
       setFacetCounts(json.facetCounts ?? {});
       setTotal(json.total ?? 0);

package/src/index.ts

@@ -1,7 +1,12 @@
 export { defineRoute } from "@pylonsync/sdk";
 export type { RouteMode, AppManifest } from "@pylonsync/sdk";
 
-import { defaultStorage, type Storage as PylonStorage } from "@pylonsync/sync";
+import {
+  defaultStorage,
+  pylonFetch,
+  pylonFetchRaw,
+  type Storage as PylonStorage,
+} from "@pylonsync/sync";
 
 // React hooks — high-level ergonomic shape
 export {
@@ -192,30 +197,30 @@ function assertBaseUrlSafeForEnv(): void {
   }
 }
 
+/**
+ * Build the transport config for the React free helpers — base URL,
+ * token getter, and cookie credentials are all centralized in
+ * `pylonFetch`. Cookie-auth apps work because the transport always
+ * sets `credentials: "include"`; bearer-auth apps work because
+ * `getToken` returns the cached session token.
+ */
+function transportConfig(): import("@pylonsync/sync").TransportConfig {
+  return {
+    baseUrl: _baseUrl,
+    getToken: () => currentAuthToken() ?? undefined,
+  };
+}
+
 async function apiRequest(
   method: string,
   path: string,
-  body?: unknown
+  body?: unknown,
 ): Promise<unknown> {
   assertBaseUrlSafeForEnv();
-  // Auto-attach the session token so `db.insert`, `fetchList`, etc. behave
-  // as the signed-in user without every call site threading the header.
-  // Safe: `currentAuthToken` is a no-op server-side.
-  const headers: Record<string, string> = {};
-  if (body) headers["Content-Type"] = "application/json";
-  const token = currentAuthToken();
-  if (token) headers["Authorization"] = `Bearer ${token}`;
-  const res = await fetch(`${_baseUrl}${path}`, {
-    method,
-    headers,
-    body: body ? JSON.stringify(body) : undefined,
+  return pylonFetch(transportConfig(), path, {
+    method: method as "GET" | "POST" | "PUT" | "PATCH" | "DELETE",
+    json: body,
   });
-  if (!res.ok) {
-    const err = (await res.json().catch(() => ({}))) as Record<string, unknown>;
-    const errorObj = err?.error as Record<string, unknown> | undefined;
-    throw new Error((errorObj?.message as string) ?? `HTTP ${res.status}`);
-  }
-  return res.json();
 }
 
 // ---------------------------------------------------------------------------
@@ -278,12 +283,10 @@ export async function createSession(
 export async function getAuthContext(
   token?: string
 ): Promise<{ user_id: string | null }> {
-  const headers: Record<string, string> = {};
-  if (token) {
-    headers["Authorization"] = `Bearer ${token}`;
-  }
-  const res = await fetch(`${_baseUrl}/api/auth/me`, { headers });
-  return res.json() as Promise<{ user_id: string | null }>;
+  return pylonFetch<{ user_id: string | null }>(
+    { baseUrl: _baseUrl, token },
+    "/api/auth/me",
+  );
 }
 
 /**
@@ -297,16 +300,15 @@ export async function getAuthContext(
 export async function refreshSession(
   token: string
 ): Promise<{ token: string; user_id: string; expires_at: number } | null> {
-  const res = await fetch(`${_baseUrl}/api/auth/refresh`, {
-    method: "POST",
-    headers: { Authorization: `Bearer ${token}` },
-  });
-  if (!res.ok) return null;
-  return res.json() as Promise<{
-    token: string;
-    user_id: string;
-    expires_at: number;
-  }>;
+  try {
+    return await pylonFetch<{
+      token: string;
+      user_id: string;
+      expires_at: number;
+    }>({ baseUrl: _baseUrl, token }, "/api/auth/refresh", { method: "POST" });
+  } catch {
+    return null;
+  }
 }
 
 /**
@@ -405,20 +407,14 @@ export async function callFn<T = unknown>(
   args: Record<string, unknown> = {},
   options: { token?: string } = {}
 ): Promise<T> {
-  const headers: Record<string, string> = { "Content-Type": "application/json" };
-  const token = options.token ?? currentAuthToken();
-  if (token) headers["Authorization"] = `Bearer ${token}`;
-  const res = await fetch(`${_baseUrl}/api/fn/${name}`, {
-    method: "POST",
-    headers,
-    body: JSON.stringify(args),
-  });
-  const json = (await res.json()) as unknown;
-  if (!res.ok) {
-    const err = (json as { error?: { code: string; message: string } }).error;
-    throw new Error(err?.message || `HTTP ${res.status}`);
-  }
-  return json as T;
+  return pylonFetch<T>(
+    {
+      baseUrl: _baseUrl,
+      getToken: () => options.token ?? currentAuthToken() ?? undefined,
+    },
+    `/api/fn/${name}`,
+    { method: "POST", json: args },
+  );
 }
 
 /**
@@ -436,17 +432,21 @@ export async function* streamFn(
   args: Record<string, unknown> = {},
   options: { token?: string } = {}
 ): AsyncGenerator<string, unknown, unknown> {
-  const headers: Record<string, string> = {
-    "Content-Type": "application/json",
-    Accept: "text/event-stream",
-  };
-  if (options.token) headers["Authorization"] = `Bearer ${options.token}`;
-
-  const res = await fetch(`${_baseUrl}/api/fn/${name}`, {
-    method: "POST",
-    headers,
-    body: JSON.stringify(args),
-  });
+  // Streaming response — use pylonFetchRaw so we can read .body
+  // ourselves. URL + auth + credentials are centralized in the
+  // transport.
+  const res = await pylonFetchRaw(
+    {
+      baseUrl: _baseUrl,
+      getToken: () => options.token ?? currentAuthToken() ?? undefined,
+    },
+    `/api/fn/${name}`,
+    {
+      method: "POST",
+      json: args,
+      accept: "text/event-stream",
+    },
+  );
   if (!res.ok || !res.body) {
     throw new Error(`Stream failed: HTTP ${res.status}`);
   }
@@ -559,26 +559,21 @@ export async function uploadFile(
   filename ??= "upload";
   contentType ??= "application/octet-stream";
 
-  const headers: Record<string, string> = {
-    "Content-Type": contentType,
-    "X-Filename": filename,
-  };
-  if (options.token) headers["Authorization"] = `Bearer ${options.token}`;
-
-  const res = await fetch(`${_baseUrl}/api/files/upload`, {
-    method: "POST",
-    headers,
-    body,
-  });
-
-  if (!res.ok) {
-    const err = (await res.json().catch(() => ({}))) as {
-      error?: { code: string; message: string };
-    };
-    throw new Error(err.error?.message || `Upload failed: HTTP ${res.status}`);
-  }
-
-  return (await res.json()) as UploadedFile;
+  return pylonFetch<UploadedFile>(
+    {
+      baseUrl: _baseUrl,
+      getToken: () => options.token ?? currentAuthToken() ?? undefined,
+    },
+    "/api/files/upload",
+    {
+      method: "POST",
+      body,
+      headers: {
+        "Content-Type": contentType,
+        "X-Filename": filename,
+      },
+    },
+  );
 }
 
 /**
@@ -597,19 +592,12 @@ export async function uploadFileMultipart(
   }
   form.append("file", file);
 
-  const headers: Record<string, string> = {};
-  if (options.token) headers["Authorization"] = `Bearer ${options.token}`;
-
-  const res = await fetch(`${_baseUrl}/api/files/upload`, {
-    method: "POST",
-    headers,
-    body: form,
-  });
-  if (!res.ok) {
-    const err = (await res.json().catch(() => ({}))) as {
-      error?: { code: string; message: string };
-    };
-    throw new Error(err.error?.message || `Upload failed: HTTP ${res.status}`);
-  }
-  return (await res.json()) as UploadedFile;
+  return pylonFetch<UploadedFile>(
+    {
+      baseUrl: _baseUrl,
+      getToken: () => options.token ?? currentAuthToken() ?? undefined,
+    },
+    "/api/files/upload",
+    { method: "POST", body: form },
+  );
 }

package/src/useRoom.ts

@@ -1,6 +1,7 @@
 "use client";
 
 import { useState, useEffect, useCallback, useRef } from 'react';
+import { pylonFetch } from '@pylonsync/sync';
 import { getBaseUrl, getReactStorage, storageKey } from './index';
 
 // ---------------------------------------------------------------------------
@@ -96,12 +97,13 @@ export function useRoom(
   const presenceRef = useRef(initialPresence);
   const intervalRef = useRef<ReturnType<typeof setInterval> | null>(null);
 
-  // Stable header builder -- only changes when `token` changes.
-  const headers = useCallback((): Record<string, string> => {
-    const h: Record<string, string> = { 'Content-Type': 'application/json' };
-    if (token) h['Authorization'] = `Bearer ${token}`;
-    return h;
-  }, [token]);
+  // Transport config — shared across every room API call. The
+  // `pylonFetch` helper owns auth + credentials + JSON handling so
+  // every site here drops the duplicate header builder.
+  const transport = useCallback(
+    () => ({ baseUrl, token }),
+    [baseUrl, token],
+  );
 
   // ------- lifecycle: join / heartbeat / leave -------
   //
@@ -118,34 +120,25 @@ export function useRoom(
 
     const join = async () => {
       try {
-        const res = await fetch(`${baseUrl}/api/rooms/join`, {
-          method: 'POST',
-          headers: headers(),
-          body: JSON.stringify({
-            room: roomId,
-            user_id: userId,
-            data: presenceRef.current,
-          }),
-        });
-        const body = await res.json();
+        const body = await pylonFetch<{ snapshot?: { peers?: RoomPeer[] } }>(
+          transport(),
+          '/api/rooms/join',
+          {
+            method: 'POST',
+            json: { room: roomId, user_id: userId, data: presenceRef.current },
+          },
+        );
         if (!mounted) return;
-
-        if (res.ok) {
-          joined = true;
-          setIsConnected(true);
-          setError(null);
-          if (body.snapshot?.peers) {
-            setPeers(
-              (body.snapshot.peers as RoomPeer[]).filter(
-                (p) => p.user_id !== userId,
-              ),
-            );
-          }
-        } else {
-          setError(body.error?.message || 'Failed to join room');
+        joined = true;
+        setIsConnected(true);
+        setError(null);
+        if (body.snapshot?.peers) {
+          setPeers(
+            body.snapshot.peers.filter((p) => p.user_id !== userId),
+          );
         }
       } catch (e: any) {
-        if (mounted) setError(e.message);
+        if (mounted) setError(e?.message ?? 'Failed to join room');
       }
     };
 
@@ -155,19 +148,14 @@ export function useRoom(
     intervalRef.current = setInterval(async () => {
       if (!mounted) return;
       try {
-        const res = await fetch(
-          `${baseUrl}/api/rooms/${encodeURIComponent(roomId)}`,
-          { headers: headers() },
+        const body = await pylonFetch<{ members?: RoomPeer[] }>(
+          transport(),
+          `/api/rooms/${encodeURIComponent(roomId)}`,
         );
-        if (res.ok) {
-          const body = await res.json();
-          if (mounted) {
-            setPeers(
-              ((body.members ?? []) as RoomPeer[]).filter(
-                (p) => p.user_id !== userId,
-              ),
-            );
-          }
+        if (mounted) {
+          setPeers(
+            (body.members ?? []).filter((p) => p.user_id !== userId),
+          );
         }
       } catch {
         // Swallow -- next heartbeat will retry.
@@ -183,10 +171,9 @@ export function useRoom(
       // not in this room" errors. Server leave is also idempotent so
       // a stray duplicate would 200 anyway, but we save the round trip.
       if (joined) {
-        fetch(`${baseUrl}/api/rooms/leave`, {
+        pylonFetch(transport(), '/api/rooms/leave', {
           method: 'POST',
-          headers: headers(),
-          body: JSON.stringify({ room: roomId, user_id: userId }),
+          json: { room: roomId, user_id: userId },
         }).catch(() => {});
       }
     };
@@ -199,35 +186,32 @@ export function useRoom(
   const setPresence = useCallback(
     (data: Record<string, any>) => {
       presenceRef.current = data;
-      fetch(`${baseUrl}/api/rooms/presence`, {
+      pylonFetch(transport(), '/api/rooms/presence', {
         method: 'POST',
-        headers: headers(),
-        body: JSON.stringify({ room: roomId, user_id: userId, data }),
+        json: { room: roomId, user_id: userId, data },
       }).catch(() => {});
     },
-    [roomId, userId, baseUrl, headers],
+    [roomId, userId, transport],
   );
 
   const broadcast = useCallback(
     (topic: string, data: any) => {
-      fetch(`${baseUrl}/api/rooms/broadcast`, {
+      pylonFetch(transport(), '/api/rooms/broadcast', {
         method: 'POST',
-        headers: headers(),
-        body: JSON.stringify({ room: roomId, user_id: userId, topic, data }),
+        json: { room: roomId, user_id: userId, topic, data },
       }).catch(() => {});
     },
-    [roomId, userId, baseUrl, headers],
+    [roomId, userId, transport],
   );
 
   const leave = useCallback(() => {
-    fetch(`${baseUrl}/api/rooms/leave`, {
+    pylonFetch(transport(), '/api/rooms/leave', {
       method: 'POST',
-      headers: headers(),
-      body: JSON.stringify({ room: roomId, user_id: userId }),
+      json: { room: roomId, user_id: userId },
     }).catch(() => {});
     setIsConnected(false);
     setPeers([]);
-  }, [roomId, userId, baseUrl, headers]);
+  }, [roomId, userId, transport]);
 
   return { peers, isConnected, setPresence, broadcast, leave, error };
 }