tacilytics 2.1.0 → 2.2.0

package/public/app.js

@@ -14,6 +14,7 @@
     }
   } catch (e) { /* corrupt value → keep both visible */ }
   var lastStats = null;
+  function closeModal(ov, opt) { return window.TaciModal.close(ov, opt); } // one close path for all modals (account.js)
   // dashboard segmentation filters (whitelist mirrors the server's FILTER_COLS + goal)
   var FILTER_LABELS = { country: 'Country', source: 'Source', page: 'Page', browser: 'Browser', os: 'OS', device: 'Device', lang: 'Language', medium: 'Medium', campaign: 'Campaign', platform: 'Platform', version: 'App version', goal: 'Goal' };
 
@@ -34,7 +35,16 @@
   // chart palette comes from CSS custom properties (single source of truth for the theme)
   var CSSV = getComputedStyle(document.documentElement);
   function cv(name, fb) { return (CSSV.getPropertyValue(name) || '').trim() || fb; }
-  var COL = { v: cv('--chart-visitors', '#5b8def'), p: cv('--chart-pageviews', '#8b93a3'), red: cv('--red', '#f87171'), dim: cv('--text-dim', '#8b93a3'), line: cv('--line-strong', '#323946') };
+  var COL = {};
+  // chart colours follow the theme: re-read the CSS variables whenever it changes
+  function readColors() {
+    CSSV = getComputedStyle(document.documentElement);
+    COL.v = cv('--chart-visitors', '#5b8def'); COL.p = cv('--chart-pageviews', '#8b93a3'); COL.red = cv('--red', '#f87171');
+    COL.dim = cv('--text-dim', '#8b93a3'); COL.line = cv('--line-strong', '#323946'); COL.bg = cv('--bg', '#071114');
+    COL.grid = document.documentElement.getAttribute('data-theme') === 'light' ? 'rgba(10,40,38,.08)' : 'rgba(255,255,255,.05)';
+  }
+  readColors();
+  new MutationObserver(function () { readColors(); if (lastStats && lastStats.series) drawChart(lastStats.series); }).observe(document.documentElement, { attributes: true, attributeFilter: ['data-theme'] });
   // Escape any value that originates from visitor beacons before it touches innerHTML.
   function esc(s) { return String(s == null ? '' : s).replace(/[&<>"']/g, function (c) { return { '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c]; }); }
 
@@ -43,7 +53,8 @@
     opts.headers = Object.assign({ 'Content-Type': 'application/json', 'x-session-token': TOKEN }, opts.headers || {});
     return fetch(path, opts).then(function (r) {
       if (r.status === 401) { if (!SHARE) showLogin(); throw new Error('auth'); }
-      return r.json().catch(function () { return {}; });
+      // same rule as account.js: JSON errors come back as {error}, anything that is not JSON throws (Tyto)
+      return window.TaciReadJson(r);
     });
   }
 
@@ -56,10 +67,13 @@
     var r = parseInt(h.slice(0, 2), 16), g = parseInt(h.slice(2, 4), 16), b = parseInt(h.slice(4, 6), 16);
     return Math.max(r, g, b) < 90; // only near-black / deep navy marks; saturated reds stay
   }
+  // lookup tables keyed by visitor data (source, country, platform …): own keys only, so a source
+  // called 'constructor' or '__proto__' stays plain text instead of hitting Object.prototype
+  function own(o, k) { return Object.prototype.hasOwnProperty.call(o, k) ? o[k] : undefined; }
   function ico(id, cls) { return '<svg class="ico ' + (cls || '') + '" aria-hidden="true"><use href="' + SPRITE + '#' + id + '"></use></svg>'; }
   function brand(name, fallbackUi) {
     if (!name) return ico(fallbackUi || 'i-other', 'ui');
-    var c = BRAND_COLORS[name];
+    var c = own(BRAND_COLORS, name);
     if (name === 'samsung') c = '#6f8dff'; // Samsung navy is unreadable on dark — same hue, lighter
     if (c && isDark(c)) c = '#e7f3f1'; // black logos (Apple, X, GitHub …) would vanish on the dark UI
     return '<svg class="ico brand" aria-hidden="true"' + (c ? ' style="color:' + c + '"' : '') + '><use href="' + SPRITE + '#b-' + name + '"></use></svg>';
@@ -88,7 +102,7 @@
   var NAMES = { DE: 'Germany', AT: 'Austria', CH: 'Switzerland', GB: 'United Kingdom', US: 'United States', FR: 'France', NL: 'Netherlands', ES: 'Spain', IT: 'Italy', SE: 'Sweden', NO: 'Norway', DK: 'Denmark', FI: 'Finland', PL: 'Poland', CZ: 'Czechia', BE: 'Belgium', IE: 'Ireland', PT: 'Portugal', CA: 'Canada', AU: 'Australia', BR: 'Brazil', IN: 'India', JP: 'Japan', CN: 'China', RU: 'Russia', TR: 'Turkey', MX: 'Mexico', HU: 'Hungary', RO: 'Romania', GR: 'Greece', UA: 'Ukraine', HR: 'Croatia', NZ: 'New Zealand', SG: 'Singapore', KR: 'South Korea', IL: 'Israel', AE: 'UAE', ZA: 'South Africa' };
 
   // ── login (the form itself lives in account.js: passphrase, accounts, TOTP, passkeys) ──
-  function showLogin() { clearInterval(window.__rt); $('login').classList.remove('hide'); $('app').classList.add('hide'); if (window.TaciAccount) window.TaciAccount.prepareLogin(); }
+  function showLogin() { clearInterval(window.__rt); [].forEach.call(document.querySelectorAll('.modal-overlay:not(#login):not(.hide)'), function (o) { closeModal(o, { force: true }); }); $('login').classList.remove('hide'); $('app').classList.add('hide'); var v = $('appVersion'); if (v) v.textContent = ''; if (window.TaciAccount) window.TaciAccount.prepareLogin(); }
   function hideLogin() { $('login').classList.add('hide'); $('app').classList.remove('hide'); }
   function signedIn(token) { TOKEN = token; localStorage.setItem('nyx_token', TOKEN); $('loginErr').textContent = ''; boot(); }
   $('logoutBtn').onclick = function () {
@@ -107,15 +121,48 @@
       if (!sites.length) { sel.innerHTML = '<option>no sites yet</option>'; return; }
       if (!state.site || !sites.some(function (s) { return s.domain === state.site; })) state.site = sites[0].domain;
       sel.value = state.site;
+      showTz();
     });
   }
-  $('siteSelect').onchange = function () { state.site = this.value; localStorage.setItem('nyx_site', state.site); load(); if (typeof loadFunnels === 'function') loadFunnels(); };
+  $('siteSelect').onchange = function () { state.site = this.value; showTz(); localStorage.setItem('nyx_site', state.site); load(); if (typeof loadFunnels === 'function') loadFunnels(); };
 
-  $('addSiteBtn').onclick = function () { $('addModal').classList.remove('hide'); $('newDomain').value = ''; $('addErr').textContent = ''; $('newDomain').focus(); };
-  $('cancelAdd').onclick = function () { $('addModal').classList.add('hide'); };
+  // ── time zones: the browser's zone is the default for a new site; the list comes from Intl ──
+  var BROWSER_TZ = (function () { try { return Intl.DateTimeFormat().resolvedOptions().timeZone || 'UTC'; } catch (e) { return 'UTC'; } })();
+  var TZ_LIST = (function () {
+    var l = []; try { l = Intl.supportedValuesOf('timeZone'); } catch (e) { /* old browser: the two below */ }
+    if (l.indexOf('UTC') < 0) l = ['UTC'].concat(l);
+    if (l.indexOf(BROWSER_TZ) < 0) l.push(BROWSER_TZ);
+    return l;
+  })();
+  function fillTz(sel, value) {
+    var list = TZ_LIST.indexOf(value) < 0 ? TZ_LIST.concat([value]) : TZ_LIST;
+    sel.innerHTML = list.map(function (z) { return '<option value="' + esc(z) + '">' + esc(z.replace(/_/g, ' ')) + '</option>'; }).join('');
+    sel.value = value;
+  }
+  // today in the site's time zone (en-CA formats as YYYY-MM-DD)
+  function localToday() { var s = currentSite(); try { return new Intl.DateTimeFormat('en-CA', { timeZone: (s && s.timezone) || 'UTC', year: 'numeric', month: '2-digit', day: '2-digit' }).format(new Date()); } catch (e) { return new Date().toISOString().slice(0, 10); } }
+  function currentSite() { return (state.sites || []).filter(function (s) { return s.domain === state.site; })[0]; }
+  function showTz() { var s = currentSite(); $('tzName').textContent = s ? String(s.timezone || 'UTC').replace(/_/g, ' ') : 'UTC'; $('tzBtn').classList.toggle('hide', !s); }
+  $('tzBtn').onclick = function () {
+    var s = currentSite(); if (!s) return;
+    $('tzSite').textContent = s.domain; $('tzErr').textContent = ''; fillTz($('tzSelect'), s.timezone || 'UTC');
+    $('tzModal').classList.remove('hide'); $('tzSelect').focus();
+  };
+  $('cancelTz').onclick = function () { closeModal($('tzModal'), { force: true }); };
+  $('saveTz').onclick = function () {
+    var s = currentSite(); if (!s) return;
+    api('/api/sites/' + s.id, { method: 'PATCH', body: JSON.stringify({ timezone: $('tzSelect').value }) }).then(function (r) {
+      if (r.error) { $('tzErr').textContent = r.error; return; }
+      closeModal($('tzModal'), { force: true });
+      loadSites().then(load);
+    });
+  };
+
+  $('addSiteBtn').onclick = function () { $('addModal').classList.remove('hide'); $('newDomain').value = ''; fillTz($('newTz'), BROWSER_TZ); $('addErr').textContent = ''; $('newDomain').focus(); };
+  $('cancelAdd').onclick = function () { closeModal($('addModal'), { force: true }); };
   $('createSiteBtn').onclick = function () {
     var d = $('newDomain').value.trim();
-    api('/api/sites', { method: 'POST', body: JSON.stringify({ domain: d }) }).then(function (s) {
+    api('/api/sites', { method: 'POST', body: JSON.stringify({ domain: d, timezone: $('newTz').value }) }).then(function (s) {
       if (s.error) { $('addErr').textContent = s.error; return; }
       $('addModal').classList.add('hide');
       state.site = s.domain; localStorage.setItem('nyx_site', state.site);
@@ -148,7 +195,7 @@
     return {
       s1: 'Paste this once into the <code>&lt;head&gt;</code> of your site:',
       c1: snippetFor(domain), s2: '', c2: '',
-      hint: 'Track goals &amp; properties from your code:<br><code>tacilytics(\'Signup\')</code> · <code>tacilytics(\'Signup\', { plan: \'pro\' })</code><br><span style="opacity:.7">Privacy flags on the tag: <code>data-honor-dnt</code> · <code>data-track-outbound</code></span>'
+      hint: 'Track goals &amp; properties from your code:<br><code>tacilytics(\'Signup\')</code> · <code>tacilytics(\'Signup\', { plan: \'pro\' })</code><br><span style="opacity:.7">Privacy flags on the tag: <code>data-honor-dnt</code> · <code>data-track-outbound</code> · <code>data-track-downloads</code></span>'
     };
   }
   function renderSnippet() {
@@ -193,14 +240,15 @@
   };
 
   $('snippetBtn').onclick = function () { if (state.site) showSnippet(state.site); };
-  $('closeSnippet').onclick = function () { $('snippetModal').classList.add('hide'); };
+  $('closeSnippet').onclick = function () { closeModal($('snippetModal')); };
   $('copySnippet').onclick = function () { copyFrom('copySnippet', 'snippetCode'); };
   $('copySnippet2').onclick = function () { copyFrom('copySnippet2', 'snippetCode2', 'Copy step 2'); };
 
   // ── live visitors (last 30 min) ──
   var liveTimer = null;
   function openLive() { if (!state.site || state.site === 'no sites yet') return; $('liveModal').classList.remove('hide'); fetchLive(); clearInterval(liveTimer); liveTimer = setInterval(fetchLive, 8000); }
-  function closeLive() { $('liveModal').classList.add('hide'); clearInterval(liveTimer); liveTimer = null; }
+  function closeLive() { closeModal($('liveModal')); }
+  $('liveModal').addEventListener('taci:close', function () { clearInterval(liveTimer); liveTimer = null; }); // every exit stops polling
   function fetchLive() {
     if (document.hidden) return;
     api('/api/realtime?site=' + encodeURIComponent(state.site)).then(function (r) {
@@ -323,8 +371,8 @@
     el.classList.remove('hide');
     var chips = keys.map(function (k) {
       var v = state.filters[k];
-      var disp = k === 'country' ? (flagIcon(v) + ' ' + esc(NAMES[v] || v)) : k === 'platform' ? (platformIcon(v) + ' ' + esc(platformLabel(v))) : esc(v);
-      return '<span class="chip"><span class="k">' + esc(FILTER_LABELS[k] || k) + '</span>' + disp +
+      var disp = k === 'country' ? (flagIcon(v) + ' ' + esc(own(NAMES, v) || v)) : k === 'platform' ? (platformIcon(v) + ' ' + esc(platformLabel(v))) : esc(v);
+      return '<span class="chip"><span class="k">' + esc(own(FILTER_LABELS, k) || k) + '</span>' + disp +
         '<button data-rm="' + esc(k) + '" title="Remove" aria-label="Remove filter">' + ico('i-x', 'ui') + '</button></span>';
     }).join('');
     el.innerHTML = '<span class="flabel">Filtered by</span>' + chips + '<span class="chip clear" id="clearFilters">Clear all</span>';
@@ -360,6 +408,23 @@
       '<path d="' + line + '" fill="none" stroke="' + color + '" stroke-width="1.6" vector-effect="non-scaling-stroke" opacity=".9"/></svg>';
     card.insertAdjacentHTML('beforeend', svg);
   }
+  // ── chart annotations: a thin coral line + diamond per annotated day (daily views only) ──
+  function annotationsFor(d) {
+    var list = (lastStats && lastStats.annotations) || [];
+    return d && d.day ? list.filter(function (a) { return a.day === d.day; }) : [];
+  }
+  function annotationMarks(series, x, H) {
+    var list = (lastStats && lastStats.annotations) || [];
+    if (!list.length) return '';
+    var out = '';
+    series.forEach(function (d, i) {
+      if (!annotationsFor(d).length) return;
+      var cx = x(i).toFixed(1);
+      out += '<line x1="' + cx + '" x2="' + cx + '" y1="14" y2="' + H + '" stroke="var(--accent-2, #ff7a5c)" stroke-width="1.2" stroke-dasharray="3 4" opacity=".75" vector-effect="non-scaling-stroke"/>' +
+        '<path d="M' + cx + ' 3 l5 6 l-5 6 l-5 -6 z" fill="var(--accent-2, #ff7a5c)"/>';
+    });
+    return out;
+  }
   function drawChart(series) {
     var svg = $('chart'); var W = 800, H = 220, pad = 8;
     var showV = state.show.visitors, showP = state.show.pageviews;
@@ -381,25 +446,146 @@
       '<defs><linearGradient id="ag" x1="0" y1="0" x2="0" y2="1">' +
       '<stop offset="0%" stop-color="' + COL.v + '" stop-opacity="0.32"/><stop offset="100%" stop-color="' + COL.v + '" stop-opacity="0"/>' +
       '</linearGradient></defs>' +
-      [0.25, 0.5, 0.75].map(function (f) { var gy = (pad + f * (H - 2 * pad)).toFixed(1); return '<line x1="0" x2="' + W + '" y1="' + gy + '" y2="' + gy + '" stroke="rgba(255,255,255,.05)" stroke-dasharray="2 6" vector-effect="non-scaling-stroke"/>'; }).join('') +
+      [0.25, 0.5, 0.75].map(function (f) { var gy = (pad + f * (H - 2 * pad)).toFixed(1); return '<line x1="0" x2="' + W + '" y1="' + gy + '" y2="' + gy + '" stroke="' + COL.grid + '" stroke-dasharray="2 6" vector-effect="non-scaling-stroke"/>'; }).join('') +
       (showV ? '<path d="' + areaP + '" fill="url(#ag)"/>' : '') +
       (showP ? '<path d="' + path('pageviews') + '" fill="none" stroke="' + COL.p + '" stroke-width="1.6" stroke-dasharray="4 4" opacity="0.85"/>' : '') +
       (showV ? '<path d="' + path('visitors') + '" fill="none" stroke="' + COL.v + '" stroke-width="2.4" stroke-linecap="round"/>' : '') +
-      (showV && n <= 40 ? series.map(function (d, i) { return '<circle cx="' + x(i).toFixed(1) + '" cy="' + y(d.visitors).toFixed(1) + '" r="2.4" fill="' + COL.v + '" stroke="#071114" stroke-width="1.5"/>'; }).join('') : '') +
+      (showV && n <= 40 ? series.map(function (d, i) { return '<circle cx="' + x(i).toFixed(1) + '" cy="' + y(d.visitors).toFixed(1) + '" r="2.4" fill="' + COL.v + '" stroke="' + COL.bg + '" stroke-width="1.5"/>'; }).join('') : '') +
+      annotationMarks(series, x, H) +
       hovers;
     var tip = $('tip');
     Array.prototype.forEach.call(svg.querySelectorAll('rect'), function (rect) {
       rect.addEventListener('mousemove', function (e) {
         var d = series[+rect.dataset.i];
+        var notes = annotationsFor(d);
         tip.innerHTML = '<strong>' + esc(d.label) + '</strong>' +
           (showV ? '<br>' + d.visitors + ' visitors' : '') +
-          (showP ? '<br>' + d.pageviews + ' views' : '');
+          (showP ? '<br>' + d.pageviews + ' views' : '') +
+          notes.map(function (a) { return '<br><span class="tip-note" data-no-i18n>◆ ' + esc(a.text) + '</span>'; }).join('');
         tip.style.left = (e.clientX + 14) + 'px'; tip.style.top = (e.clientY - 10) + 'px'; tip.style.opacity = 1;
       });
       rect.addEventListener('mouseleave', function () { tip.style.opacity = 0; });
     });
   }
 
+  // ── import history (Plausible / GA4) ──
+  var impSrc = 'plausible';
+  var IMP_HOWTO = {
+    plausible: 'In Plausible: <strong>Site settings → Imports &amp; Exports → Export data</strong>. Upload the ZIP you get (or the CSV files in it).',
+    ga: 'In Google Analytics 4: open a report (e.g. <strong>Pages and screens</strong>, <strong>Traffic acquisition</strong>, <strong>Demographic details</strong>), add <strong>Date</strong> as a secondary dimension, then <strong>Share → Download file → CSV</strong>. One file per report; pick several at once.',
+  };
+  function openImport() {
+    $('importModal').classList.remove('hide'); $('impErr').textContent = ''; $('impStatus').textContent = ''; $('impSite').textContent = state.site;
+    setImpSrc(impSrc); loadImports();
+  }
+  function setImpSrc(src) {
+    impSrc = src;
+    Array.prototype.forEach.call($('impTabs').children, function (b) { b.classList.toggle('active', b.dataset.src === src); });
+    $('impHowto').innerHTML = IMP_HOWTO[src];
+  }
+  function loadImports() {
+    api('/api/imports?site=' + encodeURIComponent(state.site)).then(function (r) {
+      if (r.error) return;
+      $('impList').innerHTML = r.imports.length ? '<div class="set-card"><h3>Imported</h3>' + r.imports.map(function (i) {
+        return '<div class="set-row"><span><strong>' + (i.source === 'ga' ? 'Google Analytics' : 'Plausible') + '</strong> ' + esc(i.first_day || '?') + ' – ' + esc(i.last_day || '?') +
+          ' <span class="muted small">· ' + Number(i.pageviews).toLocaleString() + ' views' + (i.created_by ? ' · by ' + esc(i.created_by) : '') + '</span></span>' +
+          '<button class="btn ghost danger mini" data-delimp="' + i.id + '">Remove</button></div>';
+      }).join('') + (r.countsUntil ? '<p class="muted small" style="margin:8px 0 0">Own data starts ' + esc(r.countsUntil) + '; imported days from then on are ignored.</p>' : '') + '</div>' : '';
+      $('impList').querySelectorAll('[data-delimp]').forEach(function (b) {
+        b.onclick = function () { if (confirm('Remove this import? The imported numbers disappear from all charts.')) api('/api/imports/' + b.dataset.delimp, { method: 'DELETE' }).then(function () { loadImports(); load(); }); };
+      });
+    });
+  }
+  $('importBtn').onclick = openImport;
+  $('closeImport').onclick = function () { closeModal($('importModal')); };
+  $('impTabs').onclick = function (e) { var b = e.target.closest('button'); if (b) setImpSrc(b.dataset.src); };
+  $('impGo').onclick = function () {
+    var files = Array.prototype.slice.call($('impFile').files || []);
+    $('impErr').textContent = '';
+    if (!files.length) { $('impErr').textContent = 'Choose a file first'; return; }
+    var done = 0, views = 0;
+    $('impStatus').textContent = 'Uploading…';
+    // one request per file: each file becomes its own import (and can be removed on its own)
+    files.reduce(function (p, f) {
+      return p.then(function () {
+        return fetch('/api/imports?site=' + encodeURIComponent(state.site) + '&source=' + impSrc + '&name=' + encodeURIComponent(f.name), {
+          method: 'POST', headers: { 'x-session-token': localStorage.getItem('nyx_token') || '', 'Content-Type': /\.zip$/i.test(f.name) ? 'application/zip' : 'text/csv' }, body: f,
+        }).then(function (r) { return r.json().then(function (j) { if (!r.ok) throw new Error(f.name + ': ' + (j.error || r.status)); done++; views += j.pageviews || 0; if (j.note) $('impStatus').textContent = j.note; }); });
+      });
+    }, Promise.resolve()).then(function () {
+      $('impStatus').textContent = done + ' file' + (done > 1 ? 's' : '') + ' imported (' + views.toLocaleString() + ' views). ' + ($('impStatus').textContent.indexOf('Days from') === 0 ? $('impStatus').textContent : '');
+      $('impFile').value = ''; loadImports(); load();
+    }).catch(function (e) { $('impErr').textContent = e.message; $('impStatus').textContent = ''; loadImports(); load(); });
+  };
+
+  // ── alerts ──
+  var KIND_LABEL = { spike: 'Traffic spike', drop: 'Traffic drop', goal: 'Goal' };
+  function openAlerts() {
+    // a fresh form only when the modal opens — openAlerts also re-renders the list while it is open
+    if ($('alertsModal').classList.contains('hide')) { $('alKind').value = 'spike'; $('alGoalRow').classList.add('hide'); $('alGoal').value = ''; $('alThreshold').value = '10'; $('alWindow').value = '24'; $('alWebhook').value = ''; }
+    $('alertsModal').classList.remove('hide'); $('alertsErr').textContent = ''; $('alertsSite').textContent = state.site;
+    var goals = ((lastStats && lastStats.goals) || []).map(function (g) { return g.name; });
+    $('alGoalList').innerHTML = goals.map(function (g) { return '<option value="' + esc(g) + '">'; }).join('');
+    api('/api/alerts?site=' + encodeURIComponent(state.site)).then(function (r) {
+      if (r.error) { $('alertsErr').textContent = r.error; return; }
+      $('alHint').textContent = r.fallbackWebhook ? 'Leave the webhook empty to use the server default (DIGEST_WEBHOOK_URL).' : 'Discord: channel settings → Integrations → Webhooks → Copy URL.';
+      $('alWebhook').placeholder = r.fallbackWebhook ? 'Webhook URL (optional — server default)' : 'Webhook URL (https://…)';
+      $('alertsList').innerHTML = r.alerts.length ? '<div class="set-card">' + r.alerts.map(function (a) {
+        var what = a.kind === 'goal' ? a.threshold + '× <span data-no-i18n>' + esc(a.goal) + '</span> in ' + (a.window_hours === 1 ? '1 h' : a.window_hours === 24 ? '24 h' : '7 days') : KIND_LABEL[a.kind];
+        return '<div class="set-row"><span>' + ico(a.kind === 'goal' ? 'i-goal' : a.kind === 'drop' ? 'i-down' : 'i-up', 'ui') + '<strong>' + what + '</strong>' +
+          ' <span class="muted small">→ ' + (a.webhook ? '<span data-no-i18n>' + esc(a.webhook) + '</span>' : 'server default') + (a.last_fired ? ' · last sent ' + new Date(a.last_fired).toLocaleString() : '') + '</span></span>' +
+          '<label class="small muted" style="display:inline-flex;gap:5px;align-items:center"><input type="checkbox" data-al-on="' + a.id + '"' + (a.enabled ? ' checked' : '') + ' style="width:auto;margin:0"> on</label>' +
+          '<button class="btn ghost mini" data-al-test="' + a.id + '">Test</button>' +
+          '<button class="btn ghost danger mini" data-al-del="' + a.id + '">Remove</button></div>';
+      }).join('') + '</div>' : '<p class="muted small">No alerts for this site yet.</p>';
+      var L = $('alertsList');
+      L.querySelectorAll('[data-al-on]').forEach(function (c) { c.onchange = function () { api('/api/alerts/' + c.dataset.alOn, { method: 'PATCH', body: JSON.stringify({ enabled: c.checked }) }); }; });
+      L.querySelectorAll('[data-al-del]').forEach(function (b) { b.onclick = function () { api('/api/alerts/' + b.dataset.alDel, { method: 'DELETE' }).then(openAlerts); }; });
+      L.querySelectorAll('[data-al-test]').forEach(function (b) {
+        b.onclick = function () {
+          b.textContent = 'Sending…';
+          api('/api/alerts/' + b.dataset.alTest + '/test', { method: 'POST' }).then(function (r) { b.textContent = r.error ? 'Failed' : 'Sent ✓'; if (r.error) $('alertsErr').textContent = r.error; });
+        };
+      });
+    });
+  }
+  $('alertsBtn').onclick = openAlerts;
+  $('closeAlerts').onclick = function () { closeModal($('alertsModal'), { force: true }); };
+  $('alKind').onchange = function () { $('alGoalRow').classList.toggle('hide', this.value !== 'goal'); };
+  $('alAdd').onclick = function () {
+    $('alertsErr').textContent = '';
+    var body = { site: state.site, kind: $('alKind').value, webhook: $('alWebhook').value.trim() || undefined };
+    if (body.kind === 'goal') { body.goal = $('alGoal').value.trim(); body.threshold = Number($('alThreshold').value); body.window_hours = Number($('alWindow').value); }
+    api('/api/alerts', { method: 'POST', body: JSON.stringify(body) }).then(function (r) {
+      if (r.error) { $('alertsErr').textContent = r.error; return; }
+      $('alWebhook').value = ''; window.TaciModal.snapshot($('alertsModal')); openAlerts();
+    });
+  };
+
+  // ── add / list annotations ──
+  function openAnnotations() {
+    $('annModal').classList.remove('hide'); $('annErr').textContent = '';
+    $('annDay').value = localToday(); $('annText').value = ''; $('annText').focus(); window.TaciModal.snapshot($('annModal')); // also when re-opened after a save
+    api('/api/annotations?site=' + encodeURIComponent(state.site)).then(function (list) {
+      $('annList').innerHTML = (list || []).length ? list.map(function (a) {
+        return '<div class="set-row"><span><strong>' + esc(a.day) + '</strong> <span data-no-i18n>' + esc(a.text) + '</span>' + (a.created_by ? ' <span class="muted small">· ' + esc(a.created_by) + '</span>' : '') + '</span>' +
+          '<button class="btn ghost danger mini" data-delann="' + a.id + '">Remove</button></div>';
+      }).join('') : '<p class="muted small">No notes yet.</p>';
+      $('annList').querySelectorAll('[data-delann]').forEach(function (b) {
+        b.onclick = function () { api('/api/annotations/' + b.dataset.delann, { method: 'DELETE' }).then(function () { openAnnotations(); load(); }); };
+      });
+    });
+  }
+  $('annBtn').onclick = openAnnotations;
+  $('closeAnn').onclick = function () { closeModal($('annModal'), { force: true }); };
+  $('saveAnn').onclick = function () {
+    api('/api/annotations', { method: 'POST', body: JSON.stringify({ site: state.site, day: $('annDay').value, text: $('annText').value }) }).then(function (r) {
+      if (r.error) { $('annErr').textContent = r.error; return; }
+      openAnnotations(); load();
+    });
+  };
+  $('annText').addEventListener('keydown', function (e) { if (e.key === 'Enter') $('saveAnn').click(); });
+
   // ── tab-aware panels (Pages: Top/Entry/Exit · Sources: Source/Medium/Campaign) ──
   function renderPagesPanel() {
     var s = lastStats; if (!s) return;
@@ -413,8 +599,8 @@
     'android-app://com.google.android.googlequicksearchbox': 'Google App (Android)', 't.co': 'X / Twitter',
   };
   var PLATFORM_NAMES = { web: 'Web', android: 'Android app', ios: 'iOS app', macos: 'macOS app', windows: 'Windows app', linux: 'Linux app' };
-  function platformIcon(n) { return n === 'web' ? ico('i-web', 'ui') : n === 'windows' ? ico('i-desktop', 'ui') : brand(PLATFORM_ICON[n], 'i-mobile'); }
-  function platformLabel(n) { return PLATFORM_NAMES[n] || n; }
+  function platformIcon(n) { return n === 'web' ? ico('i-web', 'ui') : n === 'windows' ? ico('i-desktop', 'ui') : brand(own(PLATFORM_ICON, n), 'i-mobile'); }
+  function platformLabel(n) { return own(PLATFORM_NAMES, n) || n; }
   state.pfTab = 'platforms';
   function renderPlatformsPanel() {
     var s = lastStats; if (!s) return;
@@ -426,7 +612,7 @@
     if (state.pfTab === 'appVersions') bars('p-platforms', s.appVersions || [], { filterKey: 'version', icon: function () { return ico('i-layers', 'ui'); }, label: function (r) { return 'v' + r.name; } });
     else bars('p-platforms', s.platforms || [], { filterKey: 'platform', icon: function (r) { return platformIcon(r.name); }, label: function (r) { return platformLabel(r.name); } });
   }
-  function sourceLabel(n) { if (n === 'Direct') return 'Direct / none'; var nice = SOURCE_NAMES[n]; return nice ? nice + ' · ' + n : n; }
+  function sourceLabel(n) { if (n === 'Direct') return 'Direct / none'; var nice = own(SOURCE_NAMES, n); return nice ? nice + ' · ' + n : n; }
   function renderSourcesPanel() {
     var s = lastStats; if (!s) return;
     var tab = state.srcTab, fk = tab === 'mediums' ? 'medium' : tab === 'campaigns' ? 'campaign' : 'source';
@@ -538,6 +724,10 @@
     api('/api/stats?' + statsQuery()).then(function (s) {
       if (s.error) return;
       lastStats = s;
+      var imn = $('importedNote');
+      if (s.imported && s.imported.included) { imn.textContent = 'Includes imported history' + (s.imported.until ? ' (until ' + s.imported.until + ')' : '') + '.'; imn.title = 'Visitors on imported days are summed per day, not unique across days.'; imn.classList.remove('hide'); }
+      else if (s.imported && s.imported.excludedByFilter) { imn.textContent = 'Imported history is hidden while a filter is active.'; imn.classList.remove('hide'); }
+      else imn.classList.add('hide');
       $('s-visitors').textContent = fmt(s.totals.visitors);
       $('s-pageviews').textContent = fmt(s.totals.pageviews);
       $('s-bounce').textContent = s.totals.bounce + '%';
@@ -551,9 +741,9 @@
       sparkline('s-pageviews', (s.series || []).map(function (d) { return d.pageviews; }), COL.p);
       renderPagesPanel();
       renderSourcesPanel();
-      bars('p-countries', s.countries, { filterKey: 'country', icon: function (r) { return flagIcon(r.name); }, label: function (r) { return NAMES[r.name] || r.name; } });
-      bars('p-browsers', s.browsers, { filterKey: 'browser', icon: function (r) { return r.name === 'App' ? ico('i-mobile', 'ui') : r.name === 'Edge' ? ico('i-browser', 'ui') : brand(BROWSER_ICON[r.name], 'i-browser'); } });
-      bars('p-os', s.os, { filterKey: 'os', icon: function (r) { return r.name === 'Windows' ? ico('i-desktop', 'ui') : brand(OS_ICON[r.name], 'i-os'); } });
+      bars('p-countries', s.countries, { filterKey: 'country', icon: function (r) { return flagIcon(r.name); }, label: function (r) { return own(NAMES, r.name) || r.name; } });
+      bars('p-browsers', s.browsers, { filterKey: 'browser', icon: function (r) { return r.name === 'App' ? ico('i-mobile', 'ui') : r.name === 'Edge' ? ico('i-browser', 'ui') : brand(own(BROWSER_ICON, r.name), 'i-browser'); } });
+      bars('p-os', s.os, { filterKey: 'os', icon: function (r) { return r.name === 'Windows' ? ico('i-desktop', 'ui') : brand(own(OS_ICON, r.name), 'i-os'); } });
       bars('p-devices', s.devices, { filterKey: 'device', icon: function (r) { return ico(r.name === 'Desktop' ? 'i-desktop' : r.name === 'Tablet' ? 'i-tablet' : 'i-mobile', 'ui'); } });
       renderPlatformsPanel();
       bars('p-languages', s.languages, { filterKey: 'lang' });
@@ -689,7 +879,7 @@
   };
   $('copyShare').onclick = function () { navigator.clipboard.writeText($('shareUrl').textContent); $('copyShare').textContent = 'Copied'; setTimeout(function () { $('copyShare').textContent = 'Copy link'; }, 1500); };
   $('revokeShare').onclick = function () { if (shareToken) api('/api/shares/' + shareToken, { method: 'DELETE' }).then(function () { $('shareModal').classList.add('hide'); }); };
-  $('closeShare').onclick = function () { $('shareModal').classList.add('hide'); };
+  $('closeShare').onclick = function () { closeModal($('shareModal')); };
 
   // ── funnels ──
   function fmtPct(p) { return (p == null ? '—' : p + '%'); }
@@ -737,7 +927,7 @@
     $('funnelModal').classList.remove('hide'); $('funnelName').focus();
   };
   $('addStepBtn').onclick = function () { if ($('funnelSteps').children.length < 8) $('funnelSteps').appendChild(stepRow()); };
-  $('cancelFunnel').onclick = function () { $('funnelModal').classList.add('hide'); };
+  $('cancelFunnel').onclick = function () { closeModal($('funnelModal'), { force: true }); };
   $('createFunnelBtn').onclick = function () {
     var steps = Array.prototype.map.call($('funnelSteps').children, function (row) {
       return { type: row.querySelector('.step-type').value, value: row.querySelector('.step-value').value.trim() };
@@ -770,7 +960,7 @@
       state.site = info.domain;
       var sel = $('siteSelect');
       sel.innerHTML = '<option>' + esc(info.domain) + '</option>'; sel.disabled = true;
-      ['addSiteBtn', 'logoutBtn', 'settingsBtn', 'shareBtn', 'snippetBtn', 'addFunnelBtn'].forEach(function (id) { var el = $(id); if (el) el.classList.add('hide'); });
+      ['addSiteBtn', 'tzBtn', 'logoutBtn', 'settingsBtn', 'shareBtn', 'snippetBtn', 'addFunnelBtn', 'annBtn', 'alertsBtn', 'importBtn'].forEach(function (id) { var el = $(id); if (el) el.classList.add('hide'); });
       syncLegend();
       load();
       clearInterval(window.__rt);
@@ -781,5 +971,6 @@
   var INVITE = (location.pathname.match(/^\/invite\/([a-f0-9]{32,64})$/) || [])[1] || '';
   if (SHARE) bootShare();
   else if (INVITE) { $('login').classList.add('hide'); window.TaciAccount.showInvite(INVITE); }
+  else if (/^\/reset\/[a-f0-9]{32,64}$/.test(location.pathname)) { $('login').classList.add('hide'); window.TaciAccount.showReset(location.pathname.split('/').pop()); }
   else if (TOKEN) boot(); else showLogin();
 })();

package/public/assets/icons.svg

@@ -202,4 +202,5 @@
 <symbol id="i-shield" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z" /><path d="m9 12 2 2 4-4" /></symbol>
 <symbol id="i-user-plus" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" /><circle cx="9" cy="7" r="4" /><line x1="19" x2="19" y1="8" y2="14" /><line x1="22" x2="16" y1="11" y2="11" /></symbol>
 <symbol id="i-smartphone" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect width="14" height="20" x="5" y="2" rx="2" ry="2" /><path d="M12 18h.01" /></symbol>
+<symbol id="i-bell" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M10.268 21a2 2 0 0 0 3.464 0" /><path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" /></symbol>
 </svg>