-
Notifications
You must be signed in to change notification settings - Fork 152
Description
- I've validated the bug against the latest version of DB packages
Describe the bug
When using useLiveQuery from @tanstack/vue-db with .findOne(), the data property always returns an array (T[]) instead of a single object (T | undefined). This behavior differs from @tanstack/react-db, where findOne() correctly returns a single object.
The UseLiveQueryReturn interface in Vue adapter has data hardcoded as ComputedRef<T[]>, which ignores the .findOne() modifier.
To Reproduce
- Create a Vue component using
@tanstack/vue-db - Use
useLiveQuerywith.findOne()to fetch a single record:
import { useLiveQuery } from '@tanstack/vue-db'
import { eq } from '@tanstack/db'
const { data } = useLiveQuery((q) =>
q.from({ users: usersCollection })
.where(({ users }) => eq(users.id, 'some-id'))
.findOne()
)- Log or inspect
data.value - See that it returns an array
[{ id: '...', ... }]instead of a single object{ id: '...', ... }
Expected behavior
When using .findOne(), the data property should return T | undefined (a single object or undefined), not T[] (an array). This is how it works in @tanstack/react-db:
// React - works correctly
const { data } = useLiveQuery((q) =>
q.from({ users: usersCollection })
.where(({ users }) => eq(users.id, userId))
.findOne()
)
// data type: User | undefined ✓Screenshots
N/A
Desktop (please complete the following information):
- OS: Windows 11
- Browser: Chrome
- Version: latest
Smartphone (please complete the following information):
N/A (not mobile-specific)
Additional context
Package versions:
@tanstack/db: 0.5.16@tanstack/vue-db: 0.0.92vue: 3.5.26
Current workaround:
const query = useLiveQuery((q) =>
q.from({ users: usersCollection })
.where(({ users }) => eq(users.id, userId))
.findOne()
)
// Manually extract first element
const user = computed(() => query.data.value?.[0])The issue appears to be in the UseLiveQueryReturn interface definition which doesn't account for the findOne() query modifier:
interface UseLiveQueryReturn<T extends object> {
data: ComputedRef<T[]>; // Always array, should be conditional based on findOne()
// ...
}