From 55cba9a3fe08fd6c07708ec0d40614ae3a510afe Mon Sep 17 00:00:00 2001
From: chahinebrini <chahinebrini@gmail.com>
Date: Thu, 14 May 2026 00:53:08 +0200
Subject: [PATCH] fix(mail): legend takes natural width inside card + bar-chart
 always trims to hit-range
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. Legend-Wrapper: feste 180px-Width raus, stattdessen flex:1 + minWidth:0.
   Mit Donut 200px + gap 20 + Card-paddingHorizontal 16+16 wäre 200+20+180+32=432
   zu breit — kleine iPhones haben effektive Card-Width <380px. Legend ragte
   raus. Jetzt: Legend nimmt verfügbaren Rest-Platz, Texte trunken bei Bedarf.

2. useMailConnectionStats: zoom IMMER wenn nonEmpty.length > 0, nicht nur
   bei sparse-data-Bedingung. Bei 30-Tage-Range mit 1 Hit wurde das vorher
   trotzdem als 30 leere Bars + 1 Bar gerendert (Logik nonEmpty*3<raw greift
   zwar mathematisch, aber nicht aggressiv genug für wirklichen Visual-Fix).
   Jetzt: trim ALWAYS auf [firstHit..lastHit] — bei 1 Hit = 1 Bar, bei 5 Hits
   über 10 Tage = 10 Bars (5 mit Daten, 5 dazwischen). Konsistent visuell.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 .../components/mail/MailDistributionChart.tsx            | 2 +-
 apps/rebreak-native/hooks/useMailStats.ts                | 9 +++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/apps/rebreak-native/components/mail/MailDistributionChart.tsx b/apps/rebreak-native/components/mail/MailDistributionChart.tsx
index b636e85..8b93a68 100644
--- a/apps/rebreak-native/components/mail/MailDistributionChart.tsx
+++ b/apps/rebreak-native/components/mail/MailDistributionChart.tsx
@@ -112,7 +112,7 @@ export function MailDistributionChart({ data, hero, totalBlocked, isLegend }: Pr
             centerLabel={centerLabel}
             width={DONUT_WIDTH}
           />
-          <View style={{ gap: 6, width: 180 }}>
+          <View style={{ gap: 6, flex: 1, minWidth: 0 }}>
             {slices.map((slice) => (
               <LegendRow key={slice.label} slice={slice} colors={colors} />
             ))}
diff --git a/apps/rebreak-native/hooks/useMailStats.ts b/apps/rebreak-native/hooks/useMailStats.ts
index dbb5d7e..2780438 100644
--- a/apps/rebreak-native/hooks/useMailStats.ts
+++ b/apps/rebreak-native/hooks/useMailStats.ts
@@ -73,10 +73,11 @@ export function useMailConnectionStats(
         data = aggregateToWeeks(raw);
       } else if (granularity === 'month') {
         data = aggregateToMonths(raw);
-      } else if (nonEmpty.length > 0 && nonEmpty.length * 3 < raw.length) {
-        // Sparse data (z.B. nur 1-2 Tage von 30): zoom in auf die echte Range
-        // zwischen erstem und letztem Hit. Vermeidet 30 leere Bars + 1 Bar
-        // ganz rechts wie bei einer frischen Outlook-Connection.
+      } else if (nonEmpty.length > 0) {
+        // IMMER auf die echte Hit-Range zoomen — von erstem nonEmpty bis
+        // letztem nonEmpty. Gaps dazwischen bleiben sichtbar (für realistische
+        // Verteilung), aber 29 leere Slots am Anfang + 1 Bar am Ende wird
+        // auf z.B. 1-3 Bars geschrumpft. Trim eliminiert das visuelle Rauschen.
         const firstDate = nonEmpty[0].date;
         const lastDate = nonEmpty[nonEmpty.length - 1].date;
         data = raw.filter((e) => e.date >= firstDate && e.date <= lastDate);