ReactJS 'Immer' for nested structure exercise

React
1

Hi everyone,
I wanted to do practice of updating the object with Immer, have done it like Mosh showed us using useState
I’m doing mosh’s course on react part 1 exercise, lecturehttps://codewithmosh.teachable.com/courses/ultimate-react-part1/lectures/45915726 (#12 exercise)

I’m simply trying to implement the most basic immer on my code to update some values of an array.

  const [cart, setCart] = useState({
    discount: 0.1,
    items: [
      {
        id: 1,
        title: "Product 1",
        quantity: 1,
      },
      {
        id: 2,
        title: "Product 2",
        quantity: 1,
      },
    ],
  });

I have done it like

produce((draft) => {
      const cart = draft.items.find((cart: any) => cart.id === 2);

      if (cart) {
        cart.quantity = 2123;
      }
    });

And i’m simply not getting any response, I don’t see any way to debug Immer as well.
Can someone point out my mistake and help me do this exercise using Immer I really want to see how Immer is really useful and should we always use Immer.

Thank You