giorgio/read.markets
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ui: collapsible settings sections + welcome-email + larger auth inputs

Browse source 
Settings page tidy-up driven by user feedback that it had grown too busy:

  - Each section (Import, Invite, Email digests, Cloud sync) is now a
    native <details>/<summary> accordion. Import stays open by default
    because /settings#import is the deep-link target from the dashboard
    CTA; the others collapse so the page lands quiet.
  - Manage subscription is a right-aligned gear-icon button instead of
    a rectangular text button — the descriptive copy moves into the
    tooltip. Frees up the Tier row of visual weight.

Auth + modal inputs were too small (verify code box, portfolio restore
PIN): the auth-card selector now covers text inputs as well, and a new
.modal-input class standardises 16px / 12px-padding fields used in the
cloud-sync enable modal and the portfolio restore prompt.

The verify page no longer carries the "Email me the digest" checkbox —
it was misleading on repeat logins (server-side it only applied on
first sign-up but rendered every time). Default-opt-in lives in the
User row at creation; per-user changes happen on /settings. First
successful verify now triggers a one-shot welcome email explaining the
digest cadence and pointing at /settings for opt-out; SMTP failure is
logged but does not block the login.

Tests rewritten to cover the new welcome-email path:
  - first login sends exactly one welcome email
  - returning user gets none
  - SMTP failure does not break the redirect
  - regression guard: returning user who opted out stays opted out

Also lands the paddle merchant-summary doc that was written earlier
during the Paddle → Polar → Stripe onboarding pivot.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Giorgio Gilestro 2026-05-26 22:32:59 +02:00
parent a07fd144ea
commit 00211fec02
8 changed files with 553 additions and 124 deletions
Download patch file Download diff file Expand all files Collapse all files

124
app/services/email_service.py
View file

@ -200,6 +200,130 @@ async def send_otp(to: str, code: str, ttl_minutes: int) -> None:
await send_email(to, subject, text, html_body=html)
# ---------------------------------------------------------------------------
# Welcome email — sent once on first successful login.
# ---------------------------------------------------------------------------
_WELCOME_HTML_TEMPLATE = """\
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<title>Welcome to {brand}</title>
<style>
@media (prefers-color-scheme: dark) {{
body {{ background:{D_bg} !important; }}
.card {{ background:{D_surface} !important; border-color:{D_border} !important; }}
.h1 {{ color:{D_text} !important; }}
.muted {{ color:{D_muted} !important; }}
.lead {{ color:{D_text} !important; }}
.divider {{ border-color:{D_border} !important; }}
a {{ color:{D_accent} !important; }}
}}
@media (max-width: 540px) {{
.card {{ padding:24px 18px !important; }}
}}
</style>
</head>
<body style="margin:0; padding:24px 12px; background:{L_bg}; font-family:{FONT_MONO}; color:{L_text}; -webkit-font-smoothing:antialiased;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" align="center" width="100%" style="max-width:520px; margin:0 auto; border-collapse:separate;">
<tr><td class="card" style="background:{L_surface}; border:1px solid {L_border}; padding:32px 28px;">
<div class="muted" style="font-size:11px; letter-spacing:0.32em; color:{L_muted}; text-transform:uppercase;">
&#9648;&nbsp;{brand_upper}
</div>
<div style="height:22px; line-height:22px; font-size:0;">&nbsp;</div>
<div class="h1" style="font-size:17px; font-weight:normal; color:{L_text}; letter-spacing:0.02em;">
Welcome to {brand}.
</div>
<div style="height:14px; line-height:14px; font-size:0;">&nbsp;</div>
<div class="lead muted" style="font-size:13px; color:{L_muted}; line-height:1.65;">
You&rsquo;re signed in. The dashboard is at
<a href="{app_url}" style="color:{L_accent}; text-decoration:none;">{app_url_short}</a> &mdash;
a rolling news feed, cross-asset indicator panels, and a written
strategic read of the session, all updated through the day.
</div>
<div style="height:20px; line-height:20px; font-size:0;">&nbsp;</div>
<div class="divider" style="border-top:1px solid {L_border};"></div>
<div style="height:18px; line-height:18px; font-size:0;">&nbsp;</div>
<div class="h1" style="font-size:14px; font-weight:normal; color:{L_text};">
About the email digest
</div>
<div style="height:10px; line-height:10px; font-size:0;">&nbsp;</div>
<div class="lead muted" style="font-size:13px; color:{L_muted}; line-height:1.65;">
We send one Sunday digest to every account &mdash; the week behind +
the week ahead. Paid subscribers also get a short daily digest
(Mon&ndash;Sat), each a ~600-word read of the session.
You&rsquo;re opted in by default; you can switch the digest off
at any time on the
<a href="{settings_url}" style="color:{L_accent}; text-decoration:none;">Settings page</a>,
or use the one-click unsubscribe link in every digest email.
</div>
<div style="height:20px; line-height:20px; font-size:0;">&nbsp;</div>
<div class="divider" style="border-top:1px solid {L_border};"></div>
<div style="height:14px; line-height:14px; font-size:0;">&nbsp;</div>
<div class="muted" style="font-size:10.5px; color:{L_dim}; letter-spacing:0.06em;">
Sent automatically by {brand} &middot; do not reply
</div>
</td></tr>
</table>
</body>
</html>
"""
_WELCOME_TEXT_TEMPLATE = """\
{brand_upper} — welcome
You're signed in. The dashboard is at {app_url}: a rolling news feed,
cross-asset indicator panels, and a written strategic read of the
session, all updated through the day.
About the email digest
----------------------
We send one Sunday digest to every account (the week behind + the
week ahead). Paid subscribers also get a short daily digest (Mon-Sat),
each a ~600-word read of the session.
You're opted in by default; switch it off any time at {settings_url},
or use the one-click unsubscribe link in every digest email.
—
Sent automatically by {brand} · do not reply
"""
def render_welcome_email() -> tuple[str, str, str]:
"""Returns (subject, text_body, html_body) for the post-signup welcome.
Single-shot email, sent the first time a user successfully verifies
an OTP. Explains the digest (which is opt-in by default) and how to
turn it off — replaces the old verify-page checkbox which appeared
on every login and was misleading."""
subject = f"Welcome to {branding.BRAND_NAME}"
fmt = dict(
brand=branding.BRAND_NAME,
brand_upper=branding.BRAND_NAME.upper(),
app_url=branding.APP_URL,
app_url_short=branding.APP_URL.replace("https://", "").replace("http://", ""),
settings_url=f"{branding.APP_URL}/settings",
FONT_MONO=branding.FONT_MONO,
**{f"L_{k.replace('-', '_')}": v for k, v in branding.LIGHT.items()},
**{f"D_{k.replace('-', '_')}": v for k, v in branding.DARK.items()},
)
text = _WELCOME_TEXT_TEMPLATE.format(**fmt)
html = _WELCOME_HTML_TEMPLATE.format(**fmt)
return subject, text, html
async def send_welcome_email(to: str) -> None:
subject, text, html = render_welcome_email()
await send_email(to, subject, text, html_body=html)
# ---------------------------------------------------------------------------
# Digest email rendering
# ---------------------------------------------------------------------------