UseLiveQueryReturn is missing fields that electric appends
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
UseLiveQueryReturn when used agains a ElectricCollection, doesn't match what actually a useLiveQuery returns for a query from an electric collection.
To Reproduce
Steps to reproduce the behavior:
- Create zod schema
import { z } from 'zod/v4';
export const actionSchema = z.object({
id: z.string().uuid(),
label: z.string(),
// ... wathever...
});
export type Action = z.infer<typeof actionSchema>;
- Create a collection
const electricOpts = electricCollectionOptions({
id: 'actions',
schema: actionSchema,
getKey: (item) => item.id,
shapeOptions: {
url: `${env.PUBLIC_URL}/shapes/actions`,
subsetMethod: 'POST',
columnMapper: snakeCamelMapper(),
},
});
export const actionsCollection = createCollection(electricOpts);
- Query it using live query (in svelte in this case, and inside of a class)
#query: UseElectricLiveQueryReturn<Action> | null = $state(null);
// ...class stuff...
this.#query = useLiveQuery((q) =>
q.from({ a: actionsCollection }).orderBy(({ a }) => a.createdAt, 'desc').limit(50),
);
- Expect a type error that the query is missing
{ readonly $synced: boolean; readonly $origin: VirtualOrigin; readonly $key: string | number; readonly $collectionId: string; }from the original type passed (Actionin this case)
Expected behavior
Type should match correctly when inferring from UseElectricLiveQueryReturn<Action>
Workaround
I've created the follow type util to help me while this is an issue
import type { UseLiveQueryReturn, VirtualOrigin } from "@tanstack/svelte-db";
export type UseElectricLiveQueryReturn<T extends object> = UseLiveQueryReturn<T & {
readonly $synced: boolean; readonly $origin: VirtualOrigin; readonly $key: string | number; readonly $collectionId: string;
}>;
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by locating the TypeScript definitions for UseLiveQueryReturn and the ElectricCollection live-query return type, then compare them with the fields appended by Electric. Reproduce the Action example and verify that the inferred useLiveQuery result satisfies UseElectricLiveQueryReturn without a workaround.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 68/100