Quetsion about devtools error

[BorisSpring]

Hello guys im wondering sicne i readed alot of docs but it s kinda confusing how can i manage on server side react query

const TagsPage = async ({ searchParams }: SearchParams) => {
const queryClient = new QueryClient();

await queryClient.prefetchQuery({
queryKey: [Number(searchParams.page || 1), searchParams?.sortBy],
queryFn: () =>
findAllTagsWithSortAndPaginate({
page: Number(searchParams.page || 1),
sortBy: searchParams?.sortBy,
}),
});

const data = queryClient.getQueryData<{
tags: TagWithCount[];
count: number;
}>([Number(searchParams.page || 1), searchParams?.sortBy]);

return (

Tags

  <HydrationBoundary state={dehydrate(queryClient)}>
    <DataTable
      totalCount={data?.count || 0}
      placeholder='Filter By Name'
      filterBy='name'
      data={data?.tags || []}
      columns={columns}
    />
  </HydrationBoundary>
</div>

);
};
this is my components it works fine in client but when i open devtools to see data and i click on data it just giving me some type error that label doesnt exists thanks in adanace guys