From 2978c43bb7f2c0ca628524fa2afd80fce25cb898 Mon Sep 17 00:00:00 2001
From: Antoine M <antoine.martinon@deligraph.com>
Date: Thu, 30 Nov 2023 09:18:26 +0100
Subject: [PATCH] handle isLoading

---
 resources/css/pages/template-archives-news.css | 3 +++
 resources/js/archive-template-news.js          | 4 ++++
 2 files changed, 7 insertions(+)

diff --git a/resources/css/pages/template-archives-news.css b/resources/css/pages/template-archives-news.css
index dc6be10..5ebecee 100644
--- a/resources/css/pages/template-archives-news.css
+++ b/resources/css/pages/template-archives-news.css
@@ -2,4 +2,7 @@
   .card-grid-container {
     @apply pt-2;
   }
+  .card-grid-container[isLoading] {
+    @apply opacity-30;
+  }
 }
diff --git a/resources/js/archive-template-news.js b/resources/js/archive-template-news.js
index ee7ba3b..7cf4e02 100644
--- a/resources/js/archive-template-news.js
+++ b/resources/js/archive-template-news.js
@@ -13,7 +13,11 @@ async function filterPosts(e) {
   filterButtons.forEach((button) => {
     button.classList.remove('filters-toolbar__action-button--active');
   });
+
+  const newsContainer = document.querySelector('.news-container .card-grid-container');
+  newsContainer.setAttribute('isLoading', true);
   await hydrateNewsFeedByTypeId(filterID, termName);
+  newsContainer.removeAttribute('isLoading');
 
   e.target.classList.add('filters-toolbar__action-button--active');
 }