I have a NextJS app connected with Supabase up and running and on localhost I am able to change data in DB and see changes reflected (with hard refresh).

I also have the same app deployed on Vercel and changes to DB are not reflected there even with hard refresh.

I tried reading about caching on Vercel and I wasn't able to really understand too much.

Does anyone know how I may be able to fix this?

Here is my code which is fetching data in question:

import { supabase } from "../lib/supabaseClient";

export default async function Home() {
  // Fetch data from Supabase in a server-side function
  const { data: users, error } = await supabase.from("users").select("*");

  if (error) {
    console.error("Error fetching users:", error);
    return (
      <div>
        <h1>Error Fetching Users</h1>
        <p>{error.message}</p>
      </div>
    );
  }

  return (
    <div>
      <h1>Users List</h1>
      {users && users.length > 0 ? (
        <ul>
          {users.map((user) => (
            <li key={user.id}>{user.name}</li>
          ))}
        </ul>
      ) : (
        <p>No users found</p>
      )}
    </div>
  );
}