From 0c9839e1d8c381385510029a018ed4af5d76b15e Mon Sep 17 00:00:00 2001
From: Tetardtek <kvnn64@gmail.com>
Date: Tue, 24 Mar 2026 19:21:24 +0100
Subject: [PATCH] =?UTF-8?q?feat:=20bouton=20Voir=20tout=20sur=20qu=C3=AAte?=
 =?UTF-8?q?s=20combat=20=E2=80=94=20plus=20de=20qu=C3=AAtes=20cach=C3=A9es?=
 =?UTF-8?q?=20derri=C3=A8re=20les=20grosses?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/pages/QuestPage.tsx | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/frontend/src/pages/QuestPage.tsx b/frontend/src/pages/QuestPage.tsx
index 0135291..a79a72b 100644
--- a/frontend/src/pages/QuestPage.tsx
+++ b/frontend/src/pages/QuestPage.tsx
@@ -228,9 +228,9 @@ export function QuestPage() {
   const availableCraft = availableAll.filter((q: any) => !q.repeatable && isCraftQuest(q));
   const availableDaily = availableAll.filter((q: any) => q.repeatable);
 
-  // Stagger: show max 3 combat quests at a time
-  const shownCombat = availableCombat.slice(0, 3);
-  const hiddenCount = availableCombat.length - shownCombat.length;
+  const [showAllCombat, setShowAllCombat] = useState(false);
+  const shownCombat = showAllCombat ? availableCombat : availableCombat.slice(0, 3);
+  const hiddenCount = availableCombat.length - 3;
 
   return (
     <div>
@@ -262,9 +262,13 @@ export function QuestPage() {
             <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
               {shownCombat.map((q: any) => <QuestCard key={q.id} pq={q} mode="available" />)}
               {hiddenCount > 0 && (
-                <div style={{ textAlign: 'center', fontSize: 11, color: '#6b7a99', padding: 4 }}>
-                  +{hiddenCount} quête{hiddenCount > 1 ? 's' : ''} supplémentaire{hiddenCount > 1 ? 's' : ''} après celles-ci
-                </div>
+                <button
+                  className="btn btn-ghost"
+                  style={{ width: '100%', fontSize: 11, padding: '0.3rem', marginTop: 2 }}
+                  onClick={() => setShowAllCombat(!showAllCombat)}
+                >
+                  {showAllCombat ? 'Réduire' : `Voir tout (+${hiddenCount} quête${hiddenCount > 1 ? 's' : ''})`}
+                </button>
               )}
             </div>
           ) : (