Hello, I'm having some troubles handling cookies.

Currently, I have a component which fetches the basket from an server action, which then returns the basket, or if it doesn't exist it creates one and assigns a cookie for it.

I keep getting an error when trying to assign the cookie though, would love it if anyone could share their thoughts concerning this.

Example:

(component)

"use server";

import { getBasket } from 'app/actions';

export default async function Page() {
  const basket = await getBasket();

  return <>{JSON.stringify(basket)}</>;
}

(actions)

"use server";

export async function getBasket() {
  const basketId = cookies().get('basketId')?.value;

  if (basketId) {
    // fetches & returns basket here, doesnt concern this issue
  } else {
    // (act like basket is fetched here)

    cookies().set("basketId", basket.ident) // THIS errors
  }
}