Debaucus
Debaucus
Explore posts from servers
CDCloudflare DevelopersTtRPCTTCTheo's Typesafe Cult
PostsComments
TtRPC
Created by Debaucus on 7/4/2023 in #❓-help
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?
If not, I believe my best approach is to trigger a normal query a stack an array client side with all the results. Same affect really.
16 replies
TtRPC
Created by Debaucus on 7/4/2023 in #❓-help
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?
After lots of ChatGPT work and a good break, I have a better understanding, but now I have more questions 😅 This behavior is happening because when you change the tag value in the query, it triggers a new query with the updated tag value. This causes the previous data to be replaced with the new data returned from the updated query. Does TRPC have an option that works like this? 
const tagListFullSplit = tagsList?.split(",");
const results = useQueries(
  tagListFullSplit.map((tag) => ({
    queryKey: ["socialServers", tag],
    queryFn: () =>
      trpc.server.getAllSocialServers({
        limit: 3,
        tag,
      }),
  }))
);
const tagListFullSplit = tagsList?.split(",");
const results = useQueries(
  tagListFullSplit.map((tag) => ({
    queryKey: ["socialServers", tag],
    queryFn: () =>
      trpc.server.getAllSocialServers({
        limit: 3,
        tag,
      }),
  }))
);
This will return an array of query results, one for each tag. You can then merge the results from all queries into a single array and display them as desired.This will return an array of query results, one for each tag. You can then merge the results from all queries into a single array and display them as desired.
16 replies
TtRPC
Created by Debaucus on 7/4/2023 in #❓-help
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?
Seems to defeat the point of keepPreviousData: true 😅
16 replies
TtRPC
Created by Debaucus on 7/4/2023 in #❓-help
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?
That would be it yes, maybe storing the state would work?
16 replies
TtRPC
Created by Debaucus on 7/4/2023 in #❓-help
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?
I apologise if I'm coming across blunt or rude, it's not intended, I've been on this for a few days 😅 I'm just very confused why (what I imagine) a common need is giving me strange behaviour
16 replies
TtRPC
Created by Debaucus on 7/4/2023 in #❓-help
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?
The bit that is confusing me is that if I change the input. So for example: 
    .input(
      z.object({
        limit: z.number(),
        // cursor is a reference to the last item in the previous batch
        // it's used to fetch the next batch
        cursor: z.string().nullish(),
        skip: z.number().optional(),
      })
    )
    .query(async ({ ctx, input }) => {
      const { limit, skip, cursor } = input;

      const tagsList = "free-to-play,testing,survival,444,custom-game-1";
      const tagListFullSplit = tagsList?.split(",");
      const tagToSelect = Math.floor(Math.random() * 5);

      const allSocialServers = await ctx.prisma?.server.findMany({
        where: {
          AND: [
            { published: true },
            { nsfw: false },
            { serverTags: { contains: tagListFullSplit[tagToSelect] } },
            {
              OR: [
                { serverTypes: { contains: "Telegram" } },
                { serverTypes: { contains: "Discord" } },
              ],
            },
          ],
        },
        orderBy: [{ votesDaily: "desc" }, { id: "desc" }],
        take: limit + 1,
        skip: skip,
        cursor: cursor ? { id: cursor } : undefined,
      });
    .input(
      z.object({
        limit: z.number(),
        // cursor is a reference to the last item in the previous batch
        // it's used to fetch the next batch
        cursor: z.string().nullish(),
        skip: z.number().optional(),
      })
    )
    .query(async ({ ctx, input }) => {
      const { limit, skip, cursor } = input;

      const tagsList = "free-to-play,testing,survival,444,custom-game-1";
      const tagListFullSplit = tagsList?.split(",");
      const tagToSelect = Math.floor(Math.random() * 5);

      const allSocialServers = await ctx.prisma?.server.findMany({
        where: {
          AND: [
            { published: true },
            { nsfw: false },
            { serverTags: { contains: tagListFullSplit[tagToSelect] } },
            {
              OR: [
                { serverTypes: { contains: "Telegram" } },
                { serverTypes: { contains: "Discord" } },
              ],
            },
          ],
        },
        orderBy: [{ votesDaily: "desc" }, { id: "desc" }],
        take: limit + 1,
        skip: skip,
        cursor: cursor ? { id: cursor } : undefined,
      });
This works for example, however, I already have the pre-set values. If I send the serverTags: value in the query from the file (shown as tag:) I get constant resets. Ultimately, here is my question. How do you correctly infiniteQuery when changing an input value? Request 3 of tag: x, then, a new query is triggered for request 3 of tag: y, results of tag: x get overwritten or replaced? At least when I use an array with an index selector number value.
16 replies
TtRPC
Created by Debaucus on 7/4/2023 in #❓-help
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?
Does that have a changing input by default?
16 replies
TtRPC
Created by Debaucus on 7/4/2023 in #❓-help
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?
keepPreviousData: true, Doesn't work either. Thought that might be it.
16 replies