React, next, api call not updating

Question

I have an api call wrapped in a useEffect on my client side in react that is gonna fetch my prompts (only the ones with privacy set to true) from the server

  useEffect(() => {
    const fetchPosts = async () => {
      const response = await fetch("/api/prompt");

      const data = await response.json();
      console.log(data);
      setPosts(data);
    };

Here is my server side route.js

import { connectToDB } from "@utils/database";
import Prompt from "@models/Prompt";

export const GET = async (request) => {
  try {
    await connectToDB();

    const prompts = await Prompt.find({ privacy: true })
      .sort({ _id: -1 })
      .populate("userId");

    console.log(prompts);

    return new Response(JSON.stringify(prompts), {
      status: 200,
    });
  } catch (error) {
    console.log(error);
    return new Response("Failed to fetch tattoos", { status: 500 });
  }
};

Runing the app in my localhost works fine, when I update a prompt privacy the prompt becomes visible or hidden depending on the privacy, but when I upload the app to vercel, it is not updating, my database is being update, but the response is still the same.

I tried using no-cache and next: revalidate the api request in the client side, and also adding no-cache headers in the server side.

headers: {
  "Cache-Control": "no-cache",
  "Content-Type": "application/json",
},