<?php
/**
 * Page Découvrir — catalogue enrichi.
 *
 * @package Volade\SDK
 * @license GPL-2.0-or-later
 * @var array $discover_stats
 * @var array $discover_catalog
 * @var array $discover_featured
 * @var array $discover_groups
 * @var array $discover_categories
 */

defined( 'ABSPATH' ) || exit;

$user = $this->get_current_user();
?>
<div class="volade-wrap volade-discover-page">
	<?php
	$hero_kicker  = __( 'Écosystème Volade', 'core-version-switcher-by-volade' );
	$hero_title   = __( 'Découvrir les plugins', 'core-version-switcher-by-volade' );
	$hero_lead    = __( 'Extensions Volade disponibles — forks maintenus, outils dev et intégrations pour votre site.', 'core-version-switcher-by-volade' );
	$hero_variant = 'indigo';
	$hero_orbs    = array( '🔌', '⚡', '🚀' );
	ob_start();
	?>
	<a href="<?php echo esc_url( admin_url( 'admin.php?page=volade-promote' ) ); ?>" class="volade-btn volade-btn-secondary">
		<?php esc_html_e( 'Gagner de l\'XP', 'core-version-switcher-by-volade' ); ?>
	</a>
	<?php
	$hero_actions_html = ob_get_clean();
	require __DIR__ . '/partials/page-hero.php';
	?>

	<div class="volade-dash-grid volade-discover-stats">
		<div class="volade-stat-card">
			<div class="volade-stat-icon volade-stat-icon--indigo">✅</div>
			<span class="volade-stat-number"><?php echo (int) $discover_stats['live']; ?></span>
			<span class="volade-stat-label"><?php esc_html_e( 'Disponibles', 'core-version-switcher-by-volade' ); ?></span>
		</div>
		<div class="volade-stat-card">
			<div class="volade-stat-icon volade-stat-icon--dark">🛠️</div>
			<span class="volade-stat-number"><?php echo (int) $discover_stats['planned']; ?></span>
			<span class="volade-stat-label"><?php esc_html_e( 'En développement', 'core-version-switcher-by-volade' ); ?></span>
		</div>
		<div class="volade-stat-card">
			<div class="volade-stat-icon volade-stat-icon--indigo">📂</div>
			<span class="volade-stat-number"><?php echo (int) $discover_stats['categories']; ?></span>
			<span class="volade-stat-label"><?php esc_html_e( 'Catégories', 'core-version-switcher-by-volade' ); ?></span>
		</div>
		<div class="volade-stat-card">
			<div class="volade-stat-icon volade-stat-icon--dark">📦</div>
			<span class="volade-stat-number"><?php echo (int) $discover_stats['installed']; ?></span>
			<span class="volade-stat-label"><?php esc_html_e( 'Sur ce site', 'core-version-switcher-by-volade' ); ?></span>
		</div>
	</div>

	<div class="volade-discover-toolbar volade-card">
		<div class="volade-discover-search-wrap">
			<span class="volade-discover-search-icon" aria-hidden="true">🔍</span>
			<input type="search"
					id="volade-discover-search"
					class="volade-discover-search"
					placeholder="<?php esc_attr_e( 'Rechercher un plugin…', 'core-version-switcher-by-volade' ); ?>"
					autocomplete="off" />
		</div>
		<div class="volade-discover-filters" role="group" aria-label="<?php esc_attr_e( 'Filtres', 'core-version-switcher-by-volade' ); ?>">
			<button type="button" class="volade-discover-filter is-active" data-filter="all"><?php esc_html_e( 'Tous', 'core-version-switcher-by-volade' ); ?></button>
			<button type="button" class="volade-discover-filter" data-filter="live"><?php esc_html_e( 'Disponibles', 'core-version-switcher-by-volade' ); ?></button>
			<button type="button" class="volade-discover-filter" data-filter="installed"><?php esc_html_e( 'Installés ici', 'core-version-switcher-by-volade' ); ?></button>
			<button type="button" class="volade-discover-filter" data-filter="planned"><?php esc_html_e( 'En développement', 'core-version-switcher-by-volade' ); ?></button>
		</div>
		<div class="volade-discover-cat-chips">
			<button type="button" class="volade-discover-cat is-active" data-category="all"><?php esc_html_e( 'Toutes catégories', 'core-version-switcher-by-volade' ); ?></button>
			<?php foreach ( $discover_groups as $group ) : ?>
				<button type="button"
						class="volade-discover-cat"
						data-category="<?php echo esc_attr( $group['key'] ); ?>">
					<?php echo esc_html( ( $group['icon'] ?? '' ) . ' ' . $group['label'] ); ?>
				</button>
			<?php endforeach; ?>
		</div>
		<p class="volade-discover-result-count" id="volade-discover-count" aria-live="polite">
			<?php
			printf(
				/* translators: %d: number of plugins shown in the discover catalog. */
				esc_html__( '%d plugins affichés', 'core-version-switcher-by-volade' ),
				count( $discover_catalog )
			);
			?>
		</p>
	</div>

	<?php if ( ! empty( $discover_featured ) ) : ?>
		<section class="volade-discover-section volade-discover-featured">
			<div class="volade-discover-section-head">
				<h2><span aria-hidden="true">⭐</span> <?php esc_html_e( 'À la une', 'core-version-switcher-by-volade' ); ?></h2>
				<p><?php esc_html_e( 'Plugins prioritaires et déjà disponibles.', 'core-version-switcher-by-volade' ); ?></p>
			</div>
			<div class="volade-discover-featured-grid">
				<?php foreach ( $discover_featured as $plugin ) : ?>
					<?php include __DIR__ . '/partials/discover-card.php'; ?>
				<?php endforeach; ?>
			</div>
		</section>
	<?php endif; ?>

	<div id="volade-discover-catalog">
		<?php
		$featured_slugs = array_column( $discover_featured, 'slug' );
		foreach ( $discover_groups as $group ) :
			?>
			<section class="volade-discover-section volade-discover-category-block"
					data-category-block="<?php echo esc_attr( $group['key'] ); ?>">
				<div class="volade-discover-section-head">
					<h2>
						<span class="volade-discover-cat-icon" aria-hidden="true"><?php echo esc_html( $group['icon'] ); ?></span>
						<?php echo esc_html( $group['label'] ); ?>
						<span class="volade-discover-cat-count"><?php echo count( $group['plugins'] ); ?></span>
					</h2>
				</div>
				<div class="volade-discover-cards-grid">
					<?php foreach ( $group['plugins'] as $plugin ) : ?>
						<?php
						if ( in_array( $plugin['slug'] ?? '', $featured_slugs, true ) ) {
							continue;
						}
						include __DIR__ . '/partials/discover-card.php';
						?>
					<?php endforeach; ?>
				</div>
			</section>
		<?php endforeach; ?>
	</div>

	<div class="volade-discover-empty" id="volade-discover-empty" hidden>
		<div class="volade-empty-icon">🔍</div>
		<h3><?php esc_html_e( 'Aucun plugin ne correspond', 'core-version-switcher-by-volade' ); ?></h3>
		<p class="volade-muted"><?php esc_html_e( 'Essayez un autre mot-clé ou réinitialisez les filtres.', 'core-version-switcher-by-volade' ); ?></p>
		<button type="button" class="volade-btn volade-btn-secondary" id="volade-discover-reset">
			<?php esc_html_e( 'Réinitialiser', 'core-version-switcher-by-volade' ); ?>
		</button>
	</div>
</div>
