// Share Modal — DC-058
//
// Admin UI for DC-053 share routes. Opened from the "Share" button on each
// service card (added in core/grid.js next to the existing options/delete
// buttons). Two tabs:
// - Public link: pick a TTL (1h/24h/7d), POST /api/v1/share, render the
// returned urlPath with a copy button + revoke control.
// - Tailscale invite: enter an email, POST /api/v1/share/tailscale, render
// delivered status (inbox vs dev-console fallback vs URL fallback).
//
// Modal also lists outstanding shares for the selected service (GET /api/v1/share)
// with revoke buttons. The list refreshes after every issue/revoke.
//
// Both issue endpoints are Pro-gated on the server — the modal surfaces a 402
// as an upgrade prompt ("Share is a Pro feature. Activate a license to unlock.").
// Tailscale invites additionally require tailscaleCoord configured on the host;
// the server returns 400 with a clear message when missing.
(function() {
'use strict';
if (window.__dc_058_share_modal_loaded) return;
window.__dc_058_share_modal_loaded = true;
const TTL_OPTIONS = [
{ ms: 60 * 60 * 1000, label: '1 hour' },
{ ms: 24 * 60 * 60 * 1000, label: '24 hours' },
{ ms: 7 * 24 * 60 * 60 * 1000, label: '7 days' },
];
injectModal('share-modal', `
Share …
Create a public link or Tailscale invite so someone outside your network can access this service.
A single-use Tailscale pre-auth key is generated and emailed. The device joins your tailnet and is routed to this service via Caddy.
Share link:
`);
const modal = document.getElementById('share-modal');
const serviceNameEl = document.getElementById('share-modal-service-name');
const issuedEl = document.getElementById('share-issued');
const issuedUrlInput = document.getElementById('share-issued-url');
const issuedCopyBtn = document.getElementById('share-issued-copy');
const issuedMetaEl = document.getElementById('share-issued-meta');
const errorEl = document.getElementById('share-error');
const successEl = document.getElementById('share-success');
const outstandingListEl = document.getElementById('share-outstanding-list');
const cancelBtn = document.getElementById('share-cancel');
const publicCreateBtn = document.getElementById('share-public-create');
const tsCreateBtn = document.getElementById('share-ts-create');
const tsEmailInput = document.getElementById('share-ts-email');
const publicTtlSelect = document.getElementById('share-public-ttl');
let currentService = null; // { id, name }
let activeTab = 'public';
function hideMessages() {
errorEl.style.display = 'none';
successEl.style.display = 'none';
issuedEl.style.display = 'none';
}
function showError(msg) {
successEl.style.display = 'none';
issuedEl.style.display = 'none';
errorEl.textContent = msg;
errorEl.style.display = 'block';
}
function showSuccess(msg) {
errorEl.style.display = 'none';
successEl.textContent = msg;
successEl.style.display = 'block';
}
function _originFromPage() {
// Build the absolute share URL from the page's current origin so the
// link is correct regardless of whether the user is on http://localhost
// (dev) or https://status.sami (prod). The urlPath returned by the API
// is a path-only string starting with /share/.
return window.location.origin;
}
function _absUrl(urlPath) {
if (urlPath.startsWith('http')) return urlPath;
return _originFromPage() + urlPath;
}
function _formatExpiry(iso) {
if (!iso) return '';
const d = new Date(iso);
if (Number.isNaN(d.getTime())) return '';
return d.toLocaleString();
}
function _formatRemaining(ms) {
if (ms <= 0) return 'expired';
const h = Math.floor(ms / 3600000);
if (h >= 24) return `${Math.floor(h / 24)}d ${h % 24}h left`;
const m = Math.floor((ms % 3600000) / 60000);
return `${h}h ${m}m left`;
}
function setActiveTab(name) {
activeTab = name;
hideMessages();
modal.querySelectorAll('.share-tab').forEach(btn => {
const isActive = btn.dataset.tab === name;
btn.classList.toggle('active', isActive);
btn.style.borderBottomColor = isActive ? 'var(--accent)' : 'transparent';
btn.style.color = isActive ? 'var(--fg)' : 'var(--muted)';
btn.style.fontWeight = isActive ? '600' : '400';
});
modal.querySelectorAll('.share-tab-panel').forEach(p => {
p.style.display = p.dataset.panel === name ? '' : 'none';
});
}
async function loadOutstanding() {
outstandingListEl.innerHTML = 'Loading…';
try {
const resp = await fetch('/api/v1/share', { credentials: 'same-origin' });
if (!resp.ok) {
outstandingListEl.innerHTML = 'No shares listed.';
return;
}
const body = await resp.json();
const list = (body && body.data) || [];
const filtered = list.filter(s => s.serviceId === currentService.id);
if (filtered.length === 0) {
outstandingListEl.innerHTML = 'No outstanding shares for this service.';
return;
}
outstandingListEl.innerHTML = filtered.map(s => {
const remaining = s.expiresAt ? _formatRemaining(new Date(s.expiresAt).getTime() - Date.now()) : '';
return `