// js/components/widgets/quotes/QuoteNotificationBell.jsx
// [v224.126 NUCLEAR] Sino de notificação ORC · poll 60s lê v_quote_notifications_pending.
// View já filtra horário comercial 8-22h BRT. Vendedora vê dela; admin/financeiro vê tudo.
(function(){
  'use strict';
  function QuoteNotificationBell(props){
    var user = props.user;
    var _n = React.useState([]); var notifs = _n[0], setNotifs = _n[1];
    var _o = React.useState(false); var open = _o[0], setOpen = _o[1];

    React.useEffect(function(){
      if(!user || !window.sb) return;
      var cancelled = false;
      function fetchNotifs(){
        try {
          var query = window.sb.from('v_quote_notifications_pending').select('*').not('notification_text','is',null);
          if(user.role === 'vendedor'){ query = query.eq('seller_id', user.id); }
          query.limit(20).then(function(res){
            if(!cancelled && res && !res.error && res.data) setNotifs(res.data);
          });
        } catch(e){ /* silent — sino é best-effort */ }
      }
      fetchNotifs();
      var interval = setInterval(fetchNotifs, 60000);
      return function(){ cancelled = true; clearInterval(interval); };
    }, [user && user.id, user && user.role]);

    var urgentCount = notifs.filter(function(n){ return n.severity === 'urgent'; }).length;
    var totalCount = notifs.length;
    if(totalCount === 0) return null;

    return (
      <div style={{position:'relative',display:'inline-block'}}>
        <button onClick={function(){ setOpen(!open); }}
          style={{background:'none',border:'none',cursor:'pointer',padding:6,position:'relative'}}
          title={'ORCs precisando atenção: ' + totalCount}>
          <span style={{fontSize:20}}>🔔</span>
          {urgentCount > 0 && (
            <span style={{position:'absolute',top:0,right:0,background:'#DC2626',color:'#fff',borderRadius:'50%',minWidth:18,height:18,fontSize:10,fontWeight:700,display:'flex',alignItems:'center',justifyContent:'center'}}>{urgentCount}</span>
          )}
        </button>
        {open && (
          <div style={{position:'absolute',right:0,top:'100%',marginTop:4,background:'#fff',boxShadow:'0 4px 12px rgba(0,0,0,0.15)',borderRadius:8,padding:8,minWidth:320,maxWidth:400,zIndex:1000,maxHeight:400,overflowY:'auto'}}>
            <div style={{padding:8,fontSize:13,fontWeight:700,borderBottom:'1px solid #E5E7EB'}}>📋 ORCs precisando atenção ({totalCount})</div>
            {notifs.map(function(n){
              return React.createElement('div', {
                key: n.quote_id,
                style: { padding:8, fontSize:12, borderBottom:'1px solid #F3F4F6', background: n.severity === 'urgent' ? '#FEF2F2' : '#fff' }
              }, n.notification_text);
            })}
          </div>
        )}
      </div>
    );
  }

  window.ZNX = window.ZNX || {};
  window.ZNX.widgets = window.ZNX.widgets || {};
  window.ZNX.widgets.quotes = window.ZNX.widgets.quotes || {};
  window.ZNX.widgets.quotes.QuoteNotificationBell = QuoteNotificationBell;
})();
