Lassiter Gregg lassiter

tRPC Tanstack React Query Integration Issue

Problem

When trying to use the new tRPC Tanstack React Query integration with @trpc/tanstack-react-query, the queryOptions and mutationOptions methods are not available on tRPC procedures, causing TypeScript errors.

Environment

@trpc/tanstack-react-query: ^11.4.3
@tanstack/react-query: ^5.79.0
@trpc/client: ^11.4.3
@trpc/server: ^11.4.3

Keybase proof

I hereby claim:

I am lassiter on github.
I am lassiter (https://keybase.io/lassiter) on keybase.
I have a public key ASCTNvDpeW1DuSlG4fUK9oTp1xt9YWCs2ZY-xkGBF-wL6Qo

To claim this, I am signing this object:

This file declares a class, Player, instantiates it, and assigns it to a global player variable.
The Player class contains four methods:
- constructor()
- playPause()
- skipTo()
- setVolume()
The constructor() method sets initial values for the currentlyPlaying, playState, volume, and soundObject properties.
- currentlyPlaying is set to the first item in album.songs.
- The initial playState is "stopped".
- The volume is set to the number 80.

	# Dependencies
	node_modules/
	.pnpm-debug.log*

	# Build outputs
	dist/
	.next/
	out/
	.turbo

	{
	"name": "trpc-tanstack-issue-repro",
	"private": true,
	"workspaces": [
	"packages/*",
	"apps/*"
	],
	"scripts": {
	"build": "turbo build",
	"dev": "turbo dev",

	🚨PRODUCTION 🚨
	`candidco-web` Release `19.X.XX.X` available for review https://www.candidco.com
	https://github.com/candidco/candidco-web/pull/<PR_NUMBER>
	```

	```

	<script>

	ga('ec:addProduct', { // Provide product details in an productFieldObject.
	'id': 'P12345', // Product ID (string).
	'name': 'Android Warhol T-Shirt', // Product name (string).
	'category': 'Apparel', // Product category (string).
	'brand': 'Google', // Product brand (string).
	'variant': 'black', // Product variant (string).
	'price': '29.20', // Product price (currency).
	'coupon': 'APPARELSALE', // Product coupon (string).