From 05e131a0c070f0a94ee945ea0862ab58c9bb9f91 Mon Sep 17 00:00:00 2001
From: Matthias G <matthias.giesselmann@pocket-rocket.io>
Date: Mon, 3 Aug 2026 13:07:29 +0200
Subject: [PATCH] Fit the run history into its space

Two columns showed the same long date, the trigger printed a whole mail
address and the error text pushed the table past its container. Dates are
short now, the trigger reads Verwaltung or Zeitsteuerung with the detail in
the tooltip, and long cells clamp instead of stretching.
---
 src/app/admin/settings/page.tsx | 37 ++++++++++++++++++++++++++-------
 src/lib/dates.ts                |  2 ++
 2 files changed, 31 insertions(+), 8 deletions(-)

diff --git a/src/app/admin/settings/page.tsx b/src/app/admin/settings/page.tsx
index 4d088e5..5c6a7dd 100644
--- a/src/app/admin/settings/page.tsx
+++ b/src/app/admin/settings/page.tsx
@@ -8,7 +8,7 @@ import { cellClass, headCellClass } from '~/components/admin/styles'
 import { SectionLabel } from '~/components/ui/SectionLabel'
 import { Scroller } from '~/components/ui/Scroller'
 import { listReportRuns } from '~/data/repositories/settings'
-import { longDateTimeFormat } from '~/lib/dates'
+import { dateTimeFormat, dayMonthFormat } from '~/lib/dates'
 import { readSlackConfig } from '~/lib/report-settings'
 import { requireAdmin } from '~/lib/auth-guards'
 
@@ -21,6 +21,18 @@ export async function generateMetadata(): Promise<Metadata> {
 	return { title: `${t('title')} - ${app('name')}` }
 }
 
+function trigger(value: string): { label: string, title: string } {
+	if (value.startsWith('admin:')) {
+		return { label: 'Verwaltung', title: value.slice('admin:'.length) }
+	}
+
+	if (value === 'cron') {
+		return { label: 'Zeitsteuerung', title: value }
+	}
+
+	return { label: value, title: value }
+}
+
 function resultKey(run: { sent: boolean, detail: string | null }): string {
 	if (run.sent) {
 		return 'sent'
@@ -71,7 +83,7 @@ export default async function AdminSettingsPage() {
 					<AdminNotice>{t('historyEmpty')}</AdminNotice>
 				) : (
 					<Scroller options={{ overflow: { y: 'hidden' } }}>
-						<table className="w-full min-w-3xl border-collapse text-left">
+						<table className="w-full border-collapse text-left">
 							<thead>
 								<tr>
 									<th scope="col" className={headCellClass}>{t('columns.when')}</th>
@@ -87,22 +99,31 @@ export default async function AdminSettingsPage() {
 								{runs.map(run => (
 									<tr key={run.id}>
 										<td className={`${cellClass} whitespace-nowrap font-mono text-micro`}>
-											{format.dateTime(run.createdAt, longDateTimeFormat)}
+											{format.dateTime(run.createdAt, dateTimeFormat)}
 										</td>
 										<td className={`${cellClass} whitespace-nowrap font-mono text-micro`}>
-											{format.dateTime(run.fromAt, longDateTimeFormat)}
+											{format.dateTime(run.fromAt, dayMonthFormat)}
+											{' bis '}
+											{format.dateTime(run.toAt, dayMonthFormat)}
 										</td>
 										<td className={`${cellClass} whitespace-nowrap font-mono text-micro tabular-nums`}>
 											{run.total}
 										</td>
 										<td className={cellClass}>
-											{run.projects.length === 0
-												? '-'
-												: run.projects.map(project => `${project.name} (${project.count})`).join(', ')}
+											<span
+												title={run.projects.map(project => `${project.name} (${project.count})`).join(', ')}
+												className="block max-w-56 truncate"
+											>
+												{run.projects.length === 0
+													? '-'
+													: run.projects.map(project => `${project.name} (${project.count})`).join(', ')}
+											</span>
 										</td>
 										<td className={`${cellClass} whitespace-nowrap`}>{t(`results.${resultKey(run)}`)}</td>
-										<td className={`${cellClass} whitespace-nowrap font-mono text-micro`}>{run.trigger}</td>
 										<td className={`${cellClass} whitespace-nowrap`}>
+											<span title={trigger(run.trigger).title}>{trigger(run.trigger).label}</span>
+										</td>
+										<td className={`${cellClass} max-w-72`}>
 											{run.deletedAt
 												? t('messageDeleted')
 												: run.sent && canDelete
diff --git a/src/lib/dates.ts b/src/lib/dates.ts
index a4f77ec..8cc95cd 100644
--- a/src/lib/dates.ts
+++ b/src/lib/dates.ts
@@ -23,3 +23,5 @@ export const longDateTimeFormat = {
 export const monthYearFormat = { month: 'long', year: 'numeric', timeZone: 'UTC' } as const
 
 export const monthOnlyFormat = { month: 'long', timeZone: 'UTC' } as const
+
+export const shortTimeFormat = { hour: '2-digit', minute: '2-digit' } as const