Setting the initial data of an useQuery with SSR data

Hello guys,

I have a

NextJS

NextJS

NextJS

NextJS application that I am now trying to list rows of a table called

Message

Message

. I have to now server rendered it, but I need to refetch it and consider using

useQuery

useQuery

aswell. Whats the approach I should use when the inital data should be the SSR one, but then after that im refetching from the client side.

Here is the SSR code I currently have:

export async function getServerSideProps(
  ctx: GetServerSidePropsContext,
): Promise<GetServerSidePropsResult<MessagesProps>> {
  const messages = await db.contactMessage.findMany({
    orderBy: {
      createdAt: "desc",
    },
  });

  return {
    props: {
      messages,
    },
  };
}

export async function getServerSideProps(
  ctx: GetServerSidePropsContext,
): Promise<GetServerSidePropsResult<MessagesProps>> {
  const messages = await db.contactMessage.findMany({
    orderBy: {
      createdAt: "desc",
    },
  });

  return {
    props: {
      messages,
    },
  };
}

export async function getServerSideProps(
  ctx: GetServerSidePropsContext,
): Promise<GetServerSidePropsResult<MessagesProps>> {
  const messages = await db.contactMessage.findMany({
    orderBy: {
      createdAt: "desc",
    },
  });

  return {
    props: {
      messages,
    },
  };
}

export async function getServerSideProps(
  ctx: GetServerSidePropsContext,
): Promise<GetServerSidePropsResult<MessagesProps>> {
  const messages = await db.contactMessage.findMany({
    orderBy: {
      createdAt: "desc",
    },
  });

  return {
    props: {
      messages,
    },
  };
}

Setting the initial data of an useQuery with SSR data

Similar Threads

Similar Threads

Similar Threads