<?php
/**
 * Title: Shop by category — chip strip + grid
 * Slug: iconvert-shoply/category-tag-row
 * Categories: iconvert-shoply, featured, query, woocommerce
 * Description: "Shop by category" eyebrow + horizontal row of category chips
 * Keywords: categories, navigation, tabs, shop, filter, products, grid
 * Block Types: woocommerce/product-collection
 */

$is_woo_active = class_exists( 'WooCommerce' );
if(!$is_woo_active) {
    return;
}
$iconvert_shoply_shop_url = $is_woo_active ? get_permalink( wc_get_page_id( 'shop' ) ) : home_url( '/' );
$iconvert_shoply_home_url   = home_url( '/' );
$iconvert_shoply_active_cat = isset( $_GET['iconvert_shoply_cat'] ) ? sanitize_title( wp_unslash( $_GET['iconvert_shoply_cat'] ) ) : '';

// Pull live product categories ordered by product count (most popular first).
// Cap at 9 so the chip strip fits one row at the 1232px content width
// (matches the iconvert-shoply-original reference design).
$iconvert_shoply_chip_terms = get_terms(
	array(
		'taxonomy'   => 'product_cat',
		'hide_empty' => true,
		'number'     => 9,
		'orderby'    => 'count',
		'order'      => 'DESC',
	)
);
if ( is_wp_error( $iconvert_shoply_chip_terms ) || ! is_array( $iconvert_shoply_chip_terms ) ) {
	$iconvert_shoply_chip_terms = array();
}

// Build a array of {slug, name, href, is_active, is_present}. Pad with

$iconvert_shoply_chip_slots = array();
$iconvert_shoply_first_slug = isset( $iconvert_shoply_chip_terms[0] ) ? $iconvert_shoply_chip_terms[0]->slug : '';
foreach ( $iconvert_shoply_chip_terms as $iconvert_shoply_t ) {
	$is_active = '' === $iconvert_shoply_active_cat
		? ( $iconvert_shoply_t->slug === $iconvert_shoply_first_slug )
		: ( $iconvert_shoply_t->slug === $iconvert_shoply_active_cat );
	$href      = $is_active && '' !== $iconvert_shoply_active_cat
		? $iconvert_shoply_home_url
		: add_query_arg( 'iconvert_shoply_cat', $iconvert_shoply_t->slug, $iconvert_shoply_home_url );
	$iconvert_shoply_chip_slots[] = array(
		'name'       => $iconvert_shoply_t->name,
		'href'       => $href,
		'is_active'  => $is_active,
		'is_present' => true,
	);
}

// Helper to emit the button's className: base "iconvert-shoply-chip" plus optional
// modifiers for active state and empty-slot hide.
$iconvert_shoply_chip_cls = static function ( $slot ) {
	$cls = 'iconvert-shoply-chip';
	if ( $slot['is_active'] ) {
		$cls .= ' is-active';
	}
	if ( ! $slot['is_present'] ) {
		$cls .= ' is-empty';
	}
	return $cls;
};
?>
<!-- wp:group {"align":"full","style":{"spacing":{"padding":{"top":"var:preset|spacing|50","bottom":"var:preset|spacing|60"},"blockGap":"var:preset|spacing|40"}},"layout":{"type":"constrained","contentSize":"1232px"}} -->
<div class="wp-block-group alignfull" style="padding-top:var(--wp--preset--spacing--50);padding-bottom:var(--wp--preset--spacing--60)"><!-- wp:heading {"level":4,"style":{"typography":{"fontWeight":"300"},"spacing":{"margin":{"bottom":"var:preset|spacing|30"}}},"fontSize":"large"} -->
<h4 class="wp-block-heading has-large-font-size" style="margin-bottom:var(--wp--preset--spacing--30);font-weight:300"><?php esc_html_e( 'Shop by category', 'iconvert-shoply' ); ?></h4>
<!-- /wp:heading -->

<!-- wp:buttons {"className":"iconvert-shoply-chip-strip","layout":{"type":"flex","justifyContent":"left","flexWrap":"nowrap"}} -->
<div class="wp-block-buttons iconvert-shoply-chip-strip">

    <?php foreach($iconvert_shoply_chip_slots as $iconvert_shoply_chip_slot) : ?>
        <!-- wp:button {"className":"<?php echo esc_attr( $iconvert_shoply_chip_cls( $iconvert_shoply_chip_slot ) ); ?>"} -->
        <div class="wp-block-button <?php echo esc_attr( $iconvert_shoply_chip_cls($iconvert_shoply_chip_slot ) ); ?>"><a class="wp-block-button__link wp-element-button" href="<?php echo esc_url($iconvert_shoply_chip_slot['href'] ); ?>"><?php echo esc_html( $iconvert_shoply_chip_slot['name'] ); ?></a></div>
        <!-- /wp:button -->
    <?php endforeach; ?>
</div>
<!-- /wp:buttons -->

<!-- wp:woocommerce/product-collection {"queryId":1,"query":{"perPage":8,"pages":0,"offset":0,"postType":"product","order":"desc","orderBy":"popularity","search":"","exclude":[],"inherit":false,"taxQuery":[],"isProductCollectionBlock":true,"featured":false,"woocommerceOnSale":false,"woocommerceStockStatus":["instock","outofstock","onbackorder"],"woocommerceAttributes":[],"woocommerceHandPickedProducts":[]},"tagName":"div","displayLayout":{"type":"flex","columns":4,"shrinkColumns":true},"dimensions":{"widthType":"fill"},"collection":"woocommerce/product-collection/product-catalog","queryContextIncludes":["collection"]} -->
<div class="wp-block-woocommerce-product-collection"><!-- wp:woocommerce/product-template -->
<!-- wp:woocommerce/product-image {"showSaleBadge":false,"imageSizing":"thumbnail","isDescendentOfQueryLoop":true,"aspectRatio":"1","style":{"border":{"radius":"4px"}}} /-->

<!-- wp:post-title {"textAlign":"left","isLink":true,"style":{"spacing":{"margin":{"top":"var:preset|spacing|20","bottom":"0"}},"typography":{"fontWeight":"300","lineHeight":"1.143"}},"fontSize":"medium","__woocommerceNamespace":"woocommerce/product-collection/product-title"} /-->

<!-- wp:woocommerce/product-price {"isDescendentOfQueryLoop":true,"textAlign":"left","style":{"typography":{"fontSize":"18px","fontWeight":"400","lineHeight":"1.6"}}} /-->

<!-- wp:woocommerce/product-button {"textAlign":"left","isDescendentOfQueryLoop":true,"className":"is-style-link","fontSize":"x-small"} /-->
<!-- /wp:woocommerce/product-template -->

<!-- wp:woocommerce/product-collection-no-results -->
<!-- wp:group {"style":{"spacing":{"padding":{"top":"var:preset|spacing|40","bottom":"var:preset|spacing|40"}}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group" style="padding-top:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40)"><!-- wp:heading {"textAlign":"center","level":3,"style":{"typography":{"fontWeight":"300"}}} -->
<h3 class="wp-block-heading has-text-align-center" style="font-weight:300"><?php esc_html_e( 'No products found', 'iconvert-shoply' ); ?></h3>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center","textColor":"muted-contrast"} -->
<p class="has-text-align-center has-muted-contrast-color has-text-color"><?php esc_html_e( 'Pick a different category or clear the active filter.', 'iconvert-shoply' ); ?></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group -->
<!-- /wp:woocommerce/product-collection-no-results --></div>
<!-- /wp:woocommerce/product-collection -->

<!-- wp:buttons {"style":{"spacing":{"margin":{"top":"var:preset|spacing|40"}}},"layout":{"type":"flex","justifyContent":"center"}} -->
<div class="wp-block-buttons" style="margin-top:var(--wp--preset--spacing--40)"><!-- wp:button {"backgroundColor":"subtle-contrast","textColor":"contrast","style":{"border":{"radius":"0px","width":"0px","style":"none"},"spacing":{"padding":{"top":"15px","bottom":"15px","left":"40px","right":"40px"}},"typography":{"fontWeight":"300","textTransform":"none","fontSize":"16px","letterSpacing":"1px"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-contrast-color has-subtle-contrast-background-color has-text-color has-background has-custom-font-size wp-element-button" href="<?php echo esc_url( $iconvert_shoply_shop_url ); ?>" style="border-style:none;border-width:0px;border-radius:0px;padding-top:15px;padding-right:40px;padding-bottom:15px;padding-left:40px;font-size:16px;font-weight:300;letter-spacing:1px;text-transform:none"><?php esc_html_e( 'View all products', 'iconvert-shoply' ); ?></a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:group -->
