Build a countdown timer as a single React component. It starts at 01:00 and ticks down once per second, with Start, Pause, and Reset controls. The interesting part isn't the display — it's owning a setInterval correctly: not stacking two of them, pausing without losing the value, and clearing it when the component unmounts.
The starter App.tsx renders the timer in its resting state (01:00 and the three buttons) with no logic. Make it work:
seconds with useState(60) and show format(seconds) as mm:ss.start() runs a setInterval that decrements seconds every 1000ms and stops at 0. Starting twice must not double-tick.pause() clears the interval but keeps seconds; reset() clears it and returns to 60.01:00. Clicking Start counts down: 00:59, 00:58, … Clicking Start again does nothing extra — still one tick per second.01:00 and stops.00:00.useRef — it's a handle you read and clear, and changing it should not trigger a re-render. seconds is the state; the id is the handle.start() should return early. Two intervals means two decrements per second.format is provided. The mm:ss helper (pad to two digits) is already in the starter; focus on the timer lifecycle.