thatcher 1.0.7 → 1.0.34

package/src/ui/idle-logout.js

@@ -1,156 +0,0 @@
-export function getIdleLogoutScript(config = {}) {
-  const idleTimeoutMs = config.idle_timeout_ms || 1800000;
-  const idleWarningMs = config.idle_warning_ms || 1500000;
-  const warningConfig = config.idle_warning_dialog_config || {};
-
-  return `
-(function() {
-  let idleTimer = null;
-  let warningTimer = null;
-  let isWarningShown = false;
-
-  const CONFIG = {
-    idleTimeoutMs: ${idleTimeoutMs},
-    idleWarningMs: ${idleWarningMs},
-    warningTitle: '${warningConfig.title || 'Session Expiring'}',
-    warningMessage: '${warningConfig.message || 'Your session will expire due to inactivity'}',
-    stayButtonLabel: '${warningConfig.buttons?.[0]?.label || 'Stay Logged In'}',
-    logoutButtonLabel: '${warningConfig.buttons?.[1]?.label || 'Logout'}'
-  };
-
-  function resetIdleTimer() {
-    clearTimeout(idleTimer);
-    clearTimeout(warningTimer);
-    isWarningShown = false;
-    removeWarningDialog();
-
-    warningTimer = setTimeout(() => {
-      showWarningDialog();
-    }, CONFIG.idleWarningMs);
-
-    idleTimer = setTimeout(() => {
-      logout();
-    }, CONFIG.idleTimeoutMs);
-  }
-
-  function showWarningDialog() {
-    if (isWarningShown) return;
-    isWarningShown = true;
-
-    const dialog = document.createElement('div');
-    dialog.id = 'idle-warning-dialog';
-    dialog.style.cssText = \`
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      background: rgba(0,0,0,0.5);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      z-index: 10000;
-    \`;
-
-    const content = document.createElement('div');
-    content.style.cssText = \`
-      background: var(--color-surface, #fff);
-      padding: 2rem;
-      border-radius: 8px;
-      box-shadow: 0 4px 16px rgba(0,0,0,0.2);
-      max-width: 400px;
-      text-align: center;
-      color: var(--color-text, #111);
-    \`;
-
-    const title = document.createElement('h3');
-    title.textContent = CONFIG.warningTitle;
-    title.style.marginBottom = '1rem';
-    title.style.color = 'var(--color-text, #333)';
-
-    const message = document.createElement('p');
-    message.textContent = CONFIG.warningMessage;
-    message.style.marginBottom = '1.5rem';
-    message.style.color = 'var(--color-text-muted, #666)';
-
-    const buttonContainer = document.createElement('div');
-    buttonContainer.style.cssText = 'display: flex; gap: 1rem;';
-
-    const stayBtn = document.createElement('button');
-    stayBtn.textContent = CONFIG.stayButtonLabel;
-    stayBtn.style.cssText = \`
-      flex: 1;
-      padding: 0.75rem;
-      background: #007bff;
-      color: white;
-      border: none;
-      border-radius: 4px;
-      cursor: pointer;
-      font-weight: 600;
-    \`;
-    stayBtn.onclick = () => {
-      removeWarningDialog();
-      resetIdleTimer();
-    };
-
-    const logoutBtn = document.createElement('button');
-    logoutBtn.textContent = CONFIG.logoutButtonLabel;
-    logoutBtn.style.cssText = \`
-      flex: 1;
-      padding: 0.75rem;
-      background: #6c757d;
-      color: white;
-      border: none;
-      border-radius: 4px;
-      cursor: pointer;
-      font-weight: 600;
-    \`;
-    logoutBtn.onclick = logout;
-
-    buttonContainer.appendChild(stayBtn);
-    buttonContainer.appendChild(logoutBtn);
-
-    content.appendChild(title);
-    content.appendChild(message);
-    content.appendChild(buttonContainer);
-    dialog.appendChild(content);
-    document.body.appendChild(dialog);
-  }
-
-  function removeWarningDialog() {
-    const dialog = document.getElementById('idle-warning-dialog');
-    if (dialog) dialog.remove();
-  }
-
-  function logout() {
-    fetch('/api/auth/logout', { method: 'POST' })
-      .then(() => {
-        window.location.href = '/login';
-      })
-      .catch(() => {
-        window.location.href = '/login';
-      });
-  }
-
-  const events = ['mousedown', 'keydown', 'scroll', 'touchstart', 'click'];
-
-  events.forEach(event => {
-    document.addEventListener(event, resetIdleTimer, true);
-  });
-
-  resetIdleTimer();
-
-  window.idleLogout = { resetIdleTimer, logout };
-})();
-`;
-}
-
-export function injectIdleLogoutScript(html, config = {}) {
-  const script = getIdleLogoutScript(config);
-  const tag = `<script>${script}</script>`;
-
-  if (html.includes('</body>')) {
-    return html.replace('</body>', `${tag}</body>`);
-  }
-  return html + tag;
-}

package/src/ui/letter-dialogs.js

@@ -1,37 +0,0 @@
-export function engagementLetterDialog(engagementId) {
-  return `<div id="eng-letter-dialog" class="dialog-overlay" style="display:none" data-dialog-close-overlay="true" onkeydown="if(event.key==='Escape')this.style.display='none'" role="dialog" aria-modal="true" aria-labelledby="eng-letter-dialog-title" aria-hidden="true">
-    <div class="dialog-panel" style="max-width:640px">
-      <div class="dialog-header"><span class="dialog-title" id="eng-letter-dialog-title">Engagement Letter</span><button class="dialog-close" data-dialog-close="eng-letter-dialog" aria-label="Close dialog">&times;</button></div>
-      <div class="dialog-body">
-        <div class="modal-form-group"><label for="eld-template">Template</label><select id="eld-template" class="select select-bordered w-full" onchange="eldLoadTemplate()"><option value="">Select template...</option></select></div>
-        <div class="modal-form-group"><label for="eld-date">Letter Date</label><input type="date"  id="eld-date" class="input input-bordered w-full"/></div>
-        <div class="modal-form-group"><label for="eld-recipient">Recipient Name</label><input id="eld-recipient" class="input input-bordered w-full" placeholder="Client contact name"/></div>
-        <div class="modal-form-group"><label for="eld-content">Content</label><textarea id="eld-content" class="textarea textarea-bordered w-full" rows="8" placeholder="Letter content..."></textarea></div>
-      </div>
-      <div class="dialog-footer"><button class="btn btn-ghost btn-sm" data-dialog-close="eng-letter-dialog">Cancel</button><button class="btn btn-outline btn-sm" data-action="eldPreview">Preview</button><button class="btn btn-primary btn-sm" data-action="eldSave">Save Letter</button></div>
-    </div></div>
-  <script>
-  (function(){fetch('/api/letter_template').then(function(r){return r.json()}).then(function(d){var sel=document.getElementById('eld-template');(d.data||d||[]).forEach(function(t){var o=document.createElement('option');o.value=t.id;o.textContent=t.name||t.id;sel.appendChild(o)})}).catch(function(){})})();
-  window.openEngLetter=function(){document.getElementById('eng-letter-dialog').style.display='flex'};
-  window.eldLoadTemplate=function(){var id=document.getElementById('eld-template').value;if(!id)return;fetch('/api/letter_template/'+id).then(function(r){return r.json()}).then(function(d){var t=d.data||d;document.getElementById('eld-content').value=t.content||t.body||''}).catch(function(){})};
-  window.eldPreview=function(){var content=document.getElementById('eld-content').value;var w=window.open('','_blank','width=800,height=600');w.document.write('<html><body style="padding:2rem;font-family:serif;max-width:700px;margin:auto"><h2>Engagement Letter</h2><p>Date: '+(document.getElementById('eld-date').value||'-')+'</p><p>To: '+(document.getElementById('eld-recipient').value||'-')+'</p><hr/><div style="white-space:pre-wrap">'+content+'</div></body></html>');w.document.close()};
-  window.eldSave=async function(){var body={engagement_id:'${engagementId}',template_id:document.getElementById('eld-template').value||null,date:document.getElementById('eld-date').value||null,recipient:document.getElementById('eld-recipient').value||null,content:document.getElementById('eld-content').value};try{var r=await fetch('/api/letter',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(body)});if(r.ok){showToast('Letter saved','success');document.getElementById('eng-letter-dialog').style.display='none';location.reload()}else showToast('Failed','error')}catch(e){showToast('Error','error')}};
-  </script>`;
-}
-
-export function engagementLetterTemplateUpload() {
-  return `<div id="letter-tpl-upload" class="dialog-overlay" style="display:none" data-dialog-close-overlay="true" onkeydown="if(event.key==='Escape')this.style.display='none'" role="dialog" aria-modal="true" aria-labelledby="letter-tpl-upload-title" aria-hidden="true">
-    <div class="dialog-panel">
-      <div class="dialog-header"><span class="dialog-title" id="letter-tpl-upload-title">Upload Letter Template</span><button class="dialog-close" data-dialog-close="letter-tpl-upload" aria-label="Close dialog">&times;</button></div>
-      <div class="dialog-body">
-        <div class="modal-form-group"><label for="ltu-name">Template Name</label><input id="ltu-name" class="input input-bordered w-full" placeholder="Template name"/></div>
-        <div class="modal-form-group"><label for="ltu-file">Template File</label><input type="file"  id="ltu-file" class="file-input file-input-bordered w-full" accept=".docx,.doc,.html,.txt"/></div>
-        <div class="modal-form-group"><label for="ltu-content">Or paste content</label><textarea id="ltu-content" class="textarea textarea-bordered w-full" rows="5" placeholder="Template content..."></textarea></div>
-      </div>
-      <div class="dialog-footer"><button class="btn btn-ghost btn-sm" data-dialog-close="letter-tpl-upload">Cancel</button><button class="btn btn-primary btn-sm" data-action="ltuSave">Save Template</button></div>
-    </div></div>
-  <script>
-  window.openLetterTemplateUpload=function(){document.getElementById('letter-tpl-upload').style.display='flex'};
-  window.ltuSave=async function(){var name=document.getElementById('ltu-name').value.trim();if(!name){showToast('Name required','error');return}var file=document.getElementById('ltu-file').files[0];var content=document.getElementById('ltu-content').value;if(file){var fd=new FormData();fd.append('file',file);fd.append('name',name);try{var r=await fetch('/api/letter_template/upload',{method:'POST',body:fd});if(r.ok){showToast('Template uploaded','success');document.getElementById('letter-tpl-upload').style.display='none';location.reload()}else showToast('Upload failed','error')}catch(e){showToast('Error','error')}}else if(content){try{var r=await fetch('/api/letter_template',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({name:name,content:content})});if(r.ok){showToast('Template saved','success');document.getElementById('letter-tpl-upload').style.display='none';location.reload()}else showToast('Failed','error')}catch(e){showToast('Error','error')}}else{showToast('Provide file or content','error')}};
-  </script>`;
-}

package/src/ui/password-reset-page.js

@@ -1,146 +0,0 @@
-export function renderPasswordResetPage(params = {}) {
-  const token = params.token || '';
-  const isConfirm = !!token;
-  const title = isConfirm ? 'Set New Password' : 'Forgot Password';
-  const subtitle = isConfirm ? 'Enter your new password below' : 'Enter your email to receive a reset link';
-  const btnLabel = isConfirm ? 'Update Password' : 'Send Reset Link';
-
-  return `<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>${title} | Moonlanding</title>
-  <style>
-    *{margin:0;padding:0;box-sizing:border-box}
-    :root{--bg:#f1f5f9;--surface:#fff;--border:#e2e8f0;--text:#0f172a;--text-muted:#64748b;--primary:#04141f;--accent:#2563eb;--danger:#b91c1c;--danger-bg:#fee2e2;--danger-border:#fca5a5;--success-bg:#dcfce7;--success:#15803d;--success-border:#86efac;--info-bg:#dbeafe;--info:#1d4ed8;--info-border:#93c5fd}
-    @media(prefers-color-scheme:dark){:root{--bg:#0f172a;--surface:#1a1a1a;--border:#334155;--text:#f1f5f9;--text-muted:#94a3b8;--primary:#1e3a5f}}
-    body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background:var(--bg);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;color:var(--text)}
-    .wrap{width:100%;max-width:400px}
-    .logo{text-align:center;margin-bottom:32px}
-    .logo-mark{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;background:var(--primary);border-radius:14px;margin-bottom:14px;box-shadow:0 4px 12px rgba(4,20,31,0.25)}
-    .logo-name{font-size:1.35rem;font-weight:800;color:var(--text);letter-spacing:0.5px;display:block;margin-bottom:4px}
-    .logo-sub{color:var(--text-muted);font-size:0.875rem}
-    .card{background:var(--surface);border-radius:10px;box-shadow:0 4px 24px rgba(0,0,0,0.09);padding:32px;border:1px solid var(--border)}
-    .field{margin-bottom:18px}
-    label{display:block;font-size:0.8125rem;font-weight:600;color:var(--text);margin-bottom:6px}
-    input{width:100%;padding:10px 13px;border:1.5px solid var(--border);border-radius:8px;font-size:0.9rem;outline:none;transition:border-color 0.15s,box-shadow 0.15s;background:var(--surface);color:var(--text);min-height:44px}
-    input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,0.12)}
-    input::placeholder{color:var(--text-muted)}
-    .submit-btn{width:100%;padding:12px;background:var(--primary);color:#fff;border:none;border-radius:8px;font-size:0.9375rem;font-weight:600;cursor:pointer;transition:all 0.15s;min-height:46px;margin-top:4px}
-    .submit-btn:hover:not(:disabled){background:#0a2535}
-    .submit-btn:disabled{opacity:0.65;cursor:not-allowed}
-    .submit-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
-    .alert{padding:11px 14px;border-radius:8px;margin-bottom:18px;font-size:0.875rem;border:1px solid;line-height:1.4}
-    .alert-error{background:var(--danger-bg);color:var(--danger);border-color:var(--danger-border)}
-    .alert-success{background:var(--success-bg);color:var(--success);border-color:var(--success-border)}
-    .alert-info{background:var(--info-bg);color:var(--info);border-color:var(--info-border)}
-    .back{text-align:center;margin-top:18px;font-size:0.875rem;color:var(--text-muted)}
-    .back a{color:var(--accent);text-decoration:none;font-weight:500}
-    .back a:hover{text-decoration:underline}
-    @media(prefers-color-scheme:dark){
-      .card{background:#1a1a1a;border-color:#334155;box-shadow:0 4px 24px rgba(0,0,0,0.4)}
-      input{background:#1a1a1a;border-color:#334155;color:#f1f5f9}
-      .submit-btn{background:#1e3a5f}
-      .submit-btn:hover:not(:disabled){background:#1e293b}
-    }
-  </style>
-</head>
-<body>
-  <div class="wrap">
-    <div class="logo">
-      <div class="logo-mark">
-        <svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" aria-hidden="true"><circle cx="12" cy="12" r="3"/><path d="M12 1v6m0 6v6M4.22 4.22l4.24 4.24m4.24 4.24l4.24 4.24M1 12h6m6 0h6M4.22 19.78l4.24-4.24m4.24-4.24l4.24-4.24"/></svg>
-      </div>
-      <span class="logo-name">MOONLANDING</span>
-      <div class="logo-sub">${subtitle}</div>
-    </div>
-    <div class="card">
-      <div id="alertContainer" role="alert" aria-live="assertive"></div>
-      <form id="resetForm" aria-label="${title}" novalidate>
-        ${!isConfirm ? `
-          <div class="field">
-            <label for="email">Email address</label>
-            <input type="email" name="email" id="email" placeholder="you@example.com" required autocomplete="email" autofocus>
-          </div>
-          <button type="submit" id="submitBtn" class="submit-btn">${btnLabel}</button>
-        ` : `
-          <input type="hidden" name="token" value="${token}">
-          <div class="field">
-            <label for="password">New password</label>
-            <input type="password" name="password" id="password" placeholder="At least 8 characters" required minlength="8" autocomplete="new-password" autofocus>
-          </div>
-          <div class="field">
-            <label for="confirm">Confirm new password</label>
-            <input type="password" name="confirm" id="confirm" placeholder="Same password again" required minlength="8" autocomplete="new-password">
-          </div>
-          <button type="submit" id="submitBtn" class="submit-btn">${btnLabel}</button>
-        `}
-      </form>
-      <div class="back"><a href="/login">Back to sign in</a></div>
-    </div>
-  </div>
-  <script src="/ui/event-delegation.js"></script>
-  <script>
-    var form = document.getElementById('resetForm');
-    var submitBtn = document.getElementById('submitBtn');
-    var alertContainer = document.getElementById('alertContainer');
-    var isConfirm = ${isConfirm};
-
-    function showAlert(message, type) {
-      alertContainer.innerHTML = '<div class="alert alert-' + (type || 'error') + '">' + message + '</div>';
-    }
-
-    if (isConfirm && !form.token.value) {
-      showAlert('Invalid or expired reset link. Please request a new one.', 'error');
-      submitBtn.disabled = true;
-    }
-
-    form.addEventListener('submit', async function(e) {
-      e.preventDefault();
-      alertContainer.innerHTML = '';
-      var formData = new FormData(form);
-      var data = Object.fromEntries(formData);
-
-      if (isConfirm && data.password !== data.confirm) {
-        showAlert('Passwords do not match.', 'error');
-        return;
-      }
-
-      var origText = submitBtn.textContent;
-      submitBtn.textContent = isConfirm ? 'Updating\u2026' : 'Sending\u2026';
-      submitBtn.disabled = true;
-
-      try {
-        var body = isConfirm ? { token: data.token, password: data.password } : { email: data.email };
-        var res = await fetch('/api/auth/password-reset', {
-          method: isConfirm ? 'PUT' : 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify(body)
-        });
-        var result = await res.json().catch(function() { return {}; });
-        if (res.ok) {
-          if (isConfirm) {
-            showAlert('Password updated. <a href="/login" style="color:var(--success);font-weight:600;text-decoration:underline">Sign in now</a>', 'success');
-            form.style.display = 'none';
-          } else {
-            form.reset();
-            showAlert('If an account exists with that email, a reset link has been sent.', 'info');
-            submitBtn.textContent = origText;
-            submitBtn.disabled = false;
-          }
-        } else {
-          showAlert(result.error || 'An error occurred. Please try again.', 'error');
-          submitBtn.textContent = origText;
-          submitBtn.disabled = false;
-        }
-      } catch(err) {
-        showAlert('Network error. Please try again.', 'error');
-        submitBtn.textContent = origText;
-        submitBtn.disabled = false;
-      }
-    });
-  </script>
-</body>
-</html>`;
-}

package/src/ui/perf-renderer.js

@@ -1,71 +0,0 @@
-import { memoize } from '@/lib/render-cache.js'
-import { measure } from '@/lib/perf-monitor.js'
-import { virtualScrollScript, lazyLoadImages, deferOffscreen } from '@/ui/virtual-scroll.js'
-import { eventDelegation, perfBudget, createSkeleton } from '@/ui/perf-helpers.js'
-
-export function optimizedListRender(items, renderFn, options = {}) {
-  const { chunkSize = 100, containerId = 'list-container', enableVirtual = true } = options
-  return measure('list-render', () => {
-    if (!items || items.length === 0) return createSkeleton('list', 3)
-    if (items.length <= chunkSize) return items.map(renderFn).join('')
-    const visible = items.slice(0, chunkSize)
-    const deferred = items.slice(chunkSize)
-    return visible.map(renderFn).join('') +
-      (enableVirtual && deferred.length > 0
-        ? `<div class="defer-load" data-deferred="${deferred.length}"></div>`
-        : deferred.map(renderFn).join(''))
-  })
-}
-
-export function withPerformanceMonitoring(renderFn, name) {
-  return function(...args) {
-    return measure(name, () => renderFn(...args))
-  }
-}
-
-export function withMemoization(renderFn) {
-  return memoize(renderFn)
-}
-
-export function optimizedTableScripts(tableId, options = {}) {
-  const { enableVirtual = false, enableDefer = true, rowHeight = 48, perfBudgetMs = 200 } = options
-  const scripts = []
-  if (enableVirtual) scripts.push(virtualScrollScript(tableId, rowHeight))
-  if (enableDefer) scripts.push(deferOffscreen('.defer-load'))
-  scripts.push(perfBudget(`${tableId}-render`, perfBudgetMs))
-  scripts.push(lazyLoadImages())
-  return scripts.filter(Boolean)
-}
-
-export function batchOperations(operations, batchSize = 10) {
-  const batches = []
-  for (let i = 0; i < operations.length; i += batchSize) {
-    batches.push(operations.slice(i, i + batchSize))
-  }
-  return batches.map((batch, idx) => {
-    if (idx === 0) return batch
-    return { deferred: true, operations: batch }
-  })
-}
-
-export function progressiveLoad(content, priority = 'high') {
-  if (priority === 'high') return content
-  return `<div class="defer-load" data-content="${escapeAttr(content)}"></div>`
-}
-
-function escapeAttr(str) {
-  return String(str).replace(/"/g, '&quot;').replace(/'/g, '&#39;')
-}
-
-export const perfConfig = {
-  tableChunkSize: 100,
-  cardChunkSize: 50,
-  virtualScrollThreshold: 200,
-  deferLoadThreshold: 100,
-  perfBudgets: {
-    'list-render': 100,
-    'table-render': 150,
-    'card-render': 80,
-    'page-render': 500
-  }
-}