app/add-to-cart.js import { cookies } from 'next/headers'
 
export default function AddToCart({ productId }) {
  async function addItem(data) {
    'use server'
 
    const cartId = cookies().get('cartId')?.value
    await saveToDb({ cartId, data })
  }
 
  return (
    <form action={addItem}>
      <button type="submit">Add to Cart</button>
    </form>
  )
}
Good to know: An action is similar to the HTML primitive action
formAction
You can use formAction prop to handle Form Actions on elements such as button, input type="submit", and input type="image". The formAction prop takes precedence over the form's action.
app/form.js export default function Form() {
  async function handleSubmit() {
    'use server'
    // ...
  }