Skill Feedback: react-db (mixed)

Skill Feedback: react-db

Package: @tanstack/react-db
Skill version: 0.1.74
Rating: mixed

Task

Use useLiveQuery to render reactive todo lists from collections created by createStreamDB.

What Worked

• useLiveQuery API with query builder, dependency array, eq() operators all worked correctly once the dedup issue was resolved
• The from/where/orderBy/limit fluent API was intuitive
• The skill's warning about using eq() instead of === was helpful

What Failed

• Opaque "not a Collection" error when @tanstack/db is duplicated: useLiveQuery throws QueryBuilderError: Invalid source for live query: The value provided for alias "todo" is not a Collection when the Collection instance was created by a different copy of @tanstack/db. This error message doesn't hint at the root cause (duplicate package installations). This is a runtime validation issue, not a skill issue per se, but the skill could document this common pitfall.

Missing

• Troubleshooting section for "not a Collection" errors: When using useLiveQuery with collections from external packages (like @durable-streams/state), package manager deduplication is critical. A note like "If you see 'not a Collection' errors, ensure only one copy of @tanstack/db is installed (check with pnpm ls @tanstack/db)" would save significant debugging time.

• Meta-framework integration with createStreamDB: The meta-framework skill covers collection setup and preloading, but doesn't cover the createStreamDB pattern where collections come from a StreamDB instance rather than being created directly. An example of db.collections.todos in a useLiveQuery call would bridge the gap.

Self-Corrections

Resolved by forcing a single @tanstack/db installation via pnpm overrides after the user identified the root cause.

User Comments

"just frustrated by bugs in the skills" — the dedup issue was the most time-consuming problem in the session.

Start by reviewing the meta-framework skill's collection setup and preloading guidance, then trace the useLiveQuery and createStreamDB examples. Done means adding a troubleshooting note for duplicated @tanstack/db installations, including the pnpm ls @tanstack/db check, and an example using db.collections.todos with useLiveQuery.