/* ============ CHAT: realtime group chat + safety (moderation, report, word filter, rate limit) ============ */
(function(){
  const { useState, useEffect, useRef } = React;
  const { AvatarImg } = window;

  const EMOJI_CATEGORIES=[
    {k:'smile', icon:'😀', e:Array.from('😀😃😄😁😆😅😂🤣🥲☺️😊😇🙂🙃😉😍🥰😘😗😚😋😛😜🤪😝🤗🤭🤫🤔🤐😐😑😶😏😒🙄😬😌😔😪😴😷🤒🤕🤢🤮🥵🥶😳🥺😢😭😤😠😡🤬🤯😱😨😰😥🤠🥳😎🤓🧐🤡👻💀👽🤖')},
    {k:'hands', icon:'👍', e:Array.from('👍👎👌🤌🤏✌️🤞🤟🤘🤙👈👉👆👇☝️✋🤚🖐️🖖👋🤝🙏💪🦾👏🙌👐🤲🫶🫡')},
    {k:'love', icon:'❤️', e:Array.from('❤️🧡💛💚💙💜🖤🤍🤎💔💕💞💓💗💖💘💝💟😍🥰😘')},
    {k:'eco', icon:'♻️', e:Array.from('♻️🌍🌎🌏🌱🌿🍀🌳🌲🌴🌵🌾🌷🌸🌹🌺🌻🌼💐🍃🍂🍁🌊💧💦☀️⛅🌈⭐🌟✨💫🔥💚🪴')},
    {k:'party', icon:'🎉', e:Array.from('🎉🎊🥳🎈🎁🏆🥇🥈🥉🎯🏅👑💯🚀⚡🌟✨🎵🎶🪅🎀🍾🥂')},
    {k:'animals', icon:'🐶', e:Array.from('🐶🐱🐭🐹🐰🦊🐻🐼🐨🐯🦁🐮🐷🐸🐵🐔🐧🐦🐤🦄🐝🦋🐢🐙🦖🐬🐳🦅🦉🐠🐌🐞')},
    {k:'food', icon:'🍕', e:Array.from('🍎🍐🍊🍋🍌🍉🍇🍓🫐🍒🍑🥭🍍🥥🥝🍅🥑🥕🌽🍕🍔🌭🌮🍟🍩🍪🎂🧁🍦🍫🍬🍭🥤🧃☕🍺')},
    {k:'sport', icon:'⚽', e:Array.from('⚽🏀🏈⚾🎾🏐🏉🎱🏓🏸🏒🏑🏏⛳🪁🎣🛹🛼🚲🏊🚴🤸🎮🎲🎸🎺🥁🎨🎤🎯')},
  ];

  /* ---- light profanity / abuse filter (Hebrew + English roots) ----
     Best-effort client guard against the worst language; not a replacement for the
     admin "delete message" + "report" tools. Matches on a normalized string. */
  const BAD_ROOTS = [
    'זונה','זין','כוס אמא','בן זונה','בת זונה','שרמוטה','מניאק','מטומטם','מפגר','נכה','הומו','לסבית',
    'תזדיין','תזדייני','זדיין','מזדיין','שתמות','תמותי','תמות','אנס','אונס','אנאל','דפוק','חרא','קקה','תחת',
    'נאצי','כושי','ערבוש','מוסלמי מסריח','להרוג אותך','אהרוג','תהרוג',
    'fuck','f u c k','shit','bitch','slut','whore','nigger','nigga','retard','rape','kys','kill you','cunt','dick','pussy','faggot','asshole',
  ];
  function normalizeForFilter(s){
    return (s||'')
      .toLowerCase()
      .replace(/[\u0591-\u05C7]/g,'')           // strip Hebrew niqqud
      .replace(/[^\u0590-\u05FFa-z0-9 ]+/g,' ')  // keep he/en letters + digits
      .replace(/\s+/g,' ').trim();
  }
  function hasBadLanguage(text){
    const n=normalizeForFilter(text);
    const compact=n.replace(/ /g,'');
    return BAD_ROOTS.some(w=>{ const wn=w.toLowerCase(); return n.includes(wn) || compact.includes(wn.replace(/ /g,'')); });
  }

  // rate limit: no faster than ~1s apart, max 6 messages / 12s
  function makeRateLimiter(){
    const stamps=[];
    return ()=>{
      const now=Date.now();
      while(stamps.length && now-stamps[0]>12000) stamps.shift();
      if(stamps.length && now-stamps[stamps.length-1]<900) return 'slow';
      if(stamps.length>=6) return 'flood';
      stamps.push(now); return null;
    };
  }

  function timeStr(ts){
    try{ const d=new Date(ts); return d.getHours().toString().padStart(2,'0')+':'+d.getMinutes().toString().padStart(2,'0'); }catch(e){ return ''; }
  }

  function Chat({group, uid, profile, onSend, isAdmin, onDelete, onReport}){
    const { ConfirmDialog } = window;
    const [text,setText]=useState('');
    const [showEmoji,setShowEmoji]=useState(false);
    const [emojiCat,setEmojiCat]=useState(0);
    const [warn,setWarn]=useState('');
    const [menuFor,setMenuFor]=useState(null);   // message id whose action menu is open
    const [confirm,setConfirm]=useState(null);    // {type:'delete'|'report', msg}
    const [busy,setBusy]=useState(false);
    const scrollRef=useRef(null);
    const inputRef=useRef(null);
    const rateRef=useRef(null); if(!rateRef.current) rateRef.current=makeRateLimiter();
    const chat=group.chat||{};
    const msgs=Object.keys(chat).map(k=>({id:k,...chat[k]})).sort((a,b)=>(a.ts||0)-(b.ts||0));

    useEffect(()=>{ const el=scrollRef.current; if(el) el.scrollTop=el.scrollHeight; },[msgs.length]);
    useEffect(()=>{ if(!warn) return; const t=setTimeout(()=>setWarn(''),3200); return ()=>clearTimeout(t); },[warn]);

    const send=(e)=>{
      e.preventDefault(); const t=text.trim(); if(!t) return;
      if(hasBadLanguage(t)){ setWarn('בוא נשמור על שפה נעימה 💚 ההודעה לא נשלחה.'); return; }
      const rl=rateRef.current();
      if(rl==='slow'){ setWarn('רגע אחד… 🙂'); return; }
      if(rl==='flood'){ setWarn('האטו קצת — יותר מדי הודעות ברצף.'); return; }
      onSend(t); setText(''); setShowEmoji(false);
    };
    const addEmoji=(em)=>{ setText(t=>(t+em).slice(0,400)); if(inputRef.current) inputRef.current.focus(); };
    const members=group.members||{};

    const doConfirm=async()=>{
      if(!confirm) return; setBusy(true);
      try{
        if(confirm.type==='delete'){ await (onDelete&&onDelete(confirm.msg)); }
        else if(confirm.type==='report'){ await (onReport&&onReport(confirm.msg)); }
      }catch(e){}
      setBusy(false); setConfirm(null); setMenuFor(null);
    };

    return (
      <div className="chat-wrap">
        <div className="chat-scroll" ref={scrollRef} onClick={()=>menuFor&&setMenuFor(null)}>
          {msgs.length===0 && <div className="chat-empty">עדיין שקט כאן 🤫<br/>שלחו את ההודעה הראשונה!</div>}
          {msgs.map(m=>{
            const mine=m.uid===uid;
            const mem=members[m.uid]||{};
            const av=m.avatar||mem.avatar||'fox';
            const nm=m.name||mem.name||'מישהו';
            const canDelete = mine || isAdmin;
            const canReport = !mine;
            const open = menuFor===m.id;
            return (
              <div className={"msg"+(mine?' mine':'')} key={m.id}>
                {!mine && <AvatarImg value={av} size={34}/>}
                <div>
                  <div className="bubble">
                    {!mine && <div className="who">{nm}</div>}
                    <div className="txt">{m.text}</div>
                    {(canDelete||canReport) && (
                      <button type="button" className="msg-kebab" aria-label="פעולות על הודעה" onClick={(e)=>{ e.stopPropagation(); setMenuFor(open?null:m.id); }}>⋯</button>
                    )}
                    {open && (
                      <div className="msg-menu" onClick={e=>e.stopPropagation()}>
                        {canReport && <button type="button" onClick={()=>setConfirm({type:'report',msg:m})}>🚩 דיווח</button>}
                        {canDelete && <button type="button" className="del" onClick={()=>setConfirm({type:'delete',msg:m})}>🗑️ מחיקה</button>}
                      </div>
                    )}
                  </div>
                  <div className="time">{timeStr(m.ts)}</div>
                </div>
              </div>
            );
          })}
        </div>
        {warn && <div className="chat-warn" role="status">{warn}</div>}
        <form className="chat-input" onSubmit={send}>
          <button type="button" className="emoji-btn" aria-label="אימוג'ים" onClick={()=>setShowEmoji(s=>!s)}>{showEmoji?'⌨️':'😀'}</button>
          <input ref={inputRef} className="input" value={text} onChange={e=>setText(e.target.value)} onFocus={()=>setShowEmoji(false)} placeholder="כתבו הודעה לקבוצה…" maxLength={400} aria-label="הודעה לקבוצה"/>
          <button className="chat-send" type="submit" aria-label="שליחה">➤</button>
          {showEmoji && (
            <div className="emoji-pop">
              <div className="emoji-cats">
                {EMOJI_CATEGORIES.map((c,i)=>(<button type="button" key={c.k} className={emojiCat===i?'on':''} onClick={()=>setEmojiCat(i)} aria-label={"קטגוריה "+c.k}>{c.icon}</button>))}
              </div>
              <div className="emoji-grid">
                {EMOJI_CATEGORIES[emojiCat].e.map((em,j)=>(<button type="button" key={em+j} onClick={()=>addEmoji(em)}>{em}</button>))}
              </div>
            </div>
          )}
        </form>

        {confirm && ConfirmDialog && (
          <ConfirmDialog
            title={confirm.type==='delete'?'למחוק את ההודעה?':'לדווח על ההודעה?'}
            body={confirm.type==='delete'?'ההודעה תוסר מהצ\'אט לכולם.':'ההודעה תסומן ותועבר למנהל הקבוצה לבדיקה.'}
            confirmLabel={confirm.type==='delete'?'מחיקה':'דיווח'} danger={confirm.type==='delete'} busy={busy}
            onCancel={()=>{ if(!busy){ setConfirm(null); setMenuFor(null); } }}
            onConfirm={doConfirm}/>
        )}
      </div>
    );
  }

  Object.assign(window, { Chat, hasBadLanguage });
})();
