Weektab Webmail

2026-02-23 11:45:18 +01:00
parent 0eef705ac9
commit c27e2da6ae
14 changed files with 3864 additions and 0 deletions
--- a/nx-webmail/.dockerignore
+++ b/nx-webmail/.dockerignore
@@ -0,0 +1,9 @@
+node_modules
+npm-debug.log
+dist
+.git
+.gitignore
+Dockerfile*
+.dockerignore
+.env
+.env.*
--- a/nx-webmail/.env.example
+++ b/nx-webmail/.env.example
@@ -0,0 +1,2 @@
+PORT=3001
+NODE_ENV=production
--- a/nx-webmail/Dockerfile
+++ b/nx-webmail/Dockerfile
@@ -0,0 +1,23 @@
+# syntax=docker/dockerfile:1
+FROM node:20-alpine AS base
+WORKDIR /app
+
+FROM base AS deps
+COPY package*.json ./
+RUN npm install
+
+FROM deps AS build
+COPY . .
+RUN npm run build
+
+FROM node:20-alpine AS runtime
+WORKDIR /app
+ENV NODE_ENV=production
+ENV PORT=3001
+COPY package*.json ./
+COPY --from=deps /app/node_modules ./node_modules
+RUN npm prune --omit=dev
+COPY --from=build /app/dist ./dist
+COPY ./server.js ./server.js
+EXPOSE 3001
+CMD ["node", "server.js"]
--- a/nx-webmail/README.md
+++ b/nx-webmail/README.md
@@ -0,0 +1,40 @@
+# Standalone Webmail (Docker-ready)
+
+## Local setup
+
+1. Install dependencies:
+   npm install
+2. Run dev mode (Vite + API):
+   npm run dev
+3. Open:
+   http://localhost:5173
+
+## Docker (standalone)
+
+1. Copy env file:
+   cp .env.example .env
+2. Build + run:
+   docker compose up --build -d
+3. Open:
+   http://localhost:3001
+
+## Umbrel app packaging
+
+This repository is prepared for Umbrel app-store usage.
+
+1. Put this project into your app folder (folder name must match `id` in `umbrel-app.yml`, currently `nx-webmail`).
+2. Keep these files in that folder:
+   - `docker-compose.yml`
+   - `umbrel-app.yml`
+   - `Dockerfile`
+3. Add the app folder to your Umbrel community app store repo and push.
+
+Notes:
+- Umbrel uses the `app_proxy` service in `docker-compose.yml`.
+- Internal app port is `3001`.
+- If your store prefix is not `nx`, change `id` in `umbrel-app.yml` and update `APP_HOST` accordingly.
+
+## Notes
+
+- Frontend calls API on `/api/webmail/*`.
+- IMAP/SMTP credentials are provided by user login in UI.
--- a/nx-webmail/docker-compose.yml
+++ b/nx-webmail/docker-compose.yml
@@ -0,0 +1,16 @@
+version: "3.7"
+
+services:
+  app_proxy:
+    environment:
+      APP_HOST: nx-webmail_server_1
+      APP_PORT: 3001
+
+  server:
+    build: .
+    image: nx-webmail:1.0.0
+    init: true
+    restart: on-failure
+    environment:
+      NODE_ENV: production
+      PORT: 3001
--- a/nx-webmail/index.html
+++ b/nx-webmail/index.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Webmail</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>
--- a/nx-webmail/logo.svg
+++ b/nx-webmail/logo.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" role="img" aria-labelledby="title desc">
+  <title id="title">Webmail</title>
+  <desc id="desc">Envelope icon for Webmail app</desc>
+  <rect x="16" y="32" width="224" height="192" rx="24" fill="#0f172a"/>
+  <rect x="32" y="64" width="192" height="128" rx="14" fill="#1e293b"/>
+  <path d="M32 78l96 70 96-70" fill="none" stroke="#e2e8f0" stroke-width="14" stroke-linecap="round" stroke-linejoin="round"/>
+  <path d="M32 178l70-54m122 54l-70-54" fill="none" stroke="#94a3b8" stroke-width="10" stroke-linecap="round"/>
+</svg>
--- a/nx-webmail/package.json
+++ b/nx-webmail/package.json
@@ -0,0 +1,26 @@
+{
+    "name":  "weektab-webmail-standalone",
+    "version":  "1.0.0",
+    "private":  true,
+    "type":  "module",
+    "scripts":  {
+                    "dev":  "concurrently \"vite\" \"node server.js\"",
+                    "build":  "vite build",
+                    "start":  "node server.js"
+                },
+    "dependencies":  {
+                         "dotenv":  "^16.4.5",
+                         "express":  "^4.21.2",
+                         "imap-simple":  "^5.1.0",
+                         "mailparser":  "^3.7.2",
+                         "nodemailer":  "^6.10.1",
+                         "react":  "^18.3.1",
+                         "react-dom":  "^18.3.1",
+                         "remixicon":  "^4.5.0"
+                     },
+    "devDependencies":  {
+                            "@vitejs/plugin-react":  "^4.3.4",
+                            "concurrently":  "^9.1.2",
+                            "vite":  "^5.4.11"
+                        }
+}
--- a/nx-webmail/server.js
+++ b/nx-webmail/server.js
@@ -0,0 +1,342 @@
+import express from 'express';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import crypto from 'crypto';
+import dotenv from 'dotenv';
+import imaps from 'imap-simple';
+import { simpleParser } from 'mailparser';
+import nodemailer from 'nodemailer';
+
+dotenv.config();
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const app = express();
+
+app.use(express.json({ limit: '5mb' }));
+
+function imapConfig({ user, password, host, port, tls }) {
+  return {
+    imap: {
+      user,
+      password,
+      host,
+      port: Number(port || 993),
+      tls: tls !== false,
+      authTimeout: 10000,
+      connTimeout: 15000,
+      tlsOptions: { rejectUnauthorized: false }
+    }
+  };
+}
+
+function extractSenderEmail(value) {
+  const raw = String(value || '').trim();
+  const match = raw.match(/<([^>]+)>/);
+  return (match?.[1] || raw).trim().toLowerCase();
+}
+
+function gravatarUrl(senderValue) {
+  const email = extractSenderEmail(senderValue);
+  if (!email || !email.includes('@')) return '';
+  const hash = crypto.createHash('md5').update(email).digest('hex');
+  return `https://www.gravatar.com/avatar/${hash}?s=64&d=404`;
+}
+
+function flattenBoxes(tree, prefix = '') {
+  const names = [];
+  for (const key of Object.keys(tree || {})) {
+    const box = tree[key];
+    const delimiter = box?.delimiter || '/';
+    const full = prefix ? `${prefix}${delimiter}${key}` : key;
+    if (!box?.attribs || !box.attribs.includes('\\Noselect')) names.push(full);
+    if (box?.children) names.push(...flattenBoxes(box.children, full));
+  }
+  return names;
+}
+
+function parseHeaderRow(res) {
+  const header = res.parts.find((p) => p.which === 'HEADER.FIELDS (FROM TO SUBJECT DATE)')?.body || {};
+  const textPart = res.parts.find((p) => p.which === 'TEXT');
+  let snippet = '';
+  if (textPart?.body) {
+    snippet = String(textPart.body)
+      .replace(/(<([^>]+)>)/gi, '')
+      .replace(/\s+/g, ' ')
+      .trim()
+      .substring(0, 120);
+    if (snippet) snippet += '...';
+  }
+  const sender = header.from ? header.from[0] : 'Unknown';
+  return {
+    id: res.attributes.uid,
+    subject: header.subject ? header.subject[0] : '(No Subject)',
+    sender,
+    avatar: gravatarUrl(sender),
+    time: header.date ? new Date(header.date[0]).toLocaleString() : '',
+    unread: !res.attributes.flags.includes('\\Seen'),
+    snippet
+  };
+}
+
+app.post('/api/webmail/connect', async (req, res) => {
+  const { user, password, host } = req.body;
+  if (!user || !password || !host) return res.status(400).json({ error: 'Missing credentials' });
+
+  let connection;
+  try {
+    connection = await imaps.connect(imapConfig(req.body));
+    const boxes = await connection.getBoxes();
+    const folderNames = flattenBoxes(boxes);
+
+    const folders = [];
+    for (const name of folderNames) {
+      try {
+        const box = await connection.openBox(name, true);
+        folders.push({ name, total: box.messages.total || 0, unseen: box.messages.unseen || 0 });
+      } catch {
+        folders.push({ name, total: 0, unseen: 0 });
+      }
+    }
+
+    res.json({ success: true, folders });
+  } catch (err) {
+    res.status(500).json({ error: err.message || 'Failed to connect to IMAP server' });
+  } finally {
+    if (connection) connection.end();
+  }
+});
+
+app.post('/api/webmail/inbox', async (req, res) => {
+  const {
+    user, password, host, folder = 'INBOX',
+    offset = 0, limit = 50, fetchAll = false,
+    direction = 'newest', sync = false, sinceUid = 0, knownUids = []
+  } = req.body;
+
+  if (!user || !password || !host) return res.status(400).json({ error: 'Missing credentials' });
+
+  let connection;
+  try {
+    connection = await imaps.connect(imapConfig(req.body));
+    await connection.openBox(folder);
+
+    const safeOffset = Math.max(0, Number(offset) || 0);
+    const safeLimit = Math.max(1, Math.min(200, Number(limit) || 50));
+    const loadAll = fetchAll === true || String(fetchAll).toLowerCase() === 'true';
+    const oldest = String(direction).toLowerCase() === 'oldest';
+    const syncMode = sync === true || String(sync).toLowerCase() === 'true';
+
+    const fetchOptions = {
+      bodies: ['HEADER.FIELDS (FROM TO SUBJECT DATE)', 'TEXT'],
+      struct: true,
+      markSeen: false
+    };
+
+    const allUids = await new Promise((resolve, reject) => {
+      connection.imap.search(['ALL'], (err, results) => {
+        if (err) return reject(err);
+        resolve(Array.isArray(results) ? results : []);
+      });
+    });
+
+    const sortedUids = [...allUids].sort((a, b) => a - b);
+    const total = sortedUids.length;
+
+    if (syncMode) {
+      const since = Math.max(0, Number(sinceUid) || 0);
+      const known = new Set(Array.isArray(knownUids) ? knownUids.map((u) => Number(u)).filter((u) => Number.isFinite(u) && u > 0) : []);
+      const current = new Set(sortedUids);
+      const deletedUids = [...known].filter((uid) => !current.has(uid));
+      const newUidList = sortedUids.filter((uid) => uid > since);
+
+      let newResults = [];
+      if (newUidList.length > 0) {
+        newResults = await connection.search([['UID', newUidList.join(',')]], fetchOptions);
+      }
+
+      const newEmails = newResults.map(parseHeaderRow).sort((a, b) => Number(a.id || 0) - Number(b.id || 0));
+      return res.json({ sync: true, total, newEmails, deletedUids });
+    }
+
+    let targetUids = sortedUids;
+    if (!loadAll) {
+      if (oldest) {
+        const start = safeOffset;
+        const end = Math.min(total, start + safeLimit);
+        targetUids = sortedUids.slice(start, end);
+      } else {
+        const end = Math.max(0, total - safeOffset);
+        const start = Math.max(0, end - safeLimit);
+        targetUids = sortedUids.slice(start, end);
+      }
+    }
+
+    if (targetUids.length === 0) {
+      return res.json({ emails: [], total, hasMore: false, nextOffset: safeOffset });
+    }
+
+    const results = await connection.search([['UID', targetUids.join(',')]], fetchOptions);
+    const emails = results.map(parseHeaderRow).sort((a, b) => Number(a.id || 0) - Number(b.id || 0));
+    const nextOffset = loadAll ? total : Math.min(total, safeOffset + targetUids.length);
+    const hasMore = loadAll ? false : nextOffset < total;
+    res.json({ emails, total, hasMore, nextOffset });
+  } catch (err) {
+    res.status(500).json({ error: err.message || 'Failed to fetch inbox' });
+  } finally {
+    if (connection) connection.end();
+  }
+});
+
+app.post('/api/webmail/message', async (req, res) => {
+  const { user, password, host, folder = 'INBOX', uid } = req.body;
+  if (!user || !password || !host || !uid) return res.status(400).json({ error: 'Missing credentials or UID' });
+
+  let connection;
+  try {
+    connection = await imaps.connect(imapConfig(req.body));
+    await connection.openBox(folder);
+    const results = await connection.search([['UID', uid]], { bodies: [''], markSeen: true });
+    if (!results.length) return res.status(404).json({ error: 'Message not found' });
+
+    const rawEmail = results[0].parts.find((p) => p.which === '').body;
+    const parsed = await simpleParser(rawEmail);
+    const hasHtmlBody = typeof parsed.html === 'string' && parsed.html.trim().length > 0;
+    let html = parsed.html || parsed.textAsHtml || parsed.text || '';
+    if (typeof html !== 'string') html = String(html || '');
+
+    const inlineAttachments = (parsed.attachments || []).filter((a) => a?.content && (a?.cid || a?.contentId));
+    if (html && inlineAttachments.length > 0) {
+      for (const attachment of inlineAttachments) {
+        const rawCid = String(attachment.cid || attachment.contentId || '').trim();
+        const cid = rawCid.replace(/^<|>$/g, '');
+        if (!cid) continue;
+        const mime = String(attachment.contentType || 'application/octet-stream');
+        const base64 = Buffer.from(attachment.content).toString('base64');
+        const safeCid = cid.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+        html = html.replace(new RegExp(`cid:${safeCid}`, 'gi'), `data:${mime};base64,${base64}`);
+      }
+    }
+
+    res.json({
+      id: uid,
+      subject: parsed.subject,
+      sender: parsed.from ? parsed.from.text : '',
+      to: parsed.to ? parsed.to.text : '',
+      date: parsed.date,
+      html,
+      isPlainText: !hasHtmlBody,
+      attachments: (parsed.attachments || []).map((a) => ({ filename: a.filename, size: a.size, contentType: a.contentType }))
+    });
+  } catch (err) {
+    res.status(500).json({ error: err.message || 'Failed to fetch message' });
+  } finally {
+    if (connection) connection.end();
+  }
+});
+
+app.post('/api/webmail/send', async (req, res) => {
+  const { user, password, host, port, to, subject, body } = req.body;
+  if (!user || !password || !host || !to) return res.status(400).json({ error: 'Missing arguments' });
+
+  try {
+    const transporter = nodemailer.createTransport({
+      host,
+      port: Number(port || 465),
+      secure: Number(port || 465) === 465,
+      auth: { user, pass: password },
+      tls: { rejectUnauthorized: false }
+    });
+
+    await transporter.sendMail({ from: user, to, subject: subject || 'No Subject', html: body });
+    res.json({ success: true });
+  } catch (err) {
+    res.status(500).json({ error: err.message || 'Failed to send message' });
+  }
+});
+
+app.post('/api/webmail/delete', async (req, res) => {
+  const { user, password, host, folder = 'INBOX', uid } = req.body;
+  if (!user || !password || !host || !uid) return res.status(400).json({ error: 'Missing credentials or UID' });
+
+  let connection;
+  try {
+    connection = await imaps.connect(imapConfig(req.body));
+    await connection.openBox(folder);
+    await connection.addFlags(uid, '\\Deleted');
+    await new Promise((resolve, reject) => connection.imap.expunge((err) => (err ? reject(err) : resolve())));
+    res.json({ success: true, uid: Number(uid) });
+  } catch (err) {
+    res.status(500).json({ error: err.message || 'Failed to delete message' });
+  } finally {
+    if (connection) connection.end();
+  }
+});
+
+app.post('/api/webmail/delete-bulk', async (req, res) => {
+  const { user, password, host, folder = 'INBOX', uids } = req.body;
+  const uidList = Array.isArray(uids) ? uids.map((u) => Number(u)).filter((u) => Number.isFinite(u) && u > 0) : [];
+  if (!user || !password || !host || uidList.length === 0) return res.status(400).json({ error: 'Missing credentials or UIDs' });
+
+  let connection;
+  try {
+    connection = await imaps.connect(imapConfig(req.body));
+    await connection.openBox(folder);
+    await connection.addFlags(uidList, '\\Deleted');
+    await new Promise((resolve, reject) => connection.imap.expunge((err) => (err ? reject(err) : resolve())));
+    res.json({ success: true, deleted: uidList.length, uids: uidList });
+  } catch (err) {
+    res.status(500).json({ error: err.message || 'Failed to delete selected messages' });
+  } finally {
+    if (connection) connection.end();
+  }
+});
+
+app.post('/api/webmail/empty-trash', async (req, res) => {
+  const { user, password, host, folder = 'INBOX.Trash' } = req.body;
+  if (!user || !password || !host) return res.status(400).json({ error: 'Missing credentials' });
+
+  let connection;
+  try {
+    connection = await imaps.connect(imapConfig(req.body));
+    await connection.openBox(folder);
+    const uids = await new Promise((resolve, reject) => {
+      connection.imap.search(['ALL'], (err, results) => {
+        if (err) return reject(err);
+        resolve(Array.isArray(results) ? results : []);
+      });
+    });
+
+    if (!uids.length) return res.json({ success: true, deleted: 0 });
+
+    await connection.addFlags(uids, '\\Deleted');
+    await new Promise((resolve, reject) => connection.imap.expunge((err) => (err ? reject(err) : resolve())));
+    res.json({ success: true, deleted: uids.length });
+  } catch (err) {
+    res.status(500).json({ error: err.message || 'Failed to empty trash' });
+  } finally {
+    if (connection) connection.end();
+  }
+});
+
+app.post('/api/webmail/quota', async (_req, res) => {
+  // Safe default for standalone starter. Can be enhanced for provider-specific quota later.
+  res.json({ supported: false });
+});
+
+app.post('/api/webmail/folder-sizes', async (_req, res) => {
+  // Safe default for standalone starter. Can be enhanced when needed.
+  res.json({ success: true, sizes: {} });
+});
+
+if (process.env.NODE_ENV === 'production') {
+  app.use(express.static(path.join(__dirname, 'dist')));
+  app.get('*', (_req, res) => {
+    res.sendFile(path.join(__dirname, 'dist', 'index.html'));
+  });
+}
+
+const PORT = Number(process.env.PORT || 3001);
+app.listen(PORT, () => {
+  console.log(`Webmail server running on http://localhost:${PORT}`);
+});
--- a/nx-webmail/src/components/Webmail.jsx
+++ b/nx-webmail/src/components/Webmail.jsx
--- a/nx-webmail/src/main.jsx
+++ b/nx-webmail/src/main.jsx
@@ -0,0 +1,7 @@
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import Webmail from './components/Webmail.jsx';
+import './styles/webmail.css';
+import 'remixicon/fonts/remixicon.css';
+
+createRoot(document.getElementById('root')).render(<Webmail />);
--- a/nx-webmail/src/styles/webmail.css
+++ b/nx-webmail/src/styles/webmail.css
--- a/nx-webmail/umbrel-app.yml
+++ b/nx-webmail/umbrel-app.yml
@@ -0,0 +1,24 @@
+manifestVersion: 1
+id: nx-webmail
+name: Webmail
+tagline: Self-hosted IMAP/SMTP webmail client
+icon: logo.svg
+category: utilities
+version: "1.0.0"
+port: 3001
+description: >-
+  Webmail is a lightweight, self-hosted webmail app for connecting to external
+  IMAP and SMTP accounts directly from your Umbrel.
+developer: Weektab
+website: https://git.weektab.org
+submitter: Weektab
+submission: https://git.weektab.org/nexus/umbrel-apps
+repo: https://git.weektab.org/nexus/webmail
+support: https://git.weektab.org/nexus/webmail/issues
+gallery: []
+releaseNotes: >-
+  Initial Umbrel app packaging.
+dependencies: []
+path: ""
+defaultUsername: ""
+defaultPassword: ""
--- a/nx-webmail/vite.config.js
+++ b/nx-webmail/vite.config.js
@@ -0,0 +1,15 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+export default defineConfig({
+  plugins: [react()],
+  server: {
+    port: 5173,
+    proxy: {
+      '/api': 'http://localhost:3001'
+    }
+  },
+  build: {
+    outDir: 'dist'
+  }
+});