@faasjs/react 8.0.0-beta.23 → 8.0.0-beta.25

package/dist/index.d.ts

@@ -1318,7 +1318,7 @@ declare class ErrorBoundary extends Component<ErrorBoundaryProps, {
   /**
    * Render children or the configured fallback for the captured error.
    */
-  render(): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null;
+  render(): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | _$react_jsx_runtime0.JSX.Element | null;
 }
 //#endregion
 //#region src/equal.d.ts
@@ -1465,7 +1465,7 @@ type OptionalWrapperProps<TWrapper extends ComponentType<{
  * )
  * ```
  */
-declare function OptionalWrapper(props: OptionalWrapperProps): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+declare function OptionalWrapper(props: OptionalWrapperProps): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | _$react_jsx_runtime0.JSX.Element | null | undefined;
 declare namespace OptionalWrapper {
   var displayName: string;
 }

package/dist/index.mjs

@@ -402,6 +402,117 @@ let mock = null;
 function setMock(handler) {
 	mock = handler;
 }
+function buildActionUrl(action, baseUrl, options, requestId) {
+	return `${(options?.baseUrl || baseUrl) + action.toLowerCase()}?_=${requestId}`;
+}
+function buildActionOptions(defaultOptions, options, params, requestId) {
+	const resolvedOptions = {
+		method: "POST",
+		headers: { "Content-Type": "application/json; charset=UTF-8" },
+		mode: "cors",
+		credentials: "include",
+		body: JSON.stringify(params),
+		...defaultOptions,
+		...options || Object.create(null)
+	};
+	if (!resolvedOptions.headers["X-FaasJS-Request-Id"] && !resolvedOptions.headers["x-faasjs-request-id"]) resolvedOptions.headers["X-FaasJS-Request-Id"] = requestId;
+	return resolvedOptions;
+}
+async function runBeforeRequest(action, params, options) {
+	if (!options.beforeRequest) return;
+	await options.beforeRequest({
+		action,
+		params,
+		options,
+		headers: options.headers
+	});
+}
+function normalizeMockResponse(response) {
+	if (response instanceof Error) throw new ResponseError(response);
+	if (response instanceof Response) {
+		if (typeof ReadableStream !== "undefined" && response.body instanceof ReadableStream && response.body.locked === false) {
+			const [nextBody, currentBody] = response.body.tee();
+			response.body = nextBody;
+			const clonedResponse = {
+				status: response.status,
+				headers: response.headers,
+				body: currentBody
+			};
+			if (response.data !== void 0) clonedResponse.data = response.data;
+			return new Response({ ...clonedResponse });
+		}
+		return response;
+	}
+	if (response && typeof ReadableStream !== "undefined" && response.body instanceof ReadableStream && response.body.locked === false) {
+		const [nextBody, currentBody] = response.body.tee();
+		response.body = nextBody;
+		return new Response({
+			...response,
+			body: currentBody
+		});
+	}
+	return new Response(response || {});
+}
+async function resolveMockResponse(action, params, options) {
+	console.debug(`[FaasJS] Mock request: ${action} %j`, params);
+	if (typeof mock === "function") return normalizeMockResponse(await mock(action, params, options));
+	return normalizeMockResponse(mock);
+}
+function toResponseHeaders(headers) {
+	const responseHeaders = {};
+	for (const [key, value] of headers) responseHeaders[key] = value;
+	return responseHeaders;
+}
+function parseSuccessfulResponse(status, headers, text) {
+	if (!text) return new Response({
+		status,
+		headers
+	});
+	const body = JSON.parse(text);
+	if (body.error?.message) throw new ResponseError({
+		message: body.error.message,
+		status,
+		headers,
+		body
+	});
+	return new Response({
+		status,
+		headers,
+		body,
+		data: body.data
+	});
+}
+function parseFailedResponse(status, headers, text) {
+	try {
+		const body = JSON.parse(text);
+		if (body.error?.message) throw new ResponseError({
+			message: body.error.message,
+			status,
+			headers,
+			body
+		});
+		throw new ResponseError({
+			message: text,
+			status,
+			headers,
+			body
+		});
+	} catch (error) {
+		if (error instanceof ResponseError) throw error;
+		throw new ResponseError({
+			message: text,
+			status,
+			headers,
+			body: text
+		});
+	}
+}
+async function parseFetchResponse(response) {
+	const headers = toResponseHeaders(response.headers);
+	const text = await response.text();
+	if (response.status >= 200 && response.status < 300) return parseSuccessfulResponse(response.status, headers, text);
+	return parseFailedResponse(response.status, headers, text);
+}
 /**
 * Browser client for FaasJS - provides HTTP client functionality for making API requests from web applications.
 *
@@ -655,86 +766,15 @@ var FaasBrowserClient = class {
 	*/
 	async action(action, params, options) {
 		if (!action) throw Error("[FaasJS] action required");
-		const id = `F-${generateId()}`;
-		const url = `${(options?.baseUrl || this.baseUrl) + action.toLowerCase()}?_=${id}`;
 		if (!params) params = Object.create(null);
-		if (!options) options = Object.create(null);
-		const parsedOptions = {
-			method: "POST",
-			headers: { "Content-Type": "application/json; charset=UTF-8" },
-			mode: "cors",
-			credentials: "include",
-			body: JSON.stringify(params),
-			...this.defaultOptions,
-			...options
-		};
-		if (!parsedOptions.headers["X-FaasJS-Request-Id"] && !parsedOptions.headers["x-faasjs-request-id"]) parsedOptions.headers["X-FaasJS-Request-Id"] = id;
-		if (parsedOptions.beforeRequest) await parsedOptions.beforeRequest({
-			action,
-			params,
-			options: parsedOptions,
-			headers: parsedOptions.headers
-		});
-		if (mock) {
-			console.debug(`[FaasJS] Mock request: ${action} %j`, params);
-			if (typeof mock === "function") {
-				const response = await mock(action, params, parsedOptions);
-				if (response instanceof Error) return Promise.reject(new ResponseError(response));
-				if (response instanceof Response) return response;
-				return new Response(response || {});
-			}
-			if (mock instanceof Response) return mock;
-			return new Response(mock || {});
-		}
-		if (parsedOptions.request) return parsedOptions.request(url, parsedOptions);
-		if (parsedOptions.stream) return fetch(url, parsedOptions);
-		return fetch(url, parsedOptions).then(async (response) => {
-			const headers = {};
-			for (const values of response.headers) headers[values[0]] = values[1];
-			return response.text().then((res) => {
-				if (response.status >= 200 && response.status < 300) {
-					if (!res) return new Response({
-						status: response.status,
-						headers
-					});
-					const body = JSON.parse(res);
-					if (body.error?.message) return Promise.reject(new ResponseError({
-						message: body.error.message,
-						status: response.status,
-						headers,
-						body
-					}));
-					return new Response({
-						status: response.status,
-						headers,
-						body,
-						data: body.data
-					});
-				}
-				try {
-					const body = JSON.parse(res);
-					if (body.error?.message) return Promise.reject(new ResponseError({
-						message: body.error.message,
-						status: response.status,
-						headers,
-						body
-					}));
-					return Promise.reject(new ResponseError({
-						message: res,
-						status: response.status,
-						headers,
-						body
-					}));
-				} catch {
-					return Promise.reject(new ResponseError({
-						message: res,
-						status: response.status,
-						headers,
-						body: res
-					}));
-				}
-			});
-		});
+		const requestId = `F-${generateId()}`;
+		const url = buildActionUrl(action, this.baseUrl, options, requestId);
+		const resolvedOptions = buildActionOptions(this.defaultOptions, options, params, requestId);
+		await runBeforeRequest(action, params, resolvedOptions);
+		if (mock) return resolveMockResponse(action, params, resolvedOptions);
+		if (resolvedOptions.request) return resolvedOptions.request(url, resolvedOptions);
+		if (resolvedOptions.stream) return fetch(url, resolvedOptions);
+		return parseFetchResponse(await fetch(url, resolvedOptions));
 	}
 };
 //#endregion
@@ -1132,6 +1172,7 @@ function useFaasRequest({ action, defaultParams, options, beforeSend, onSuccess,
 	const failedOnceRef = useRef(false);
 	const pendingReloadsRef = useRef(/* @__PURE__ */ new Map());
 	const reloadCounterRef = useRef(0);
+	const requestVersionRef = useRef(0);
 	const beforeSendRef = useRef(beforeSend);
 	const onSuccessRef = useRef(onSuccess);
 	const sendRef = useRef(send);
@@ -1153,6 +1194,7 @@ function useFaasRequest({ action, defaultParams, options, beforeSend, onSuccess,
 		beforeSendRef.current?.();
 		failedOnceRef.current = false;
 		const controller = new AbortController();
+		const requestVersion = ++requestVersionRef.current;
 		controllerRef.current = controller;
 		const client = getClient(options.baseUrl);
 		const requestParams = options.params || params;
@@ -1164,6 +1206,7 @@ function useFaasRequest({ action, defaultParams, options, beforeSend, onSuccess,
 			for (const { resolve } of pendingReloadsRef.current.values()) resolve(value);
 			pendingReloadsRef.current.clear();
 		};
+		const isCurrentRequest = () => requestVersion === requestVersionRef.current && controllerRef.current === controller;
 		const run = () => {
 			sendRef.current({
 				action,
@@ -1174,12 +1217,14 @@ function useFaasRequest({ action, defaultParams, options, beforeSend, onSuccess,
 					promiseRef.current = promise;
 				}
 			}).then((result) => {
+				if (!isCurrentRequest()) return;
 				failedOnceRef.current = false;
 				setError(null);
 				onSuccessRef.current?.(result);
 				setLoading(false);
 				resolvePending(result);
 			}).catch(async (e) => {
+				if (!isCurrentRequest()) return;
 				if (typeof e?.message === "string" && e.message.toLowerCase().includes("aborted")) return;
 				if (!failedOnceRef.current && typeof e?.message === "string" && e.message.includes("Failed to fetch")) {
 					failedOnceRef.current = true;
@@ -1193,6 +1238,7 @@ function useFaasRequest({ action, defaultParams, options, beforeSend, onSuccess,
 				} catch (newError) {
 					nextError = newError;
 				}
+				if (!isCurrentRequest()) return;
 				setError(nextError);
 				setLoading(false);
 				rejectPending(nextError);
@@ -1202,13 +1248,15 @@ function useFaasRequest({ action, defaultParams, options, beforeSend, onSuccess,
 			const timeout = setTimeout(run, options.debounce);
 			return () => {
 				clearTimeout(timeout);
-				controllerRef.current?.abort();
+				if (controllerRef.current === controller) controllerRef.current = null;
+				controller.abort();
 				setLoading(false);
 			};
 		}
 		run();
 		return () => {
-			controllerRef.current?.abort();
+			if (controllerRef.current === controller) controllerRef.current = null;
+			controller.abort();
 			setLoading(false);
 		};
 	}, [
@@ -1712,12 +1760,13 @@ function createSplittingContext(defaultValue) {
 * ```
 */
 function useFaasStream(action, defaultParams, options = {}) {
-	const [data, setData] = useState(options.data || "");
+	const [data, setData] = useState(options.data ?? "");
+	const updateData = options.setData ?? setData;
 	const request = useFaasRequest({
 		action,
 		defaultParams,
 		options,
-		beforeSend: () => setData(""),
+		beforeSend: () => updateData(""),
 		send: async ({ action, params, signal, client }) => {
 			const response = await client.browserClient.action(action, params, {
 				signal,
@@ -1727,17 +1776,32 @@ function useFaasStream(action, defaultParams, options = {}) {
 			const reader = response.body.getReader();
 			const decoder = new TextDecoder();
 			let accumulatedText = "";
+			const onAbort = () => {
+				reader.cancel().catch(() => void 0);
+			};
+			if (signal.aborted) {
+				onAbort();
+				throw new Error("Request aborted");
+			}
+			signal.addEventListener("abort", onAbort, { once: true });
 			try {
 				while (true) {
+					if (signal.aborted) throw new Error("Request aborted");
 					const { done, value } = await reader.read();
 					if (done) break;
 					accumulatedText += decoder.decode(value, { stream: true });
-					setData(accumulatedText);
+					updateData(accumulatedText);
 				}
+				accumulatedText += decoder.decode();
 				return accumulatedText;
 			} catch (error) {
-				reader.releaseLock();
+				if (signal.aborted) throw new Error("Request aborted");
 				throw error;
+			} finally {
+				signal.removeEventListener("abort", onAbort);
+				try {
+					reader.releaseLock();
+				} catch {}
 			}
 		}
 	});
@@ -1746,10 +1810,10 @@ function useFaasStream(action, defaultParams, options = {}) {
 		params: request.params,
 		loading: request.loading,
 		reloadTimes: request.reloadTimes,
-		data: options.data || data,
+		data: options.data ?? data,
 		error: request.error,
 		reload: request.reload,
-		setData: options.setData || setData,
+		setData: updateData,
 		setLoading: request.setLoading,
 		setError: request.setError
 	};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faasjs/react",
-  "version": "8.0.0-beta.23",
+  "version": "8.0.0-beta.25",
   "homepage": "https://faasjs.com/doc/react/",
   "bugs": {
     "url": "https://github.com/faasjs/faasjs/issues"
@@ -26,12 +26,12 @@
     }
   },
   "devDependencies": {
-    "@faasjs/types": ">=8.0.0-beta.23",
+    "@faasjs/types": ">=8.0.0-beta.25",
     "@types/react": "^19.0.0",
     "react": "^19.0.0"
   },
   "peerDependencies": {
-    "@faasjs/types": ">=8.0.0-beta.23"
+    "@faasjs/types": ">=8.0.0-beta.25"
   },
   "engines": {
     "node": ">=24.0.0",