@contember/bindx-react 0.1.52 → 0.1.54

package/dist/hooks/useEntity.d.ts

@@ -54,8 +54,10 @@ export type NotFoundEntityResult = UseEntityResultBase & {
 /**
  * Ready state — full EntityAccessor with status metadata.
  *
- * `$isRefetching` is `true` while a background re-fetch is in flight
- * (triggered by a `queryKey` change while ready data is already present).
+ * `$isRefetching` is `true` while the data answers an earlier query: from the re-fetch
+ * that a `queryKey` change starts, while ready data is already present, until its result
+ * arrives. Unlike `useEntityList`, the flag turns on when the re-fetch starts, one render
+ * after the change, not on the render that changes the query.
  * The accessor identity and field values remain stable until the new data
  * arrives, so the subtree does not unmount — useful for stale-while-revalidate
  * indicators (subtle spinner, "stale" badge, etc.).

package/dist/hooks/useEntity.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useEntity.d.ts","sourceRoot":"","sources":["../../src/hooks/useEntity.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACX,SAAS,EACT,iBAAiB,EAEjB,cAAc,EACd,aAAa,EACb,UAAU,EAIV,YAAY,EACZ,cAAc,EACd,SAAS,EACT,cAAc,EACd,MAAM,kBAAkB,CAAA;AAgBzB;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAChC,sFAAsF;IACtF,EAAE,EAAE,iBAAiB,CAAA;IACrB,wEAAwE;IACxE,KAAK,CAAC,EAAE,OAAO,CAAA;IACf;;;;OAIG;IACH,SAAS,CAAC,EAAE,aAAa,CAAA;IACzB,gDAAgD;IAChD,QAAQ,CAAC,EAAE,MAAM,CAAA;CACjB;AAMD;;;GAGG;AACH,UAAU,mBAAmB;IAC5B,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC,CAAA;IACzB,MAAM,IAAI,IAAI,CAAA;CACd;AAED,MAAM,MAAM,mBAAmB,GAAG,mBAAmB,GAAG;IACvD,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAA;IAC3B,QAAQ,CAAC,UAAU,EAAE,IAAI,CAAA;IACzB,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAA;IAC7B,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAA;IACxB,QAAQ,CAAC,WAAW,EAAE,KAAK,CAAA;IAC3B,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG,mBAAmB,GAAG;IACrD,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,UAAU,EAAE,KAAK,CAAA;IAC1B,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAA;IAC7B,QAAQ,CAAC,QAAQ,EAAE,IAAI,CAAA;IACvB,QAAQ,CAAC,WAAW,EAAE,KAAK,CAAA;IAC3B,QAAQ,CAAC,MAAM,EAAE,UAAU,CAAA;IAC3B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG,mBAAmB,GAAG;IACxD,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAA;IAC7B,QAAQ,CAAC,UAAU,EAAE,KAAK,CAAA;IAC1B,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAA;IAC7B,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAA;IACxB,QAAQ,CAAC,WAAW,EAAE,IAAI,CAAA;IAC1B,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAA;IACrB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;;;;;;GAQG;AACH,MAAM,MAAM,iBAAiB,CAAC,OAAO,SAAS,MAAM,EAAE,SAAS,SAAS,MAAM,GAAG,OAAO,IACvF,mBAAmB,GAAG,cAAc,CAAC,OAAO,EAAE,SAAS,CAAC,GAAG;IAC1D,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,UAAU,EAAE,KAAK,CAAA;IAC1B,QAAQ,CAAC,aAAa,EAAE,OAAO,CAAA;IAC/B,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAA;IACxB,QAAQ,CAAC,WAAW,EAAE,KAAK,CAAA;IAC3B,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAA;CACrB,CAAA;AAEF;;;GAGG;AACH,MAAM,MAAM,eAAe,CAAC,OAAO,SAAS,MAAM,EAAE,SAAS,SAAS,MAAM,GAAG,OAAO,IACnF,mBAAmB,GACnB,iBAAiB,GACjB,oBAAoB,GACpB,iBAAiB,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;AAMxC;;GAEG;AACH,wBAAgB,SAAS,CACxB,QAAQ,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACvC,MAAM,SAAS,SAAS,CAAC,QAAQ,CAAC,EAClC,OAAO,SAAS,MAAM,EAEtB,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,EAC3B,OAAO,EAAE,gBAAgB,GAAG;IAAE,KAAK,EAAE,SAAS,MAAM,EAAE,CAAA;CAAE,EACxD,OAAO,EAAE,cAAc,CAAC,cAAc,CAAC,QAAQ,EAAE,MAAM,CAAC,EAAE,OAAO,CAAC,GAChE,eAAe,CAAC,cAAc,CAAC,QAAQ,EAAE,MAAM,CAAC,EAAE,OAAO,CAAC,CAAA;AAE7D;;;;;;;;;GASG;AACH,wBAAgB,SAAS,CAAC,QAAQ,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,SAAS,MAAM,EACxF,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,EAC3B,OAAO,EAAE,gBAAgB,EACzB,OAAO,EAAE,cAAc,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,GACtD,eAAe,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAA;AAEnD;;;GAGG;AACH,wBAAgB,SAAS,CACxB,MAAM,EAAE,SAAS,EACjB,OAAO,EAAE,gBAAgB,GAAG;IAAE,SAAS,EAAE,aAAa,CAAA;CAAE,GACtD,eAAe,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA"}
+{"version":3,"file":"useEntity.d.ts","sourceRoot":"","sources":["../../src/hooks/useEntity.ts"],"names":[],"mappings":"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"}

package/dist/hooks/useEntityList.d.ts

@@ -40,8 +40,8 @@ export type ErrorEntityListResult = EntityListResultBase & {
     readonly $error: FieldError;
 };
 /**
- * `$isRefetching` is `true` while a background re-fetch is in flight
- * (triggered by a `queryKey` change while ready data is already present).
+ * `$isRefetching` is `true` while the items answer an earlier query: from the render
+ * that changes the options or the `queryKey` until the re-fetch returns.
  * The accessor identity stays stable so the subtree does not unmount —
  * stale-while-revalidate semantics.
  */

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@contember/bindx-react",
-	"version": "0.1.52",
+	"version": "0.1.54",
 	"description": "Type-safe React data binding framework",
 	"type": "module",
 	"main": "./src/index.ts",
@@ -15,8 +15,8 @@
 		"react": ">=18.0.0"
 	},
 	"dependencies": {
-		"@contember/bindx": "0.1.52",
-		"@contember/bindx-client": "0.1.52",
+		"@contember/bindx": "0.1.54",
+		"@contember/bindx-client": "0.1.54",
 		"@contember/graphql-client": "^2.1.0-beta.1",
 		"@radix-ui/primitive": "^1.1.3",
 		"@radix-ui/react-slot": "^1.2.4"

package/src/hooks/useEntity.ts

@@ -93,8 +93,10 @@ export type NotFoundEntityResult = UseEntityResultBase & {
 /**
  * Ready state — full EntityAccessor with status metadata.
  *
- * `$isRefetching` is `true` while a background re-fetch is in flight
- * (triggered by a `queryKey` change while ready data is already present).
+ * `$isRefetching` is `true` while the data answers an earlier query: from the re-fetch
+ * that a `queryKey` change starts, while ready data is already present, until its result
+ * arrives. Unlike `useEntityList`, the flag turns on when the re-fetch starts, one render
+ * after the change, not on the render that changes the query.
  * The accessor identity and field values remain stable until the new data
  * arrives, so the subtree does not unmount — useful for stale-while-revalidate
  * indicators (subtle spinner, "stale" badge, etc.).
@@ -290,7 +292,8 @@ export function useEntity(
 				if (result.type === 'get' && result.data === null) {
 					dispatcher.dispatch(setLoadState(entityType, id, 'not_found'))
 				} else if (result.type === 'get' && result.data) {
-					const data = result.data
+					store.indexServerResponse(entityType, result.data, selectionMeta, schemaRegistry)
+					const data = store.resolveServerOccurrence(result.data)
 					// Revalidation: advance the server baseline but keep local dirty
 					// edits intact (see EntitySnapshotStore.refreshServerData).
 					store.batchNotifications(() => {
@@ -321,7 +324,7 @@ export function useEntity(
 				fetchingRef.current = null
 			}
 		}
-	}, [entityType, id, byKey, effectiveQueryKey, options.cache, batcher, store, dispatcher, selectionMeta])
+	}, [entityType, id, byKey, effectiveQueryKey, options.cache, batcher, store, dispatcher, selectionMeta, schemaRegistry])
 
 	// --- EntityHandle ---
 	// The handle keeps a stable identity across data changes — it is a stateless live view over the

package/src/hooks/useEntityList.ts

@@ -58,8 +58,8 @@ export type ErrorEntityListResult = EntityListResultBase & {
 }
 
 /**
- * `$isRefetching` is `true` while a background re-fetch is in flight
- * (triggered by a `queryKey` change while ready data is already present).
+ * `$isRefetching` is `true` while the items answer an earlier query: from the render
+ * that changes the options or the `queryKey` until the re-fetch returns.
  * The accessor identity stays stable so the subtree does not unmount —
  * stale-while-revalidate semantics.
  */
@@ -217,16 +217,24 @@ export function useEntityList(
 		return `${entityType}:${selectionContentKey}`
 	}, [options.queryKey, selectionContentKey, entityType])
 
+	const requestKey = useMemo(
+		() => JSON.stringify([effectiveQueryKey, optionsKey]),
+		[effectiveQueryKey, optionsKey],
+	)
+
 	// --- List state tracking ---
 	const listStateRef = useRef<{
 		status: 'loading' | 'error' | 'ready'
 		items: Array<{ id: string; data: object }>
 		error?: FieldError
 		isRefetching: boolean
+		/** The request the items were loaded for. */
+		requestKey: string | null
 	}>({
 		status: 'loading',
 		items: [],
 		isRefetching: false,
+		requestKey: null,
 	})
 
 	const versionRef = useRef(0)
@@ -350,6 +358,9 @@ export function useEntityList(
 		const state = listStateRef.current
 		const version = versionRef.current
 		const storeVersion = store.getVersion()
+		// Until the data-loading effect marks the refetch, the items of the previous request are
+		// already stale on the render that changed it.
+		const isRefetching = state.isRefetching || state.requestKey !== requestKey
 
 		const cache = listCacheRef.current
 		if (
@@ -357,7 +368,7 @@ export function useEntityList(
 			cache.version === version &&
 			cache.storeVersion === storeVersion &&
 			cache.status === state.status &&
-			cache.isRefetching === state.isRefetching &&
+			cache.isRefetching === isRefetching &&
 			cache.accessorCache === itemAccessorCache
 		) {
 			return cache.result
@@ -382,7 +393,7 @@ export function useEntityList(
 			result = {
 				$status: 'ready',
 				$isLoading: false,
-				$isRefetching: state.isRefetching,
+				$isRefetching: isRefetching,
 				$isError: false,
 				$error: null,
 				$isDirty: false,
@@ -398,13 +409,13 @@ export function useEntityList(
 			version,
 			storeVersion,
 			status: state.status,
-			isRefetching: state.isRefetching,
+			isRefetching,
 			accessorCache: itemAccessorCache,
 			result,
 		}
 
 		return result
-	}, [store, itemAccessorCache, addItem, removeItem, moveItem, resolveItemId])
+	}, [store, requestKey, itemAccessorCache, addItem, removeItem, moveItem, resolveItemId])
 
 	const isEqual = useCallback(
 		(a: UseEntityListResult<any>, b: UseEntityListResult<any>): boolean => {
@@ -429,7 +440,7 @@ export function useEntityList(
 		if (prev.status === 'ready') {
 			listStateRef.current = { ...prev, isRefetching: true }
 		} else {
-			listStateRef.current = { status: 'loading', items: [], isRefetching: false }
+			listStateRef.current = { status: 'loading', items: [], isRefetching: false, requestKey: null }
 		}
 		versionRef.current++
 		store.notify()
@@ -462,13 +473,14 @@ export function useEntityList(
 					throw new Error('Unexpected query result type')
 				}
 
-				const items = result.data.map(data => ({ id: getRowId(entityType, data), data }))
+				store.indexServerResponse(entityType, result.data, selectionMeta, schemaRegistry)
+				const items = result.data.map(data => ({ id: getRowId(entityType, data), data: store.resolveServerOccurrence(data) }))
 				store.batchNotifications(() => {
 					for (const item of items) {
 						// Revalidation preserves local edits while advancing the server baseline.
 						dispatcher.dispatch(refreshServerData(entityType, item.id, item.data))
 					}
-					listStateRef.current = { status: 'ready', items, isRefetching: false }
+					listStateRef.current = { status: 'ready', items, isRefetching: false, requestKey }
 					versionRef.current++
 					store.notify()
 				})
@@ -481,6 +493,7 @@ export function useEntityList(
 					items: [],
 					error: createLoadError(normalizedError),
 					isRefetching: false,
+					requestKey,
 				}
 				versionRef.current++
 				store.notify()
@@ -492,7 +505,7 @@ export function useEntityList(
 		return () => {
 			abortController.abort()
 		}
-	}, [entityType, optionsKey, effectiveQueryKey, batcher, dispatcher, store, selectionMeta])
+	}, [entityType, optionsKey, requestKey, batcher, dispatcher, store, selectionMeta, schemaRegistry])
 
 	return accessor
 }