JAVASCRIPT useEngine.js

import { useState, useEffect, useCallback, useRef } from 'react';
import { LadderEngine } from '../../engine/engine';
// Singleton engine instance for the application
const engine = new LadderEngine();
export function useEngine() {
    const [state, setState] = useState(() => engine.getState());
    const [program, setProgram] = useState(() => engine.getProgram() || null);
    const stopFnRef = useRef(null);
    useEffect(() => {
        const unsubscribe = engine.subscribe(() => {
            setState({ ...engine.getState() });
            const currentProgram = engine.getProgram();
            if (currentProgram) {
                setProgram(currentProgram);
            }
        });
        return () => unsubscribe();
    }, []);
    const loadProgram = useCallback((newProgram) => {
        engine.loadProgram(newProgram);
        setProgram(newProgram);
    }, []);
    const start = useCallback(() => {
        const stopFn = engine.start();
        stopFnRef.current = stopFn;
    }, []);
    const stop = useCallback(() => {
        if (stopFnRef.current) {
            stopFnRef.current();
            stopFnRef.current = null;
        }
    }, []);
    return {
        state,
        engine,
        program,
        loadProgram,
        start,
        stop,
    };
}