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

fixes

Browse Source
This commit is contained in:
Andreas Knuth
2025-10-17 09:44:58 -05:00
parent 45a61a032c
commit 655050bf46
6 changed files with 5182 additions and 714 deletions
Download Patch File Download Diff File Expand all files Collapse all files

155
app/emails/page.tsx
View File

@@ -1,37 +1,132 @@
import { NextRequest, NextResponse } from 'next/server';
import { db } from '@/app/db/drizzle';
import { domains, emails } from '@/app/db/schema';
import { authenticate } from '@/app/lib/utils';
import { eq } from 'drizzle-orm';
'use client';
export async function GET(req: NextRequest) {
if (!authenticate(req)) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
import { useState, useEffect } from 'react';
import { useSearchParams } from 'next/navigation';
import Link from 'next/link';
const { searchParams } = new URL(req.url);
interface Email {
key: string;
subject: string;
date: string;
processed: string;
processedAt: string | null;
processedBy: string | null;
queuedTo: string | null;
status: string | null;
}
export default function Emails() {
const searchParams = useSearchParams();
const bucket = searchParams.get('bucket');
if (!bucket) return NextResponse.json({ error: 'Missing bucket' }, { status: 400 });
const mailbox = searchParams.get('mailbox');
const [emails, setEmails] = useState<Email[]>([]);
const [error, setError] = useState<string | null>(null);
const [loading, setLoading] = useState(true);
const [domain] = await db.select().from(domains).where(eq(domains.bucket, bucket));
if (!domain) return NextResponse.json({ error: 'Domain not found' }, { status: 404 });
useEffect(() => {
if (!bucket || !mailbox) {
setError('Missing parameters');
setLoading(false);
return;
}
const auth = localStorage.getItem('auth');
if (!auth) {
setError('Not authenticated');
setLoading(false);
return;
}
// Hole alle E-Mail-Adressen aus den "to" Feldern für diese Domain
const mailboxData = await db.select({ to: emails.to }).from(emails).where(eq(emails.domainId, domain.id));
// Extrahiere die Domain aus dem Bucket-Namen (z.B. "example-com-emails" -> "example.com")
const domainName = bucket.replace('-emails', '').replace(/-/g, '.');
const uniqueMailboxes = new Set<string>();
// Filtere nur E-Mail-Adressen, die zur aktuellen Domain gehören
mailboxData.forEach(em => {
em.to?.forEach(recipient => {
const recipientLower = recipient.toLowerCase();
// Prüfe, ob die E-Mail-Adresse zur Domain gehört
if (recipientLower.endsWith(`@${domainName}`)) {
uniqueMailboxes.add(recipientLower);
}
});
});
fetch(`/api/emails?bucket=${bucket}&mailbox=${encodeURIComponent(mailbox)}`, {
headers: { Authorization: `Basic ${auth}` }
})
.then(res => {
if (!res.ok) throw new Error('Failed to fetch emails');
return res.json();
})
.then(data => {
const sorted = data.sort((a: Email, b: Email) => new Date(b.date).getTime() - new Date(a.date).getTime());
setEmails(sorted);
})
.catch(err => setError(err.message))
.finally(() => setLoading(false));
}, [bucket, mailbox]);
return NextResponse.json(Array.from(uniqueMailboxes).sort());
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', hour12: false });
};
return (
<div className="min-h-screen bg-gradient-to-b from-blue-50 to-gray-100 p-8">
<nav className="max-w-6xl mx-auto mb-6 bg-white p-4 rounded-lg shadow-sm">
<ol className="flex flex-wrap space-x-2 text-sm text-gray-500">
<li><Link href="/" className="hover:text-blue-600">Home</Link></li>
<li className="mx-1">/</li>
<li><Link href="/domains" className="hover:text-blue-600">Domains</Link></li>
<li className="mx-1">/</li>
<li><Link href={`/mailboxes?bucket=${bucket}`} className="hover:text-blue-600">Mailboxes</Link></li>
<li className="mx-1">/</li>
<li className="font-semibold text-gray-700">Emails</li>
</ol>
</nav>
<h1 className="text-4xl font-bold mb-8 text-center text-gray-800">Emails for {mailbox} in {bucket}</h1>
<div className="overflow-x-auto max-w-6xl mx-auto bg-white rounded-lg shadow-md">
<table className="min-w-full divide-y divide-gray-200">
<thead className="bg-blue-50">
<tr>
<th className="px-4 py-3 text-left text-xs font-medium text-gray-700 uppercase tracking-wider">Subject</th>
<th className="px-4 py-3 text-left text-xs font-medium text-gray-700 uppercase tracking-wider">Date</th>
<th className="px-4 py-3 text-left text-xs font-medium text-gray-700 uppercase tracking-wider">Processed</th>
<th className="px-4 py-3 text-left text-xs font-medium text-gray-700 uppercase tracking-wider">Processed At</th>
<th className="px-4 py-3 text-left text-xs font-medium text-gray-700 uppercase tracking-wider">Processed By</th>
<th className="px-4 py-3 text-left text-xs font-medium text-gray-700 uppercase tracking-wider">Queued To</th>
<th className="px-4 py-3 text-left text-xs font-medium text-gray-700 uppercase tracking-wider">Status</th>
<th className="px-4 py-3 text-left text-xs font-medium text-gray-700 uppercase tracking-wider">Actions</th>
</tr>
</thead>
<tbody className="bg-white divide-y divide-gray-200">
{emails.length === 0 ? (
<tr>
<td colSpan={8} className="px-4 py-8 text-center text-gray-500">No emails found</td>
</tr>
) : emails.map((e: Email) => (
<tr key={e.key} className="hover:bg-blue-50 transition">
<td className="px-4 py-4 text-sm text-gray-900 max-w-xs truncate">{e.subject}</td>
<td className="px-4 py-4 whitespace-nowrap text-sm text-gray-500">{formatDate(e.date)}</td>
<td className="px-4 py-4 whitespace-nowrap text-sm">
<span className={`px-2 py-1 rounded-full text-xs font-medium ${e.processed === 'true' ? 'bg-green-100 text-green-800' : 'bg-yellow-100 text-yellow-800'}`}>
{e.processed === 'true' ? 'Yes' : 'No'}
</span>
</td>
<td className="px-4 py-4 whitespace-nowrap text-sm text-gray-500">{formatDate(e.processedAt)}</td>
<td className="px-4 py-4 whitespace-nowrap text-sm text-gray-500">{e.processedBy || '-'}</td>
<td className="px-4 py-4 whitespace-nowrap text-sm text-gray-500">{e.queuedTo || '-'}</td>
<td className="px-4 py-4 whitespace-nowrap text-sm">
{e.status ? (
<span className={`px-2 py-1 rounded-full text-xs font-medium ${
e.status === 'delivered' ? 'bg-green-100 text-green-800' :
e.status === 'failed' ? 'bg-red-100 text-red-800' :
'bg-gray-100 text-gray-800'
}`}>
{e.status}
</span>
) : '-'}
</td>
<td className="px-4 py-4 whitespace-nowrap text-sm font-medium">
<Link href={`/email?bucket=${bucket}&key=${e.key}&mailbox=${encodeURIComponent(mailbox || '')}`} className="text-blue-600 hover:text-blue-900">
View
</Link>
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
);
}