react-query-questions
solid-query-questions
table-questions
virtual-questions
router-questions
react-charts-questions
ranger-questions
vue-query-questions
svelte-query-questions
bling-questions
form-questions
angular-query-questions
start-questions
db-questions
start-showcase
router-showcase
📣-announcements
Defining and using an abstract collection type
A shared service used across apps expects an input of type
Collection<T>, where T is a shared type definition of an object.
The service uses the input collection to query and manipulate the underlying collection, while abstracting the logic of fetching and persisting data. The individual apps can supply any collection they like, as long as the items in that collection match T.
How is this best achieved? When typing the input strictly as Collection<T>, I get various type issues, including the insert mutation transaction not propagating the row type. Instead it is typed as Record<string, any>...Partial collection updates
Hi,
I would like to do partial collection updates for a subset of records. For example, I only want to refetch from the server the records with a foreignKeyId of 'xyz' which would subsequently update/insert the corresponding records in the collection. Of the 100 records in the collection, this might only fetch a handful of records.
For example, I want something like ...
is there a way to know if there are any async mutations in-flight for a collection?
I want to block mutations in the brief period that an async mutation is in-flight for one of my larger forms. It's mainly to prevent the race condition where an onUpdate handler gets processed before the onInsert.
In this case, an upsert is not possible, the insert '''must''' happen before the update.
Is there a way to access like a
pendingMutations integer or a isMutating flag for a collection ? This would tremendously help in my opinion...is tanstack db an appropriate choice for a large paginated table?
I'm testing Tanstack db and feel like I'm going in circles on this issue. We run a larger Admin application that uses lots of tables (Tanstack table in fact). These tables have filters for the order status, who they are assigned to, the order type etc. This historically has been server-side paginated due to its size.
This is where my ignorance with Tanstack db is shining... if I use something like
useLiveInfiniteQuery it works great, but all my searches/filters/etc (my where clauses) would only be invoking the data in the collections cache. This is not ideal if an user wants to search for an order older than what is in the cache. If I ignore pagination and use the default eager it takes 15-20 seconds to load a 150mb table (not ideal either).
Hopefully this question makes sense. For reference, I am using tRPC and Prisma....Where to put query client when using DB with Start
Where is the right place to create the instance of query client when using db with start.
type signature for query builder instance?
I'm wondering what's the correct pattern here -- I'd like to have a function that applies a bunch of filters to any given query that selects a certain type of collection. for instance
```ts
const someFancyFilteringFunctionThatWillBeReused = <...
How to get ctx.meta?.loadSubsetOptions type safe?
The type of
meta being Record<string, unknown> | undefined, loadSubsetOptions is typed unknown.
Is there a way to make it type safe or I should just cope with @ts-ignore?
```ts
createCollection(...Default where clause on queries
Is it possible to set a default where clause on all queries? My use-case is scoping all queries to the current account_id to avoid users with multiple accounts from having data leak between.
Is there a way of formatting data at the collection level on certain queries?
I have a use-case where I have a metadata field that is json, it contains a structure that holds foreign key references to other tables/collections. This can be things like people/location/attachment references.
In postgres I've created a view which enriches this data so when you load the row's metadata it would have the fresh data. Eg if a person changes their name, it would be updated automatically.
Is there anything in tanstack/db & tanstack/react-db that can do something like this? I was hoping there'd be some type of onSelect?...
Type error when disabling useLiveSuspenseQuery
I'm trying to conditionally enable/disable a simple query based on an external value like so:
```
export const useUser = (userId? : string) => {
return useLiveSuspenseQuery((q) => {...
Updates not persisting
Hi, I'm new to DB and I'm stuggling to get this simple CRUD setup working.
```
export const sessionsCollection = createCollection(
queryCollectionOptions({...
On-Demand Sync Mode w/ Electric Collections
I have some Electric Collections using the API proxy setup:
```
import { ELECTRIC_PROTOCOL_QUERY_PARAMS } from "@electric-sql/client"
import { createFileRoute } from "@tanstack/react-router"...
Unable to reliably await collection queryFn + data being "Ready"
I'm switching from tanstack query to db using query collections. I use tanstack router also, and my app was full of route loaders that would
await queryClient.ensureQueryData(...) (so my route will show a loading fallback until the promise resolves). It's a wonderful pattern and I am hoping to repeat it with tanstack db using await someCollection.preload() but am getting inconsistent results.
It seems sometimes my route components render when a query result is an empty array, for just a quick flash, and then the results become available. I assume there is some solution for me in the docs, but the API reference for Collection gives a 404... so I have resorted to trying to read the source code and can't find an issue / the answer there. Maybe there is just a broken link for this Collection documentation? And it could be fixed? And then I would find the answer there? 🙏 tyia...Shortcomings with vue version of tanstackDB?
Are there any shortcomings when using vue with tanstackDB compared to react?
SSE behind Cloudflare
I tried using SSE in my collections by adding
liveSse: true to my shape options when building my collections. I had some issues once I deployed to prod with it though - I'm behind Cloudflare and I noticed collections getting slow/not updating for a while before everything came through at once. Is it expected to work behind the CF proxy?Question about targeted refetch behavior in on-demand with queryCollection
Hi!
I have a question about TanStack DB's refetching behavior when using a query collection in
on-demand mode after updating a specific item (I attached a POC script to reproduce this).
Scenario:...queryCollectionOptions type error missing compareOptions/comparisonOpts
Hi, I'm pretty new working with DB, I've been working with it for about a month now all perfect and today after upgrading to the latests version of DB,
getting type errors when using queryCollectionOptions with createCollection:
Type 'Collection<T, string, any, any, any>' is missing properties:
comparisonOpts, compareOptions...
useLiveSuspenseQuery not reactive?
I'm inserting values into my query and not seeing the optimistic state in my view. If i switch to a regular useLiveQuery my view immediately responds. Is this the expected behavior?
"on-demand" live query returns empty data on remount.
I’m testing the new query-driven sync. First load works great, but if I navigate away and back, the query returns [] and queryFn isn’t called again.
Is this something wrong with my implementation, or a bug with on-demand + navigation?
I’m trying to emulate the blog post and have a collection like this:...
Recommended patterns for syncing rows which can belong to multiple users
I have an AI chat feature which I am expanding to allow multi-user chat, with the option to tag the AI instead of just sending the message to all human users.
Before this feature, I added a check like
``
const filter = user_id = '${user.id}'`...