I have a file @/actions/cart.server.actions and inside of it I have a function handleGetCart() that does a cookies().set("cartToken", cart.tokenValue).

Here's the file:

"use server"

import { cookies } from "next/headers"

export async function handleGetCart(): Promise<CartResponse | undefined> {
  {/* some code ... */}
  cookies().set("cartToken", cart.tokenValue)
  {/* some code ... */}
}

Now I'm calling this function in different server components like page.tsx or layout.tsx.

For example:

import { handleGetCart } from "@/actions/cart.server.actions"

export default async function CartLayout({ children }: { children: ReactNode }) {
  const cart = await handleGetCart()

  return (
    ...
  )
}

But I get the following error: Error: Cookies can only be modified in a Server Action or Route Handler.
I've read the docs but I don't get why i's not working (I've added the experimental property)