[2.0] A second optimistic guess made while the first action's refresh is in flight never shows through a keyed projection #4629

import { For, Loading, action, createMemo, createOptimistic, createProjection, createSignal, flush, refresh } from "solid-js";
import { render } from "../src/index.js";
const tick = async () => { for (let i = 0; i < 4; i++) { await new Promise(r => setTimeout(r, 0)); flush(); } };
for (const proj of [false, true]) test(proj ? "projection" : "memo", async () => {
  const asks: { key: string; res: (v: any) => void; rej: (e: any) => void }[] = [];
  const ask = (key: string) => new Promise<any>((res, rej) => asks.push({ key, res, rej }));
  const settle = async (key: string, f: (a: any) => void) => { const i = asks.findIndex(a => a.key === key); f(asks.splice(i, 1)[0]); await tick(); };
  const c = document.body.appendChild(document.createElement("div"));
  let assign!: (id: number) => any;
  const server = [{ id: 3, a: "-" }, { id: 4, a: "dana" }];
  render(() => {
    const issues = createMemo(() => ask("issues"));
    const [truth] = createSignal<any[]>(() => []);
    const [assigning, guess] = createOptimistic<any[]>(() => truth());
    const overlay = createMemo(() => issues().map((i: any) => { const g = assigning().filter((x: any) => x.id === i.id).pop(); return g ? { ...i, a: g.a } : i; }));
    const shown = proj ? (() => { const p = createProjection(() => overlay() as any, [] as any, { key: "id" } as any); return () => p as any; })() : overlay;
    assign = action(function* (id: number) {
      guess(xs => [...xs, { id, a: "guest" }]);
      yield ask(`assign:${id}`);
      refresh(issues);
    });
    return <Loading fallback={<i>loading</i>}><For each={shown()}>{(it: any) => { const v = () => typeof it === "function" ? it() : it; return <i>[#{v().id} {v().a}]</i>; }}</For></Loading>;
  }, c);
  await tick();
  await settle("issues", a => a.res(server.map(x => ({ ...x }))));
  assign(3); await tick();
  server[0].a = "guest"; await settle("assign:3", a => a.res({}));   // action 1's refresh(issues) is now in flight
  assign(4); await tick();                                           // (4) expected [#4 guest]
  await settle("issues", a => a.res(server.map(x => ({ ...x }))));   // (5) action 1 done; expected [#4 guest]
  server[1].a = "guest"; await settle("assign:4", a => a.res({}));
  await settle("issues", a => a.res(server.map(x => ({ ...x }))));   // (6)
});