From 36474d3525744956044cf2fa341817a4311a029f Mon Sep 17 00:00:00 2001
From: henry <dev@henrystuifzand.nl>
Date: Sun, 15 Mar 2026 06:45:27 +0100
Subject: [PATCH] Load all competition emblems upfront so picker shows logos
 immediately

Previously emblems were only cached after visiting each competition.
Now a single /api/competitions fetch on mount populates all emblems
at once, including the initially selected button.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/App.jsx | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index 09fd08a..f49604f 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -18,6 +18,19 @@ export default function App() {
 
   const closeModal = useCallback(() => setSelectedTeam(null), [])
 
+  // Load all competition emblems once on mount so the picker shows logos immediately
+  useEffect(() => {
+    apiFetch('/competitions')
+      .then((data) => {
+        const map = {}
+        for (const comp of data.competitions ?? []) {
+          if (comp.code && comp.emblem) map[comp.code] = comp.emblem
+        }
+        setEmblems(map)
+      })
+      .catch(() => {}) // non-critical — picker still works without logos
+  }, [])
+
   useEffect(() => {
     setLoading(true)
     setError(null)
@@ -30,10 +43,6 @@ export default function App() {
         setStandings(total?.table ?? [])
         setCompetition(data.competition)
         setSeason(data.season)
-        // Cache the emblem for this competition
-        if (data.competition?.emblem) {
-          setEmblems((prev) => ({ ...prev, [selectedCode]: data.competition.emblem }))
-        }
         setLoading(false)
       })
       .catch((err) => {