import { useEffect, useRef, useState } from "react";

interface UseImageEditorResult {
	currentImageUrl: string;
	currentBlob: Blob | null;
	applyImage: (blob: Blob) => string;
	reset: () => void;
}

/**
 * Manages the image history for the editor.
 * Tracks the current image URL/blob and cleans up generated object URLs on unmount.
 */
export function useImageEditor(initialImageUrl: string): UseImageEditorResult {
	let [currentImageUrl, setCurrentImageUrl] = useState(initialImageUrl);
	let [currentBlob, setCurrentBlob] = useState<Blob | null>(null);
	let generatedUrls = useRef<string[]>([]);

	useEffect(() => {
		return () => {
			for (let url of generatedUrls.current) URL.revokeObjectURL(url);
		};
	}, []);

	function applyImage(blob: Blob): string {
		let nextUrl = URL.createObjectURL(blob);
		generatedUrls.current = [...generatedUrls.current, nextUrl];
		setCurrentImageUrl(nextUrl);
		setCurrentBlob(blob);
		return nextUrl;
	}

	function reset() {
		setCurrentImageUrl(initialImageUrl);
		setCurrentBlob(null);
	}

	return { currentImageUrl, currentBlob, applyImage, reset };
}