import { MediaReplaceFlow, MediaPlaceholder } from "@wordpress/block-editor";

export default function ImageMediaPlaceholder({ imageId, imageAlt, imageUrl, setAttributes }) {
	function setImageAttributes(image) {
		setAttributes({
			imageId: image.id,
			imageAlt: image.alt,
			imageUrl: image.url,
		});
	}

	function removeImageAttributes() {
		console.log("removeImageAttributes");
		setAttributes({
			imageId: null,
			imageAlt: null,
			imageUrl: null,
		});
	}
	return (
		<>
			{!imageUrl && (
				<MediaPlaceholder
					accept='image/*'
					allowedTypes={["image"]}
					onSelect={setImageAttributes}
					multiple={false}
					handleUpload={true}
				/>
			)}
		</>
	);
}
