Communication between components with React

What are you most proud of, and what would you do differently next time?

I'm proud of the moment I managed to make the quantity of the product in the cart add up to the quantity I placed every time I clicked the add to cart button. It was a detail in the project that I had a lot of difficulty developing.

What challenges did you encounter, and how did you overcome them?

I had a lot of difficulty to manage the quantity of products sending to minicart. The way that I found to solve that was:

export function Minicart({ onAddProductToCart }: MinicartProps) {

  const products = onAddProductToCart();
  const [productInTheMinicart, setProductInTheMinicart] =
    useState();
  const [quantityOfProductInTheMinicart, setQuantityOfProductInTheMinicart] =
    useState(0);

  useEffect(() => {
    if (!products) return;
    setProductInTheMinicart(products);
  }, [products]);

  useEffect(() => {
    if (productInTheMinicart?.quantity !== undefined) {
      setQuantityOfProductInTheMinicart(
        (state) => state + productInTheMinicart?.quantity
      );
    }
  }, [productInTheMinicart?.quantity]);

...

What specific areas of your project would you like help with?

I want to know if there's another efficent way to solve the problem that I explained in the first question.