From aa2ea611b122ca33048ae02b1a7d07344998a811 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Sat, 28 Mar 2026 19:18:17 +0000 Subject: [PATCH] Logo banner layout rework, Proton Mail provider, ProviderWizard sizing improvements Agent-Logs-Url: https://github.com/christianlouis/InboxConverge/sessions/8dc8f341-02b2-4449-8a88-a2124033c31a Co-authored-by: christianlouis <361235+christianlouis@users.noreply.github.com> --- CHANGELOG.md | 3 +- backend/app/api/v1/endpoints/providers.py | 9 +++++ backend/app/services/mail_processor.py | 20 ++++++++++ docs/TODO.md | 3 +- frontend/public/providers/protonmail.svg | 29 +++++++++++++++ frontend/src/app/accounts/page.tsx | 43 +++++++++++++--------- frontend/src/components/ProviderWizard.tsx | 39 ++++++++++++++------ 7 files changed, 115 insertions(+), 31 deletions(-) create mode 100644 frontend/public/providers/protonmail.svg diff --git a/CHANGELOG.md b/CHANGELOG.md index dd69487..8e89a63 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -32,7 +32,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Added - **Pull Now**: Added a "Pull Now" button (⟳) to each mail account card on the Accounts page. Clicking it immediately queues a Celery `process_mail_account` task for that account via the new `POST /mail-accounts/{id}/pull-now` backend endpoint. The button shows a spinner while the request is in flight and is disabled for inactive accounts. -- **Provider logos**: Provider logos (Gmail, GMX, WEB.DE, Outlook, Yahoo, AOL, T-Online, IONOS, Freenet, Posteo, iCloud) are now displayed next to the account name on the Accounts page. High-quality official SVG logos sourced from Wikimedia Commons and provider websites replace the previous placeholder assets. +- **Provider logos**: Provider logos (Gmail, GMX, WEB.DE, Outlook, Yahoo, AOL, T-Online, IONOS, Freenet, Posteo, iCloud, Proton Mail) are displayed as a full-width banner at the top of each account card. Using `next/image` with `fill` + `object-contain` ensures every logo – from square icons to very wide wordmarks (up to 6:1 aspect ratio) – renders correctly without distortion. +- **Proton Mail**: Added Proton Mail as a provider preset (backend + ProviderWizard). Supports IMAP and POP3 via Proton Mail Bridge (default ports 127.0.0.1:1143 / 127.0.0.1:1144). Domains: `proton.me`, `protonmail.com`, `protonmail.ch`, `pm.me`. ### Changed - **Mailbox Activity view**: The user-facing "Logs" page has been redesigned to a mailbox-centric diff --git a/backend/app/api/v1/endpoints/providers.py b/backend/app/api/v1/endpoints/providers.py index 7a9a72a..1757b87 100644 --- a/backend/app/api/v1/endpoints/providers.py +++ b/backend/app/api/v1/endpoints/providers.py @@ -155,6 +155,15 @@ PROVIDER_PRESETS: List[ProviderPreset] = [ pop3_ssl={"host": "pop.mail.de", "port": 995}, notes="Use your mail.de email credentials.", ), + ProviderPreset( + id="protonmail", + name="Proton Mail", + icon="protonmail", + domains=["proton.me", "protonmail.com", "protonmail.ch", "pm.me"], + imap_ssl={"host": "127.0.0.1", "port": 1143}, + pop3_ssl={"host": "127.0.0.1", "port": 1144}, + notes="Requires Proton Mail Bridge running locally. Use your Bridge password (not your Proton account password). Default Bridge ports: IMAP 127.0.0.1:1143, POP3 127.0.0.1:1144.", + ), ProviderPreset( id="icloud", name="iCloud Mail", diff --git a/backend/app/services/mail_processor.py b/backend/app/services/mail_processor.py index dccca9b..208908f 100644 --- a/backend/app/services/mail_processor.py +++ b/backend/app/services/mail_processor.py @@ -597,6 +597,26 @@ class MailServerAutoDetect: "pop3_ssl": {"host": "pop.mail.de", "port": 995}, "imap_ssl": {"host": "imap.mail.de", "port": 993}, }, + "proton.me": { + "name": "Proton Mail", + "imap_ssl": {"host": "127.0.0.1", "port": 1143}, + "pop3_ssl": {"host": "127.0.0.1", "port": 1144}, + }, + "protonmail.com": { + "name": "Proton Mail", + "imap_ssl": {"host": "127.0.0.1", "port": 1143}, + "pop3_ssl": {"host": "127.0.0.1", "port": 1144}, + }, + "protonmail.ch": { + "name": "Proton Mail", + "imap_ssl": {"host": "127.0.0.1", "port": 1143}, + "pop3_ssl": {"host": "127.0.0.1", "port": 1144}, + }, + "pm.me": { + "name": "Proton Mail", + "imap_ssl": {"host": "127.0.0.1", "port": 1143}, + "pop3_ssl": {"host": "127.0.0.1", "port": 1144}, + }, } @classmethod diff --git a/docs/TODO.md b/docs/TODO.md index f35318c..113b358 100644 --- a/docs/TODO.md +++ b/docs/TODO.md @@ -5,7 +5,8 @@ Comprehensive task breakdown for repository improvements and production readines ## ✅ Recently Completed - [x] **Pull Now**: Added "Pull Now" button on Accounts page that immediately queues a `process_mail_account` Celery task via `POST /mail-accounts/{id}/pull-now`. Button shows spinner while in flight and is disabled for inactive accounts. -- [x] **Provider logos**: Provider SVG logos (Gmail, GMX, WEB.DE, Outlook, Yahoo, AOL, T-Online, IONOS, Freenet, Posteo, iCloud) now displayed on the Accounts page next to each account name. +- [x] **Provider logos rework**: Logos now displayed as full-width banner strips at the top of each account card using `next/image fill + object-contain`. Handles all aspect ratios (1:1 square to 6:1 wordmark) without distortion. Proton Mail added. +- [x] **Proton Mail provider**: Added Proton Mail preset in backend and ProviderWizard frontend. Domains: proton.me, protonmail.com, protonmail.ch, pm.me. Auto-detect and IMAP/POP3 Bridge settings included. - [x] Redesigned user-facing Logs page to mailbox-centric "Mailbox Activity" view: shows last check status per account + only successful pulls, suppressing noise from empty polling cycles. - [x] Added `has_emails` filter to `GET /processing-runs` and `GET /mail-accounts/{id}/processing-runs` API endpoints. - [x] Rename entire project to **InboxConverge**: all user-visible strings, Docker container/image names, DB defaults, monitoring, and docs updated. diff --git a/frontend/public/providers/protonmail.svg b/frontend/public/providers/protonmail.svg new file mode 100644 index 0000000..c5b4fe7 --- /dev/null +++ b/frontend/public/providers/protonmail.svg @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/frontend/src/app/accounts/page.tsx b/frontend/src/app/accounts/page.tsx index de32564..6e6aae5 100644 --- a/frontend/src/app/accounts/page.tsx +++ b/frontend/src/app/accounts/page.tsx @@ -23,20 +23,29 @@ const PROVIDER_ICON_MAP: Record = { 'Posteo': 'posteo', 'mail.de': 'mailde', 'iCloud Mail': 'icloud', + 'Proton Mail': 'protonmail', }; -function ProviderLogo({ providerName }: { providerName?: string | null }) { +/** + * Full-width logo banner rendered at the top of a card. + * Uses next/image fill + object-contain so every logo – regardless of its + * native aspect ratio (1:1 square up to ~6:1 wordmark) – fits correctly + * inside the fixed-height strip without distortion. + */ +function ProviderLogoBanner({ providerName }: { providerName?: string | null }) { const icon = providerName ? PROVIDER_ICON_MAP[providerName] : undefined; if (!icon) return null; return ( - {`${providerName} {/* silently skip missing icons */}} - /> +
+ {`${providerName} +
); } @@ -136,16 +145,16 @@ export default function AccountsPage() { account.is_enabled ? 'border-gray-200' : 'border-gray-200 opacity-60' }`} > + {/* Provider logo banner – full-width strip that accommodates any aspect ratio */} + +
-
- -
-

- {account.name} -

-

{account.email_address}

-
+
+

+ {account.name} +

+

{account.email_address}

{account.is_enabled ? ( diff --git a/frontend/src/components/ProviderWizard.tsx b/frontend/src/components/ProviderWizard.tsx index eaa1305..757780b 100644 --- a/frontend/src/components/ProviderWizard.tsx +++ b/frontend/src/components/ProviderWizard.tsx @@ -1,7 +1,7 @@ 'use client'; import { useState } from 'react'; -import { ChevronRight, Mail, ArrowLeft } from 'lucide-react'; +import { Mail, ArrowLeft } from 'lucide-react'; interface ProviderPreset { id: string; @@ -126,6 +126,15 @@ const PROVIDERS: ProviderPreset[] = [ pop3_ssl: null, notes: 'Posteo supports IMAP only.', }, + { + id: 'protonmail', + name: 'Proton Mail', + logo: '/providers/protonmail.svg', + domains: ['proton.me', 'protonmail.com', 'protonmail.ch', 'pm.me'], + imap_ssl: { host: '127.0.0.1', port: 1143 }, + pop3_ssl: { host: '127.0.0.1', port: 1144 }, + notes: 'Requires Proton Mail Bridge running locally. Use your Bridge password (not your Proton account password). Default Bridge ports: IMAP 127.0.0.1:1143, POP3 127.0.0.1:1144.', + }, ]; export function ProviderWizard({ onSelect, onManual }: ProviderWizardProps) { @@ -172,7 +181,13 @@ export function ProviderWizard({ onSelect, onManual }: ProviderWizardProps) {

- {selectedProvider.name} +
+ {selectedProvider.name} +
{selectedProvider.name}

@@ -240,23 +255,23 @@ export function ProviderWizard({ onSelect, onManual }: ProviderWizardProps) {

Quick Setup — Select Your Email Provider

-
+
{PROVIDERS.map((provider) => ( ))}