'use client';

import { useCounter } from 'use-a-hook';

export default function SeatPicker() {
  const seats = useCounter(1);
  return (
    <section>
      <p>Seats: {seats.count}</p>
      <button disabled={seats.count <= 1} onClick={() => seats.decrement()}>
        Remove seat
      </button>
      <button onClick={() => seats.increment()}>Add seat</button>
      <button onClick={seats.reset}>Start over</button>
    </section>
  );
}