From 676ed9c1b30dd6d12450cb608179dae7886071cc Mon Sep 17 00:00:00 2001
From: Ronny <ronny975@gmail.com>
Date: Sat, 11 Apr 2026 20:51:36 +0200
Subject: [PATCH] fix: improve tipping user journey
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Dashboard "Jetzt tippen" opens TipModal directly instead of
  navigating to /spiele (no more dead-end spielplan)
- After tipping, dashboard updates to show "Dein Tipp: X:Y ✓"
- Spielplan auto-opens all sections when only 1-2 exist
  (no more collapsed "Demnächst" as only section)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/src/pages/DashboardPage.tsx | 39 ++++++++++++++++++++++++++--
 frontend/src/pages/MatchesPage.tsx   |  7 ++++-
 2 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/frontend/src/pages/DashboardPage.tsx b/frontend/src/pages/DashboardPage.tsx
index 5289866..09e6745 100644
--- a/frontend/src/pages/DashboardPage.tsx
+++ b/frontend/src/pages/DashboardPage.tsx
@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { api, DashboardData } from '../api/client';
+import { api, DashboardData, Match } from '../api/client';
+import TipModal from '../components/TipModal';
 import styles from './DashboardPage.module.css';
 
 interface Props {
@@ -25,6 +26,7 @@ export default function DashboardPage(_props: Props) {
   const [data, setData] = useState<DashboardData | null>(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(false);
+  const [tipMatch, setTipMatch] = useState<Match | null>(null);
   const navigate = useNavigate();
 
   useEffect(() => {
@@ -90,7 +92,23 @@ export default function DashboardPage(_props: Props) {
             ) : hero.tippable ? (
               <button
                 className={styles.heroTipBtn}
-                onClick={e => { e.stopPropagation(); navigate('/spiele'); }}
+                onClick={e => {
+                  e.stopPropagation();
+                  setTipMatch({
+                    id: hero.match.id,
+                    externalId: 0,
+                    utcDate: hero.match.utcDate,
+                    status: hero.match.status,
+                    stage: '',
+                    group: null,
+                    homeTeam: hero.match.homeTeam,
+                    awayTeam: hero.match.awayTeam,
+                    score: { home: null, away: null },
+                    userTip: null,
+                    minutesUntilKickoff: hero.match.minutesUntilKickoff,
+                    tippable: true,
+                  });
+                }}
               >
                 Jetzt tippen
               </button>
@@ -138,6 +156,23 @@ export default function DashboardPage(_props: Props) {
           ))}
         </div>
       )}
+
+      {tipMatch && (
+        <TipModal
+          match={tipMatch}
+          onClose={() => setTipMatch(null)}
+          onSaved={(_matchId, tipHome, tipAway) => {
+            setTipMatch(null);
+            // Update dashboard data to reflect the new tip
+            if (data && data.hero) {
+              setData({
+                ...data,
+                hero: { ...data.hero, userTip: { home: tipHome, away: tipAway } },
+              });
+            }
+          }}
+        />
+      )}
     </div>
   );
 }
diff --git a/frontend/src/pages/MatchesPage.tsx b/frontend/src/pages/MatchesPage.tsx
index 5721ece..f302a9d 100644
--- a/frontend/src/pages/MatchesPage.tsx
+++ b/frontend/src/pages/MatchesPage.tsx
@@ -81,7 +81,12 @@ export default function MatchesPage() {
     if (allMatches.length > 0) {
       const filteredMatches = allMatches.filter(m => !stageFilter || m.stage === stageFilter);
       const sections = groupIntoSections(filteredMatches);
-      setOpenSections(new Set(sections.filter(s => s.defaultOpen).map(s => s.key)));
+      // If only 1-2 sections exist, open all of them
+      if (sections.length <= 2) {
+        setOpenSections(new Set(sections.map(s => s.key)));
+      } else {
+        setOpenSections(new Set(sections.filter(s => s.defaultOpen).map(s => s.key)));
+      }
     }
   }, [allMatches]); // only on initial load