deep-jade

seeding-the-query-cache

@/services/queries/boards

import { createQueryKeys } from '@lukemorales/query-key-factory';
import { infiniteQueryOptions, QueryClient, useInfiniteQuery, useQueryClient } from '@tanstack/react-query';
import { getBoards } from '@/server/actions';

const boards = createQueryKeys('boards', {
  list: {
    queryKey: null
  }
});

export const getBoardsQueryOptions = (queryClient: QueryClient) =>
  infiniteQueryOptions({
    ...boards.list,
    queryFn: async context => {
      const res = await getBoards(context.pageParam);
      //seeding here using queryClient
      return res;
    },
    initialPageParam: 1,
    getNextPageParam: page => page.meta.nextCursor
  });

export const useBoards = () => {
  const queryClient = useQueryClient();
  return useInfiniteQuery(getBoardsQueryOptions(queryClient));
};

import { createQueryKeys } from '@lukemorales/query-key-factory';
import { infiniteQueryOptions, QueryClient, useInfiniteQuery, useQueryClient } from '@tanstack/react-query';
import { getBoards } from '@/server/actions';

const boards = createQueryKeys('boards', {
  list: {
    queryKey: null
  }
});

export const getBoardsQueryOptions = (queryClient: QueryClient) =>
  infiniteQueryOptions({
    ...boards.list,
    queryFn: async context => {
      const res = await getBoards(context.pageParam);
      //seeding here using queryClient
      return res;
    },
    initialPageParam: 1,
    getNextPageParam: page => page.meta.nextCursor
  });

export const useBoards = () => {
  const queryClient = useQueryClient();
  return useInfiniteQuery(getBoardsQueryOptions(queryClient));
};

import { ReactNode } from 'react';
import { Metadata } from 'next';
import { dehydrate, HydrationBoundary, QueryClient } from '@tanstack/react-query';
import { getBoardsQueryOptions } from '@/services/queries/boards';
import MainLayout from '@/components/layouts/main-layout';
import dbConnect from '@/server/db-connect';

export const metadata: Metadata = {
  title: 'Kanban Task Management App',
  description: 'Generated by create next app'
};

export default async function BoardsLayout({ children }: { children: ReactNode }) {
  const queryClient = new QueryClient();
  await queryClient.prefetchInfiniteQuery(getBoardsQueryOptions(queryClient));

  return (
    <HydrationBoundary state={dehydrate(queryClient)}>
      <MainLayout>{children}</MainLayout>
    </HydrationBoundary>
  );
}

import { ReactNode } from 'react';
import { Metadata } from 'next';
import { dehydrate, HydrationBoundary, QueryClient } from '@tanstack/react-query';
import { getBoardsQueryOptions } from '@/services/queries/boards';
import MainLayout from '@/components/layouts/main-layout';
import dbConnect from '@/server/db-connect';

export const metadata: Metadata = {
  title: 'Kanban Task Management App',
  description: 'Generated by create next app'
};

export default async function BoardsLayout({ children }: { children: ReactNode }) {
  const queryClient = new QueryClient();
  await queryClient.prefetchInfiniteQuery(getBoardsQueryOptions(queryClient));

  return (
    <HydrationBoundary state={dehydrate(queryClient)}>
      <MainLayout>{children}</MainLayout>
    </HydrationBoundary>
  );
}

is this considered a best practice

6 Replies

sunny-green•2y ago

Stop spamming

deep-jadeOP•2y ago

when did I do that !!!

sunny-green•2y ago

You duplicated your question after asking for 3 consecutive days

deep-jadeOP•2y ago

I saw that he was answering questions and not answering mine so I just mentioned him so that maybe he overlooked my question. in his explanation there is only two way of seeding at least instead of saying stop spamming, you may offer your help or smth... and I don't see that is spamming and as you said a waited for 3 days and then asked in the forth day

deep-jade•2y ago

it is spamming to @ mention someone directly, please stop it. I didn't answer because I don't even see a question in your code block. It looks exactly like the code we have in the docs so what is your concrete problem / question with it? maybe I don't want to answer every question because I have other things to do? This is pretty incosiderate of you ...

deep-jadeOP•2y ago

there is a misunderstanding for sure I'm very sorry anyway I won't ask any questions again sorry have a good day sir

Gaming

Programming

seeding-the-query-cache

Did you find this page helpful?