better-supabase 0.5.0 → 0.6.0

package/dist/react-F80mF4-t.js

@@ -0,0 +1,409 @@
+import { n as dbError } from "./errors-B11Duf73.js";
+import { t as escapeLike } from "./escape-like-DHfx6jRr.js";
+import { r as err, s as toDbError } from "./result-DzUbqgdW.js";
+import "./react/session.js";
+import { n as ClientContext, o as useBroadcastAuth } from "./hooks-1BTCJsiw.js";
+import { t as fieldErrorsOf } from "./field-errors-VF1yb8yI.js";
+import { n as ttlSeconds } from "./ttl-Hr34gRu8.js";
+import { useCallback, useContext, useEffect, useMemo, useRef, useState, useTransition } from "react";
+//#region src/react/actions.ts
+const IDLE$1 = {
+	data: void 0,
+	error: void 0
+};
+/**
+* Calls a Server Action from an event handler: tracks pending inputs and the
+* last result, and calls `onSuccess` or `onError`.
+*
+* ```tsx
+* const remove = useAction(removeMember, { onError: (e) => toast.error(message(e)) });
+* <Button disabled={remove.pendingInputs.some((p) => p.userId === id)} onClick={() => remove.run({ userId: id })} />
+* ```
+*/
+function useAction(action, options = {}) {
+	const [transitioning, startTransition] = useTransition();
+	const [inFlight, setInFlight] = useState([]);
+	const [settled, setSettled] = useState(IDLE$1);
+	const latest = useRef({
+		action,
+		options
+	});
+	latest.current = {
+		action,
+		options
+	};
+	const run = useCallback((input) => {
+		const entry = { input };
+		setInFlight((current) => [...current, entry]);
+		setSettled((current) => current.error === void 0 ? current : {
+			...current,
+			error: void 0
+		});
+		const settledRun = new Promise((resolve, reject) => {
+			const done = () => {
+				setInFlight((current) => current.filter((item) => item !== entry));
+			};
+			startTransition(async () => {
+				let result;
+				try {
+					result = await latest.current.action(input);
+				} catch (cause) {
+					done();
+					reject(cause instanceof Error ? cause : new Error(String(cause)));
+					throw cause;
+				}
+				done();
+				setSettled(result.ok ? {
+					data: result.data,
+					error: void 0
+				} : (current) => ({
+					data: current.data,
+					error: result.error
+				}));
+				const { onSuccess, onError } = latest.current.options;
+				if (result.ok) onSuccess?.(result.data, input);
+				else onError?.(result.error, input);
+				resolve(result);
+			});
+		});
+		settledRun.catch(() => void 0);
+		return settledRun;
+	}, []);
+	const reset = useCallback(() => {
+		setSettled(IDLE$1);
+	}, []);
+	const pendingInputs = inFlight.map((item) => item.input);
+	return {
+		run,
+		pending: transitioning || inFlight.length > 0,
+		pendingInputs,
+		pendingInput: pendingInputs.at(-1),
+		data: settled.data,
+		error: settled.error,
+		reset
+	};
+}
+/**
+* A `<form>` that submits `FormData` to a Server Action. Fields keep what
+* the user typed when the action fails (a `<form action>` resets them) and
+* clear only on success.
+*
+* ```tsx
+* const form = useActionForm(createCustomer, { onSuccess: () => toast.success('Saved') });
+* <form {...form.formProps}>
+*   <Input name="name" aria-invalid={form.fieldErrors.name !== undefined} />
+* </form>
+* ```
+*/
+function useActionForm(action, options = {}) {
+	const handle = useAction(action);
+	return {
+		formProps: { onSubmit: (event) => {
+			event.preventDefault();
+			const form = event.currentTarget;
+			handle.run(new FormData(form)).then((result) => {
+				if (!result.ok) {
+					options.onError?.(result.error, form);
+					return;
+				}
+				if (options.resetOnSuccess ?? true) form.reset();
+				options.onSuccess?.(result.data, form);
+			}, () => void 0);
+		} },
+		pending: handle.pending,
+		data: handle.data,
+		error: handle.error,
+		fieldErrors: fieldErrorsOf(handle.error),
+		reset: () => {
+			handle.reset();
+		}
+	};
+}
+//#endregion
+//#region src/react/presence.ts
+const NONE = [];
+const NO_HANDLERS = {};
+const notJoined = () => Promise.resolve(dbError("invalid_request", "better-supabase: the presence topic is not joined"));
+/**
+* Joins a presence topic while mounted and returns who is on it. Pass
+* `null` values to pause. It rejoins when the topic or the user changes.
+*
+* ```tsx
+* const { members } = usePresence(roomTopic, { roomId }, { state: { name } });
+* ```
+*/
+function usePresence(topic, values, options = {}) {
+	const context = useContext(ClientContext);
+	const supabase = options.client ?? context?.client.supabase;
+	if (!supabase) throw new Error("better-supabase: usePresence needs <BetterSupabaseProvider client={bs}> or { client: supabase }");
+	const auth = useBroadcastAuth(options.client === void 0 ? context?.client : void 0, supabase);
+	const [members, setMembers] = useState(NONE);
+	const [status, setStatus] = useState("closed");
+	const joinedRef = useRef(null);
+	const trackedKey = useRef(void 0);
+	const name = values ? topic.topic(values) : null;
+	const userId = auth.userId;
+	const state = options.state;
+	const stateKey = state === void 0 ? void 0 : JSON.stringify(state);
+	const latest = useRef({
+		state,
+		stateKey
+	});
+	latest.current = {
+		state,
+		stateKey
+	};
+	useEffect(() => {
+		if (!name || auth.status === "loading") return;
+		const matched = topic.match(name);
+		if (!matched) return;
+		const joined = topic.subscribe(supabase, matched, NO_HANDLERS, {
+			onStatus: setStatus,
+			onPresence: setMembers
+		});
+		joinedRef.current = joined;
+		syncState(joined, latest.current, trackedKey);
+		return () => {
+			joinedRef.current = null;
+			trackedKey.current = void 0;
+			setMembers(NONE);
+			setStatus("closed");
+			joined.unsubscribe();
+		};
+	}, [
+		supabase,
+		topic,
+		name,
+		userId,
+		auth.status
+	]);
+	useEffect(() => {
+		const joined = joinedRef.current;
+		if (joined) syncState(joined, {
+			state: latest.current.state,
+			stateKey
+		}, trackedKey);
+	}, [stateKey]);
+	return {
+		members,
+		status,
+		...useMemo(() => ({
+			track: async (next) => {
+				const joined = joinedRef.current;
+				if (!joined) return notJoined();
+				const result = await joined.track(next);
+				return result.ok ? void 0 : result.error;
+			},
+			untrack: async () => {
+				const joined = joinedRef.current;
+				if (!joined) return notJoined();
+				const result = await joined.untrack();
+				return result.ok ? void 0 : result.error;
+			}
+		}), [])
+	};
+}
+/** Tracks or untracks the `state` option once per distinct value. */
+function syncState(joined, current, tracked) {
+	if (current.stateKey === void 0 || current.stateKey === tracked.current) return;
+	tracked.current = current.stateKey;
+	if (current.state === null || current.state === void 0) joined.untrack();
+	else joined.track(current.state);
+}
+//#endregion
+//#region src/react/search.ts
+/**
+* A search box's value, debounced. Pass `term` to `contains` (which
+* escapes it) or `pattern` to `ilike`; both are `undefined` while empty.
+*
+* ```tsx
+* const search = useDebouncedSearch();
+* useQuery(q.customers.findMany({ where: search.term ? { name: { contains: search.term } } : {} }));
+* ```
+*/
+function useDebouncedSearch(initial = "", options = {}) {
+	const delayMs = options.delayMs ?? 250;
+	const minLength = options.minLength ?? 1;
+	const [value, setValue] = useState(initial);
+	const [settled, setSettled] = useState(initial);
+	useEffect(() => {
+		if (value === settled) return;
+		const timer = setTimeout(() => {
+			setSettled(value);
+		}, delayMs);
+		return () => {
+			clearTimeout(timer);
+		};
+	}, [
+		value,
+		settled,
+		delayMs
+	]);
+	const trimmed = settled.trim();
+	const term = trimmed.length >= minLength ? trimmed : void 0;
+	return {
+		value,
+		setValue,
+		term,
+		pattern: term === void 0 ? void 0 : `%${escapeLike(term)}%`,
+		pending: value !== settled
+	};
+}
+//#endregion
+//#region src/react/storage.ts
+/** Re-sign this share of the TTL before the URL expires. */
+const REFRESH_AT = .9;
+/**
+* A signed URL for an object, signed again before it expires. Pass `null`
+* as the target to pause. Connect the bucket with `cacheSignedUrls: true`
+* so components showing the same object share one URL.
+*
+* ```tsx
+* const { url } = useSignedUrl(avatars, user ? { userId: user.id } : null, { ttl: 'hour' });
+* ```
+*/
+function useSignedUrl(bucket, target, options = {}) {
+	const key = target === null || target === void 0 ? null : JSON.stringify([target, options]);
+	const [state, setState] = useState({
+		key: null,
+		url: void 0,
+		error: void 0
+	});
+	const latest = useRef({
+		target,
+		options
+	});
+	latest.current = {
+		target,
+		options
+	};
+	const ttl = ttlSeconds(options.ttl);
+	useEffect(() => {
+		if (key === null) return;
+		let active = true;
+		const sign = () => {
+			const current = latest.current.target;
+			if (current === null || current === void 0) return;
+			bucket.signedUrl(current, latest.current.options).then((result) => {
+				if (!active) return;
+				if (!result.ok) {
+					setState((last) => ({
+						key,
+						url: last.key === key ? last.url : void 0,
+						error: result.error
+					}));
+					return;
+				}
+				setState({
+					key,
+					url: result.data,
+					error: void 0
+				});
+			});
+		};
+		sign();
+		const timer = setInterval(sign, ttl * 1e3 * REFRESH_AT);
+		return () => {
+			active = false;
+			clearInterval(timer);
+		};
+	}, [
+		bucket,
+		key,
+		ttl
+	]);
+	const fresh = key !== null && state.key === key;
+	return {
+		url: fresh ? state.url : void 0,
+		error: fresh ? state.error : void 0,
+		loading: key !== null && (!fresh || state.url === void 0 && !state.error)
+	};
+}
+const IDLE = {
+	status: "idle",
+	progress: 0,
+	data: void 0,
+	error: void 0
+};
+/**
+* Uploads to a connected bucket with progress, abort and status state.
+* Unmounting aborts the upload in flight.
+*
+* ```tsx
+* const avatar = useUpload(avatars, { onSuccess: ({ path }) => save(path) });
+* <input type="file" onChange={(e) => avatar.upload({ userId }, e.target.files[0], { upsert: true })} />
+* <progress value={avatar.progress} />
+* ```
+*/
+function useUpload(bucket, options = {}) {
+	const [state, setState] = useState(IDLE);
+	const latest = useRef({
+		controller: void 0,
+		options
+	});
+	latest.current.options = options;
+	useEffect(() => () => {
+		latest.current.controller?.abort();
+	}, []);
+	const calls = useMemo(() => {
+		const stop = () => {
+			latest.current.controller?.abort();
+			latest.current.controller = void 0;
+			setState(IDLE);
+		};
+		return {
+			upload: async (target, body, uploadOptions) => {
+				latest.current.controller?.abort();
+				const controller = new AbortController();
+				latest.current.controller = controller;
+				const mine = () => latest.current.controller === controller;
+				setState({
+					...IDLE,
+					status: "uploading"
+				});
+				let result;
+				try {
+					result = await bucket.upload(target, body, {
+						...uploadOptions,
+						signal: controller.signal,
+						onProgress: (progress) => {
+							if (mine()) setState((last) => ({
+								...last,
+								progress
+							}));
+						}
+					});
+				} catch (cause) {
+					result = err(toDbError(cause));
+				}
+				if (!mine() || controller.signal.aborted) return result;
+				latest.current.controller = void 0;
+				if (result.ok) {
+					setState({
+						status: "done",
+						progress: 1,
+						data: result.data,
+						error: void 0
+					});
+					latest.current.options.onSuccess?.(result.data);
+				} else {
+					setState((last) => ({
+						...last,
+						status: "error",
+						error: result.error
+					}));
+					latest.current.options.onError?.(result.error);
+				}
+				return result;
+			},
+			abort: stop,
+			reset: stop
+		};
+	}, [bucket]);
+	return {
+		...state,
+		...calls
+	};
+}
+//#endregion
+export { useAction as a, usePresence as i, useUpload as n, useActionForm as o, useDebouncedSearch as r, useSignedUrl as t };

package/dist/react-router/index.d.ts

@@ -0,0 +1,83 @@
+import { a as AnyModels, i as AnyFunctions } from "../types-6BdhkmZe.js";
+import { t as BetterSupabase } from "../define-CJJkkr1-.js";
+import { t as BetterServer } from "../server-CeVeeXwz.js";
+import { a as AuthorizedContext, c as Unwrapped, i as AuthorizeOptions, n as ActionParsed, o as BlockActionOptions, r as ActionResult, s as BlockRequireOptions } from "../kit-B5tid-q5.js";
+import { t as RefusalRedirects } from "../refusal-D1rgbzNq.js";
+import { n as FrameworkOptions, t as FrameworkLocals } from "../framework-DuVb4Xa8.js";
+import { t as Validated } from "../shared-DDSjEGDR.js";
+import { AnyEntry, Contributions } from "@supabase/middleware";
+import { StandardSchemaV1 } from "@standard-schema/spec";
+//#region src/bridges/react-router.d.ts
+/** The part of React Router's `RouterContextProvider` the bridge writes. */
+interface ReactRouterContext<Key, Value> {
+  set(key: Key, value: Value): void;
+}
+/** React Router's server middleware, typed structurally so the package does not import `react-router`. */
+type ReactRouterMiddleware<Key, Value> = (args: {
+  readonly request: Request;
+  readonly context: ReactRouterContext<Key, Value>;
+}, next: () => Promise<Response>) => Promise<Response>;
+interface ToReactRouterOptions<Key, Value> {
+  /**
+   * The host's env object for `getEnv`, e.g.
+   * `({ context }) => context.get(cloudflareContext).env` on Workers.
+   */
+  readonly env?: (args: Parameters<ReactRouterMiddleware<Key, Value>>[0]) => unknown;
+}
+/**
+ * Runs an entry array as React Router server middleware. The contributions
+ * are set under `key` (a `createContext()` key), so loaders and actions
+ * read `context.get(key).db`.
+ *
+ * ```ts title="app/root.tsx"
+ * export const supabase = createContext<BetterSupabaseContributions<...>>()
+ * export const middleware = [toReactRouter([withBetterSupabase(server)], supabase)]
+ * ```
+ */
+export declare function toReactRouter<const Entries extends readonly AnyEntry[], Key>(entries: Entries & Validated<Entries>, key: Key, options?: ToReactRouterOptions<Key, Contributions<Entries>>): ReactRouterMiddleware<Key, Contributions<Entries>>;
+//#endregion
+//#region src/react-router/create.d.ts
+/** React Router's `RouterContextProvider`, typed structurally. */
+interface ReactRouterContextProvider {
+  get(key: never): unknown;
+  set(key: never, value: never): void;
+}
+/** The arguments of a loader, action or middleware. */
+interface ReactRouterArgs {
+  readonly request: Request;
+  readonly context: ReactRouterContextProvider;
+  readonly params?: Readonly<Record<string, string | undefined>>;
+}
+interface ReactRouterOptions extends FrameworkOptions {
+  /** `createContext` from `react-router`; the factory makes its own context key. */
+  readonly createContext: () => unknown;
+  /**
+   * The host's env object for `getEnv`, e.g.
+   * `({ context }) => context.get(cloudflareContext).env` on Workers.
+   */
+  readonly platformEnv?: (args: ReactRouterArgs) => unknown;
+}
+interface BetterReactRouter<M extends AnyModels, F extends AnyFunctions, E, C = unknown, P = unknown> extends BetterServer<M, F, E, C, P> {
+  /** The context key the middleware sets: `context.get(bs.contextKey)`, or `bs.locals(args)`. */
+  readonly contextKey: unknown;
+  /**
+   * Server middleware for `root.tsx`: verifies the caller, refreshes the
+   * session cookie on navigations and form posts, and sets the context.
+   */
+  readonly middleware: (args: ReactRouterArgs, next: () => Promise<Response>) => Promise<Response>;
+  /** `db`, `bs`, `auth`, `tenant` and the serializable `session` of the request. */
+  locals(args: ReactRouterArgs): FrameworkLocals<M, F, E, C, P>;
+  /**
+   * A loader that runs the guard first. A refused caller gets a redirect to
+   * `signIn` or `mfa` when configured, else a thrown Problem Details
+   * response for the `ErrorBoundary`. `Result`s unwrap, and a failed one
+   * is thrown the same way.
+   */
+  loader<A extends ReactRouterArgs, T, R extends boolean = false>(options: BlockRequireOptions<C, P, R>, fn: (args: A, ctx: FrameworkLocals<M, F, E, C, P> & AuthorizedContext<C, P, R>) => T): (args: A) => Promise<Unwrapped<Awaited<T>>>;
+  /** An action returning an `ActionResult`, for `useActionData` or `useAction`. */
+  action<S extends StandardSchemaV1 | undefined, T, A extends ReactRouterArgs = ReactRouterArgs, R extends boolean = false>(options: BlockActionOptions<S, C, P, R>, fn: (input: ActionParsed<S>, ctx: FrameworkLocals<M, F, E, C, P> & AuthorizedContext<C, P, R>, args: A) => T): (args: A) => Promise<ActionResult<Unwrapped<Awaited<T>>>>;
+}
+/** React Router integration: middleware, guarded loaders and actions. */
+export declare function createReactRouter<M extends AnyModels, D, F extends AnyFunctions, E, C = unknown, P = unknown>(betterSupabase: BetterSupabase<M, D, F, E, C, P>, options: ReactRouterOptions): BetterReactRouter<M, F, E, C, P>;
+//#endregion
+export type { ActionResult, AuthorizeOptions, AuthorizedContext, BetterReactRouter, BlockActionOptions, BlockRequireOptions, FrameworkLocals, FrameworkOptions, ReactRouterArgs, ReactRouterContext, ReactRouterContextProvider, ReactRouterMiddleware, ReactRouterOptions, RefusalRedirects, ToReactRouterOptions };

package/dist/react-router/index.js

@@ -0,0 +1,89 @@
+import { a as problemResponse } from "../problem-BreOl8b8.js";
+import { c as extendServer, n as flushEvents, s as createServer } from "../adapter-Bc1o3zyy.js";
+import { o as settle, t as defaultExpose } from "../respond-BUgsXNgk.js";
+import { i as requireCaller, o as runAction } from "../kit-Fm-Fv7q5.js";
+import { n as bufferInPlace, t as around } from "../shared-CBxosKK3.js";
+import { i as localsOf, n as actionInput, r as frameworkEntry } from "../framework-CONDyPYx.js";
+import { r as refusalResponse } from "../refusal-CeJWxmkH.js";
+//#region src/bridges/react-router.ts
+/**
+* Runs an entry array as React Router server middleware. The contributions
+* are set under `key` (a `createContext()` key), so loaders and actions
+* read `context.get(key).db`.
+*
+* ```ts title="app/root.tsx"
+* export const supabase = createContext<BetterSupabaseContributions<...>>()
+* export const middleware = [toReactRouter([withBetterSupabase(server)], supabase)]
+* ```
+*/
+function toReactRouter(entries, key, options = {}) {
+	const run = around(entries);
+	return (args, next) => {
+		const { request, context } = args;
+		bufferInPlace(request);
+		return run(request, options.env?.(args), async (contributions) => {
+			context.set(key, contributions);
+			return next();
+		});
+	};
+}
+//#endregion
+//#region src/react-router/create.ts
+/** React Router integration: middleware, guarded loaders and actions. */
+function createReactRouter(betterSupabase, options) {
+	const server = createServer(betterSupabase, options);
+	const expose = options.exposeErrors ?? defaultExpose();
+	const run = around([frameworkEntry(server, options, expose)]);
+	const key = options.createContext();
+	const locals = (args) => {
+		let value;
+		try {
+			value = args.context.get(key);
+		} catch {
+			value = void 0;
+		}
+		if (typeof value !== "object" || value === null || !("bs" in value)) throw new TypeError("better-supabase: no context; add bs.middleware to the root route's middleware export");
+		return value;
+	};
+	return extendServer(server, {
+		contextKey: key,
+		middleware(args, next) {
+			bufferInPlace(args.request);
+			return run(args.request, options.platformEnv?.(args), async (contributions) => {
+				args.context.set(key, localsOf(contributions));
+				const response = await next();
+				flushEvents(server, options.waitUntil);
+				return response;
+			});
+		},
+		locals,
+		loader(loaderOptions, fn) {
+			return async (args) => {
+				const scope = locals(args);
+				const caller = await requireCaller(scope.bs.auth, loaderOptions, scope.tenant);
+				if ("kind" in caller) throw refusalResponse(caller, args.request, options, expose);
+				const ctx = {
+					...scope,
+					...caller
+				};
+				const settled = await settle(() => fn(args, ctx));
+				if (!settled.ok) throw problemResponse(settled.error, {
+					instance: new URL(args.request.url).pathname,
+					expose
+				});
+				return settled.data;
+			};
+		},
+		action(actionOptions, fn) {
+			return async (args) => {
+				const scope = locals(args);
+				return await runAction(scope.bs.auth, actionOptions, await actionInput(args.request), scope.tenant, (parsed, caller) => fn(parsed, {
+					...scope,
+					...caller
+				}, args));
+			};
+		}
+	});
+}
+//#endregion
+export { createReactRouter, toReactRouter };

package/dist/react-topic-seAWjL3_.js

@@ -0,0 +1,38 @@
+import { t as joinTopic } from "./channels-CkgQ_X60.js";
+//#region src/blocks/react-topic.ts
+/**
+* Joins a private topic and returns the function that leaves it. Watches on
+* the same client and topic share one channel, as `defineTopic` subscriptions
+* do, and the channel closes when the last one leaves.
+*/
+function watchTopic(supabase, topic, watch) {
+	let joined = false;
+	let left = false;
+	let leave;
+	try {
+		({leave} = joinTopic(supabase, topic, true, false, false, {
+			onStatus: (status) => {
+				if (left) return;
+				if (status === "subscribed") {
+					if (joined) watch.onRejoin();
+					joined = true;
+				}
+				watch.onStatus(status);
+			},
+			receive: (message) => {
+				if (!left) watch.onMessage(message.event, message.payload);
+			}
+		}));
+	} catch {
+		watch.onStatus("error");
+		return () => void 0;
+	}
+	return () => {
+		if (left) return;
+		left = true;
+		watch.onStatus("closed");
+		queueMicrotask(() => void leave());
+	};
+}
+//#endregion
+export { watchTopic as t };