React shopping cart localstorage hook implementation

Medium

In a React application, you're building a custom hook to manage a shopping cart with local storage persistence. Which implementation correctly handles both cart updates and storage synchronization?

ReactReact hooksLocalstorageUseeffectState management

1function useShoppingCart() {
  const [cart, setCart] = useState(() => {
      try {
          const stored = localStorage.getItem('cart');
          return stored ? JSON.parse(stored) : [];
      } catch {
          return [];
      }
  });
10
  _______________
12
  const addItem = (product) => {
      setCart(currentCart => {
          const existingItem = currentCart.find(item => item.id === product.id);
          if (existingItem) {
              return currentCart.map(item =>
                  item.id === product.id
                      ? { ...item, quantity: item.quantity + 1 }
                      : item
              );
          }
          return [...currentCart, { ...product, quantity: 1 }];
      });
  };
26
  return { cart, addItem };
28}

In a React application, you're building a custom hook to manage a shopping cart with local storage persistence. Which implementation correctly handles both cart updates and storage synchronization?

Hint