TanStack / TanStack/db

solid-db useLiveQuery breaks with where + orderBy

Open
#1,208 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
3.9k
Forks
266
Avg merge
1d 4h
Merged PRs (30d)
55

Description

  • I've validated the bug against the latest version of DB packages

Describe the bug

When using the same useLiveQuery with a where and orderBy clause in multiple components, query logic tends to break.

To Reproduce
Steps to reproduce the behavior:

  1. Clone this repo
  2. pnpm install && pnpm dev
  3. Go to localhost:3000
  4. Click the decrement all button a few times, then click the change name button a few times, UI should break unexpectedly.

Expected behavior

  • The DB stores a list of items, each with an index, independent UUID (which is used as the key), and name.
  • The UI contains 4 identical <List> components, each one has a useLiveQuery that views the list of items whose indices are between 1 and 4 inclusive. It then sorts the list items.
  • Clicking on decrement all in the UI will decrement each item's index value and should update the list displays accordingly.
  • Clicking on change name in the UI will add a + at the end of each item's name, it should update the list displays accordingly.

Screenshots

Image

Initial state.

Image

After clicking on decrement all once.

Image

After clicking on decrement all and change name a few times.

Desktop (please complete the following information):

  • OS: 25.11.20260113.2c3e5ec (Xantusia)
  • Browser: Firefox
  • Version: 146.0.1

Additional context

  • I am not well-versed in the internals of Tanstack DB but I believe this is a solid-db specific issue, as it seems like the collection itself is internally consistent, collection.subscribeChanges also fires events correctly, and generally, everything outside of useLiveQuery works appropriately.
  • I also have a more complex environment where I am using @tanstack/solid-db and again, the failure seems to be concentrated within the useLiveQuery, synchronization mechanism. If I replace useLiveQuery with a manual setState(Array.from(collection.entries())), everything updates correctly.
  • orderBy works fine without where.
  • where works without orderBy.
  • All logic works if I only have 1 <List> component.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked reproduction repository and run pnpm install && pnpm dev, then reproduce the failure using four List components and the decrement all and change name actions. Read the useLiveQuery synchronization path and compare behavior with the manual Array.from(collection.entries()) update described in the issue. Done means combined where and orderBy queries remain correct across all components after both actions.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.