3.1.1 (#381)

README.md

@@ -117,6 +117,20 @@ misc:
 
 ## 🤝🏽 Contributions
 
--   Contributions are welcome, just make a pull request
+Contributions are welcome, just make a pull request.
+
+Most of the core logic is within `shared`, have avoided creating an abstract core class which requires a `rerender` specific to each framework because the differences between each framework make this not worth the while I think because then effort shifts towards reconciliation, for example:
+
+-   with React we trigger a rerender by updating a counter
+-   with Solid (and other signal based frameworks) we trigger a rerender by updating the `qwery` signal
+
+to extract out the core into a general purpose class would be introducing `data`, `version` and `dispatch` signals and then updating each of these individually.
+
+Another one is that supporting both suspense and non suspense:
+
+-   in React we throw a Promise before proceeding
+-   in Solid, we `createResource`
+-   in Svelte, there is no suspense and we just return the async
+-   in Vue, we just make the component async
 
 **_"Man's duality, life and its formalities"_**

lerna.json

@@ -1,6 +1,6 @@
 {
   "$schema": "node_modules/lerna/schemas/lerna-schema.json",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "packages": [
     "packages/*"
   ],

packages/example-react/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@b.s/qwery-example-react",
 	"private": true,
-	"version": "3.1.0",
+	"version": "3.1.1",
 	"type": "module",
 	"scripts": {
 		"dev": "vite",

packages/example-solid/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "example-solid",
 	"private": true,
-	"version": "3.1.0",
+	"version": "3.1.1",
 	"type": "module",
 	"scripts": {
 		"dev": "vite",

packages/example-svelte/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@b.s/qwery-example-svelte",
 	"private": true,
-	"version": "3.1.0",
+	"version": "3.1.1",
 	"type": "module",
 	"scripts": {
 		"dev": "vite",

packages/example-vue/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@b.s/qwery-example-vue",
 	"private": true,
-	"version": "3.1.0",
+	"version": "3.1.1",
 	"type": "module",
 	"scripts": {
 		"dev": "vite",

packages/gqwery/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@b.s/gqwery",
-	"version": "3.1.0",
+	"version": "3.1.1",
 	"type": "module",
 	"repository": {
 		"type": "git",

packages/react/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@b.s/react-qwery",
-	"version": "3.1.0",
+	"version": "3.1.1",
 	"type": "module",
 	"repository": {
 		"type": "git",

packages/react/src/test/use-monitored-fetch/monitored-fetch.test.ts

@@ -16,19 +16,30 @@ describe("monitored fetch", () => {
 
 		await waitFor(() => {
 			expect(result.current.isFetching).toBeFalsy();
+			expect(result.current.isInitialFetch).toBeFalsy();
 		});
 
 		monitoredFirstFetch();
 		rerender();
 
 		await waitFor(() => {
 			expect(result.current.isFetching).toBeTruthy();
+			expect(result.current.isInitialFetch).toBeTruthy();
 		});
 
 		await vi.runAllTimersAsync();
 
 		await waitFor(() => {
 			expect(result.current.isFetching).toBeFalsy();
+			expect(result.current.isInitialFetch).toBeFalsy();
+		});
+
+		monitoredFirstFetch();
+		rerender();
+
+		await waitFor(() => {
+			expect(result.current.isFetching).toBeTruthy();
+			expect(result.current.isInitialFetch).toBeFalsy();
 		});
 	});
 });

packages/react/src/test/use-qwery/enable.test.tsx

@@ -36,9 +36,11 @@ describe("enable", () => {
 			/>,
 		);
 
-		await waitFor(() => {
-			expect(() => screen.getByText("1")).toThrowError();
-		});
+		await expect(
+			waitFor(() => {
+				expect(screen.getByText("1")).toBeTruthy();
+			}),
+		).rejects.toThrowError();
 	});
 
 	it("enabled/disabled", async () => {
@@ -82,14 +84,16 @@ describe("enable", () => {
 				onChange={vitest.fn()}
 				initialValue={initialValue}
 				render={data => {
-					return data && 1;
+					return data && 2;
 				}}
 				enabled={false}
 			/>,
 		);
 
-		await waitFor(() => {
-			expect(() => screen.getByText("1")).toThrowError();
-		});
+		await expect(
+			waitFor(() => {
+				expect(screen.getByText("2")).toBeTruthy();
+			}),
+		).rejects.toThrowError();
 	});
 });

packages/react/src/use-monitored-fetch/index.ts

@@ -3,7 +3,10 @@ import { makeMonitor } from "@b.s/qwery-shared";
 
 export const useMonitoredFetch = () => {
 	const [allFetchStatus, setAllFetchStatus] = React.useState<{
-		[key: string]: boolean;
+		[key: string]: {
+			isFetching: boolean;
+			count: number;
+		};
 	}>(Object.create(null));
 
 	const monitor = React.useCallback(
@@ -14,7 +17,15 @@ export const useMonitoredFetch = () => {
 	return {
 		isFetching:
 			Object.keys(allFetchStatus).length > 0
-				? Object.values(allFetchStatus).some(Boolean)
+				? Object.values(allFetchStatus).some(
+						({ isFetching }) => isFetching,
+					)
+				: false,
+		isInitialFetch:
+			Object.keys(allFetchStatus).length > 0
+				? Object.values(allFetchStatus).some(
+						({ isFetching, count }) => isFetching && count < 1,
+					)
 				: false,
 		monitor,
 	};

packages/react/src/use-qwery/index.ts

@@ -38,6 +38,7 @@ export const useQwery = <I extends InitialValue>({
 	enabled = true,
 	affects,
 	requestManager,
+	throwErrors = suspense,
 }: UseQweryOptions<I>): UseQweryReturn<I> => {
 	const instanceId = React.useMemo(createId, []);
 
@@ -144,6 +145,7 @@ export const useQwery = <I extends InitialValue>({
 			abortController: abortControllerRef.current,
 			refetch: typeof initialValue === "function" ? initialValue : null,
 			affects,
+			throwErrors,
 		});
 
 		setQwery(_qwery);
@@ -158,6 +160,14 @@ export const useQwery = <I extends InitialValue>({
 		typeof createQwery
 	> | null>(null);
 
+	React.useEffect(() => {
+		const cancelInflightRequests = abortControllerRef.current.abort.bind(
+			abortControllerRef.current,
+		);
+
+		return cancelInflightRequests;
+	}, []);
+
 	React.useEffect(() => {
 		return () => {
 			SUSPENDED.delete(suspenseKey);
@@ -166,13 +176,7 @@ export const useQwery = <I extends InitialValue>({
 	}, [qwery, enabled, queryKey?.toString(), suspenseKey]);
 
 	React.useEffect(() => {
-		const cancelInflightRequests = abortControllerRef.current.abort.bind(
-			abortControllerRef.current,
-		);
-
 		create();
-
-		return cancelInflightRequests;
 	}, [
 		enabled,
 		queryKey?.toString(),
@@ -208,14 +212,7 @@ export const useQwery = <I extends InitialValue>({
 			return;
 		}
 
-		const observe = () => {
-			return subscribeQwery(qwery, {
-				rerender,
-				subscribe,
-			});
-		};
-
-		return observe();
+		return subscribeQwery(qwery, subscribe);
 	}, [qwery]);
 
 	React.useEffect(() => {

packages/shared/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@b.s/qwery-shared",
-	"version": "3.1.0",
+	"version": "3.1.1",
 	"private": true,
 	"type": "module",
 	"devDependencies": {

packages/shared/src/use-monitored-fetch/index.ts

@@ -21,7 +21,10 @@ export const makeMonitor =
 			onFetching: isFetching =>
 				update(allFetchStatus => ({
 					...allFetchStatus,
-					[id]: isFetching,
+					[id]: {
+						isFetching,
+						count: (allFetchStatus[id]?.count ?? 0) + 1 / 2,
+					},
 				})),
 		});
 	};