/**
 * Recast Paywall Block Registration
 */

(function() {
    'use strict';

    const { registerBlockType } = wp.blocks;
    const { InnerBlocks, useBlockProps } = wp.blockEditor;
    const { createElement } = wp.element;
    const { __ } = wp.i18n;

    // Register the Recast Paywall Section block
    registerBlockType('recast-paywall/paywall-section', {
        title: __('Recast Paywall Section', 'recast-paywall'),
        description: __('Content within this block will be gated behind the paywall.', 'recast-paywall'),
        category: 'widgets',
        icon: 'lock',
        supports: {
            align: true,
            html: false,
        },
        attributes: {
            postId: {
                type: 'number',
                default: 0,
            },
        },

        edit: function(props) {
            const blockProps = useBlockProps({
                className: 'recast-paywall-section-editor',
                style: {
                    border: '2px dashed #8b5cf6',
                    borderRadius: '4px',
                    padding: '20px',
                    background: 'rgba(139, 92, 246, 0.05)',
                },
            });

            return createElement(
                'div',
                blockProps,
                createElement(
                    'div',
                    {
                        style: {
                            marginBottom: '10px',
                            fontWeight: 'bold',
                            color: '#8b5cf6',
                            fontSize: '14px',
                        },
                    },
                    '🔒 ' + __('Recast Paywall Section', 'recast-paywall')
                ),
                createElement(
                    'p',
                    {
                        style: {
                            fontSize: '12px',
                            color: '#666',
                            marginBottom: '15px',
                        },
                    },
                    __('Content added inside this block will be protected by your Recast paywall.', 'recast-paywall')
                ),
                createElement(InnerBlocks, {
                    template: [
                        ['core/paragraph', { placeholder: __('Add content that will be protected by the paywall...', 'recast-paywall') }],
                    ],
                })
            );
        },

        save: function() {
            const blockProps = useBlockProps.save();
            return createElement(
                'div',
                blockProps,
                createElement(InnerBlocks.Content)
            );
        },
    });
})();

