200 lines
8.2 KiB
JavaScript
200 lines
8.2 KiB
JavaScript
// Settings view — verification defaults, migration defaults, connection info
|
|
|
|
import { api } from './api.js';
|
|
import { state } from './state.js';
|
|
import { escHtml } from './utils.js';
|
|
|
|
const SETTINGS_KEY = 'migrator_settings';
|
|
|
|
export function loadSettings() {
|
|
try { return JSON.parse(localStorage.getItem(SETTINGS_KEY)) || {}; }
|
|
catch { return {}; }
|
|
}
|
|
|
|
export function saveSettings(settings) {
|
|
localStorage.setItem(SETTINGS_KEY, JSON.stringify(settings));
|
|
}
|
|
|
|
export function renderSettings() {
|
|
const outlet = document.getElementById('router-outlet');
|
|
const s = loadSettings();
|
|
|
|
outlet.innerHTML = `
|
|
<div class="page-header">
|
|
<div>
|
|
<div class="page-title">Settings</div>
|
|
<div class="page-subtitle">Configure verification defaults and migration behavior</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Verification defaults -->
|
|
<div class="settings-section">
|
|
<div class="settings-section-header">
|
|
<div class="settings-section-title">Verification</div>
|
|
<div class="settings-section-sub">Default recipient for test envelopes</div>
|
|
</div>
|
|
<div class="settings-section-body">
|
|
<div class="setting-row">
|
|
<div class="setting-body">
|
|
<div class="setting-label">Test Recipient Name</div>
|
|
<div class="setting-desc">Pre-filled in the Send Test dialog on the Verification screen</div>
|
|
</div>
|
|
<div class="setting-control" style="min-width:240px">
|
|
<input type="text" class="form-input" id="set-recipient-name"
|
|
value="${escHtml(s.testRecipientName || '')}"
|
|
placeholder="e.g. Test User" />
|
|
</div>
|
|
</div>
|
|
<div class="setting-row">
|
|
<div class="setting-body">
|
|
<div class="setting-label">Test Recipient Email</div>
|
|
<div class="setting-desc">Pre-filled in the Send Test dialog</div>
|
|
</div>
|
|
<div class="setting-control" style="min-width:240px">
|
|
<input type="email" class="form-input" id="set-recipient-email"
|
|
value="${escHtml(s.testRecipientEmail || '')}"
|
|
placeholder="e.g. test@example.com" />
|
|
</div>
|
|
</div>
|
|
<div class="setting-row">
|
|
<div class="setting-body">
|
|
<div class="setting-label">Auto-Void Timer (hours)</div>
|
|
<div class="setting-desc">Reminder to void test envelopes after this many hours (display only — no automatic action)</div>
|
|
</div>
|
|
<div class="setting-control">
|
|
<input type="number" class="form-input" id="set-auto-void"
|
|
value="${s.autoVoidHours ?? 24}" min="1" max="168" style="width:80px" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Migration defaults -->
|
|
<div class="settings-section">
|
|
<div class="settings-section-header">
|
|
<div class="settings-section-title">Migration Defaults</div>
|
|
<div class="settings-section-sub">Pre-set options in the migration options modal</div>
|
|
</div>
|
|
<div class="settings-section-body">
|
|
<div class="setting-row">
|
|
<div class="setting-body">
|
|
<div class="setting-label">Overwrite Existing by Default</div>
|
|
<div class="setting-desc">When on, the Overwrite Existing toggle in the migration modal starts enabled</div>
|
|
</div>
|
|
<div class="setting-control">
|
|
<button class="toggle ${s.defaultOverwrite ? 'on' : ''}" id="set-overwrite"
|
|
role="switch" aria-checked="${!!s.defaultOverwrite}"></button>
|
|
</div>
|
|
</div>
|
|
<div class="setting-row">
|
|
<div class="setting-body">
|
|
<div class="setting-label">Include Documents by Default</div>
|
|
<div class="setting-desc">Embed PDFs in the Docusign template payload</div>
|
|
</div>
|
|
<div class="setting-control">
|
|
<button class="toggle ${s.defaultIncludeDocs !== false ? 'on' : ''}" id="set-include-docs"
|
|
role="switch" aria-checked="${s.defaultIncludeDocs !== false}"></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Connection info (read-only) -->
|
|
<div class="settings-section">
|
|
<div class="settings-section-header">
|
|
<div class="settings-section-title">Connections</div>
|
|
<div class="settings-section-sub">Current platform connection status (connect via top bar)</div>
|
|
</div>
|
|
<div class="settings-section-body" id="settings-conn-info">
|
|
<div style="padding:8px 0;font-size:13px;color:var(--text-muted)">Loading…</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Save -->
|
|
<div style="display:flex;gap:8px;align-items:center">
|
|
<button class="btn btn-primary" id="btn-save-settings">Save Settings</button>
|
|
<span id="save-confirm" style="font-size:13px;color:var(--success);display:none">✓ Saved</span>
|
|
</div>
|
|
`;
|
|
|
|
// Wire toggles
|
|
document.querySelectorAll('.toggle').forEach(btn => {
|
|
btn.addEventListener('click', () => {
|
|
btn.classList.toggle('on');
|
|
btn.setAttribute('aria-checked', btn.classList.contains('on'));
|
|
});
|
|
});
|
|
|
|
// Save
|
|
document.getElementById('btn-save-settings')?.addEventListener('click', () => {
|
|
const updated = {
|
|
testRecipientName: document.getElementById('set-recipient-name')?.value.trim() || '',
|
|
testRecipientEmail: document.getElementById('set-recipient-email')?.value.trim() || '',
|
|
autoVoidHours: parseInt(document.getElementById('set-auto-void')?.value) || 24,
|
|
defaultOverwrite: document.getElementById('set-overwrite')?.classList.contains('on') || false,
|
|
defaultIncludeDocs: document.getElementById('set-include-docs')?.classList.contains('on') !== false,
|
|
};
|
|
saveSettings(updated);
|
|
const confirm = document.getElementById('save-confirm');
|
|
if (confirm) {
|
|
confirm.style.display = 'inline';
|
|
setTimeout(() => { confirm.style.display = 'none'; }, 2500);
|
|
}
|
|
});
|
|
|
|
// Load connection info
|
|
_loadConnInfo();
|
|
}
|
|
|
|
async function _loadConnInfo() {
|
|
const connEl = document.getElementById('settings-conn-info');
|
|
if (!connEl) return;
|
|
|
|
try {
|
|
const data = await api.auth.status();
|
|
connEl.innerHTML = `
|
|
<div class="conn-info-row">
|
|
<span class="conn-info-label">Adobe Sign</span>
|
|
<span class="conn-info-value">${data.adobe ? 'Connected' : 'Not connected'}</span>
|
|
<span class="conn-info-status">
|
|
<span class="badge ${data.adobe ? 'badge-green' : 'badge-gray'}">${data.adobe ? '● Connected' : '○ Disconnected'}</span>
|
|
</span>
|
|
</div>
|
|
<div class="conn-info-row">
|
|
<span class="conn-info-label">Docusign</span>
|
|
<span class="conn-info-value">${data.docusign ? 'Connected' : 'Not connected'}</span>
|
|
<span class="conn-info-status">
|
|
<span class="badge ${data.docusign ? 'badge-green' : 'badge-gray'}">${data.docusign ? '● Connected' : '○ Disconnected'}</span>
|
|
</span>
|
|
</div>
|
|
<div class="conn-info-row">
|
|
<span class="conn-info-label">Adobe Auth Mode</span>
|
|
<span class="conn-info-value mono">${escHtml(data.adobe_auth_mode || '—')}</span>
|
|
<span class="conn-info-status"></span>
|
|
</div>
|
|
<div class="conn-info-row">
|
|
<span class="conn-info-label">Docusign Auth Mode</span>
|
|
<span class="conn-info-value mono">${escHtml(data.docusign_auth_mode || '—')}</span>
|
|
<span class="conn-info-status"></span>
|
|
</div>
|
|
<div class="conn-info-row">
|
|
<span class="conn-info-label">Browser Session ID</span>
|
|
<span class="conn-info-value mono">${escHtml(data.session_id || '—')}</span>
|
|
<span class="conn-info-status"></span>
|
|
</div>
|
|
<div class="conn-info-row">
|
|
<span class="conn-info-label">Docusign Account ID</span>
|
|
<span class="conn-info-value mono">${escHtml(data.docusign_account_id || '—')}</span>
|
|
<span class="conn-info-status"></span>
|
|
</div>
|
|
<div class="conn-info-row">
|
|
<span class="conn-info-label">API Environment</span>
|
|
<span class="conn-info-value mono">${escHtml(data.base_url || '—')}</span>
|
|
<span class="conn-info-status"></span>
|
|
</div>
|
|
`;
|
|
} catch (e) {
|
|
connEl.innerHTML = `<div class="callout error"><span class="callout-icon">❌</span>Failed to load connection info: ${escHtml(e.message)}</div>`;
|
|
}
|
|
}
|