/**
 * aieo/brand-slider — block editor UI.
 *
 * UMD globals only (wp.*); no build step. Lets editors pick the source
 * mode (top/new_brand/new_product/favourites/manual), brand count,
 * slides-per-view, card style, title/subtitle/CTA inline. Live preview
 * via wp.serverSideRender so the editor reflects the front-end render.
 */
( function ( wp ) {
    if ( ! wp || ! wp.blocks || ! wp.element ) { return; }

    var el                = wp.element.createElement;
    var Fragment          = wp.element.Fragment;
    var registerBlockType = wp.blocks.registerBlockType;
    var ServerSideRender  = wp.serverSideRender;
    var InspectorControls = wp.blockEditor.InspectorControls;
    var useBlockProps     = wp.blockEditor.useBlockProps;
    var PanelBody         = wp.components.PanelBody;
    var SelectControl     = wp.components.SelectControl;
    var RangeControl      = wp.components.RangeControl;
    var TextControl       = wp.components.TextControl;
    var ToggleControl     = wp.components.ToggleControl;
    var __                = wp.i18n.__;

    registerBlockType( 'aieo/brand-slider', {
        edit: function ( props ) {
            var attrs   = props.attributes;
            var setAttr = function ( k ) {
                return function ( v ) { var p = {}; p[ k ] = v; props.setAttributes( p ); };
            };
            var blockProps = useBlockProps ? useBlockProps() : {};

            return el( Fragment, {},
                el( InspectorControls, {},
                    el( PanelBody, { title: __( 'Source', 'ai-eshop-optimizer' ), initialOpen: true },
                        el( SelectControl, {
                            label: __( 'Mode', 'ai-eshop-optimizer' ),
                            value: attrs.mode || 'top',
                            options: [
                                { value: 'top',          label: __( 'Top brands (by sales)',                'ai-eshop-optimizer' ) },
                                { value: 'new_brand',    label: __( 'Newest brands (by creation date)',     'ai-eshop-optimizer' ) },
                                { value: 'new_product',  label: __( 'Brand whose newest product is recent', 'ai-eshop-optimizer' ) },
                                { value: 'favourites',   label: __( 'Your favourites (per logged-in user)', 'ai-eshop-optimizer' ) },
                                { value: 'manual',       label: __( 'Manual brand selection',               'ai-eshop-optimizer' ) },
                            ],
                            onChange: setAttr( 'mode' ),
                        } ),
                        el( RangeControl, {
                            label: __( 'Brands to show', 'ai-eshop-optimizer' ),
                            value: attrs.limit || 10,
                            onChange: setAttr( 'limit' ),
                            min: 1, max: 50, step: 1,
                        } ),
                        el( RangeControl, {
                            label: __( 'Slides per view (desktop)', 'ai-eshop-optimizer' ),
                            value: attrs.slidesPerView || 5,
                            onChange: setAttr( 'slidesPerView' ),
                            min: 2, max: 8, step: 1,
                        } )
                    ),
                    el( PanelBody, { title: __( 'Card', 'ai-eshop-optimizer' ), initialOpen: false },
                        el( SelectControl, {
                            label: __( 'Card style', 'ai-eshop-optimizer' ),
                            value: attrs.cardStyle || 'hero',
                            options: [
                                { value: 'hero', label: __( 'Hero (image / logo fallback)', 'ai-eshop-optimizer' ) },
                                { value: 'logo', label: __( 'Logo strip',                    'ai-eshop-optimizer' ) },
                            ],
                            onChange: setAttr( 'cardStyle' ),
                        } ),
                        el( ToggleControl, {
                            label: __( 'Show product counts', 'ai-eshop-optimizer' ),
                            checked: !! attrs.showCounts,
                            onChange: setAttr( 'showCounts' ),
                        } )
                    ),
                    el( PanelBody, { title: __( 'Header & CTA', 'ai-eshop-optimizer' ), initialOpen: false },
                        el( TextControl, {
                            label: __( 'Title', 'ai-eshop-optimizer' ),
                            value: attrs.title || '',
                            onChange: setAttr( 'title' ),
                        } ),
                        el( TextControl, {
                            label: __( 'Subtitle', 'ai-eshop-optimizer' ),
                            value: attrs.subtitle || '',
                            onChange: setAttr( 'subtitle' ),
                        } ),
                        el( ToggleControl, {
                            label: __( 'Feature heading style (large, like product sliders)', 'ai-eshop-optimizer' ),
                            help: __( 'Inherits the big thin-uppercase title + full-width underline used by the product sliders.', 'ai-eshop-optimizer' ),
                            checked: !! attrs.headingFeature,
                            onChange: setAttr( 'headingFeature' ),
                        } ),
                        el( TextControl, {
                            label: __( 'CTA label', 'ai-eshop-optimizer' ),
                            value: attrs.ctaLabel || '',
                            onChange: setAttr( 'ctaLabel' ),
                        } ),
                        el( TextControl, {
                            label: __( 'CTA URL', 'ai-eshop-optimizer' ),
                            value: attrs.ctaUrl || '',
                            onChange: setAttr( 'ctaUrl' ),
                        } )
                    )
                ),
                el( 'div', blockProps,
                    el( ServerSideRender, {
                        block: 'aieo/brand-slider',
                        attributes: attrs,
                    } )
                )
            );
        },
        save: function () { return null; }
    } );
}( window.wp ) );
