${_EMAIL_SETTINGS_ICON}Email Settings
${_emailSettingsAccountSelectHtml()}
Could not load settings.
`;
return;
}
page.querySelector('.email-settings-body').innerHTML = _emailCleanupSettingsHtml() + _emailSettingsFormHtml(cfg) + _emailWritingStyleHtml(writingStyle);
page.querySelector('#email-settings-account-select')?.addEventListener('change', async (ev) => {
state._libAccountId = ev.currentTarget.value || null;
_publishActiveAccount();
_renderAccountsStrip();
_resetEmailListForFreshLoad();
_loadEmails({ useCache: true });
_loadFolders({ resetMissing: true }).catch(() => {});
page.querySelector('.email-unsubscribe-inline-panel')?.remove();
const body = page.querySelector('.email-settings-body');
if (body) body.innerHTML = _emailSettingsLoadingHtml();
try {
const [nextCfg, nextStyle] = await Promise.all([
_fetchEmailSettingsConfig(),
_fetchEmailWritingStyle().catch(() => ''),
]);
if (body) body.innerHTML = _emailCleanupSettingsHtml() + _emailSettingsFormHtml(nextCfg) + _emailWritingStyleHtml(nextStyle);
_bindEmailSettingsPageControls(page);
} catch (_) {
if (body) body.innerHTML = `Could not load settings.
`;
}
});
_bindEmailSettingsPageControls(page);
}
function _bindEmailSettingsPageControls(page) {
page.querySelector('.email-settings-clean-btn')?.addEventListener('click', (ev) => {
_openUnsubscribeReviewModal(ev.currentTarget);
});
const enabledToggle = page.querySelector('#email-auto-reply-enabled');
const syncEnabledState = () => {
const section = page.querySelector('.email-settings-auto-reply-section');
const stateLabel = page.querySelector('.email-settings-enabled-state');
const enabled = !!enabledToggle?.checked;
section?.classList.toggle('is-disabled', !enabled);
section?.classList.toggle('is-enabled', enabled);
if (stateLabel) stateLabel.textContent = enabled ? 'Enabled' : 'Disabled';
};
const saveAutoReplySettings = async ({ quiet = false } = {}) => {
const saveBtn = page.querySelector('.email-settings-save');
const status = page.querySelector('.email-settings-status');
if (saveBtn && !quiet) saveBtn.disabled = true;
if (status) status.textContent = quiet ? 'Saving…' : 'Saving…';
const payload = {
email_auto_reply: !!page.querySelector('#email-auto-reply-enabled')?.checked,
email_auto_reply_start: page.querySelector('#email-auto-reply-start')?.value || '',
email_auto_reply_end: page.querySelector('#email-auto-reply-end')?.value || '',
email_auto_reply_subject: page.querySelector('#email-auto-reply-subject')?.value || '',
email_auto_reply_message: page.querySelector('#email-auto-reply-message')?.value || '',
email_auto_reply_cooldown: page.querySelector('#email-auto-reply-cooldown')?.value || 'period',
email_auto_reply_scope: 'account',
email_auto_reply_account_id: state._libAccountId || '',
email_auto_reply_exclude_automated: !!page.querySelector('#email-auto-reply-exclude')?.checked,
email_auto_reply_pause_notifications: !!page.querySelector('#email-auto-reply-pause')?.checked,
};
try {
const res = await fetch(emailApiUrl('/api/email/config', {
account_id: state._libAccountId || undefined,
}), {
method: 'PUT',
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
body: JSON.stringify(payload),
});
if (!res.ok) throw new Error(`HTTP ${res.status}`);
if (status) status.textContent = 'Saved';
if (!quiet) showToast?.('Email settings saved');
_refreshUnreadBadge().catch(() => {});
setTimeout(() => { if (status) status.textContent = ''; }, quiet ? 900 : 1400);
return true;
} catch (err) {
if (status) status.textContent = 'Save failed';
showToast?.('Failed to save email settings');
return false;
} finally {
if (saveBtn) saveBtn.disabled = false;
}
};
enabledToggle?.addEventListener('change', () => {
syncEnabledState();
saveAutoReplySettings({ quiet: true });
});
syncEnabledState();
page.querySelector('.email-settings-save')?.addEventListener('click', async () => {
await saveAutoReplySettings();
});
page.querySelector('.email-style-settings-save')?.addEventListener('click', async () => {
const saveBtn = page.querySelector('.email-style-settings-save');
const status = page.querySelector('.email-style-settings-status');
saveBtn.disabled = true;
if (status) status.textContent = 'Saving…';
try {
const res = await fetch(emailApiUrl('/api/email/style', {
account_id: state._libAccountId || undefined,
}), {
method: 'PUT',
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
body: JSON.stringify({ style: page.querySelector('#email-writing-style-text')?.value || '' }),
});
if (!res.ok) throw new Error(`HTTP ${res.status}`);
if (status) status.textContent = 'Saved';
showToast?.('Email writing style saved');
setTimeout(() => { if (status) status.textContent = ''; }, 1400);
} catch (err) {
if (status) status.textContent = 'Save failed';
showToast?.('Failed to save email writing style');
} finally {
saveBtn.disabled = false;
}
});
page.querySelector('.email-style-settings-extract')?.addEventListener('click', async () => {
const extractBtn = page.querySelector('.email-style-settings-extract');
const saveBtn = page.querySelector('.email-style-settings-save');
const status = page.querySelector('.email-style-settings-status');
const styleEl = page.querySelector('#email-writing-style-text');
extractBtn.disabled = true;
if (saveBtn) saveBtn.disabled = true;
let wp = null;
if (status) {
status.innerHTML = '';
try {
wp = spinnerModule.createWhirlpool(14);
wp.element.style.cssText = 'display:inline-block;vertical-align:-3px;margin-right:6px;';
status.appendChild(wp.element);
status.appendChild(document.createTextNode('Analyzing sent emails…'));
} catch (_) {
status.textContent = 'Analyzing sent emails…';
}
}
try {
const res = await fetch(emailApiUrl('/api/email/extract-style', {
account_id: state._libAccountId || undefined,
}), {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
body: JSON.stringify({ sample_count: 15 }),
});
const data = await res.json().catch(() => ({}));
if (!res.ok || !data.success || !data.style) throw new Error(data.error || `HTTP ${res.status}`);
if (styleEl) styleEl.value = data.style;
if (status) status.textContent = 'Extracted';
showToast?.('Email writing style extracted');
setTimeout(() => { if (status) status.textContent = ''; }, 1800);
} catch (err) {
if (status) status.textContent = err?.message || 'Extract failed';
showToast?.('Failed to extract email writing style');
} finally {
if (wp && wp.destroy) { try { wp.destroy(); } catch (_) {} }
extractBtn.disabled = false;
if (saveBtn) saveBtn.disabled = false;
}
});
}
function _hideEmailSettingsPage() {
const modal = document.getElementById('email-lib-modal');
const page = document.getElementById('email-lib-settings-page');
const btn = document.getElementById('email-lib-settings-btn');
const headerBackBtn = document.getElementById('email-settings-header-back');
modal?.classList.remove('email-settings-mode');
if (page) page.hidden = true;
if (headerBackBtn) headerBackBtn.style.display = 'none';
btn?.classList.remove('active');
btn?.setAttribute('aria-expanded', 'false');
}
function _isEmailTypingTarget(t) {
return !!(t && (
t.tagName === 'INPUT' ||
t.tagName === 'TEXTAREA' ||
t.tagName === 'SELECT' ||
t.isContentEditable
));
}
function _selectEmailReaderContents(reader) {
if (!reader || !reader.isConnected) return false;
const hiddenModal = reader.closest('.modal.hidden');
if (hiddenModal) return false;
const range = document.createRange();
range.selectNodeContents(reader);
const sel = window.getSelection();
sel?.removeAllRanges();
sel?.addRange(range);
return true;
}
function _markEmailReaderActive(reader) {
if (!reader) return;
_activeEmailReaderForSelectAll = reader;
if (reader.dataset.selectAllWired === '1') return;
reader.dataset.selectAllWired = '1';
reader.addEventListener('pointerdown', () => { _activeEmailReaderForSelectAll = reader; }, true);
reader.addEventListener('focusin', () => { _activeEmailReaderForSelectAll = reader; }, true);
}
function _emailReaderLoadErrorHtml(message) {
return `
${name && detail !== name ? `
${_esc(name)}
` : ''}
${_esc(detail)}
Scanning recent ${_esc(state._libFolder || 'INBOX')} headers…
`;
document.body.appendChild(modal);
}
const close = () => modal.remove();
if (!inlineMode) modal.addEventListener('click', (e) => { if (e.target === modal) close(); });
const statusEl = modal.querySelector('.email-unsub-status');
const listEl = modal.querySelector('.email-unsub-list');
const finishScanStatus = _setUnsubStatusBusy(statusEl, `Scanning recent ${state._libFolder || 'INBOX'} headers…`);
try {
const res = await fetch(emailApiUrl('/api/email/unsubscribe/scan', {
folder: state._libFolder || 'INBOX',
limit: 30,
max_scan: 180,
account_id: state._libAccountId || undefined,
}), { credentials: 'same-origin' });
const data = await res.json().catch(() => ({}));
if (!data.success) {
finishScanStatus?.(data.error || 'Failed to scan email headers');
return;
}
const candidates = _dedupeUnsubscribeCandidatesForDisplay(data.candidates || []);
const rawTotal = Number(data.raw_total || candidates.length || 0);
finishScanStatus?.(candidates.length
? `Found ${candidates.length} unsubscribe target${candidates.length === 1 ? '' : 's'} from ${data.scanned || 0} recent emails${rawTotal > candidates.length ? `, collapsed from ${rawTotal} matching emails` : ''}. Review before sending unsubscribe.`
: `No unsubscribe candidates found in ${data.scanned || 0} recent emails.`);
modal.querySelector('.email-unsub-actions').style.display = candidates.some(c => c.can_execute) ? 'flex' : 'none';
listEl.style.display = candidates.length ? 'flex' : 'none';
listEl.innerHTML = candidates.map((c, idx) => {
const method = c.recommended_method || null;
const reasons = (c.reasons || []).map(r => `