From 63f2e0725427ee4474db43fe209786d342684ea8 Mon Sep 17 00:00:00 2001
From: Linus Rath <139418639+rathlinus@users.noreply.github.com>
Date: Fri, 2 Oct 2026 13:04:38 +0200
Subject: [PATCH] feat: show more of the message on taller triage and
 latest-message widgets #52

The triage card kept its preview to two lines however tall it was
resized, leaving most of a large card empty, and Latest message showed
no preview at all. Both now use the room they have for the start of
the message.
---
 src/widgets/layouts/mail.tsx | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/widgets/layouts/mail.tsx b/src/widgets/layouts/mail.tsx
index ab70929b..78fc3663 100644
--- a/src/widgets/layouts/mail.tsx
+++ b/src/widgets/layouts/mail.tsx
@@ -84,7 +84,7 @@ export const InboxLayout: Layout = ({ s, p, f, now, width, height }) => {
  */
 const buttonWidth = (label: string) => 15 + 6 + Math.ceil(label.length * 13 * 0.47) + 2;
 
-export const TriageLayout: Layout = ({ s, p, f, now, width, widgetId, local }) => {
+export const TriageLayout: Layout = ({ s, p, f, now, width, height, widgetId, local }) => {
   const candidates = s.mail.inbox.filter((m) => m.unread);
   const current = candidates.find((m) => m.id === local.triageId) ?? candidates[0];
   const { unread } = inboxCounts(s);
@@ -138,7 +138,10 @@ export const TriageLayout: Layout = ({ s, p, f, now, width, widgetId, local }) =
         <Spacer size={6} />
         <Txt text={current.subject || f.t('widgets.mail.no_subject', '(no subject)')} color={p.fg} size={14} weight="600" />
         {/* The notice takes the preview's place, so the card fits at its smallest. */}
-        {current.preview && !notice ? <Txt text={current.preview} color={p.muted} size={13} lines={2} /> : null}
+        {current.preview && !notice ? (
+          // Two lines at the default size; a taller card shows more of the message.
+          <Txt text={current.preview} color={p.muted} size={13} lines={Math.max(2, Math.floor((height - 125) / 18))} />
+        ) : null}
       </FlexWidget>
       {notice ? <NoticeBar p={p} f={f} notice={notice} /> : null}
       <FlexWidget style={{ flexDirection: 'row', width: 'match_parent' }}>
@@ -193,7 +196,7 @@ export const UnreadCountLayout: Layout = ({ s, p, f, width }) => {
   );
 };
 
-export const LatestMessageLayout: Layout = ({ s, p, f, now }) => {
+export const LatestMessageLayout: Layout = ({ s, p, f, now, height }) => {
   const latest = s.mail.inbox.find((m) => m.unread);
   const { unread } = inboxCounts(s);
   if (!latest) {
@@ -213,6 +216,11 @@ export const LatestMessageLayout: Layout = ({ s, p, f, now }) => {
       <Spacer size={6} />
       <Txt text={latest.fromName || latest.fromEmail} color={p.fg} size={14} weight="700" />
       <Txt text={latest.subject || f.t('widgets.mail.no_subject', '(no subject)')} color={p.fg} size={14} weight="600" lines={2} />
+      {/* Resized taller, the card has room for the start of the message. */}
+      {latest.preview && height >= 260 ? <Spacer size={4} /> : null}
+      {latest.preview && height >= 260 ? (
+        <Txt text={latest.preview} color={p.muted} size={13} lines={Math.floor((height - 190) / 18)} />
+      ) : null}
       <Spacer />
       {unread > 1 ? (
         <Txt text={f.t('widgets.mail.more_unread', '+{count} more unread', { count: unread - 1 })} color={p.muted} size={12} />