pubkey / pubkey/rxdb

React useRxDocument starts loading:false; hooks commit stale settled data on key/query change

Open
#8,965 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

stale
Dominant language
TypeScript
Stars
23.4k
Forks
1.2k
Avg merge
1d 4h
Merged PRs (30d)
110

Description

Bug

1. useRxDocument first paint looks like "not found"

https://github.com/pubkey/rxdb/blob/master/src/plugins/react/hooks/use-rx-document.ts

const [result, setResult] = useState(null);
const [loading, setLoading] = useState(false); // should be true when a key is set

setLoading(true) runs only in useEffect. The first committed paint is loading: false and result: null. Callers that check loading before treating null as missing still get a false miss on that frame. Going from no key to a key has the same first paint.

#8292 / #8294 set initial loading: true for useRxQuery / useLiveRxQuery only. useRxDocument (#8272) still starts false.

2. Query or key change commits the previous result as settled

On query / primaryKey change, both useLiveRxQuery and useRxDocument keep the previous results / result with loading: false for one committed render. setLoading(true) in useEffect is too late.

Expected

  • useRxDocument: loading is true whenever a key is set and the current key has not emitted yet.
  • After a query or key change, the first committed paint must not present the previous result with loading: false.

Related

  • #8292 / #8294 — initial loading: true for list queries only

Is there a reason or convention behind this behavior? Many other react-hook libraries instead use a pretty aggressive loading: true state before things are resolved. I think Apollo's model is reasonably informative, especially with extended network statuses.

Contributor guide

No contributing guide indexed for this repository

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 src/plugins/react/hooks/use-rx-document.ts and compare its initial state and effect timing with useLiveRxQuery and the related useRxQuery changes from #8292/#8294. Trace how key and query changes affect the first committed render. Done means useRxDocument reports loading while a keyed document has not emitted and does not expose the previous result as settled after a change.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
databases, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.