With React Query: Invariant: headers() expects to have requestAsyncStorage, none available. about openapi-typescript HOT 3 OPEN

"use server";

export const fetchSettings = async () => {
  const { data } = await client.GET("/api/settings/config-properties");
  return data;
};

"use client";

import { fetchSettings } from "@/lib/actions";
import { useQuery } from "@tanstack/react-query";

const { isPending, error, data, isFetching } = useQuery({
  queryKey: ["getConfigProperties"],
  queryFn: async () => fetchSettings(),
});

import PostForm from "@/components/post-form"
import Posts from "@/components/posts"
import { fetchPosts } from "@/server/actions/create-post"
import {
  QueryClient,
  HydrationBoundary,
  dehydrate,
} from "@tanstack/react-query"

export default async function Home() {
  const queryClient = new QueryClient()

  await queryClient.prefetchQuery({
    queryKey: ["posts"],
    queryFn: fetchPosts,
  })
  return (
    <main>
      <HydrationBoundary state={dehydrate(queryClient)}>
        <PostForm />
        <Posts />
      </HydrationBoundary>
    </main>
  )
}

"use server";

export const fetchPosts = async () => {
  const posts = await db.query.posts.findMany({
    with: {
      author: true,
      likes: true,
    },
    orderBy: (posts, { desc }) => [desc(posts.timestamp)],
  })
  if (!posts) return { error: "No posts 😓" }
  if (posts) return { success: posts }
}