hanna/fabrica

feat(web): tabbed settings and multiple emails with a primary

7a9881b · hanna committed on 2026-07-25

Split account settings into Profile / Account / SSH & GPG keys / API tokens
tabs, each its own GET route with a sidebar nav that works without JS. Add
multiple email addresses per user (migration 0006 + user_emails table): add,
remove, and choose a primary (mirrored into users.email), plus a per-user
toggle to publish the primary email on the profile. create_user now seeds the
primary email row in a transaction.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Signed by hannaSSH key fingerprint: SHA256:4g9cWhkAAw8gwqhJUcVbSnGEvdGwklW+1Aa/fMUu59k

assets/base.css +75 −0

crates/model/src/entity.rs +20 −1

crates/model/src/lib.rs +1 −1

crates/store/src/users.rs +158 −3

crates/web/src/icons.rs +4 −0

crates/web/src/lib.rs +13 −3

crates/web/src/pages.rs +232 −38

crates/web/src/repo.rs +10 −0

crates/web/src/tests.rs +95 −12

migrations/postgres/0006_user_emails.sql +18 −0

migrations/sqlite/0006_user_emails.sql +18 −0

   flex: none;
+}
+/* Settings: a left tab rail and the active tab's content. */
+.settings-layout {
+  display: flex;
+  gap: 2rem;
+  align-items: flex-start;
+}
+.settings-nav {
+  flex: none;
+  width: 13rem;
+  position: sticky;
+  top: calc(var(--fb-topbar-h) + 1rem);
+}
+.settings-nav h1 {
+  font-size: 1.4rem;
+  margin-bottom: 0.75rem;
+}
+.settings-nav nav {
+  display: flex;
+  flex-direction: column;
+  gap: 0.15rem;
+}
+.settings-nav nav a {
+  padding: 0.4rem 0.7rem;
+  border-radius: var(--fb-radius);
+  color: var(--fb-fg-muted);
+}
+.settings-nav nav a:hover {
+  background: var(--fb-bg-inset);
+  text-decoration: none;
+}
+.settings-nav nav a[aria-current="page"] {
+  background: var(--fb-bg-inset);
+  color: var(--fb-fg);
+  font-weight: 600;
+}
+.settings-content {
+  flex: 1;
+  min-width: 0;
+}
+.settings-content .listing:first-child {
+  margin-top: 0;
+}
+.email-list {
+  margin-bottom: 1rem;
+}
+.email-visibility {
+  margin: 0.5rem 0 1rem;
+}
+.email-add label {
+  margin-top: 0;
+}
+.email-add-row {
+  display: flex;
+  gap: 0.5rem;
+  align-items: stretch;
+}
+.email-add-row input {
+  flex: 1;
+  min-width: 12rem;
+}
+@media (max-width: 48rem) {
+  .settings-layout {
+    flex-direction: column;
+    gap: 1rem;
+  }
+  .settings-nav {
+    width: 100%;
+    position: static;
+  }
+  .settings-nav nav {
+    flex-direction: row;
+    flex-wrap: wrap;
+  }
+}
 label {
   display: block;
   margin: 0.75rem 0 0.25rem;

+    }
+}
+/// One of a user's email addresses. Exactly one per user is primary; the primary
+/// is mirrored into [`User::email`].
+#[derive(Debug, Clone, PartialEq, Eq)]
+pub struct UserEmail {
+    /// ULID primary key.
+    pub id: String,
+    /// Owning user.
+    pub user_id: String,
+    /// The address as entered.
+    pub email: String,
+    /// Whether this is the user's primary address.
+    pub is_primary: bool,
+    /// Creation time.
+    pub created_at: Timestamp,
+}
 /// A registered account.
 #[derive(Debug, Clone, PartialEq, Eq)]
 pub struct User {
     pub id: String,
     /// The name as the user typed it (case preserved for display).
     pub username: String,
-    /// The primary email address.
+    /// The primary email address (denormalized from [`UserEmail`] for quick
+    /// access and case-insensitive login/uniqueness).
     pub email: String,
+    /// Whether the primary email is shown on the public profile.
+    pub email_public: bool,
     /// Optional human-friendly display name.
     pub display_name: Option<String>,
     /// Optional pronouns, shown on the profile (e.g. `they/them`).

 pub use entity::{
     ApiToken, Comment, Group, Invite, Issue, IssueState, Key, KeyKind, Label, PullRequest, Repo,
-    Timestamp, User, Visibility,
+    Timestamp, User, UserEmail, Visibility,
 };
 pub use name::{MAX_NAME_LEN, NameError, RESERVED_NAMES, validate_name};

     Dashboard,
     Compass,
     MapPin,
+    Mail,
     Globe,
     Download,
     Github,
             Icon::MapPin => {
                 r#"<path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0"/><circle cx="12" cy="10" r="3"/>"#
+            }
+            Icon::Mail => {
+                r#"<rect width="20" height="16" x="2" y="4" rx="2"/><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"/>"#
+            }
             Icon::Globe => {
                 r#"<circle cx="12" cy="12" r="10"/><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"/><path d="M2 12h20"/>"#
+            }

             "/settings",
             get(pages::settings).post(pages::settings_submit),
+        )
+        .route("/settings/account", get(pages::settings_account))
         .route("/settings/username", post(pages::account_username))
-        .route("/settings/email", post(pages::account_email))
+        .route("/settings/emails", post(pages::email_add))
+        .route("/settings/emails/primary", post(pages::email_primary))
+        .route("/settings/emails/delete", post(pages::email_delete))
+        .route("/settings/emails/visibility", post(pages::email_visibility))
         .route("/settings/password", post(pages::account_password))
-        .route("/settings/tokens", post(pages::token_create))
+        .route(
+            "/settings/tokens",
+            get(pages::settings_tokens).post(pages::token_create),
+        )
         .route("/settings/tokens/revoke", post(pages::token_revoke))
-        .route("/settings/keys", post(pages::key_add))
+        .route(
+            "/settings/keys",
+            get(pages::settings_keys).post(pages::key_add),
+        )
         .route("/settings/keys/delete", post(pages::key_delete))
         .route("/settings/avatar", post(avatar::upload))
         .route("/settings/theme", get(pages::set_theme))

 /// The columns of `users` in a fixed order, shared by every `SELECT` so the
 /// row-mapping in [`Store::map_user`] can rely on names.
-pub(crate) const USER_COLUMNS: &str = "id, username, email, display_name, pronouns, bio, \
+pub(crate) const USER_COLUMNS: &str = "id, username, email, email_public, display_name, pronouns, \
-     location, links, avatar_mime, password_hash, \
+     bio, location, links, avatar_mime, password_hash, \
      must_change_password, is_admin, disabled_at, created_at, updated_at";
 /// The editable profile fields, set together by the settings page. Each `None`
             id: new_id(),
             username: new.username,
             email: new.email,
+            email_public: false,
             display_name: new.display_name,
             pronouns: None,
             bio: None,
             updated_at: now,
         };
+        let mut tx = self.pool.begin().await?;
         let sql = "INSERT INTO users \
              (id, username, username_lower, email, email_lower, display_name, \
               password_hash, must_change_password, is_admin, disabled_at, created_at, updated_at) \
             .bind(user.disabled_at)
             .bind(user.created_at)
             .bind(user.updated_at)
-            .execute(&self.pool)
+            .execute(&mut *tx)
             .await
             .map_err(|e| {
                 map_conflict(e, "user", &[("email", "email"), ("username", "username")])
             })?;
+        // Seed the primary email row so `user_emails` holds every address.
+        sqlx::query(
+            "INSERT INTO user_emails (id, user_id, email, email_lower, is_primary, created_at) \
+             VALUES ($1, $2, $3, $4, $5, $6)",
+        )
+        .bind(new_id())
+        .bind(user.id.clone())
+        .bind(user.email.clone())
+        .bind(user.email.to_lowercase())
+        .bind(true)
+        .bind(user.created_at)
+        .execute(&mut *tx)
+        .await
+        .map_err(|e| map_conflict(e, "user", &[("email_lower", "email")]))?;
+        tx.commit().await?;
         Ok(user)
+    }
         Ok(updated > 0)
+    }
+    /// List a user's email addresses, primary first.
+    ///
+    /// # Errors
+    ///
+    /// Returns [`StoreError::Query`] on a database failure.
+    pub async fn emails_by_user(&self, user_id: &str) -> Result<Vec<model::UserEmail>, StoreError> {
+        let rows = sqlx::query(
+            "SELECT id, user_id, email, is_primary, created_at FROM user_emails \
+             WHERE user_id = $1 ORDER BY is_primary DESC, created_at ASC",
+        )
+        .bind(user_id)
+        .fetch_all(&self.pool)
+        .await?;
+        rows.iter()
+            .map(|r| {
+                Ok(model::UserEmail {
+                    id: r.try_get("id")?,
+                    user_id: r.try_get("user_id")?,
+                    email: r.try_get("email")?,
+                    is_primary: self.get_bool(r, "is_primary")?,
+                    created_at: r.try_get("created_at")?,
+                })
+            })
+            .collect::<Result<_, sqlx::Error>>()
+            .map_err(Into::into)
+    }
+    /// Add a secondary email address (case-insensitively unique across all users).
+    ///
+    /// # Errors
+    ///
+    /// * [`StoreError::Conflict`] if the address is already registered.
+    /// * [`StoreError::Query`] for any other database failure.
+    pub async fn add_email(
+        &self,
+        user_id: &str,
+        email: &str,
+    ) -> Result<model::UserEmail, StoreError> {
+        let row = model::UserEmail {
+            id: new_id(),
+            user_id: user_id.to_string(),
+            email: email.to_string(),
+            is_primary: false,
+            created_at: now_ms(),
+        };
+        sqlx::query(
+            "INSERT INTO user_emails (id, user_id, email, email_lower, is_primary, created_at) \
+             VALUES ($1, $2, $3, $4, $5, $6)",
+        )
+        .bind(&row.id)
+        .bind(&row.user_id)
+        .bind(&row.email)
+        .bind(email.to_lowercase())
+        .bind(false)
+        .bind(row.created_at)
+        .execute(&self.pool)
+        .await
+        .map_err(|e| map_conflict(e, "email", &[("email_lower", "email")]))?;
+        Ok(row)
+    }
+    /// Remove one of a user's non-primary email addresses.
+    ///
+    /// # Errors
+    ///
+    /// Returns [`StoreError::Query`] on a database failure.
+    pub async fn delete_email(&self, user_id: &str, email_id: &str) -> Result<bool, StoreError> {
+        let deleted = sqlx::query(
+            "DELETE FROM user_emails WHERE id = $1 AND user_id = $2 AND is_primary = $3",
+        )
+        .bind(email_id)
+        .bind(user_id)
+        .bind(false)
+        .execute(&self.pool)
+        .await?
+        .rows_affected();
+        Ok(deleted > 0)
+    }
+    /// Make one of a user's addresses primary, mirroring it into `users.email`.
+    ///
+    /// # Errors
+    ///
+    /// Returns [`StoreError::Query`] on a database failure.
+    pub async fn set_primary_email(
+        &self,
+        user_id: &str,
+        email_id: &str,
+    ) -> Result<bool, StoreError> {
+        // Confirm the address belongs to the user and capture its value.
+        let row = sqlx::query("SELECT email FROM user_emails WHERE id = $1 AND user_id = $2")
+            .bind(email_id)
+            .bind(user_id)
+            .fetch_optional(&self.pool)
+            .await?;
+        let Some(row) = row else {
+            return Ok(false);
+        };
+        let email: String = row.try_get("email")?;
+        let mut tx = self.pool.begin().await?;
+        sqlx::query("UPDATE user_emails SET is_primary = $1 WHERE user_id = $2")
+            .bind(false)
+            .bind(user_id)
+            .execute(&mut *tx)
+            .await?;
+        sqlx::query("UPDATE user_emails SET is_primary = $1 WHERE id = $2")
+            .bind(true)
+            .bind(email_id)
+            .execute(&mut *tx)
+            .await?;
+        sqlx::query("UPDATE users SET email = $1, email_lower = $2, updated_at = $3 WHERE id = $4")
+            .bind(&email)
+            .bind(email.to_lowercase())
+            .bind(now_ms())
+            .bind(user_id)
+            .execute(&mut *tx)
+            .await?;
+        tx.commit().await?;
+        Ok(true)
+    }
+    /// Set whether the user's primary email is shown on their public profile.
+    ///
+    /// # Errors
+    ///
+    /// Returns [`StoreError::Query`] on a database failure.
+    pub async fn set_email_public(&self, user_id: &str, public: bool) -> Result<(), StoreError> {
+        sqlx::query("UPDATE users SET email_public = $1, updated_at = $2 WHERE id = $3")
+            .bind(public)
+            .bind(now_ms())
+            .bind(user_id)
+            .execute(&self.pool)
+            .await?;
+        Ok(())
+    }
     /// Set (or clear) a user's password hash.
     ///
     /// Passing `Some(hash)` sets the credential and clears the
             id: row.try_get("id")?,
             username: row.try_get("username")?,
             email: row.try_get("email")?,
+            email_public: self.get_bool(row, "email_public")?,
             display_name: row.try_get("display_name")?,
             pronouns: row.try_get("pronouns")?,
             bio: row.try_get("bio")?,

     Ok(invite)
+}
-/// `GET /settings` — the viewer's profile editor.
+/// `GET /settings` — the Profile tab.
 pub async fn settings(
     State(state): State<AppState>,
     RequireUser(user): RequireUser,
     jar: CookieJar,
     uri: Uri,
 ) -> AppResult<Response> {
-    let tokens = state.store.tokens_by_user(&user.id).await?;
+    let (jar, chrome) = build_chrome(&state, jar, Some(user.clone()), uri.path().to_string());
+    let body = settings_shell("profile", profile_tab(&user, &chrome.csrf));
+    Ok((jar, page(&chrome, "Settings", body)).into_response())
+}
+/// `GET /settings/account` — the Account tab (username, emails, password).
+pub async fn settings_account(
+    State(state): State<AppState>,
+    RequireUser(user): RequireUser,
+    jar: CookieJar,
+    uri: Uri,
+) -> AppResult<Response> {
+    let emails = state.store.emails_by_user(&user.id).await?;
+    let (jar, chrome) = build_chrome(&state, jar, Some(user.clone()), uri.path().to_string());
+    let body = settings_shell("account", account_tab(&user, &chrome.csrf, &emails));
+    Ok((jar, page(&chrome, "Settings", body)).into_response())
+}
+/// `GET /settings/keys` — the SSH and GPG keys tab.
+pub async fn settings_keys(
+    State(state): State<AppState>,
+    RequireUser(user): RequireUser,
+    jar: CookieJar,
+    uri: Uri,
+) -> AppResult<Response> {
     let keys = state.store.keys_by_user(&user.id).await?;
     let (jar, chrome) = build_chrome(&state, jar, Some(user.clone()), uri.path().to_string());
-    let body = settings_body(&user, &chrome.csrf, &tokens, &keys, None);
+    let body = settings_shell("keys", keys_section(&chrome.csrf, &keys));
+    Ok((jar, page(&chrome, "Settings", body)).into_response())
+}
+/// `GET /settings/tokens` — the API tokens tab.
+pub async fn settings_tokens(
+    State(state): State<AppState>,
+    RequireUser(user): RequireUser,
+    jar: CookieJar,
+    uri: Uri,
+) -> AppResult<Response> {
+    let tokens = state.store.tokens_by_user(&user.id).await?;
+    let (jar, chrome) = build_chrome(&state, jar, Some(user.clone()), uri.path().to_string());
+    let body = settings_shell("tokens", tokens_section(&chrome.csrf, &tokens, None));
     Ok((jar, page(&chrome, "Settings", body)).into_response())
+}
     (!t.is_empty()).then(|| t.to_string())
+}
-/// A single-field account form (username or email) with a CSRF token.
+/// The change-username form.
 #[derive(Debug, Deserialize)]
 pub struct AccountFieldForm {
     /// The new username.
     #[serde(default)]
     username: String,
-    /// The new email.
-    #[serde(default)]
-    email: String,
     /// CSRF token.
     #[serde(rename = "_csrf")]
     csrf: String,
         .update_username(&user.id, form.username.trim())
         .await
+    {
-        Ok(_) => Redirect::to("/settings").into_response(),
+        Ok(_) => Redirect::to("/settings/account").into_response(),
         Err(store::StoreError::Conflict { .. }) => {
             AppError::BadRequest("That username is already taken.".to_string()).into_response()
+        }
+    }
+}
-/// `POST /settings/email` — change the viewer's email.
+/// The add-email form.
-pub async fn account_email(
+#[derive(Debug, Deserialize)]
+pub struct EmailAddForm {
+    /// The new address.
+    #[serde(default)]
+    email: String,
+    /// CSRF token.
+    #[serde(rename = "_csrf")]
+    csrf: String,
+}
+/// `POST /settings/emails` — add a secondary email address.
+pub async fn email_add(
     State(state): State<AppState>,
     RequireUser(user): RequireUser,
     jar: CookieJar,
     headers: HeaderMap,
-    Form(form): Form<AccountFieldForm>,
+    Form(form): Form<EmailAddForm>,
 ) -> Response {
     if verify_csrf(&jar, &headers, Some(&form.csrf)).is_err() {
         return AppError::Forbidden.into_response();
     if !email.contains('@') {
         return AppError::BadRequest("Enter a valid email address.".to_string()).into_response();
+    }
-    match state.store.update_email(&user.id, email).await {
+    match state.store.add_email(&user.id, email).await {
-        Ok(_) => Redirect::to("/settings").into_response(),
+        Ok(_) => Redirect::to("/settings/account").into_response(),
         Err(store::StoreError::Conflict { .. }) => {
             AppError::BadRequest("That email is already in use.".to_string()).into_response()
+        }
+    }
+}
+/// An email-id form (set-primary or delete).
+#[derive(Debug, Deserialize)]
+pub struct EmailIdForm {
+    /// The `user_emails` row id.
+    #[serde(default)]
+    id: String,
+    /// CSRF token.
+    #[serde(rename = "_csrf")]
+    csrf: String,
+}
+/// `POST /settings/emails/primary` — make one of the viewer's emails primary.
+pub async fn email_primary(
+    State(state): State<AppState>,
+    RequireUser(user): RequireUser,
+    jar: CookieJar,
+    headers: HeaderMap,
+    Form(form): Form<EmailIdForm>,
+) -> Response {
+    if verify_csrf(&jar, &headers, Some(&form.csrf)).is_err() {
+        return AppError::Forbidden.into_response();
+    }
+    let _ = state.store.set_primary_email(&user.id, &form.id).await;
+    Redirect::to("/settings/account").into_response()
+}
+/// `POST /settings/emails/delete` — remove one of the viewer's secondary emails.
+pub async fn email_delete(
+    State(state): State<AppState>,
+    RequireUser(user): RequireUser,
+    jar: CookieJar,
+    headers: HeaderMap,
+    Form(form): Form<EmailIdForm>,
+) -> Response {
+    if verify_csrf(&jar, &headers, Some(&form.csrf)).is_err() {
+        return AppError::Forbidden.into_response();
+    }
+    let _ = state.store.delete_email(&user.id, &form.id).await;
+    Redirect::to("/settings/account").into_response()
+}
+/// The email-visibility toggle form.
+#[derive(Debug, Deserialize)]
+pub struct EmailVisibilityForm {
+    /// Present (any value) when the checkbox is ticked.
+    #[serde(default)]
+    public: Option<String>,
+    /// CSRF token.
+    #[serde(rename = "_csrf")]
+    csrf: String,
+}
+/// `POST /settings/emails/visibility` — show/hide the primary email on the profile.
+pub async fn email_visibility(
+    State(state): State<AppState>,
+    RequireUser(user): RequireUser,
+    jar: CookieJar,
+    headers: HeaderMap,
+    Form(form): Form<EmailVisibilityForm>,
+) -> Response {
+    if verify_csrf(&jar, &headers, Some(&form.csrf)).is_err() {
+        return AppError::Forbidden.into_response();
+    }
+    let _ = state
+        .store
+        .set_email_public(&user.id, form.public.is_some())
+        .await;
+    Redirect::to("/settings/account").into_response()
+}
 /// The change-password form.
 #[derive(Debug, Deserialize)]
 pub struct PasswordForm {
+    }
     .await;
     match result {
-        Ok(jar) => (jar, Redirect::to("/settings")).into_response(),
+        Ok(jar) => (jar, Redirect::to("/settings/account")).into_response(),
         Err(err) => err.into_response(),
+    }
+}
                 .tokens_by_user(&user.id)
                 .await
                 .unwrap_or_default();
-            let keys = state.store.keys_by_user(&user.id).await.unwrap_or_default();
+            let (jar, chrome) = build_chrome(
-            let (jar, chrome) =
+                &state,
-                build_chrome(&state, jar, Some(user.clone()), "/settings".to_string());
+                jar,
-            let body = settings_body(&user, &chrome.csrf, &tokens, &keys, Some(&jwt));
+                Some(user.clone()),
+                "/settings/tokens".to_string(),
+            );
+            let body = settings_shell("tokens", tokens_section(&chrome.csrf, &tokens, Some(&jwt)));
             (jar, page(&chrome, "Settings", body)).into_response()
+        }
         Err(err) => err.into_response(),
     if owned {
         let _ = state.store.revoke_token(&form.id).await;
+    }
-    Redirect::to("/settings").into_response()
+    Redirect::to("/settings/tokens").into_response()
+}
 /// The add-key form.
         })
         .await
+    {
-        Ok(_) => Redirect::to("/settings").into_response(),
+        Ok(_) => Redirect::to("/settings/keys").into_response(),
         Err(store::StoreError::Conflict { .. }) => {
             AppError::BadRequest("That key is already registered.".to_string()).into_response()
+        }
     if owned {
         let _ = state.store.delete_key(&form.id).await;
+    }
-    Redirect::to("/settings").into_response()
+    Redirect::to("/settings/keys").into_response()
+}
 /// Render the settings page: avatar, profile, account credentials, and tokens.
-fn settings_body(
+/// The settings page shell: a left tab nav and the active tab's content. Each tab
-    user: &User,
+/// is its own route, so navigation works without JavaScript.
-    csrf: &str,
+#[allow(clippy::needless_pass_by_value)] // `content` is an owned fragment embedded once.
-    tokens: &[model::ApiToken],
+fn settings_shell(active: &str, content: Markup) -> Markup {
-    keys: &[model::Key],
+    let tab = |href: &str, key: &str, label: &str| {
-    new_token: Option<&str>,
+        let current = active == key;
-) -> Markup {
+        html! {
+            a href=(href) aria-current=[current.then_some("page")] { (label) }
+        }
+    };
+    html! {
+        div class="settings-layout" {
+            aside class="settings-nav" {
+                h1 { "Settings" }
+                nav {
+                    (tab("/settings", "profile", "Profile"))
+                    (tab("/settings/account", "account", "Account"))
+                    (tab("/settings/keys", "keys", "SSH and GPG keys"))
+                    (tab("/settings/tokens", "tokens", "API tokens"))
+                }
+            }
+            div class="settings-content" { (content) }
+        }
+    }
+}
+/// The Profile tab: avatar and profile fields.
+fn profile_tab(user: &User, csrf: &str) -> Markup {
     let val = |v: &Option<String>| v.clone().unwrap_or_default();
     html! {
-        h1 { "Settings" }
         section class="listing" {
             h2 { "Avatar" }
             div class="card avatar-settings" {
+                }
+            }
+        }
+    }
+}
+/// The Account tab: username, email(s), and password.
+fn account_tab(user: &User, csrf: &str, emails: &[model::UserEmail]) -> Markup {
+    html! {
         section class="listing" {
-            h2 { "Account" }
+            h2 { "Username" }
             div class="card" {
                 form method="post" action="/settings/username" {
                     input type="hidden" name="_csrf" value=(csrf);
                     input type="text" id="username" name="username" value=(user.username) required;
                     button class="btn" type="submit" { "Change username" }
+                }
-                form method="post" action="/settings/email" {
-                    input type="hidden" name="_csrf" value=(csrf);
-                    label for="email" { "Email" }
-                    input type="email" id="email" name="email" value=(user.email) required;
-                    button class="btn" type="submit" { "Change email" }
-                }
                 p class="muted field-hint" {
                     "Administrator: " (if user.is_admin { "yes" } else { "no" })
+                }
+            }
+        }
+        (emails_section(user, csrf, emails))
         section class="listing" {
             h2 { "Password" }
             div class="card" {
+                }
+            }
+        }
-        (keys_section(csrf, keys))
+    }
-        (tokens_section(csrf, tokens, new_token))
+}
+/// The emails sub-section of the Account tab: the list of addresses (primary
+/// marked, with set-primary / remove actions), the profile visibility toggle,
+/// and the add-email form.
+fn emails_section(user: &User, csrf: &str, emails: &[model::UserEmail]) -> Markup {
+    html! {
+        section class="listing" {
+            h2 { "Emails" }
+            div class="card" {
+                ul class="entry-list email-list" {
+                    @for e in emails {
+                        li class="entry-row" {
+                            div class="entry-row-body" {
+                                span class="entry-row-title" {
+                                    (e.email)
+                                    @if e.is_primary { " " span class="badge" { "primary" } }
+                                }
+                            }
+                            div class="entry-row-actions" {
+                                @if !e.is_primary {
+                                    form method="post" action="/settings/emails/primary" {
+                                        input type="hidden" name="_csrf" value=(csrf);
+                                        input type="hidden" name="id" value=(e.id);
+                                        button class="btn" type="submit" { "Make primary" }
+                                    }
+                                    form method="post" action="/settings/emails/delete" {
+                                        input type="hidden" name="_csrf" value=(csrf);
+                                        input type="hidden" name="id" value=(e.id);
+                                        button class="btn btn-danger" type="submit" { "Remove" }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+                form class="email-visibility" method="post" action="/settings/emails/visibility" {
+                    input type="hidden" name="_csrf" value=(csrf);
+                    label class="checkbox" {
+                        input type="checkbox" name="public" value="1" checked[user.email_public]
+                              onchange="this.form.submit()";
+                        " Show my primary email on my profile"
+                    }
+                    noscript { button class="btn" type="submit" { "Save" } }
+                }
+                form class="email-add" method="post" action="/settings/emails" {
+                    input type="hidden" name="_csrf" value=(csrf);
+                    label for="new_email" { "Add email address" }
+                    div class="email-add-row" {
+                        input type="email" id="new_email" name="email" required
+                              placeholder="you@example.com";
+                        button class="btn btn-primary inline-btn" type="submit" { "Add" }
+                    }
+                }
+            }
+        }
+    }
+}

     if let Some(location) = non_empty(owner.location.as_ref()) {
         out.push(html! { li { (icon(Icon::MapPin)) span { (location) } } });
+    }
+    // The primary email, only when the owner has chosen to publish it.
+    if owner.email_public {
+        if let Some(email) = non_empty(Some(&owner.email)) {
+            out.push(html! {
+                li {
+                    a href=(format!("mailto:{email}")) { (icon(Icon::Mail)) span { (email) } }
+                }
+            });
+        }
+    }
     for link in &owner.links {
         let href = normalize_url(link);
         let shown = href

+}
 #[tokio::test]
-async fn settings_page_shows_account_and_tokens() {
+async fn settings_tabs_render() {
     let (_state, app) = app().await;
     let cookie = login(&app).await;
-    let req = Request::builder()
+    let get_tab = |uri: &'static str, cookie: String| {
-        .uri("/settings")
+        let app = app.clone();
-        .header(header::COOKIE, cookie)
+        async move {
-        .body(Body::empty())
+            let req = Request::builder()
+                .uri(uri)
+                .header(header::COOKIE, cookie)
+                .body(Body::empty())
+                .unwrap();
+            let res = app.oneshot(req).await.unwrap();
+            assert_eq!(res.status(), StatusCode::OK, "{uri}");
+            body_string(res).await
+        }
+    };
+    // The Profile tab shows the tab nav.
+    let profile = get_tab("/settings", cookie.clone()).await;
+    assert!(profile.contains("Save profile"), "profile tab");
+    assert!(profile.contains("/settings/account"), "tab nav present");
+    // The Account tab shows username, emails, and password.
+    let account = get_tab("/settings/account", cookie.clone()).await;
+    assert!(account.contains("Change username"), "username");
+    assert!(account.contains("Emails"), "emails section");
+    assert!(account.contains("Change password"), "password");
+    // The tokens tab.
+    let tokens = get_tab("/settings/tokens", cookie).await;
+    assert!(tokens.contains("API tokens"), "tokens tab");
+}
+#[tokio::test]
+async fn emails_add_set_primary_and_publish_on_profile() {
+    let (state, app) = app().await;
+    let cookie = login(&app).await;
+    let token = cookie
+        .split("fabrica_csrf=")
+        .nth(1)
+        .and_then(|s| s.split(';').next())
+        .unwrap()
+        .to_string();
+    let ada = state.store.user_by_username("ada").await.unwrap().unwrap();
+    // Add a second address.
+    let post = |uri: &'static str, body: String, cookie: String| {
+        let app = app.clone();
+        async move {
+            let req = Request::builder()
+                .method("POST")
+                .uri(uri)
+                .header(header::CONTENT_TYPE, "application/x-www-form-urlencoded")
+                .header(header::COOKIE, cookie)
+                .body(Body::from(body))
+                .unwrap();
+            app.oneshot(req).await.unwrap()
+        }
+    };
+    let res = post(
+        "/settings/emails",
+        format!("email=second@example.com&_csrf={token}"),
+        cookie.clone(),
+    )
+    .await;
+    assert_eq!(res.status(), StatusCode::SEE_OTHER);
+    let emails = state.store.emails_by_user(&ada.id).await.unwrap();
+    assert_eq!(emails.len(), 2);
+    let second = emails
+        .iter()
+        .find(|e| e.email == "second@example.com")
         .unwrap();
-    let res = app.oneshot(req).await.unwrap();
+    assert!(!second.is_primary);
-    assert_eq!(res.status(), StatusCode::OK);
+    let second_id = second.id.clone();
+    // Make it primary; users.email mirrors it.
+    let res = post(
+        "/settings/emails/primary",
+        format!("id={second_id}&_csrf={token}"),
+        cookie.clone(),
+    )
+    .await;
+    assert_eq!(res.status(), StatusCode::SEE_OTHER);
+    let ada = state.store.user_by_username("ada").await.unwrap().unwrap();
+    assert_eq!(ada.email, "second@example.com");
+    // Publish it and confirm it appears on the profile.
+    let res = post(
+        "/settings/emails/visibility",
+        format!("public=1&_csrf={token}"),
+        cookie,
+    )
+    .await;
+    assert_eq!(res.status(), StatusCode::SEE_OTHER);
+    let res = app.oneshot(get("/ada")).await.unwrap();
     let html = body_string(res).await;
-    assert!(html.contains("Change username"), "account section");
+    assert!(
-    assert!(html.contains("Change password"), "password section");
+        html.contains("second@example.com"),
-    assert!(html.contains("API tokens"), "tokens section");
+        "email shown on profile"
+    );
+}
 /// An app with self-registration enabled (and no seeded user).
     // The settings page shows the keys section.
     let req = Request::builder()
-        .uri("/settings")
+        .uri("/settings/keys")
         .header(header::COOKIE, cookie.clone())
         .body(Body::empty())
         .unwrap();
     // It renders on the settings page.
     let req = Request::builder()
-        .uri("/settings")
+        .uri("/settings/keys")
         .header(header::COOKIE, cookie.clone())
         .body(Body::empty())
         .unwrap();

+-- Multiple email addresses per user, one marked primary, plus a per-user toggle
+-- to show the primary email on the public profile.
+ALTER TABLE users ADD COLUMN email_public BOOLEAN NOT NULL DEFAULT FALSE;
+CREATE TABLE user_emails (
+    id          TEXT PRIMARY KEY,
+    user_id     TEXT NOT NULL REFERENCES users(id) ON DELETE CASCADE,
+    email       TEXT NOT NULL,
+    email_lower TEXT NOT NULL,
+    is_primary  BOOLEAN NOT NULL DEFAULT FALSE,
+    created_at  BIGINT NOT NULL
+);
+CREATE UNIQUE INDEX idx_user_emails_lower ON user_emails (email_lower);
+CREATE INDEX idx_user_emails_user ON user_emails (user_id);
+-- Seed each existing user's current email as their primary address.
+INSERT INTO user_emails (id, user_id, email, email_lower, is_primary, created_at)
+SELECT id, id, email, email_lower, TRUE, created_at FROM users;