/* =========================================================
Tappt — INLINE edit mode (edits live on the profile page,
not a popup). Sticky Cancel / Save bar, Change Cover sheet,
inline placeholder tiles + add-link forms.
========================================================= */
const {
platById: xplat, BrandIcon: XBrand, AVATAR_COLORS: XAV, I: XI,
DEFAULT_SECTIONS: XSECT, renderLink: xRenderLink, AddLinkSheet: XAddLink,
activePersona: xActive, EmbedEditor,
} = window;
const { useState: xUse, useRef: xRef, useEffect: xEffect } = React;
/* detect a platform id from a pasted URL (for the corner brand icon) */
function detectPlatform(url) {
const u = (url || '').toLowerCase();
const map = [['instagram', 'instagram'], ['tiktok', 'tiktok'], ['youtu', 'youtube'],
['x.com', 'x'], ['twitter', 'x'], ['spotify', 'spotify'], ['linkedin', 'linkedin'],
['facebook', 'facebook'], ['fb.com', 'facebook'], ['snapchat', 'snapchat'], ['twitch', 'twitch'],
['discord', 'discord'], ['t.me', 'telegram'], ['wa.me', 'whatsapp'], ['whatsapp', 'whatsapp'],
['paypal', 'paypal'], ['cash.app', 'cashapp'], ['venmo', 'venmo'], ['soundcloud', 'soundcloud'],
['pinterest', 'pinterest'], ['threads', 'threads'], ['calendly', 'calendly']];
for (const [needle, id] of map) if (u.includes(needle)) return id;
return 'website';
}
/* adult / NSFW domains banned from Tappt links */
const ADULT_DOMAINS = ['onlyfans', 'fansly', 'fancentro', 'manyvids', 'justfor.fans', 'justforfans',
'adultwork', 'pornhub', 'xvideos', 'xnxx', 'xhamster', 'redtube', 'youporn', 'spankbang',
'brazzers', 'chaturbate', 'stripchat', 'bongacams', 'cam4', 'myfreecams', 'livejasmin',
'clips4sale', 'iwantclips', 'loyalfans', 'fanvue', 'admireme', 'ismyguy', 'unlocked.app',
'avn.', 'redgifs', 'rule34', 'e-hentai', 'nhentai', 'fapello', 'erome'];
function isAdultUrl(url) {
const u = (url || '').toLowerCase().replace(/^https?:\/\//, '');
if (ADULT_DOMAINS.some((d) => u.includes(d))) return true;
// loose keyword guard on the host portion only (before first slash)
const host = u.split('/')[0];
return /\b(porn|xxx|nsfw|escort|hookup|camgirl)\b/.test(host);
}
/* read an image/video file → dataURL. Images are downscaled+compressed via
canvas so big photos don't blow the localStorage quota (the reason saving
a cover photo / profile pic was silently failing). Video passes through. */
function readMedia(file, cb) {
const kind = file.type.startsWith('video') ? 'video' : 'image';
const big = file.size > 1.2 * 1024 * 1024; // only show overlay for sizeable files
const emit = (pct, done) => { try { window.dispatchEvent(new CustomEvent('tappt-upload', { detail: { pct, done, kind } })); } catch (e) {} };
// after producing a local data URL, upload to Supabase Storage (if signed in) and
// re-emit the public URL so it persists cross-device. Falls back to the data URL.
const cloud = (dataUrl, k) => {
try {
if (window.TapptDB && window.TapptDB.available()) {
window.TapptDB.uploadMedia(dataUrl, k === 'video' ? 'mp4' : 'jpg')
.then((url) => { if (url) cb(url, k); }).catch(() => {});
}
} catch (e) {}
};
if (big) emit(1, false);
if (kind === 'video') {
const r = new FileReader();
r.onprogress = (e) => { if (big && e.lengthComputable) emit(Math.max(1, Math.round((e.loaded / e.total) * 100)), false); };
r.onload = () => { emit(100, true); cb(r.result, kind); cloud(r.result, kind); };
r.onerror = () => { emit(100, true); };
r.readAsDataURL(file);
return;
}
const r = new FileReader();
r.onprogress = (e) => { if (big && e.lengthComputable) emit(Math.max(1, Math.round((e.loaded / e.total) * 80)), false); };
r.onload = () => {
const img = new Image();
img.onload = () => {
if (big) emit(92, false);
const MAX = 1280;
let { width: w, height: h } = img;
if (w > MAX || h > MAX) { const s = MAX / Math.max(w, h); w = Math.round(w * s); h = Math.round(h * s); }
const c = document.createElement('canvas'); c.width = w; c.height = h;
c.getContext('2d').drawImage(img, 0, 0, w, h);
let out;
try { out = c.toDataURL('image/jpeg', 0.82); } catch (e) { out = r.result; }
emit(100, true); cb(out, 'image'); cloud(out, 'image');
};
img.onerror = () => { emit(100, true); cb(r.result, 'image'); cloud(r.result, 'image'); };
img.src = r.result;
};
r.readAsDataURL(file);
}
window.readMedia = readMedia;
/* action-button catalogue — white glyphs on solid brand tiles (consistent in light+dark) */
const Aic = {
save: ,
phone: ,
email: ,
whatsapp: ,
share: ,
qr: ,
subscribe: ,
gift: ,
};
const ACTIONS = {
save: { label: 'Save Contact', c: '#3A3A42', icon: Aic.save, desc: 'Saves your number & email to their phone' },
phone: { label: 'Call', c: '#34C759', icon: Aic.phone, desc: 'One tap to call you', needs: 'tel', ph: '+44 7700 900000', field: 'Phone number' },
email: { label: 'Email', c: '#1D6FE0', icon: Aic.email, desc: 'Open a new email to you', needs: 'email', ph: 'you@email.com', field: 'Email address' },
whatsapp: { label: 'WhatsApp', c: '#25D366', icon: Aic.whatsapp, desc: 'Message you on WhatsApp', needs: 'tel', ph: '+44 7700 900000', field: 'WhatsApp number' },
share: { label: 'Share', c: '#6B8299', icon: Aic.share, desc: 'Share your profile' },
qr: { label: 'QR Code', c: '#0B0B0C', icon: Aic.qr, desc: 'Show a scannable QR of your profile' },
subscribe: { label: 'Subscribe', c: 'linear-gradient(135deg,#E8C75A,#b8902a)', icon: Aic.subscribe, desc: 'Paid subscription / VIP (Pro)' },
tip: { label: 'Send a Tip', c: '#FF6BC8', icon: (Aic.gift || Aic.heart), desc: 'Opens your tip jar — set it up in Tips' },
};
window.ACTIONS = ACTIONS;
/* ===========================================================
ACTION PICKER (choose buttons; prompts for input when needed)
=========================================================== */
function ActionPicker({ active, data, onToggle, onSetData, onReorder, onClose }) {
const CATALOGUE = ['save', 'phone', 'email', 'whatsapp', 'tip', 'share', 'qr', 'subscribe'];
const [editing, setEditing] = xUse(null); // id awaiting input
const [val, setVal] = xUse('');
// order shown in the sheet — active ones keep their saved order, then the rest
const [order, setOrder] = xUse(() => {
const act = (active || []).filter((id) => CATALOGUE.includes(id));
return [...act, ...CATALOGUE.filter((id) => !act.includes(id))];
});
const [dragId, setDragId] = xUse(null);
const [overId, setOverId] = xUse(null);
const [capWarn, setCapWarn] = xUse(false);
const MAX_ACTIONS = 4;
const atCap = (active || []).length >= MAX_ACTIONS;
const dragActive = xRef(false);
const dragIdRef = xRef(null);
const overIdRef = xRef(null);
const orderRef = xRef(order);
orderRef.current = order;
const startDrag = (e, id) => {
if (dragActive.current) return;
dragActive.current = true;
e.preventDefault(); e.stopPropagation();
dragIdRef.current = id; overIdRef.current = null;
setDragId(id);
const move = (ev) => {
const pt = ev.touches ? ev.touches[0] : ev;
if (!pt) return;
const el = document.elementFromPoint(pt.clientX, pt.clientY);
const row = el && el.closest ? el.closest('[data-actid]') : null;
const oid = row ? row.getAttribute('data-actid') : null;
overIdRef.current = oid; setOverId(oid);
};
const up = () => {
dragActive.current = false;
document.removeEventListener('pointermove', move); document.removeEventListener('pointerup', up);
document.removeEventListener('touchmove', move); document.removeEventListener('touchend', up);
const cur = dragIdRef.current, ov = overIdRef.current;
setDragId(null); setOverId(null);
dragIdRef.current = null; overIdRef.current = null;
if (cur && ov && cur !== ov) {
const list = orderRef.current;
const from = list.indexOf(cur), to = list.indexOf(ov);
if (from < 0 || to < 0) return;
const next = [...list]; const [m] = next.splice(from, 1); next.splice(to, 0, m);
setOrder(next);
if (onReorder) onReorder(next.filter((id) => (active || []).includes(id)));
}
};
document.addEventListener('pointermove', move); document.addEventListener('pointerup', up);
document.addEventListener('touchmove', move, { passive: false }); document.addEventListener('touchend', up);
};
if (editing) {
const m = ACTIONS[editing];
return (
{ if (e.target === e.currentTarget) setEditing(null); }}>
{m.label}
{m.icon}
setVal(e.target.value)} />
Visitors tap “{m.label}” and it {editing === 'email' ? 'opens an email to you' : editing === 'whatsapp' ? 'opens a WhatsApp chat with you' : 'dials this number'}.
);
}
return (
{ if (e.target === e.currentTarget) onClose(); }}>
Action Buttons
{capWarn &&
You can show up to {MAX_ACTIONS} action buttons — remove one to add another.
}
{order.map((id) => {
const m = ACTIONS[id]; const on = active.includes(id);
const handle = () => {
const on = active.includes(id);
if (!on && atCap) { setCapWarn(true); setTimeout(() => setCapWarn(false), 2200); return; }
if (m.needs) { setVal(data[id] || ''); setEditing(id); return; }
onToggle(id);
};
return (