FEATURE Implementing articles filtering

includes/api.php

@@ -6,18 +6,24 @@ add_action('rest_api_init', function () {
 		BUILDING ROUTES
  	-----------------*/
 
-	// ################ NEWS ################
+	// ################ Authors ################
 
-	// * BUILD MORE NEWS CARDS 
 	register_rest_route('dynamiques-datas/v1/build', '/revue/authors', array(
 		'methods' => 'GET',
 		'callback' => 'build_revue_authors',
 		'permission_callback' => '__return_true',
 	));
+
+	// ################ FILTER ARTICLES ################
+	register_rest_route('dynamiques-datas/v1/build', '/articles', array(
+		'methods' => 'GET',
+		'callback' => 'build_articles',
+		'permission_callback' => '__return_true',
+	));
 });
 
 
-// ################ NEWS ################
+// ################ REVUE AUTHORS ################
 
 function build_revue_authors($request)
 {
@@ -40,3 +46,95 @@ function build_revue_authors($request)
 
 	return $response;
 }
+
+// ################ FILTER ARTICLES ################
+
+function build_articles($request)
+{
+	$etiquette = esc_html($request->get_param('etiquette'));
+	$auteur = esc_html($request->get_param('auteur'));
+	$sort_by = esc_html($request->get_param('sort_by'));
+	$recherche = esc_html($request->get_param('recherche'));
+
+	// Construire les arguments de la query WordPress
+	$args = array(
+		'post_type' => 'articles',
+		'posts_per_page' => -1,
+	);
+
+	// Gestion du tri
+	switch ($sort_by) {
+		case 'date_desc':
+			$args['orderby'] = 'date';
+			$args['order'] = 'DESC';
+			break;
+		case 'date_asc':
+			$args['orderby'] = 'date';
+			$args['order'] = 'ASC';
+			break;
+		case 'title_asc':
+			$args['orderby'] = 'title';
+			$args['order'] = 'ASC';
+			break;
+		default:
+			$args['orderby'] = 'date';
+			$args['order'] = 'DESC';
+	}
+
+	// Filtre par étiquette (taxonomie)
+	if (!empty($etiquette) && $etiquette != '1') {
+		$args['tax_query'] = array(
+			array(
+				'taxonomy' => 'etiquettes',
+				'field'    => 'term_id',
+				'terms'    => $etiquette,
+			),
+		);
+	}
+
+	// Filtre par auteur
+	if (!empty($auteur) && $auteur != '1') {
+		$args['meta_query'] = array(
+			array(
+				'key'     => 'authors', // Ajustez selon votre structure
+				'value'   => $auteur,
+				'compare' => 'LIKE'
+			)
+		);
+	}
+
+	// Recherche par mot-clé
+	if (!empty($recherche)) {
+		$args['s'] = $recherche;
+	}
+
+	$articles = new WP_Query($args);
+
+	ob_start();
+	if ($articles->have_posts()) :
+		while ($articles->have_posts()) : $articles->the_post();
+			get_template_part('template-parts/articles/card-article', null, array(
+				'date' => get_the_date(),
+				'image' => get_the_post_thumbnail_url(),
+				'link' => get_the_permalink(),
+				'ID' => get_the_ID()
+			));
+		endwhile;
+	else :
+		echo '<p>Aucun article trouvé.</p>';
+	endif;
+	wp_reset_postdata();
+
+	$html_template = ob_get_clean();
+
+	$response_data = array(
+		'html_template' => $html_template,
+		'post_count' => $articles->found_posts,
+		'query_args' => $args, // Pour debug
+	);
+	$response = new WP_REST_Response($response_data);
+
+	$response->set_status(200);
+
+	return $response;
+}

resources/js/filter-articles.ts

@@ -0,0 +1,48 @@
+export default function filterArticlesInit() {
+  const toolbar = document.querySelector('.post-grid__toolbar');
+  if (!toolbar) return;
+
+  const postGridToolbarActions = toolbar.querySelector('.post-grid__toolbar-actions');
+  const etiquettesSelect = toolbar.querySelector('select[name="etiquettes"]') as HTMLSelectElement;
+  const auteursSelect = toolbar.querySelector('select[name="auteurs"]') as HTMLSelectElement;
+  const sortBySelect = toolbar.querySelector('select[name="sort_by"]') as HTMLSelectElement;
+  const rechercheInput = toolbar.querySelector('.search-bar input') as HTMLInputElement;
+
+  async function hydrateArticles() {
+    const etiquetteValue = etiquettesSelect.value;
+    const auteurValue = auteursSelect.value;
+    const sortByValue = sortBySelect.value;
+    const rechercheValue = rechercheInput.value;
+
+    console.table({
+      etiquettes: etiquetteValue,
+      auteurs: auteurValue,
+      sort_by: sortByValue,
+      recherche: rechercheValue,
+    });
+
+    try {
+      const response = await fetch(
+        `/wp-json/dynamiques-datas/v1/build/articles?etiquette=${etiquetteValue}&auteur=${auteurValue}&sort_by=${sortByValue}&recherche=${rechercheValue}`
+        // `/wp-json/dynamiques-datas/v1/build/articles?etiquettes=${etiquettesSelect.value}&auteurs=${auteursSelect.value}&sort_by=${sortBySelect.value}&recherche=${rechercheInput.value}`
+      );
+      const data = await response.json();
+      console.log(data);
+
+      const articlesContainer = document.querySelector('.post-grid__list');
+      if (!articlesContainer) return;
+      articlesContainer.innerHTML = data.html_template;
+    } catch (error) {
+      console.error('Erreur lors de la récupération des articles:', error);
+    }
+  }
+
+  // Écouter les changements sur les selects
+  postGridToolbarActions.addEventListener('change', (e) => {
+    hydrateArticles();
+  });
+
+  rechercheInput.addEventListener('input', (e) => {
+    hydrateArticles();
+  });
+}

template-parts/articles/articles-grid.php

@@ -48,9 +48,9 @@ $thematiques = get_terms(array(
 				</select>
 
 				<select name="sort_by">
-					<option value="recent" selected><?php _e('Numéros récents en premier', 'dynamiques'); ?></option>
+					<option value="date_desc" selected><?php _e('Numéros récents en premier', 'dynamiques'); ?></option>
-					<option value="oldest"><?php _e('Numéros anciens en premier', 'dynamiques'); ?></option>
+					<option value="date_asc"><?php _e('Numéros anciens en premier', 'dynamiques'); ?></option>
-					<option value="alphabetical"><?php _e('Par ordre alphabétique', 'dynamiques'); ?></option>
+					<option value="title_asc"><?php _e('Par ordre alphabétique', 'dynamiques'); ?></option>
 				</select>
 			</div>