// Una sola forma de compartir en toda la plataforma. El enlace es la accion:
// toda la fila copia, sin etiqueta que repita lo que ya se lee.
function ShareDialog({open,onClose,link,subject,note,onShared}){
  const [copied,setCopied]=React.useState(false);
  const cuerpo=(subject?subject+"\n\n":"")+link;
  const copiar=()=>{
    const ok=()=>{setCopied(true);setTimeout(()=>setCopied(false),1600)};
    if(navigator.clipboard&&navigator.clipboard.writeText)navigator.clipboard.writeText(link).then(ok,ok);
    else ok();
    onShared&&onShared("link");
  };
  const mandar=(canal,url)=>{window.open(url,"_blank","noopener");onShared&&onShared(canal);onClose&&onClose()};

  return <Dialog open={open} onClose={onClose} title="Share" width={400}>
    <div style={{display:"flex",flexDirection:"column",gap:14,marginTop:4}}>
      <button type="button" onClick={copiar} aria-label={copied?"Link copied":"Copy link"}
        style={{display:"flex",alignItems:"center",gap:12,width:"100%",textAlign:"left",cursor:"pointer",
          border:"var(--border-width-hairline) solid "+(copied?"var(--bruce-black)":"var(--border-hairline)"),
          borderRadius:"var(--radius-sm)",background:"var(--surface-sunken)",padding:"14px 16px",font:"inherit",
          transition:"border-color var(--duration-base) var(--ease-standard)"}}>
        <span style={{flex:1,minWidth:0,fontSize:13,color:"var(--text-body)",
          whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"}}>{link.replace(/^https?:\/\//,"")}</span>
        <Icon name={copied?"check":"link"} size={16} strokeColor="var(--text-body)"/>
      </button>

      <div style={{display:"flex",gap:10,flexWrap:"wrap"}}>
        <Button variant="outline" style={{flex:"1 1 130px",minWidth:0}} iconLeft={<Icon name="message-circle" size={15}/>}
          onClick={()=>mandar("WhatsApp","https://wa.me/?text="+encodeURIComponent(cuerpo))}>WhatsApp</Button>
        <Button variant="outline" style={{flex:"1 1 130px",minWidth:0}} iconLeft={<Icon name="mail" size={15}/>}
          onClick={()=>mandar("email","mailto:?subject="+encodeURIComponent(subject||"")+"&body="+encodeURIComponent(cuerpo))}>Email</Button>
      </div>

      {note&&<span style={{fontSize:12,color:"var(--text-subtle)",lineHeight:1.45}}>{note}</span>}
    </div>
  </Dialog>;
}
window.ShareDialog=ShareDialog;