@octanejs/livestore 0.0.25 → 0.0.27

package/UPSTREAM.md

@@ -83,3 +83,18 @@ ownership in `audit/test-classifications.json`.
 - Public query instrumentation uses the label `octane`. The framework-neutral
   toolkit's internal refresh tag remains `react` because that released core API
   is reused unchanged.
+- Once a `useStore()` call site has suspended, it keeps calling `use()` on the
+  promise it suspended on after the store loads. Upstream calls `React.use()`
+  only while `getOrLoadPromise()` returns a promise. `use()` is positional in
+  both frameworks, and a replay reuses the thenable already stored at a
+  position, so skipping it gives a following `useStore()` in the same
+  component the loaded store instead of suspending on its own. React 19.2.3
+  hits this only when it replays a suspended component in place, for example
+  a transition that switches a mounted component to two unloaded stores and
+  the first loads while React waits: it commits the first store for both
+  calls. Octane replays a Suspense body after every settle, so without the
+  guard every such component would get the wrong store. The call still
+  returns the store that `getOrLoadPromise()` returns synchronously, and
+  `getOrLoadPromise()` still runs on every render.
+  `tests/conformance/sequential-stores.test.ts` covers mount, transition, a
+  real `StoreRegistry`, and `useActionState` commits after a Suspense load.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@octanejs/livestore",
-  "version": "0.0.25",
+  "version": "0.0.27",
   "license": "Apache-2.0",
   "type": "module",
   "sideEffects": false,
@@ -49,7 +49,7 @@
     "@opentelemetry/api": "1.9.0"
   },
   "peerDependencies": {
-    "octane": "^0.5.0"
+    "octane": "^0.7.0"
   },
   "devDependencies": {
     "@livestore/adapter-web": "0.4.0",
@@ -68,7 +68,7 @@
     "react-window": "1.8.11",
     "vite": "7.3.1",
     "vitest": "^4.1.10",
-    "octane": "0.5.0"
+    "octane": "0.7.0"
   },
   "scripts": {
     "test": "vitest run --config vitest.config.ts && vitest run --config vitest.ssr.config.ts",

package/src/useStore.ts

@@ -2,7 +2,7 @@ import type { LiveStoreSchema } from '@livestore/common/schema';
 import { SessionIdSymbol } from '@livestore/common';
 import type { RegistryStoreOptions, Store, SyncStatus } from '@livestore/livestore';
 import type { Schema } from '@livestore/utils/effect';
-import { use, useEffect } from 'octane';
+import { use, useEffect, useMemo } from 'octane';
 import { useStoreRegistry } from './StoreRegistryContext.tsrx';
 import { splitSlot, subSlot } from './internal';
 import { useClientDocument } from './useClientDocument';
@@ -32,8 +32,26 @@ export function useStore<
 ): Store<TSchema, TContext> & ReactApi {
 	const [, slot] = splitSlot(rest);
 	const storeRegistry = useStoreRegistry();
+	// Called on every render, as upstream does: a loaded store returns synchronously.
 	const storeOrPromise = storeRegistry.getOrLoadPromise(options);
-	const store = storeOrPromise instanceof Promise ? use(storeOrPromise) : storeOrPromise;
+	const loading = useMemo<{ promise: PromiseLike<unknown> | undefined }>(
+		() => ({ promise: undefined }),
+		[storeRegistry, options.storeId],
+		subSlot(slot, 'store:loading'),
+	);
+	let store: Store<TSchema, TContext>;
+	if (storeOrPromise instanceof Promise) {
+		loading.promise = storeOrPromise;
+		store = use(storeOrPromise);
+	} else {
+		// use() is positional. Once this call site has suspended, keep reading the
+		// promise it suspended on after the store loads, so the call keeps its
+		// position when the boundary replays. Skipping use() here would hand this
+		// call's position to the next useStore() in the component, and the replay
+		// would return this store to that call instead of suspending on its own.
+		if (loading.promise !== undefined) use(loading.promise);
+		store = storeOrPromise;
+	}
 	useEffect(
 		() => storeRegistry.retain(options),
 		[storeRegistry, options],