first version

app/api/auth/route.ts

@@ -0,0 +1,9 @@
+import { NextRequest, NextResponse } from 'next/server';
+
+export async function POST(req: NextRequest) {
+  const { password } = await req.json();
+  if (password === process.env.APP_PASSWORD) {
+    return NextResponse.json({ success: true });
+  }
+  return NextResponse.json({ error: 'Invalid password' }, { status: 401 });
+}

app/api/domains/route.ts

@@ -0,0 +1,11 @@
+import { db } from '@/app/db/drizzle';
+import { domains } from '@/app/db/schema';
+import { authenticate } from '@/app/lib/utils';
+import { NextRequest, NextResponse } from 'next/server';
+
+export async function GET(req: NextRequest) {
+  if (!authenticate(req)) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+
+  const domainList = await db.select({ bucket: domains.bucket, domain: domains.domain }).from(domains);
+  return NextResponse.json(domainList);
+}

app/api/email/route.ts

@@ -0,0 +1,92 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { db } from '@/app/db/drizzle';
+import { emails } from '@/app/db/schema';
+import { authenticate, getBody } from '@/app/lib/utils';
+import { eq } from 'drizzle-orm';
+import { CopyObjectCommand, GetObjectCommand, HeadObjectCommand } from '@aws-sdk/client-s3';
+import { getS3Client } from '@/app/lib/utils';
+import nodemailer from 'nodemailer';
+import { Readable } from 'stream';
+
+export async function GET(req: NextRequest) {
+  if (!authenticate(req)) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+
+  const { searchParams } = new URL(req.url);
+  const bucket = searchParams.get('bucket');
+  const key = searchParams.get('key');
+  if (!bucket || !key) return NextResponse.json({ error: 'Missing params' }, { status: 400 });
+
+  const [email] = await db.select().from(emails).where(eq(emails.s3Key, key));
+  if (!email) return NextResponse.json({ error: 'Email not found' }, { status: 404 });
+
+  return NextResponse.json({
+    subject: email.subject,
+    from: email.from,
+    to: email.to?.join(', '),
+    html: email.html,
+    raw: email.raw,
+    processed: email.processed ? 'true' : 'false',
+  });
+}
+
+// PUT: Update processed in S3 and DB
+export async function PUT(req: NextRequest) {
+  if (!authenticate(req)) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+
+  const { bucket, key, processed } = await req.json();
+  if (!bucket || !key) return NextResponse.json({ error: 'Missing params' }, { status: 400 });
+
+  const s3 = getS3Client();
+  const head = await s3.send(new HeadObjectCommand({ Bucket: bucket, Key: key }));
+  const newMeta = { ...head.Metadata, [process.env.PROCESSED_META_KEY!]: processed };
+  await s3.send(new CopyObjectCommand({
+    Bucket: bucket,
+    Key: key,
+    CopySource: `${bucket}/${key}`,
+    Metadata: newMeta,
+    MetadataDirective: 'REPLACE'
+  }));
+
+  await db.update(emails).set({ processed: processed === 'true' }).where(eq(emails.s3Key, key));
+
+  return NextResponse.json({ success: true });
+}
+
+// POST: Resend, update in S3 and DB
+export async function POST(req: NextRequest) {
+  if (!authenticate(req)) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+
+  const { bucket, key } = await req.json();
+  if (!bucket || !key) return NextResponse.json({ error: 'Missing params' }, { status: 400 });
+
+  const s3 = getS3Client();
+  const { Body } = await s3.send(new GetObjectCommand({ Bucket: bucket, Key: key }));
+  const raw = await getBody(Body as Readable);
+
+  const transporter = nodemailer.createTransport({
+    host: process.env.SMTP_HOST,
+    port: Number(process.env.SMTP_PORT),
+    secure: false,
+    auth: { user: process.env.SMTP_USER, pass: process.env.SMTP_PASS },
+    tls: { rejectUnauthorized: false }
+  });
+
+  try {
+    await transporter.sendMail({ raw });
+    // Update S3 Metadata
+    const head = await s3.send(new HeadObjectCommand({ Bucket: bucket, Key: key }));
+    const newMeta = { ...head.Metadata, [process.env.PROCESSED_META_KEY!]: process.env.PROCESSED_META_VALUE! };
+    await s3.send(new CopyObjectCommand({
+      Bucket: bucket,
+      Key: key,
+      CopySource: `${bucket}/${key}`,
+      Metadata: newMeta,
+      MetadataDirective: 'REPLACE'
+    }));
+    // Update DB
+    await db.update(emails).set({ processed: true }).where(eq(emails.s3Key, key));
+    return NextResponse.json({ message: 'Resent successfully' });
+  } catch (error) {
+    return NextResponse.json({ error: (error as Error).message }, { status: 500 });
+  }
+}

app/api/emails/route.ts

@@ -0,0 +1,26 @@
+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, sql } from 'drizzle-orm';
+
+export async function GET(req: NextRequest) {
+  if (!authenticate(req)) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+
+  const { searchParams } = new URL(req.url);
+  const bucket = searchParams.get('bucket');
+  const mailbox = searchParams.get('mailbox')?.toLowerCase();
+  if (!bucket || !mailbox) return NextResponse.json({ error: 'Missing params' }, { status: 400 });
+
+  const [domain] = await db.select().from(domains).where(eq(domains.bucket, bucket));
+  if (!domain) return NextResponse.json({ error: 'Domain not found' }, { status: 404 });
+
+  const emailList = await db.select({
+    key: emails.s3Key,
+    subject: emails.subject,
+    date: emails.date,
+    processed: emails.processed,
+  }).from(emails).where(sql`${mailbox} = ANY(${emails.to}) AND ${emails.domainId} = ${domain.id}`);
+
+  return NextResponse.json(emailList.map(e => ({ key: e.key, subject: e.subject, date: e.date?.toISOString(), processed: e.processed ? 'true' : 'false' })));
+}

app/api/mailboxes/route.ts

@@ -0,0 +1,22 @@
+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, sql } from 'drizzle-orm';
+
+export async function GET(req: NextRequest) {
+  if (!authenticate(req)) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+
+  const { searchParams } = new URL(req.url);
+  const bucket = searchParams.get('bucket');
+  if (!bucket) return NextResponse.json({ error: 'Missing bucket' }, { status: 400 });
+
+  const [domain] = await db.select().from(domains).where(eq(domains.bucket, bucket));
+  if (!domain) return NextResponse.json({ error: 'Domain not found' }, { status: 404 });
+
+  const mailboxData = await db.select({ to: emails.to }).from(emails).where(eq(emails.domainId, domain.id));
+  const uniqueMailboxes = new Set<string>();
+  mailboxData.forEach(em => em.to?.forEach(r => uniqueMailboxes.add(r.toLowerCase())));
+
+  return NextResponse.json(Array.from(uniqueMailboxes));
+}

app/api/resend-domain/route.ts

@@ -0,0 +1,30 @@
+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';
+
+export async function POST(req: NextRequest) {
+  if (!authenticate(req)) return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+
+  const { bucket } = await req.json();
+  if (!bucket) return NextResponse.json({ error: 'Missing bucket' }, { status: 400 });
+
+  const [domain] = await db.select().from(domains).where(eq(domains.bucket, bucket));
+  if (!domain) return NextResponse.json({ error: 'Domain not found' }, { status: 404 });
+
+  const unprocessed = await db.select({ s3Key: emails.s3Key }).from(emails).where(eq(emails.processed, false));
+
+  let count = 0;
+  for (const em of unprocessed) {
+    // Call POST /api/email internally for resend (updates DB/S3)
+    await fetch(`${req.headers.get('origin')}/api/email`, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json', Authorization: req.headers.get('Authorization')! },
+      body: JSON.stringify({ bucket, key: em.s3Key }),
+    });
+    count++;
+  }
+
+  return NextResponse.json({ message: `Resent ${count} emails` });
+}

app/db/drizzle.ts

@@ -0,0 +1,8 @@
+import { drizzle } from 'drizzle-orm/postgres-js';
+import postgres from 'postgres';
+import dotenv from 'dotenv';
+dotenv.config({ path: '.env' });
+console.log('DATABASE_URL:', process.env.DATABASE_URL);
+
+const queryClient = postgres(process.env.DATABASE_URL!);
+export const db = drizzle(queryClient);

app/db/schema.ts

@@ -0,0 +1,22 @@
+import { pgTable, serial, text, integer, timestamp, boolean } from 'drizzle-orm/pg-core';
+
+export const domains = pgTable('domains', {
+  id: serial('id').primaryKey(),
+  bucket: text('bucket').unique().notNull(),
+  domain: text('domain').notNull(),
+});
+
+export const emails = pgTable('emails', {
+  id: serial('id').primaryKey(),
+  domainId: integer('domain_id').references(() => domains.id).notNull(),
+  s3Key: text('s3_key').unique().notNull(),
+  from: text('from'),
+  to: text('to').array(),
+  cc: text('cc').array(),
+  bcc: text('bcc').array(),
+  subject: text('subject'),
+  html: text('html'),
+  raw: text('raw'),
+  processed: boolean('processed').default(false),
+  date: timestamp('date'),
+});

app/domains/page.tsx

@@ -0,0 +1,52 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import Link from 'next/link';
+
+export default function Domains() {
+  const [domains, setDomains] = useState([]);
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    const auth = localStorage.getItem('auth');
+    if (!auth) {
+      setError('Not authenticated');
+      setLoading(false);
+      return;
+    }
+
+    fetch('/api/domains', { 
+      headers: { Authorization: `Basic ${auth}` } 
+    })
+      .then(res => {
+        if (!res.ok) throw new Error('Failed to fetch domains');
+        return res.json();
+      })
+      .then(setDomains)
+      .catch(err => setError(err.message))
+      .finally(() => setLoading(false));
+  }, []);
+
+  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>;
+
+  return (
+    <div className="min-h-screen bg-gray-100 p-8">
+      <h1 className="text-3xl font-bold mb-6 text-center">Domains</h1>
+      <ul className="max-w-md mx-auto bg-white rounded-lg shadow-md divide-y divide-gray-200">
+        {domains.length === 0 ? (
+          <li className="p-4 text-center text-gray-500">No domains found</li>
+        ) : (
+          domains.map((d: any) => (
+            <li key={d.bucket} className="p-4 hover:bg-gray-50 transition">
+              <Link href={`/mailboxes?bucket=${d.bucket}`} className="text-blue-500 hover:underline">
+                {d.domain}
+              </Link>
+            </li>
+          ))
+        )}
+      </ul>
+    </div>
+  );
+}

app/email/page.tsx

@@ -0,0 +1,77 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { useSearchParams } from 'next/navigation';
+import ReactMarkdown from 'react-markdown';
+
+export default function EmailDetail() {
+  const searchParams = useSearchParams();
+  const bucket = searchParams.get('bucket');
+  const key = searchParams.get('key');
+  const [email, setEmail] = useState({ subject: '', from: '', to: '', html: '', raw: '', processed: '' });
+  const [viewMode, setViewMode] = useState('html');
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    if (!bucket || !key) {
+      setError('Missing parameters');
+      setLoading(false);
+      return;
+    }
+    const auth = localStorage.getItem('auth');
+    if (!auth) {
+      setError('Not authenticated');
+      setLoading(false);
+      return;
+    }
+
+    fetch(`/api/email?bucket=${bucket}&key=${key}`, { 
+      headers: { Authorization: `Basic ${auth}` } 
+    })
+      .then(res => {
+        if (!res.ok) throw new Error('Failed to fetch email');
+        return res.json();
+      })
+      .then(setEmail)
+      .catch(err => setError(err.message))
+      .finally(() => setLoading(false));
+  }, [bucket, key]);
+
+  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>;
+
+  return (
+    <div className="min-h-screen bg-gray-100 p-8">
+      <div className="max-w-4xl mx-auto bg-white rounded-lg shadow-md p-6">
+        <h1 className="text-3xl font-bold mb-4">{email.subject}</h1>
+        <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-4"><strong>Processed:</strong> {email.processed}</p>
+        <div className="flex mb-4">
+          <button 
+            onClick={() => setViewMode('html')} 
+            className={`px-4 py-2 rounded-l ${viewMode === 'html' ? 'bg-blue-500 text-white' : 'bg-gray-200 text-gray-700'} hover:bg-blue-600 transition`}
+          >
+            HTML
+          </button>
+          <button 
+            onClick={() => setViewMode('raw')} 
+            className={`px-4 py-2 rounded-r ${viewMode === 'raw' ? 'bg-blue-500 text-white' : 'bg-gray-200 text-gray-700'} hover:bg-blue-600 transition`}
+          >
+            RAW
+          </button>
+        </div>
+        <div className="border border-gray-300 p-4 rounded bg-white overflow-auto max-h-96">
+          {viewMode === 'html' ? (
+            <div className="prose">
+              <ReactMarkdown>{email.html}</ReactMarkdown>
+            </div>
+          ) : (
+            <pre className="whitespace-pre-wrap text-sm">{email.raw}</pre>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}

app/emails/page.tsx

@@ -0,0 +1,139 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { useSearchParams } from 'next/navigation';
+import Link from 'next/link';
+
+interface Email {
+  key: string;
+  subject: string;
+  date: string;
+  processed: string;
+}
+
+export default function Emails() {
+  const searchParams = useSearchParams();
+  const bucket = searchParams.get('bucket');
+  const mailbox = searchParams.get('mailbox');
+  const [emails, setEmails] = useState<Email[]>([]);
+  const [message, setMessage] = useState('');
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    if (!bucket || !mailbox) {
+      setError('Missing parameters');
+      setLoading(false);
+      return;
+    }
+    const auth = localStorage.getItem('auth');
+    if (!auth) {
+      setError('Not authenticated');
+      setLoading(false);
+      return;
+    }
+
+    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(setEmails)
+      .catch(err => setError(err.message))
+      .finally(() => setLoading(false));
+  }, [bucket, mailbox]);
+
+  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 handleResendAll = async () => {
+    const auth = localStorage.getItem('auth');
+    if (!auth) return setMessage('Not authenticated');
+
+    const response = await fetch('/api/resend-domain', {
+      method: 'POST',
+      headers: { Authorization: `Basic ${auth}`, 'Content-Type': 'application/json' },
+      body: JSON.stringify({ bucket }),
+    });
+    const res = await response.json();
+    setMessage(res.message || res.error);
+  };
+
+  const handleUpdateProcessed = async (key: string, newValue: boolean) => {
+    const auth = localStorage.getItem('auth');
+    if (!auth) return;
+
+    await fetch('/api/email', {
+      method: 'PUT',
+      headers: { Authorization: `Basic ${auth}`, 'Content-Type': 'application/json' },
+      body: JSON.stringify({ bucket, key, processed: newValue ? 'true' : 'false' }),
+    });
+    setEmails(emails.map(em => em.key === key ? { ...em, processed: newValue ? 'true' : 'false' } : em));
+  };
+
+  const handleResend = async (key: string) => {
+    const auth = localStorage.getItem('auth');
+    if (!auth) return alert('Not authenticated');
+
+    const response = await fetch('/api/email', {
+      method: 'POST',
+      headers: { Authorization: `Basic ${auth}`, 'Content-Type': 'application/json' },
+      body: JSON.stringify({ bucket, key }),
+    });
+    const res = await response.json();
+    alert(res.message || res.error);
+  };
+
+  return (
+    <div className="min-h-screen bg-gray-100 p-8">
+      <h1 className="text-3xl font-bold mb-6 text-center">Emails for {mailbox} in {bucket}</h1>
+      <div className="flex justify-center mb-6">
+        <button 
+          onClick={handleResendAll} 
+          className="bg-green-500 text-white px-6 py-3 rounded hover:bg-green-600 transition"
+        >
+          Resend all unprocessed
+        </button>
+      </div>
+      {message && <p className="text-center mb-4 text-blue-500">{message}</p>}
+      <div className="overflow-x-auto max-w-4xl mx-auto bg-white rounded-lg shadow-md">
+        <table className="min-w-full divide-y divide-gray-200">
+          <thead className="bg-gray-50">
+            <tr>
+              <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Subject</th>
+              <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Date</th>
+              <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Processed</th>
+              <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
+            </tr>
+          </thead>
+          <tbody className="bg-white divide-y divide-gray-200">
+            {emails.map((e: Email) => (
+              <tr key={e.key} className="hover:bg-gray-50 transition">
+                <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{e.subject}</td>
+                <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">{e.date}</td>
+                <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                  <input 
+                    type="checkbox" 
+                    checked={e.processed === 'true'} 
+                    onChange={() => handleUpdateProcessed(e.key, e.processed !== 'true')} 
+                    className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded"
+                  />
+                </td>
+                <td className="px-6 py-4 whitespace-nowrap text-sm font-medium">
+                  <Link href={`/email?bucket=${bucket}&key=${e.key}`} className="text-blue-600 hover:text-blue-900 mr-4">
+                    View
+                  </Link>
+                  <button onClick={() => handleResend(e.key)} className="text-green-600 hover:text-green-900">
+                    Resend
+                  </button>
+                </td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  );
+}

app/globals.css

@@ -1,26 +1,3 @@
-@import "tailwindcss";
+@tailwind base;
-
+@tailwind components;
-:root {
+@tailwind utilities;
-  --background: #ffffff;
-  --foreground: #171717;
-}
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
-}
-
-@media (prefers-color-scheme: dark) {
-  :root {
-    --background: #0a0a0a;
-    --foreground: #ededed;
-  }
-}
-
-body {
-  background: var(--background);
-  color: var(--foreground);
-  font-family: Arial, Helvetica, sans-serif;
-}

app/layout.tsx

@@ -1,20 +1,12 @@
 import type { Metadata } from "next";
-import { Geist, Geist_Mono } from "next/font/google";
+import { Inter } from "next/font/google";
 import "./globals.css";
 
-const geistSans = Geist({
+const inter = Inter({ subsets: ["latin"] });
-  variable: "--font-geist-sans",
-  subsets: ["latin"],
-});
-
-const geistMono = Geist_Mono({
-  variable: "--font-geist-mono",
-  subsets: ["latin"],
-});
 
 export const metadata: Metadata = {
-  title: "Create Next App",
+  title: "Mail S3 Admin",
-  description: "Generated by create next app",
+  description: "Admin App for S3 Emails",
 };
 
 export default function RootLayout({
@@ -24,11 +16,7 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en">
-      <body
+      <body className={inter.className}>{children}</body>
-        className={`${geistSans.variable} ${geistMono.variable} antialiased`}
-      >
-        {children}
-      </body>
     </html>
   );
-}
+}

app/lib/cron.ts

@@ -0,0 +1,14 @@
+import cron from 'node-cron';
+import { syncAllDomains } from './sync';
+
+console.log('Starting Cron Job for S3 Sync...');
+
+cron.schedule('0 * * * *', async () => {
+  console.log('Running Sync...');
+  try {
+    await syncAllDomains();
+    console.log('Sync completed.');
+  } catch (error) {
+    console.error('Sync error:', error);
+  }
+});

app/lib/sync.ts

@@ -0,0 +1,94 @@
+import { db } from '@/app/db/drizzle';
+import { domains, emails } from '@/app/db/schema';
+import { getS3Client, getBody } from '@/app/lib/utils';
+import { simpleParser } from 'mailparser';
+import { ListBucketsCommand, ListObjectsV2Command, GetObjectCommand, HeadObjectCommand } from '@aws-sdk/client-s3';
+import { eq, sql } from 'drizzle-orm';
+import { Readable } from 'stream';
+import pRetry from 'p-retry';  // Für Retry bei Timeouts
+
+export async function syncAllDomains() {
+  console.log('Starting syncAllDomains...');
+  const s3 = getS3Client();
+  const { Buckets } = await pRetry(() => s3.send(new ListBucketsCommand({})), { retries: 3 });  // Retry bei Fail
+  const domainBuckets = Buckets?.filter(b => b.Name?.endsWith('-emails')) || [];
+  console.log('Found domain buckets:', domainBuckets.map(b => b.Name).join(', ') || 'None');
+
+  for (const bucketObj of domainBuckets) {
+    const bucket = bucketObj.Name!;
+    const domainName = bucket.replace('-emails', '').replace(/-/g, '.');
+    console.log(`Processing bucket: ${bucket} (domain: ${domainName})`);
+
+    // Upsert Domain
+    const existingDomain = await db.select().from(domains).where(eq(domains.bucket, bucket)).limit(1);
+    console.log(`Existing domain for ${bucket}: ${existingDomain.length > 0 ? 'Yes (ID: ' + existingDomain[0].id + ')' : 'No'}`);
+    let domainId;
+    if (existingDomain.length === 0) {
+      const [newDomain] = await db.insert(domains).values({ bucket, domain: domainName }).returning({ id: domains.id });
+      domainId = newDomain.id;
+      console.log(`Created new domain ID: ${domainId}`);
+    } else {
+      domainId = existingDomain[0].id;
+    }
+
+    // Sync Emails
+    await syncEmailsForDomain(domainId, bucket);
+  }
+  console.log('syncAllDomains completed.');
+}
+
+async function syncEmailsForDomain(domainId: number, bucket: string) {
+  console.log(`Starting syncEmailsForDomain for bucket: ${bucket} (domainId: ${domainId})`);
+  const s3 = getS3Client();
+  const { Contents } = await pRetry(() => s3.send(new ListObjectsV2Command({ Bucket: bucket })), { retries: 3 });
+  console.log(`Found objects in bucket: ${Contents?.length || 0}`);
+
+  for (const obj of Contents || []) {
+    if (!obj.Key) continue;
+    console.log(`Processing object: ${obj.Key}`);
+
+    // Check if exists
+    const existing = await db.select().from(emails).where(eq(emails.s3Key, obj.Key!)).limit(1);
+    console.log(`Existing email for ${obj.Key}: ${existing.length > 0 ? 'Yes' : 'No'}`);
+    if (existing.length > 0) {
+      // Update processed if changed
+      const head = await pRetry(() => s3.send(new HeadObjectCommand({ Bucket: bucket, Key: obj.Key })), { retries: 3 });
+      const processed = head.Metadata?.[process.env.PROCESSED_META_KEY!] === process.env.PROCESSED_META_VALUE!;
+      console.log(`Processed metadata for ${obj.Key}: ${processed} (DB: ${existing[0].processed})`);
+      if (existing[0].processed !== processed) {
+        await db.update(emails).set({ processed }).where(eq(emails.s3Key, obj.Key!));
+        console.log(`Updated processed for ${obj.Key}`);
+      }
+      await new Promise(resolve => setTimeout(resolve, 100));  // Kleine Delay gegen Throttling
+      continue;
+    }
+
+    // New: Parse and insert
+    console.log(`Parsing new email: ${obj.Key}`);
+    const { Body } = await pRetry(() => s3.send(new GetObjectCommand({ Bucket: bucket, Key: obj.Key })), { retries: 3 });
+    const raw = await getBody(Body as Readable);
+    const parsed = await simpleParser(raw);
+    const head = await pRetry(() => s3.send(new HeadObjectCommand({ Bucket: bucket, Key: obj.Key })), { retries: 3 });
+
+    const to = parsed.to ? (Array.isArray(parsed.to) ? parsed.to.flatMap(t => t.value.map(v => v.address?.toLowerCase() || '')) : parsed.to.value.map(v => v.address?.toLowerCase() || '')) : [];
+    const cc = parsed.cc ? (Array.isArray(parsed.cc) ? parsed.cc.flatMap(c => c.value.map(v => v.address?.toLowerCase() || '')) : parsed.cc.value.map(v => v.address?.toLowerCase() || '')) : [];
+    const bcc = parsed.bcc ? (Array.isArray(parsed.bcc) ? parsed.bcc.flatMap(b => b.value.map(v => v.address?.toLowerCase() || '')) : parsed.bcc.value.map(v => v.address?.toLowerCase() || '')) : [];
+
+    await db.insert(emails).values({
+      domainId,
+      s3Key: obj.Key!,
+      from: parsed.from?.value[0].address,
+      to,
+      cc,
+      bcc,
+      subject: parsed.subject,
+      html: parsed.html || parsed.textAsHtml,
+      raw: raw.toString('utf-8'),
+      processed: head.Metadata?.[process.env.PROCESSED_META_KEY!] === process.env.PROCESSED_META_VALUE!,
+      date: parsed.date || obj.LastModified,
+    });
+    console.log(`Inserted new email: ${obj.Key}`);
+    await new Promise(resolve => setTimeout(resolve, 100));  // Delay gegen Throttling
+  }
+  console.log(`syncEmailsForDomain completed for bucket: ${bucket}`);
+}

app/lib/utils.ts

@@ -0,0 +1,38 @@
+import { S3Client } from '@aws-sdk/client-s3';
+import { NextRequest } from 'next/server';
+import { Readable } from 'stream';
+
+export function getS3Client() {
+  console.log('Creating S3Client...');
+  console.log('AWS_REGION:', process.env.AWS_REGION);
+  console.log('AWS_ACCESS_KEY_ID:', process.env.AWS_ACCESS_KEY_ID ? 'Set' : 'Not set');  // Maskiere sensible Infos
+  console.log('AWS_SECRET_ACCESS_KEY:', process.env.AWS_SECRET_ACCESS_KEY ? 'Set' : 'Not set');
+
+  return new S3Client({
+    region: process.env.AWS_REGION,
+    credentials: { accessKeyId: process.env.AWS_ACCESS_KEY_ID!, secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY! },
+    httpOptions: { connectTimeout: 60000, timeout: 60000 },  // 60s, verhindert Timeouts
+  });
+}
+
+export function authenticate(req: NextRequest) {
+  const auth = req.headers.get('Authorization');
+  console.log('Received Auth Header:', auth);  // Logge den Header
+  console.log('Expected Password:', process.env.APP_PASSWORD);  // Logge das Env-Passwort (Achtung: Sensibel, nur für Debug!)
+  if (!auth || !auth.startsWith('Basic ')) return false;
+  const [user, pass] = Buffer.from(auth.slice(6), 'base64').toString().split(':');
+  return user === 'admin' && pass === process.env.APP_PASSWORD;
+}
+
+export async function getBody(stream: Readable): Promise<Buffer> {
+  console.log('Getting body from stream...');
+  return new Promise((resolve, reject) => {
+    const chunks: Buffer[] = [];
+    stream.on('data', chunk => chunks.push(chunk));
+    stream.on('error', reject);
+    stream.on('end', () => {
+      console.log('Body fetched, size:', Buffer.concat(chunks).length);
+      resolve(Buffer.concat(chunks));
+    });
+  });
+}

app/mailboxes/page.tsx

@@ -0,0 +1,60 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { useSearchParams } from 'next/navigation';
+import Link from 'next/link';
+
+export default function Mailboxes() {
+  const searchParams = useSearchParams();
+  const bucket = searchParams.get('bucket');
+  const [mailboxes, setMailboxes] = useState<string[]>([]);
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    if (!bucket) {
+      setError('No bucket specified');
+      setLoading(false);
+      return;
+    }
+    const auth = localStorage.getItem('auth');
+    if (!auth) {
+      setError('Not authenticated');
+      setLoading(false);
+      return;
+    }
+
+    fetch(`/api/mailboxes?bucket=${bucket}`, { 
+      headers: { Authorization: `Basic ${auth}` } 
+    })
+      .then(res => {
+        if (!res.ok) throw new Error('Failed to fetch mailboxes');
+        return res.json();
+      })
+      .then(setMailboxes)
+      .catch(err => setError(err.message))
+      .finally(() => setLoading(false));
+  }, [bucket]);
+
+  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>;
+
+  return (
+    <div className="min-h-screen bg-gray-100 p-8">
+      <h1 className="text-3xl font-bold mb-6 text-center">Mailboxes for {bucket}</h1>
+      <ul className="max-w-md mx-auto bg-white rounded-lg shadow-md divide-y divide-gray-200">
+        {mailboxes.length === 0 ? (
+          <li className="p-4 text-center text-gray-500">No mailboxes found</li>
+        ) : (
+          mailboxes.map((m: string) => (
+            <li key={m} className="p-4 hover:bg-gray-50 transition">
+              <Link href={`/emails?bucket=${bucket}&mailbox=${encodeURIComponent(m)}`} className="text-blue-500 hover:underline">
+                {m}
+              </Link>
+            </li>
+          ))
+        )}
+      </ul>
+    </div>
+  );
+}

app/page.tsx

@@ -1,103 +1,62 @@
-import Image from "next/image";
+'use client';
+
+import { useState, useEffect } from 'react';
+import Link from 'next/link';
 
 export default function Home() {
-  return (
+  const [loggedIn, setLoggedIn] = useState(false);
-    <div className="font-sans grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20">
+  const [password, setPassword] = useState('');
-      <main className="flex flex-col gap-[32px] row-start-2 items-center sm:items-start">
-        <Image
-          className="dark:invert"
-          src="/next.svg"
-          alt="Next.js logo"
-          width={180}
-          height={38}
-          priority
-        />
-        <ol className="font-mono list-inside list-decimal text-sm/6 text-center sm:text-left">
-          <li className="mb-2 tracking-[-.01em]">
-            Get started by editing{" "}
-            <code className="bg-black/[.05] dark:bg-white/[.06] font-mono font-semibold px-1 py-0.5 rounded">
-              app/page.tsx
-            </code>
-            .
-          </li>
-          <li className="tracking-[-.01em]">
-            Save and see your changes instantly.
-          </li>
-        </ol>
 
-        <div className="flex gap-4 items-center flex-col sm:flex-row">
+  useEffect(() => {
-          <a
+    if (localStorage.getItem('auth')) setLoggedIn(true);
-            className="rounded-full border border-solid border-transparent transition-colors flex items-center justify-center bg-foreground text-background gap-2 hover:bg-[#383838] dark:hover:bg-[#ccc] font-medium text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 sm:w-auto"
+  }, []);
-            href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
+
-            target="_blank"
+  const handleLogin = async () => {
-            rel="noopener noreferrer"
+    const response = await fetch('/api/auth', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ password }),
+    });
+    if (response.ok) {
+      const auth = btoa(`admin:${password}`);
+      localStorage.setItem('auth', auth);
+      setLoggedIn(true);
+    } else {
+      alert('Wrong password');
+    }
+  };
+
+  if (!loggedIn) {
+    return (
+      <div className="min-h-screen flex items-center justify-center bg-gray-100">
+        <div className="bg-white p-8 rounded-lg shadow-md w-96">
+          <h1 className="text-2xl font-bold mb-6 text-center">Login</h1>
+          <input 
+            type="password" 
+            value={password} 
+            onChange={e => setPassword(e.target.value)} 
+            className="border border-gray-300 p-3 mb-4 w-full rounded focus:outline-none focus:ring-2 focus:ring-blue-500" 
+            placeholder="Enter password"
+          />
+          <button 
+            onClick={handleLogin} 
+            className="bg-blue-500 text-white p-3 rounded w-full hover:bg-blue-600 transition"
           >
-            <Image
+            Login
-              className="dark:invert"
+          </button>
-              src="/vercel.svg"
-              alt="Vercel logomark"
-              width={20}
-              height={20}
-            />
-            Deploy now
-          </a>
-          <a
-            className="rounded-full border border-solid border-black/[.08] dark:border-white/[.145] transition-colors flex items-center justify-center hover:bg-[#f2f2f2] dark:hover:bg-[#1a1a1a] hover:border-transparent font-medium text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 w-full sm:w-auto md:w-[158px]"
-            href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            Read our docs
-          </a>
         </div>
-      </main>
+      </div>
-      <footer className="row-start-3 flex gap-[24px] flex-wrap items-center justify-center">
+    );
-        <a
+  }
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
+
-          href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
+  return (
-          target="_blank"
+    <div className="min-h-screen bg-gray-100 p-8">
-          rel="noopener noreferrer"
+      <h1 className="text-3xl font-bold mb-6 text-center">Mail S3 Admin</h1>
-        >
+      <div className="flex justify-center">
-          <Image
+        <Link href="/domains" className="bg-blue-500 text-white px-6 py-3 rounded hover:bg-blue-600 transition">
-            aria-hidden
+          Go to Domains
-            src="/file.svg"
+        </Link>
-            alt="File icon"
+      </div>
-            width={16}
-            height={16}
-          />
-          Learn
-        </a>
-        <a
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
-          href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image
-            aria-hidden
-            src="/window.svg"
-            alt="Window icon"
-            width={16}
-            height={16}
-          />
-          Examples
-        </a>
-        <a
-          className="flex items-center gap-2 hover:underline hover:underline-offset-4"
-          href="https://nextjs.org?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image
-            aria-hidden
-            src="/globe.svg"
-            alt="Globe icon"
-            width={16}
-            height={16}
-          />
-          Go to nextjs.org →
-        </a>
-      </footer>
     </div>
   );
-}
+}

docker-compose.yml

@@ -0,0 +1,25 @@
+services:
+  mail-admin:
+    build: .
+    ports:
+      - "3000:3000"
+    environment:
+      - DATABASE_URL=postgresql://postgres:password@postgres:5433/mydb?schema=public
+      # ... deine bestehenden Env-Vars (AWS, SMTP, APP_PASSWORD)
+    depends_on:
+      - postgres
+
+  postgres:
+    image: postgres:latest
+    restart: always
+    environment:
+      POSTGRES_USER: postgres
+      POSTGRES_PASSWORD: fiesta  # Ändere das!
+      POSTGRES_DB: mydb
+    ports:
+      - "5433:5432"
+    volumes:
+      - postgres-data:/var/lib/postgresql/data
+
+volumes:
+  postgres-data:

drizzle.config.ts

@@ -0,0 +1,9 @@
+import { defineConfig } from 'drizzle-kit';
+export default defineConfig({
+  out: './drizzle',
+  schema: './app/db/schema.ts',
+  dialect: 'postgresql',
+  dbCredentials: {
+    url: process.env.DATABASE_URL!,
+  },
+});

package.json

@@ -2,22 +2,41 @@
   "name": "mail-s3-admin",
   "version": "0.1.0",
   "private": true,
+  "type": "commonjs",
   "scripts": {
-    "dev": "next dev --turbopack",
+    "dev": "next dev",
     "build": "next build --turbopack",
     "start": "next start"
   },
   "dependencies": {
+    "@aws-sdk/client-s3": "^3.888.0",
+    "dotenv": "^17.2.2",
+    "drizzle-orm": "^0.44.5",
+    "email-addresses": "^5.0.0",
+    "emailjs": "^4.0.3",
+    "mailparser": "^3.7.4",
+    "marked": "^16.3.0",
+    "next": "15.5.3",
+    "node-cron": "^4.2.1",
+    "nodemailer": "^7.0.6",
+    "p-retry": "^7.0.0",
+    "pg": "^8.16.3",
+    "postgres": "^3.4.7",
     "react": "19.1.0",
     "react-dom": "19.1.0",
-    "next": "15.5.3"
+    "react-markdown": "^10.1.0"
   },
   "devDependencies": {
-    "typescript": "^5",
+    "@tailwindcss/postcss": "^4",
     "@types/node": "^20",
+    "@types/nodemailer": "^7.0.1",
     "@types/react": "^19",
     "@types/react-dom": "^19",
-    "@tailwindcss/postcss": "^4",
+    "autoprefixer": "^10.4.21",
-    "tailwindcss": "^4"
+    "drizzle-kit": "^0.31.4",
+    "postcss": "^8.5.6",
+    "tailwindcss": "^4.1.13",
+    "ts-node": "^10.9.2",
+    "typescript": "^5"
   }
 }

postcss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    '@tailwindcss/postcss': {},
+    autoprefixer: {},
+  },
+};

postcss.config.mjs

@@ -1,5 +0,0 @@
-const config = {
-  plugins: ["@tailwindcss/postcss"],
-};
-
-export default config;

s3-list.ts

@@ -0,0 +1,28 @@
+import dotenv from 'dotenv';
+dotenv.config({ path: '.env' });
+
+import { S3Client, ListBucketsCommand } from '@aws-sdk/client-s3';
+import http from 'http';
+import https from 'https';
+
+// Aktiviere KeepAlive für stabile Connections (verhindert Timeouts bei Wiederholungen)
+http.globalAgent.keepAlive = true;
+https.globalAgent.keepAlive = true;
+
+(async () => {
+  try {
+    console.log('Fetching S3 buckets...');
+    const s3 = new S3Client({
+      region: process.env.AWS_REGION,
+      credentials: {
+        accessKeyId: process.env.AWS_ACCESS_KEY_ID!,
+        secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY!,
+      },
+      httpOptions: { connectTimeout: 30000, timeout: 30000 },  // Erhöhte Timeouts (30s) verhindern ETIMEDOUT
+    });
+    const { Buckets } = await s3.send(new ListBucketsCommand({}));
+    console.log('Buckets:', Buckets?.map(b => b.Name) || 'No buckets found');
+  } catch (error) {
+    console.error('Error listing buckets:', error);
+  }
+})();

sync-test.ts

@@ -0,0 +1,23 @@
+import { syncAllDomains } from './app/lib/sync';
+import dotenv from 'dotenv';
+import http from 'http';
+import https from 'https';
+
+http.globalAgent.keepAlive = true;
+https.globalAgent.keepAlive = true;
+dotenv.config({ path: '.env' });
+
+console.log('DATABASE_URL:', process.env.DATABASE_URL);
+console.log('AWS_REGION:', process.env.AWS_REGION);
+console.log('AWS_ACCESS_KEY_ID:', process.env.AWS_ACCESS_KEY_ID ? 'Set' : 'Not set');  // Maskiere sensible Keys
+console.log('AWS_SECRET_ACCESS_KEY:', process.env.AWS_SECRET_ACCESS_KEY ? 'Set' : 'Not set');
+
+(async () => {
+  try {
+    console.log('Starting sync...');
+    await syncAllDomains();
+    console.log('Sync done');
+  } catch (error) {
+    console.error('Error:', error);
+  }
+})();

tailwind.config.ts

@@ -0,0 +1,17 @@
+import type { Config } from 'tailwindcss';
+
+const config: Config = {
+  content: [
+    './app/**/*.{js,ts,jsx,tsx,mdx}',
+    './pages/**/*.{js,ts,jsx,tsx,mdx}',
+    './components/**/*.{js,ts,jsx,tsx,mdx}',
+  ],
+  theme: {
+    extend: {
+      // Optionale Erweiterungen, z. B. Farben
+    },
+  },
+  plugins: [],
+};
+
+export default config;

tsconfig.json

@@ -18,9 +18,9 @@
         "name": "next"
       }
     ],
-    "paths": {
+    "baseUrl": ".", "paths": { "@/*": ["./*"] 
-      "@/*": ["./*"]
+  } 
-    }
+    
   },
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
   "exclude": ["node_modules"]

types.d.ts

@@ -0,0 +1,46 @@
+declare module 'mailparser' {
+  export function simpleParser(source: Buffer | string | Readable, options?: any): Promise<ParsedMail>;
+  
+  export interface ParsedMail {
+    headers: Map<string, any>;
+    subject?: string;
+    from?: AddressObject;
+    to?: AddressObject | AddressObject[];
+    cc?: AddressObject | AddressObject[];
+    bcc?: AddressObject | AddressObject[];
+    date?: Date;
+    messageId?: string;
+    inReplyTo?: string;
+    replyTo?: AddressObject;
+    references?: string | string[];
+    html?: string | false;
+    text?: string;
+    textAsHtml?: string;
+    attachments: Attachment[];
+  }
+
+  export interface AddressObject {
+    value: Mailbox[];
+    html: string;
+    text: string;
+  }
+
+  export interface Mailbox {
+    name: string;
+    address: string;
+  }
+
+  export interface Attachment {
+    type: string;
+    contentType: string;
+    partId: string;
+    filename?: string;
+    contentDisposition?: string;
+    checksum: string;
+    size: number;
+    headers: Map<string, any>;
+    content: Buffer;
+    cid?: string;
+    related?: boolean;
+  }
+}