// handle-utils.jsx — curatare si afisare clickabila pentru userii de social media.
//
// Problema reala: creatorii scriu userul cum apuca. "@@nume", " @nume ", link-ul
// intreg copiat din browser, uneori cu spatii invizibile lipite din Word. Pana acum
// salvam exact ce scriau ei, asa ca in panou aparea "@@nume" si nu se putea da click.
//
// Regula: curatam la SCRIERE (o singura data, cand se salveaza) si afisam clickabil.
// Nu curatam la citire — altfel am ascunde in interfata o valoare gresita din baza
// de date si nimeni nu ar sti ca trebuie reparata.
//
// Expune:
//   window.normHandle(raw)                  -> 'nume' curat, sau '' daca nu ramane nimic
//   window.handleUrl(platform, handle)      -> URL absolut, sau null
//   window.HandleLink({platform, handle})   -> <a> clickabil, sau "—" daca lipseste
//
// Copie identica in radacina repo-ului (vezi media/SETUP.md).

const HANDLE_PLATFORMS = {
  tiktok:    { label: 'TikTok',    base: 'https://www.tiktok.com/@' },
  instagram: { label: 'Instagram', base: 'https://www.instagram.com/' },
  facebook:  { label: 'Facebook',  base: 'https://www.facebook.com/' },
  youtube:   { label: 'YouTube',   base: 'https://www.youtube.com/@' },
};

// Domeniile din care stim sa scoatem userul daca cineva lipeste link-ul intreg.
const _HANDLE_URL_RE = /^(?:https?:\/\/)?(?:www\.|m\.|vm\.)?(?:tiktok\.com|instagram\.com|facebook\.com|fb\.com|youtube\.com)\/(.+)$/i;

function normHandle(raw) {
  if (raw === null || raw === undefined) return '';
  let h = String(raw).trim();
  if (!h) return '';

  // Link complet lipit din browser -> pastram doar partea de dupa domeniu.
  const m = h.match(_HANDLE_URL_RE);
  if (m) {
    let path = m[1];
    // facebook.com/profile.php?id=123 nu are user — nu avem ce curata, lasam textul original.
    if (/^profile\.php/i.test(path)) return h;
    // youtube.com/c/nume, /channel/nume, /user/nume -> nume
    path = path.replace(/^(?:c|channel|user)\//i, '');
    h = path;
  }

  h = h.split(/[/?#]/)[0];                       // taiem orice resturi de path sau query
  h = h.replace(/^@+/, '');                      // "@@nume" si "@@@nume" -> "nume"
  h = h.replace(/[\s\u00A0\u200B-\u200D\uFEFF]+/g, ''); // spatii normale + invizibile (copy-paste din Word)
  return h;
}

function handleUrl(platform, handle) {
  const p = HANDLE_PLATFORMS[platform];
  const h = normHandle(handle);
  if (!p || !h) return null;
  // Daca dupa curatare a ramas ceva ce nu arata a user (ex: profile.php?id=...),
  // nu inventam un link stricat.
  if (!/^[A-Za-z0-9._-]+$/.test(h)) return null;
  return p.base + encodeURIComponent(h);
}

// Afisare clickabila. `stopPropagation` e obligatoriu: link-urile stau in randuri de
// tabel care deschid un drawer la click, iar click pe link nu trebuie sa faca si asta.
function HandleLink({ platform = 'tiktok', handle, showAt = true, style, emptyText = '—' }) {
  const [hover, setHover] = React.useState(false);
  const clean = normHandle(handle);

  if (!clean) {
    return <span style={{ color: 'var(--txt-3)', ...style }}>{emptyText}</span>;
  }

  const url = handleUrl(platform, clean);
  const text = (showAt ? '@' : '') + clean;

  // Fara link valid (caz rar: user cu diacritice sau caractere ciudate) — afisam curat, dar inert.
  if (!url) {
    return <span style={{ color: 'var(--txt-1)', ...style }}>{text}</span>;
  }

  return (
    <a
      href={url}
      target="_blank"
      rel="noopener noreferrer"
      onClick={(e) => e.stopPropagation()}
      onMouseEnter={() => setHover(true)}
      onMouseLeave={() => setHover(false)}
      onFocus={() => setHover(true)}
      onBlur={() => setHover(false)}
      title={'Deschide profilul ' + (HANDLE_PLATFORMS[platform] ? HANDLE_PLATFORMS[platform].label : '') + ' intr-un tab nou'}
      className="handle-link"
      style={{
        textDecoration: 'none',
        cursor: 'pointer',
        transition: 'color .15s, border-color .15s',
        ...style,
        // Dupa spread, ca hover-ul sa castige chiar daca apelantul a dat o culoare proprie.
        color: hover ? 'var(--accent-1)' : ((style && style.color) || 'var(--txt-1)'),
        borderBottom: hover ? '1px solid var(--accent-1)' : '1px solid rgba(255,255,255,.18)',
      }}
    >{text}</a>
  );
}

window.normHandle = normHandle;
window.handleUrl = handleUrl;
window.HandleLink = HandleLink;
window.HANDLE_PLATFORMS = HANDLE_PLATFORMS;
