fix: track nested deep optimistic store pending state (#2748)

* fix: track nested deep optimistic store pending state

* test: cover nested optimistic deep reads

Co-authored-by: Cursor <cursoragent@cursor.com>

---------

Co-authored-by: Ryan Carniato <ryansolid@gmail.com>
Co-authored-by: Cursor <cursoragent@cursor.com>

Author: 3 people

.changeset/fix-nested-optimistic-store-pending.md

@@ -0,0 +1,5 @@
+---
+"@solidjs/signals": patch
+---
+
+Track pending state for nested deep optimistic store reads.

packages/solid-signals/src/store/utils.ts

@@ -9,6 +9,7 @@ import {
   getPropertyDescriptor,
   isWrappable,
   STORE_OVERRIDE,
+  STORE_LOOKUP,
   STORE_VALUE,
   storeLookup,
   trackSelf,
@@ -38,7 +39,7 @@ function snapshotImpl<T>(
         : target[STORE_VALUE]
     );
     item = target[STORE_VALUE];
-    lookup = storeLookup;
+    lookup = target[STORE_LOOKUP] ?? storeLookup;
   } else {
     isArray = Array.isArray(item);
     map.set(item, item);

packages/solid-signals/tests/store/createOptimisticStore.test.ts

@@ -1720,6 +1720,106 @@ describe("createOptimisticStore", () => {
       expect(pendingValues.at(-1)).toBe(false);
     });
 
+    it("isPending tracks deep nested optimistic store reads before async refresh starts", async () => {
+      let state: Refreshable<{ items: { name: string }[] }>;
+      let setState: (fn: (s: { items: { name: string }[] }) => void) => void;
+      let save!: () => Promise<void>;
+      let resolveAction!: () => void;
+      const pendingValues: boolean[] = [];
+
+      createRoot(() => {
+        [state, setState] = createOptimisticStore(async () => ({ items: [{ name: "Initial" }] }), {
+          items: [{ name: "Initial" }]
+        });
+
+        createRenderEffect(
+          () => isPending(() => deep(state)),
+          value => {
+            pendingValues.push(value);
+          }
+        );
+
+        save = action(function* () {
+          setState(s => {
+            s.items[0].name = "Modified";
+          });
+          expect(isPending(() => deep(state))).toBe(true);
+          yield new Promise<void>(resolve => {
+            resolveAction = resolve;
+          });
+        });
+      });
+
+      flush();
+      await Promise.resolve();
+      await Promise.resolve();
+      flush();
+      expect(pendingValues.at(-1)).toBe(false);
+
+      const actionPromise = save();
+      flush();
+
+      expect(state!.items[0].name).toBe("Modified");
+      expect(pendingValues.at(-1)).toBe(true);
+
+      resolveAction();
+      await actionPromise;
+      await Promise.resolve();
+      flush();
+
+      expect(pendingValues.at(-1)).toBe(false);
+    });
+
+    it("isPending tracks deep optimistic store reads from a nested proxy", async () => {
+      let state: Refreshable<{ items: { name: string }[] }>;
+      let setState: (fn: (s: { items: { name: string }[] }) => void) => void;
+      let save!: () => Promise<void>;
+      let resolveAction!: () => void;
+      const pendingValues: boolean[] = [];
+
+      createRoot(() => {
+        [state, setState] = createOptimisticStore(async () => ({ items: [{ name: "Initial" }] }), {
+          items: [{ name: "Initial" }]
+        });
+
+        createRenderEffect(
+          () => isPending(() => deep(state.items)),
+          value => {
+            pendingValues.push(value);
+          }
+        );
+
+        save = action(function* () {
+          setState(s => {
+            s.items[0].name = "Modified";
+          });
+          expect(isPending(() => deep(state.items))).toBe(true);
+          yield new Promise<void>(resolve => {
+            resolveAction = resolve;
+          });
+        });
+      });
+
+      flush();
+      await Promise.resolve();
+      await Promise.resolve();
+      flush();
+      expect(pendingValues.at(-1)).toBe(false);
+
+      const actionPromise = save();
+      flush();
+
+      expect(state!.items[0].name).toBe("Modified");
+      expect(pendingValues.at(-1)).toBe(true);
+
+      resolveAction();
+      await actionPromise;
+      await Promise.resolve();
+      flush();
+
+      expect(pendingValues.at(-1)).toBe(false);
+    });
+
     it("isPending clears for deep optimistic store reads when fresh projection data lands", async () => {
       let serverCount = 0;
       const fetches: Array<() => void> = [];