Your AI for thinking, writing, and building.

import React, { useState, useEffect } from 'react';

export function FocusTimer({ minutes = 25 }: { minutes?: number }) {
  const [secondsLeft, setSecondsLeft] = useState(minutes * 60);
  const [running, setRunning] = useState(false);

  useEffect(() => {
    if (!running) return;
    const timer = setInterval(() => {
      setSecondsLeft((prev) => Math.max(0, prev - 1));
    }, 1000);
    return () => clearInterval(timer);
  }, [running]);

  const mins = String(Math.floor(secondsLeft / 60)).padStart(2, '0');
  const secs = String(secondsLeft % 60).padStart(2, '0');

  return (
    <div className="rounded-2xl border p-6 text-center">
      <div className="text-4xl font-mono font-bold">{mins}:{secs}</div>
      <button onClick={() => setRunning(!running)}>
        {running ? 'Pause' : 'Start Focus'}
      </button>
    </div>
  );
}