T
TanStack•2mo ago
initial-rose

Caching from UseMutation Help

hey guys i need some advice on how to go about this im currently running a mutation to summarise a post and onSuccess im setting the data in the queryCache by a key and post.id etc and this is all in a custom hook which i import into the parent component so i can access the mutate im basically caching the postSummary data in gcTime: 1 hour and whenever the parent component renders i call the custom hook with the post.id and key etc and in the custom hook file i have a useEffect which calls the getQueryData with the keys and post.id now im not sure if im going about this the right way? ive never used caching with useMutation only with useQuery so im not familiar with this in useMutation, how does caching work in useMutation and i also saw in the docs that theres no staletime option Now the only reason im doing it this way is because i dont have a useQuery fetching the postSummary from the database as when i do the mutation its only cached clientside through useMutation and NOT saved in the database as it is not needed for my use case ill have some code for context: heres a link to a gist.github with some code https://gist.github.com/moahnaf11/6ba53155727c9ba9c7859d711466d6a4
1 Reply
ambitious-aqua
ambitious-aqua•2mo ago
If you are okay with experimental APIs, you can have streaming for useQuery. https://tanstack.com/query/latest/docs/reference/streamedQuery 
const { data: aiResult, fetchStatus } = useQuery({
  queryFn: experimental_streamedQuery({
    streamFn: ({ signal }) => summarizePost(/* pass signal here */),
  }),
  queryKey: ['ai-summary', post.id, isAuth.id]
})

const loading = fetchStatus === "fetching";
const showAi = typeof aiResult !== "undefined";
const { data: aiResult, fetchStatus } = useQuery({
  queryFn: experimental_streamedQuery({
    streamFn: ({ signal }) => summarizePost(/* pass signal here */),
  }),
  queryKey: ['ai-summary', post.id, isAuth.id]
})

const loading = fetchStatus === "fetching";
const showAi = typeof aiResult !== "undefined";
If you are not OK, then I think what you did was good though
streamedQuery | TanStack Query Docs
streamedQuery is a helper function to create a query function that streams data from an . Data will be an Array of all the chunks received. The query will be in a pending state until the first chunk o...

Did you find this page helpful?