AddToBag.jsx

1import { useEffect, useRef, useState } from "react";2import { add } from "../lib/cart.ts";34const HELD = 1500;56export function AddToBag({ line, disabled = false }) {7  const [added, setAdded] = useState(false);8  const timer = useRef(0);9  useEffect(() => () => clearTimeout(timer.current), []);10  return (11    <button12      className="pill go wide"13      type="button"14      disabled={disabled}15      onClick={() => {16        add(line);17        setAdded(true);18        clearTimeout(timer.current);19        timer.current = setTimeout(() => setAdded(false), HELD);20      }}21    >22      {added ? "Added" : "Add to Bag"}23    </button>24  );25}