[FEATURE]: Improvements to useLiveQuery React API

[oparisblue]

Feature hasn't been suggested before.

• I have verified this feature I'm about to request hasn't been suggested before.

Describe the enhancement you want to request

Hi. We've recently swapped our Expo SQLite Application over to using Drizzle, and so far it has been an amazing improvement. We love Drizzle, and are now looking to use it on our backend services going forwards as well.

However, I think that the API of useLiveQuery as it stands today leaves a lot to be desired.

It doesn't allow for passing through a null or undefined query

In our application, we let users log in and out, and each user has their own separate local SQLite database file. This means that we don't have a global database connection --- we create and destroy them as needed, and at some times, there may be no database at all.

To support this usecase (which I think will be common in a lot of production apps), it would be fantastic to allow the query parameter to be nullable, and just skip running the query if it is.

The types say it can't return undefined, but it can

If you pass in a relational query with queryMode "first", then it returns undefined as the initial state before it runs the query. However, this isn't reflected in the types

There is no loading state

There's currently no way for an application to determine between the loading state and the no data state --- this is problematic as applications often want to show very different screens for these two cases.

#4012 touches on this further

Having a deps array but the first argument not a callback is unidiomatic for react

e.g. instead of

useLiveQuery(db.select().from(schema.users));

it should be more like

useLiveQuery(() => db.select().from(schema.users), [db, schema.users]);

If the query was passed in as a callback instead of directly, it could be memoed by the hook to only change when the dependencies change, meaning that the query builder functions wouldn't have to be run every single time the parent component renders.

Additionally, there is a lot of tooling that expects this format for hooks that take deps --- see for instance the exhaustive-deps eslint rule, which can't be configured for useLiveQuery currently because the first argument is not a function.

---

Again, we wanted to thank you for the amazing work done on Drizzle so far. But, it would be good to try and improve this hook to be more inline with react standards, because as it is we have had to do quite a bit of patching to be able to use it properly in our project.