<?php
declare(strict_types=1);

namespace Automattic\WooCommerce\Blocks\BlockTypes\AddToCartWithOptions;

use Automattic\WooCommerce\Blocks\BlockTypes\AbstractBlock;
use Automattic\WooCommerce\Blocks\BlockTypes\EnableBlockJsonAssetsTrait;
use Automattic\WooCommerce\Blocks\Utils\StyleAttributesUtils;

/**
 * Block type for variation selector attribute options in add to cart with options.
 * It's responsible to render the attribute options.
 */
class VariationSelectorAttributeOptions extends AbstractBlock {

	use EnableBlockJsonAssetsTrait;

	/**
	 * Block name.
	 *
	 * @var string
	 */
	protected $block_name = 'add-to-cart-with-options-variation-selector-attribute-options';

	/**
	 * Render the block.
	 *
	 * @param array     $attributes Block attributes.
	 * @param string    $content Block content.
	 * @param \WP_Block $block Block instance.
	 * @return string Rendered block output.
	 */
	protected function render( $attributes, $content, $block ): string {
		if (
			! isset(
				$block->context['woocommerce/attributeName'],
				$block->context['woocommerce/attributeId'],
				$block->context['woocommerce/attributeTerms']
			)
		) {
			return '';
		}

		$attribute_slug = wc_variation_attribute_name( $block->context['woocommerce/attributeName'] );

		$classes_and_styles = StyleAttributesUtils::get_classes_and_styles_by_attributes( $attributes, array(), array( 'extra_classes' ) );

		$option_style = array_key_exists( 'optionStyle', $attributes ) ? $attributes['optionStyle'] : null;

		// During the beta period, `optionStyle` was called `style`, so we check
		// `style` for backwards compatibility.
		if ( ! $option_style && array_key_exists( 'style', $attributes ) && 'dropdown' === $attributes['style'] ) {
			$option_style = 'dropdown';
		}

		$wrapper_attributes = get_block_wrapper_attributes(
			array(
				'class' => $classes_and_styles['classes'],
				'style' => $classes_and_styles['styles'],
			)
		);

		if ( 'dropdown' === $option_style ) {
			$content = $this->render_dropdown( $attributes, $content, $block );
		} else {
			$content = $this->render_pills( $attributes, $content, $block );
		}

		return sprintf(
			'<div %s>%s</div>',
			$wrapper_attributes,
			$content
		);
	}

	/**
	 * Get the normalized version of the attributes.
	 *
	 * @param array $attributes         The element's attributes.
	 * @param array $default_attributes The element's default attributes.
	 * @return string The HTML element's attributes.
	 */
	public static function get_normalized_attributes( $attributes, $default_attributes = array() ) {
		$normalized_attributes = array();

		$merged_attributes = array_merge( $default_attributes, $attributes );

		foreach ( $merged_attributes as $key => $value ) {
			if ( is_null( $value ) ) {
				continue;
			}
			if ( is_array( $value ) || is_object( $value ) ) {
				$value = wp_json_encode(
					$value,
					JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_QUOT | JSON_HEX_AMP
				);
			}
			$normalized_attributes[] = sprintf( '%s="%s"', esc_attr( $key ), esc_attr( $value ) );
		}

		return implode( ' ', $normalized_attributes );
	}

	/**
	 * Get the default selected attribute.
	 *
	 * @param string $attribute_slug The attribute's slug.
	 * @param array  $attribute_terms The attribute's terms.
	 * @return string|null The default selected attribute.
	 */
	protected function get_default_selected_attribute( $attribute_slug, $attribute_terms ) {
		if ( isset( $_GET[ $attribute_slug ] ) ) { // phpcs:ignore WordPress.Security.NonceVerification.Recommended
			$raw = wp_unslash( $_GET[ $attribute_slug ] ); // phpcs:ignore WordPress.Security.NonceVerification.Recommended,WordPress.Security.ValidatedSanitizedInput.InputNotSanitized
			if ( is_string( $raw ) ) {
				$attribute_slug_from_request = sanitize_title( $raw );
				foreach ( $attribute_terms as $attribute_term ) {
					if ( sanitize_title( $attribute_term['value'] ) === $attribute_slug_from_request ) {
						return $attribute_term['value'];
					}
				}
			}
		} else {
			foreach ( $attribute_terms as $attribute_term ) {
				if ( $attribute_term['isSelected'] ) {
					return $attribute_term['value'];
				}
			}
		}

		return null;
	}

	/**
	 * Render the attribute options as pills.
	 *
	 * @param array     $attributes Block attributes.
	 * @param string    $content Block content.
	 * @param \WP_Block $block Block instance.
	 * @return string The pills.
	 */
	protected function render_pills( $attributes, $content, $block ) {
		$attribute_id               = $block->context['woocommerce/attributeId'];
		$attribute_slug             = wc_variation_attribute_name( $block->context['woocommerce/attributeName'] );
		$attribute_terms            = $block->context['woocommerce/attributeTerms'];
		$autoselect                 = $attributes['autoselect'] ?? false;
		$disabled_attributes_action = $attributes['disabledAttributesAction'] ?? 'disable';

		wp_interactivity_state(
			'woocommerce/add-to-cart-with-options',
			array(
				'isOptionSelected' =>
				function () {
					$context = wp_interactivity_get_context();

					return $context['option']['value'] === $context['selectedValue'];
				},
			)
		);

		$pills = '';
		foreach ( $attribute_terms as $attribute_term ) {
			$input = sprintf(
				'<input type="radio" %s/>',
				$this->get_normalized_attributes(
					array(
						'class'                  => 'wc-block-add-to-cart-with-options-variation-selector-attribute-options__pill-input',
						'name'                   => $attribute_slug,
						'value'                  => $attribute_term['value'],
						'data-wp-bind--checked'  => 'state.isOptionSelected',
						'data-wp-bind--disabled' => 'state.isOptionDisabled',
						'data-wp-bind--hidden'   => 'hide' === $disabled_attributes_action ? 'state.isOptionDisabled' : null,
						'data-wp-on--click'      => 'actions.handlePillClick',
						'data-wp-on--keydown'    => 'actions.handleKeyDown',
						'data-wp-context'        => array(
							'option' => $attribute_term,
						),
					),
				)
			);

			$pills .= '<label class="wc-block-add-to-cart-with-options-variation-selector-attribute-options__pill">' . $input . esc_html( $attribute_term['label'] ) . '</label>';
		}

		return sprintf(
			'<div %s>%s</div>',
			$this->get_normalized_attributes(
				array(
					'class'           => 'wc-block-add-to-cart-with-options-variation-selector-attribute-options__pills',
					'role'            => 'radiogroup',
					'id'              => $attribute_id,
					'aria-labelledby' => $attribute_id . '_label',
					'data-wp-context' => array(
						'name'          => wc_attribute_label( $block->context['woocommerce/attributeName'] ),
						'options'       => $attribute_terms,
						'selectedValue' => $this->get_default_selected_attribute( $attribute_slug, $attribute_terms ),
						'focused'       => '',
						'autoselect'    => $autoselect,
					),
					'data-wp-init'    => 'callbacks.setDefaultSelectedAttribute',
				),
			),
			$pills,
		);
	}

	/**
	 * Render the attribute options as a dropdown.
	 *
	 * @param array     $attributes Block attributes.
	 * @param string    $content Block content.
	 * @param \WP_Block $block Block instance.
	 * @return string The dropdown.
	 */
	protected function render_dropdown( $attributes, $content, $block ) {
		$attribute_id    = $block->context['woocommerce/attributeId'];
		$attribute_slug  = wc_variation_attribute_name( $block->context['woocommerce/attributeName'] );
		$attribute_terms = $block->context['woocommerce/attributeTerms'];
		$default_option  = array(
			'label'      => esc_html__( 'Choose an option', 'woocommerce' ),
			'value'      => '',
			'isSelected' => false,
		);

		$attribute_terms = array_merge(
			array( $default_option ),
			$attribute_terms
		);

		$selected_attribute         = $this->get_default_selected_attribute( $attribute_slug, $attribute_terms );
		$autoselect                 = $attributes['autoselect'] ?? false;
		$disabled_attributes_action = $attributes['disabledAttributesAction'] ?? 'disable';

		$options = '';
		foreach ( $attribute_terms as $attribute_term ) {
			$option_attributes = array(
				'value'                  => $attribute_term['value'],
				'data-wp-bind--selected' => 'state.isOptionSelected',
				'data-wp-bind--disabled' => 'state.isOptionDisabled',
				'data-wp-bind--hidden'   => 'hide' === $disabled_attributes_action ? 'state.isOptionDisabled' : null,
				'data-wp-context'        => array(
					'option' => $attribute_term,
				),
			);

			if ( $attribute_term['value'] === $selected_attribute ) {
				$option_attributes['selected'] = 'selected';
			}

			$options .= sprintf(
				'<option %s>%s</option>',
				$this->get_normalized_attributes(
					$option_attributes
				),
				esc_html( $attribute_term['label'] )
			);
		}

		return sprintf(
			'<select %s>%s</select>',
			$this->get_normalized_attributes(
				array(
					'class'              => 'wc-block-add-to-cart-with-options-variation-selector-attribute-options__dropdown',
					'id'                 => $attribute_id,
					'data-wp-context'    => array(
						'name'          => wc_attribute_label( $block->context['woocommerce/attributeName'] ),
						'options'       => $attribute_terms,
						'selectedValue' => $selected_attribute,
						'autoselect'    => $autoselect,
					),
					'data-wp-init'       => 'callbacks.setDefaultSelectedAttribute',
					'data-wp-on--change' => 'actions.handleDropdownChange',
					'name'               => $attribute_slug,
				),
			),
			$options,
		);
	}
}
