Type error when using useSuspenseQuery with convexQuery
In a vanilla Tanstack Start / Convex app, I have a query:
And when I try to use that like this:
I get this type error:
Type 'typeof skipToken' is not assignable to type 'QueryFunction<any, ["convexQuery", FunctionReference<"query", "public", { id: Id<"users">; }, any, string | undefined>, { id: Id<"users">; }], never>'.
Not sure what's going on there 🤷43 Replies
Thanks for posting in <#1088161997662724167>.
Reminder: If you have a Convex Pro account, use the Convex Dashboard to file support tickets.
- Provide context: What are you trying to achieve, what is the end-user interaction, what are you seeing? (full error message, command output, etc.)
- Use search.convex.dev to search Docs, Stack, and Discord all at once.
- Additionally, you can post your questions in the Convex Community's <#1228095053885476985> channel to receive a response from AI.
- Avoid tagging staff unless specifically instructed.
Thank you!
@CrymeLord What versions of libraries are you using (
@convex-dev/react-query
, convex
)? I think this was fixed a few versions ago
Or is this open source, could you share the code?"@convex-dev/react-query": "^0.0.0-alpha.8",
"convex": "^1.17.0",
That's up to date! Thanks for reporting, will try to get a repro.
What version of react-query?
@tanstack/react-query
I was just looking at this example, that I think you showcased in one of your talks with Tanner.
Here you're taking a string rather than a v.id('table')
https://github.com/TanStack/router/blob/main/examples/react/start-convex-trellaux/convex/board.ts#L76
GitHub
router/examples/react/start-convex-trellaux/convex/board.ts at main...
🤖 Fully typesafe Router for React (and friends) w/ built-in caching, 1st class search-param APIs, client-side cache integration and isomorphic rendering. - TanStack/router
"@tanstack/react-query": "^5.59.20",
That's on purpose, I'm not using Convex IDs
so that they're prettier
Ah gotcha!
I was thinking of using a workaround like in the example:
But surely I should be able to get the ID query working
Did you look at this in the tanstack/router repo, or degit it?
wondering how I should try to repro
It's basically a fresh project, let me try to provide everything you need
Before I do, is this helpful at all?

I'm starting with
npx degit tanstack/router/examples/react/start-convex-trellaux/ start-convex-trellaux
Btw, interestingly, the console output of
npm run dev
doesn't complain and the app runs just fine, the query also appears to workthere was a change to the react-query useQuery types a while ago that we had to change skip for
that could have happened again
GitHub
GitHub - wouteralberts/quick-debug-repo
Contribute to wouteralberts/quick-debug-repo development by creating an account on GitHub.
Curious whether you'll see the same. I'm using Zed btw, in the screenshot ^
@CrymeLord what package manager do you use? When I
npm i
I get some complaints (that I think will be fixed i later versions of convex, not positive — but I want to repro what you have)
or how to you install, do you use
npm i --legacy-peer-deps
Oh sorry, that's probably because of React 19. I used
npm i --legacy-peer-deps
cool I've got this error, will figure it out after lunch

Sweet! Good luck, meanwhile I'll just continue knowing it's on your radar
oh interesting, ok I think this is a case of an unhelpful error from an overload

this fixes it, the issue is that you're passing a string but expecting an Id
but what's annoying is that the error was so confusing because of the overload
this error should be "hey you're passing in a string as an argument, but an ID is expected"

but instead you get this mess
right right! Should I be using some helper fn to turn that id string into an id type?
Specicially, if you're making up an ID on the client, you should either cast it to an ID, or pass it as a string and then on the server check that it's an ID
is your plan to hardcode that ID in your frontend? if so then I'd cast it, e.g.
'asdfasdfasdf' as Id<'users'>
I was going to ask about that yeah, because it didn't let me query for non-existing IDs
that's not the common pattern, generally you only use IDs that you received from Convex queries
For now I'm hardcoding it yeah, planning to add proper auth and sessions later, hopefully when Convex Auth and Tanstack Start work well together (which they may already, it's just not yet documented I think)
but if you have an ID for example from a query param, then yeah you either send it in as a string (since you'd don't know it's a valid ID yet) and validate it there with
ctx.db.normalizeId
or you cast it with TypeScript, saying that you promise it's a valid IDThat all makes sense, and I learned about normalizeId now!
What you just said about casting or using
ctx.db.normalizeId
may be a great fit for the docs here: https://docs.convex.dev/database/reading-data/#reading-a-single-documentReading Data | Convex Developer Hub
Query and
Thanks for what feels like premium support!
Any word on when Convex Auth + Tanstack Start drops?
Or maybe I just wasn't looking in the right place, it's documented here

Thanks, I'll add that — plus I'd really like to fix that error, it was so ugly I didn't bother reading it really besides the "skip" thing
we could include the solution here though
I'm publishing TanStack Start + Clerk docs today, TanStack Start + Convex Auth is next—except local dev needs some love, which might be more urgent
Awesome! Yeah I guess it starts with getting people up and running locally
This is a new flow where you run the Convex backend on your own machine instead of using the cloud, you can try it with
npx convex dev --local
if you're curious—but it does opt you into some phone-home error reporting while it's in beta.I'll give that a try real soon, right now it's time for bed 🥹
ha hopefully when you wake up it'll be more stable!
Love what you guys are building, keep up the great work and amazing support!
GitHub
Ugly type error when string provided but expecting ID · Issue #10 ·...
The overload? conditional type? seems to be making this error message way more opaque than necessary