aknuth/mail-s3-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

changes

Browse Source
This commit is contained in:
Andreas Knuth
2025-10-16 17:48:29 -05:00
parent eeac2c6904
commit 45a61a032c
8 changed files with 168 additions and 373 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
app/email/page.tsx
View File

@@ -8,8 +8,19 @@ export default function EmailDetail() {
const searchParams = useSearchParams();
const bucket = searchParams.get('bucket');
const key = searchParams.get('key');
const mailbox = searchParams.get('mailbox'); // Für Breadcrumb
const [email, setEmail] = useState({ subject: '', from: '', to: '', html: '', raw: '', processed: '' });
const mailbox = searchParams.get('mailbox');
const [email, setEmail] = useState({
subject: '',
from: '',
to: '',
html: '',
raw: '',
processed: '',
processedAt: null as string | null,
processedBy: null as string | null,
queuedTo: null as string | null,
status: null as string | null,
});
const [viewMode, setViewMode] = useState('html');
const [error, setError] = useState<string | null>(null);
const [loading, setLoading] = useState(true);
@@ -42,6 +53,20 @@ export default function EmailDetail() {
if (loading) return <div className="min-h-screen flex items-center justify-center bg-gray-100">Loading...</div>;
if (error) return <div className="min-h-screen flex items-center justify-center bg-gray-100 text-red-500">{error}</div>;
const formatDate = (dateStr: string | null) => {
if (!dateStr) return 'N/A';
const date = new Date(dateStr);
return date.toLocaleString('en-US', {
year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
hour12: false
});
};
return (
<div className="min-h-screen bg-gradient-to-b from-blue-50 to-gray-100 p-8">
<nav className="max-w-4xl mx-auto mb-6 bg-white p-4 rounded-lg shadow-sm">
@@ -59,10 +84,38 @@ export default function EmailDetail() {
</nav>
<div className="max-w-4xl mx-auto bg-white rounded-lg shadow-md p-8">
<h1 className="text-4xl font-bold mb-6 text-gray-800">{email.subject}</h1>
<p className="text-gray-700 mb-2 text-lg"><strong>From:</strong> {email.from}</p>
<p className="text-gray-700 mb-2 text-lg"><strong>To:</strong> {email.to}</p>
<p className="text-gray-700 mb-2 text-lg"><strong>S3 Key:</strong> {key}</p>
<p className="text-gray-700 mb-6 text-lg"><strong>Processed:</strong> {email.processed}</p>
<div className="grid grid-cols-2 gap-4 mb-6 bg-gray-50 p-6 rounded-lg">
<div>
<p className="text-gray-700 mb-2"><strong>From:</strong> {email.from}</p>
<p className="text-gray-700 mb-2"><strong>To:</strong> {email.to}</p>
<p className="text-gray-700 mb-2"><strong>S3 Key:</strong> <span className="text-sm break-all">{key}</span></p>
</div>
<div>
<p className="text-gray-700 mb-2">
<strong>Processed:</strong>
<span className={`ml-2 px-2 py-1 rounded-full text-xs font-medium ${email.processed === 'true' ? 'bg-green-100 text-green-800' : 'bg-yellow-100 text-yellow-800'}`}>
{email.processed === 'true' ? 'Yes' : 'No'}
</span>
</p>
<p className="text-gray-700 mb-2"><strong>Processed At:</strong> {formatDate(email.processedAt)}</p>
<p className="text-gray-700 mb-2"><strong>Processed By:</strong> {email.processedBy || 'N/A'}</p>
<p className="text-gray-700 mb-2"><strong>Queued To:</strong> {email.queuedTo || 'N/A'}</p>
<p className="text-gray-700 mb-2">
<strong>Status:</strong>
{email.status ? (
<span className={`ml-2 px-2 py-1 rounded-full text-xs font-medium ${
email.status === 'delivered' ? 'bg-green-100 text-green-800' :
email.status === 'failed' ? 'bg-red-100 text-red-800' :
'bg-gray-100 text-gray-800'
}`}>
{email.status}
</span>
) : 'N/A'}
</p>
</div>
</div>
<div className="flex mb-6 space-x-2">
<button
onClick={() => setViewMode('html')}