/**
 * @file assets/js/blocks/block-genre-cloud.js
 * Registers the mbs/genre-cloud Gutenberg block.
 * Depends on mbs-blocks-editor (wp.* globals + window.mbsBlocksCore helpers).
 * Helpers used: none
 * @package MyBookShowroom
 * @since   1.0.0
 */

( function ( wp, mbsCore ) {
    'use strict';

    const { registerBlockType } = wp.blocks;
    const { InspectorControls, useBlockProps } = wp.blockEditor;
    const { ServerSideRender } = wp.serverSideRender;
    const { PanelBody, SelectControl, TextControl, RangeControl, ToggleControl } = wp.components;
    const { createElement: el, Fragment } = wp.element;

    // ============================================================================
    registerBlockType('mbs/genre-cloud', {
        apiVersion: 3,
        title: 'Genre Cloud',
        description: 'Display a tag-cloud of genres scaled by book count.',
        icon: 'tag',
        category: 'mbs',
        keywords: [ 'genres', 'cloud', 'tags', 'categories', 'filter' ],

        attributes: {
            min_count: { type: 'number', default: 1  },
            limit:     { type: 'number', default: 30 },
            min_size:  { type: 'number', default: 12 },
            max_size:  { type: 'number', default: 22 },
        },

        edit: function (props) {
            const { attributes, setAttributes } = props;

            return el(
                Fragment,
                {},
                el(
                    InspectorControls,
                    {},
                    el(
                        PanelBody,
                        { title: 'Genre Cloud Settings', initialOpen: true },
                        el(RangeControl, {
                            label: 'Minimum book count',
                            help: 'Hide genres with fewer books than this.',
                            value: attributes.min_count,
                            onChange: function (value) { setAttributes({ min_count: value }); },
                            min: 1,
                            max: 50,
                        }),
                        el(RangeControl, {
                            label: 'Max genres shown (0 = all)',
                            value: attributes.limit,
                            onChange: function (value) { setAttributes({ limit: value }); },
                            min: 0,
                            max: 200,
                        }),
                        el(RangeControl, {
                            label: 'Minimum font size (px)',
                            value: attributes.min_size,
                            onChange: function (value) { setAttributes({ min_size: value }); },
                            min: 8,
                            max: 36,
                        }),
                        el(RangeControl, {
                            label: 'Maximum font size (px)',
                            value: attributes.max_size,
                            onChange: function (value) { setAttributes({ max_size: value }); },
                            min: 8,
                            max: 72,
                        })
                    )
                ),
                el(
                    'div',
                    useBlockProps({ className: 'mbs-block mbs-block-genre-cloud' }),
                    el(ServerSideRender, {
                        block: 'mbs/genre-cloud',
                        attributes: attributes,
                    })
                )
            );
        },

        save: function () {
            return null; // Dynamic block - rendered by PHP via render_callback
        },
    });

} )( window.wp, window.mbsBlocksCore || {} );
