function useUserSubscription(input: RouterInputs['collection']['user']['list']) {
// these are the only two things that are different between subscriptions
// and I would really like to make this a more abstract function but i have
// NO CLUE how to type `proc` properly so it works with `getQueryKey`
const proc = trpc.collection.user.list
const subProc = trpc.collection.user.subscribe
const queryClient = useQueryClient()
const queryKey = getQueryKey(proc, input, 'query')
const query = proc.useQuery(input)
type Output = (typeof query)['data']
subProc.useSubscription(
{
companyId: '657e3e34e2d4aa86eb145842',
},
{
onData(event) {
// Optimistically update cache
queryClient.setQueryData<Output>(queryKey, (oldData) => {
return handleSubscription(event, oldData) as Output
})
},
}
)
return query
}
function useUserSubscription(input: RouterInputs['collection']['user']['list']) {
// these are the only two things that are different between subscriptions
// and I would really like to make this a more abstract function but i have
// NO CLUE how to type `proc` properly so it works with `getQueryKey`
const proc = trpc.collection.user.list
const subProc = trpc.collection.user.subscribe
const queryClient = useQueryClient()
const queryKey = getQueryKey(proc, input, 'query')
const query = proc.useQuery(input)
type Output = (typeof query)['data']
subProc.useSubscription(
{
companyId: '657e3e34e2d4aa86eb145842',
},
{
onData(event) {
// Optimistically update cache
queryClient.setQueryData<Output>(queryKey, (oldData) => {
return handleSubscription(event, oldData) as Output
})
},
}
)
return query
}