import { useEffect, useRef, useState, type RefObject } from 'react';
import { GameEngine } from '../game/GameEngine';
import type { GameSnapshot } from '../game/types';

export function useGameEngine(canvasRef: RefObject<HTMLCanvasElement | null>) {
  const engineRef = useRef<GameEngine | null>(null);
  const [snapshot, setSnapshot] = useState<GameSnapshot | null>(null);

  useEffect(() => {
    const canvas = canvasRef.current;
    if (!canvas) return;
    const engine = new GameEngine(canvas);
    engineRef.current = engine;
    const unsubscribe = engine.subscribe(setSnapshot);
    engine.start();
    return () => {
      unsubscribe();
      engine.stop();
      engineRef.current = null;
    };
  }, [canvasRef]);

  return { engine: engineRef, snapshot };
}