import { createBlock } from "@wordpress/blocks";
import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
import { useSelect } from "@wordpress/data";

const v1 = {
	attributes: {
		hasCustomTitle: {
			type: "boolean",
			default: false,
		},
		blockCustomTitle: {
			type: "string",
		},
		pageHeaderTitle: {
			type: "string",
		},
		hasCta: {
			type: "boolean",
			default: false,
		},
		cta: {
			type: "object",
		},
		hasCustomImage: {
			type: "boolean",
			default: false,
		},
		imageUrl: {
			type: "string",
		},
		imageAlt: {
			type: "string",
		},
		imageId: {
			type: "number",
		},
		imageProportion: {
			type: "string",
			default: "original",
		},
		anchor: {
			type: "string",
		},
		coverSize: {
			type: "string",
			default: "medium",
		},
	},

	save({ attributes }) {
		return (
			<div
				{...useBlockProps.save({
					className: `innerblocks`,
				})}
			>
				<InnerBlocks.Content />
			</div>
		);
	},

	migrate(attributes, innerBlocks) {
		const { blockCustomTitle, pageHeaderTitle, ...restAttributes } = attributes;

		// const pageTitle = useSelect((select) => {
		// 	const { getEditedPostAttribute } = select("core/editor");
		// 	return getEditedPostAttribute("title");
		// });


		return [
			restAttributes,
			[
				createBlock(
					"homegrade-content-blocks/section-titling",
					{
						content: attributes.sectionTitle,
						level: 3,
					},
					[
						createBlock("core/heading", {
							placeholder: "Titre de section",
							content: attributes.hasCustomTitle ? blockCustomTitle : "",
							level: 1,
							className: "section_titling__title",
						}),
						createBlock("core/paragraph", {
							content: attributes.pageHeaderTitle,
							placeholder: "Tapez votre sous-titre...",
							className: "section_titling__subtitle",
						}),
					],
				),

				...innerBlocks,
			],
		];
	},
};

export default [v1];