// Tasks v3 — Executive Task Console
// List + Board view, Insight Bar, bulk select, inline composer, kebab menu, drag-to-reorder

const { useState, useEffect, useMemo, useRef, useCallback } = React;

// ─── Helpers ────────────────────────────────────────────────

const startOfDay = (d) => { const x = new Date(d); x.setHours(0,0,0,0); return x; };
const dayDiff = (iso) => {
  if (!iso) return null;
  const t = startOfDay(new Date(iso));
  const today = startOfDay(new Date());
  return Math.round((t - today) / 86400000);
};
const formatDue = (iso) => {
  const d = dayDiff(iso);
  if (d == null) return null;
  if (d < -1)  return `${Math.abs(d)} gün gecikti`;
  if (d === -1) return 'Dün gecikti';
  if (d === 0)  return 'Bugün';
  if (d === 1)  return 'Yarın';
  if (d < 7)    return `${d} gün sonra`;
  const dt = new Date(iso);
  return dt.toLocaleDateString('tr-TR', { day: 'numeric', month: 'short' });
};
const formatDateTime = (iso) => {
  const dt = new Date(iso);
  return dt.toLocaleString('tr-TR', { day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit' });
};
const groupTasks = (tasks) => {
  const buckets = { pinned: [], overdue: [], today: [], thisWeek: [], later: [], dateless: [], done: [] };
  for (const t of tasks) {
    if (t.status === 'done') { buckets.done.push(t); continue; }
    if (t.pinned) { buckets.pinned.push(t); continue; }
    if (t.due_at == null) { buckets.dateless.push(t); continue; }
    const d = dayDiff(t.due_at);
    if (d < 0)      buckets.overdue.push(t);
    else if (d === 0) buckets.today.push(t);
    else if (d <= 7)  buckets.thisWeek.push(t);
    else              buckets.later.push(t);
  }
  // sort each bucket by due, then prio
  const sorter = (a, b) => {
    const ad = a.due_at ? new Date(a.due_at).getTime() : Infinity;
    const bd = b.due_at ? new Date(b.due_at).getTime() : Infinity;
    if (ad !== bd) return ad - bd;
    return b.priority - a.priority;
  };
  Object.values(buckets).forEach(b => b.sort(sorter));
  return buckets;
};
const GROUP_DEFS = [
  { key: 'pinned',   emoji: '📌', label: 'Sabit',     defaultOpen: true  },
  { key: 'overdue',  emoji: '🔥', label: 'Gecikmiş',  defaultOpen: true  },
  { key: 'today',    emoji: '☀️', label: 'Bugün',     defaultOpen: true  },
  { key: 'thisWeek', emoji: '📅', label: 'Bu Hafta',  defaultOpen: true  },
  { key: 'later',    emoji: '🌙', label: 'Sonra',     defaultOpen: true  },
  { key: 'dateless', emoji: '🔮', label: 'Tarihsiz',  defaultOpen: false },
  { key: 'done',     emoji: '✅', label: 'Tamamlanan', defaultOpen: false },
];

// ─── Icons (inline mini) ────────────────────────────────────

const ChevronIcon = ({ size = 14 }) => (
  <svg width={size} height={size} viewBox="0 0 16 16" fill="none">
    <path d="M4 6l4 4 4-4" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round"/>
  </svg>
);
const KebabIcon = () => (
  <svg width="14" height="14" viewBox="0 0 16 16" fill="none">
    <circle cx="8" cy="3" r="1.4" fill="currentColor"/>
    <circle cx="8" cy="8" r="1.4" fill="currentColor"/>
    <circle cx="8" cy="13" r="1.4" fill="currentColor"/>
  </svg>
);
const DragIcon = () => (
  <svg width="10" height="14" viewBox="0 0 10 14" fill="none">
    {[0,1,2].map(r => [0,1].map(c => (
      <circle key={`${r}-${c}`} cx={2 + c*5} cy={2 + r*5} r="1.1" fill="currentColor"/>
    )))}
  </svg>
);
const PlusIcon = ({ size = 14 }) => (
  <svg width={size} height={size} viewBox="0 0 16 16" fill="none">
    <path d="M8 3v10M3 8h10" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round"/>
  </svg>
);
const CloseIcon = ({ size = 14 }) => (
  <svg width={size} height={size} viewBox="0 0 16 16" fill="none">
    <path d="M4 4l8 8M12 4l-8 8" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round"/>
  </svg>
);
const SearchIcon = () => (
  <svg width="14" height="14" viewBox="0 0 16 16" fill="none">
    <circle cx="7" cy="7" r="4.5" stroke="currentColor" strokeWidth="1.4"/>
    <path d="M11 11l3 3" stroke="currentColor" strokeWidth="1.4" strokeLinecap="round"/>
  </svg>
);
const FilterIcon = () => (
  <svg width="14" height="14" viewBox="0 0 16 16" fill="none">
    <path d="M2 3h12l-4.5 6V13l-3 1.5V9L2 3z" stroke="currentColor" strokeWidth="1.4" strokeLinejoin="round"/>
  </svg>
);
const ListIcon = () => (
  <svg width="14" height="14" viewBox="0 0 16 16" fill="none">
    <path d="M4 4h9M4 8h9M4 12h9" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round"/>
    <circle cx="2" cy="4" r="0.8" fill="currentColor"/>
    <circle cx="2" cy="8" r="0.8" fill="currentColor"/>
    <circle cx="2" cy="12" r="0.8" fill="currentColor"/>
  </svg>
);
const BoardIcon = () => (
  <svg width="14" height="14" viewBox="0 0 16 16" fill="none">
    <rect x="2" y="3" width="3.6" height="10" rx="1" stroke="currentColor" strokeWidth="1.4"/>
    <rect x="6.2" y="3" width="3.6" height="6" rx="1" stroke="currentColor" strokeWidth="1.4"/>
    <rect x="10.4" y="3" width="3.6" height="8" rx="1" stroke="currentColor" strokeWidth="1.4"/>
  </svg>
);
const ArrowIcon = () => (
  <svg width="10" height="10" viewBox="0 0 10 10" fill="none">
    <path d="M3 1l4 4-4 4" stroke="currentColor" strokeWidth="1.4" strokeLinecap="round" strokeLinejoin="round"/>
  </svg>
);

// ─── TaskRow ────────────────────────────────────────────────

const TaskRow = ({ task, selected, onCheck, onOpen, onSelect, onPin, onDelete, onSnooze, onDelegate, onSendChat, onSourceOpen, isNew }) => {
  const [menuOpen, setMenuOpen] = useState(false);
  const [submenu, setSubmenu] = useState(null);
  const menuRef = useRef(null);
  const cat = window.TASK_CATEGORY[task.category] || window.TASK_CATEGORY.other || { emoji: '📌', label: 'Diğer', color: '#8E8E93' };
  const prio = window.TASK_PRIO[task.priority];
  const dueLabel = formatDue(task.due_at);
  const dayD = dayDiff(task.due_at);
  const isCompleted = task.status === 'done';

  useEffect(() => {
    if (!menuOpen) return;
    const handler = (e) => {
      if (menuRef.current && !menuRef.current.contains(e.target)) {
        setMenuOpen(false); setSubmenu(null);
      }
    };
    setTimeout(() => document.addEventListener('click', handler), 0);
    return () => document.removeEventListener('click', handler);
  }, [menuOpen]);

  const handleRowClick = (e) => {
    if (e.metaKey || e.ctrlKey) { onSelect(task.id, true); return; }
    onOpen(task);
  };

  const dueCls = dayD == null ? '' : (dayD < 0 ? 'due-overdue' : dayD === 0 ? 'due-today' : '');

  return (
    <div
      className={`task-row${selected ? ' selected' : ''}${isCompleted ? ' completed' : ''}${isNew ? ' task-row-enter' : ''}`}
      onClick={handleRowClick}
    >
      <div className="task-drag-handle"><DragIcon /></div>
      <button
        className={`task-checkbox${isCompleted ? ' checked' : ''}`}
        onClick={(e) => { e.stopPropagation(); onCheck(task.id); }}
        aria-label="tamamla"
      />
      <div className="task-body">
        <p className="task-title">{task.title}</p>
        <div className="task-meta">
          <span className={`task-pill prio-${task.priority}`}>{prio.emoji} {prio.label}</span>
          <span className="task-pill"><span>{cat.emoji}</span> {cat.label}</span>
          {dueLabel && <span className={`task-pill ${dueCls}`}>📅 {dueLabel}</span>}
          {task.owner !== 'neset' && (
            <span className="task-pill">👤 {(window.AGENTS_FOR_DELEGATE.find(a => a.id === task.owner)||{}).name || task.owner}</span>
          )}
          {task.pinned && <span className="task-pill">📌 Sabit</span>}
        </div>
        {(task.rationale || task.source_type !== 'manual') && (
          <div className="task-rationale-line">
            {task.rationale && <span className="task-rationale">"{task.rationale}"</span>}
            {task.source_type !== 'manual' && (
              <button className="task-source-link" onClick={(e) => e.stopPropagation()}>
                📂 {task.source_type === 'meeting' ? 'Toplantı' : 'Sohbet'} ↗
              </button>
            )}
          </div>
        )}
      </div>
      <div style={{ position: 'relative' }} ref={menuRef}>
        <button
          className="task-kebab"
          onClick={(e) => { e.stopPropagation(); setMenuOpen(o => !o); }}
          aria-label="menü"
        ><KebabIcon /></button>
        {menuOpen && (
          <div className="kebab-menu" onClick={(e) => e.stopPropagation()}>
            <button className="kebab-item" onClick={() => { onOpen(task); setMenuOpen(false); }}>
              <span className="kebab-item-emoji">✏️</span> Düzenle
            </button>
            <button className="kebab-item" onClick={() => { onPin(task.id); setMenuOpen(false); }}>
              <span className="kebab-item-emoji">📌</span> {task.pinned ? 'Sabitten Çıkar' : 'Sabitle'}
            </button>
            <div style={{ position: 'relative' }} onMouseEnter={() => setSubmenu('snooze')} onMouseLeave={() => setSubmenu(null)}>
              <button className="kebab-item">
                <span className="kebab-item-emoji">🔄</span> Erteleme <span className="kebab-item-arrow"><ArrowIcon /></span>
              </button>
              {submenu === 'snooze' && (
                <div className="kebab-submenu">
                  <button className="kebab-item" onClick={() => { onSnooze(task.id, 1); setMenuOpen(false); }}>Yarına</button>
                  <button className="kebab-item" onClick={() => { onSnooze(task.id, 7); setMenuOpen(false); }}>Bu hafta</button>
                  <button className="kebab-item" onClick={() => { onSnooze(task.id, 14); setMenuOpen(false); }}>2 hafta sonra</button>
                </div>
              )}
            </div>
            <div style={{ position: 'relative' }} onMouseEnter={() => setSubmenu('delegate')} onMouseLeave={() => setSubmenu(null)}>
              <button className="kebab-item">
                <span className="kebab-item-emoji">👤</span> Birine ata <span className="kebab-item-arrow"><ArrowIcon /></span>
              </button>
              {submenu === 'delegate' && (
                <div className="kebab-submenu">
                  {window.AGENTS_FOR_DELEGATE.map(a => (
                    <button key={a.id} className="kebab-item" onClick={() => { onDelegate(task.id, a.id); setMenuOpen(false); }}>
                      <span className="kebab-item-emoji">{a.emoji}</span> {a.name}
                    </button>
                  ))}
                </div>
              )}
            </div>
            <button
              className="kebab-item"
              onClick={() => {
                setMenuOpen(false);
                onSendChat?.(`"${task.title}" görevi hakkında düşünüp tavsiyeni al, ne yapmalıyım?`);
              }}
            >
              <span className="kebab-item-emoji">💬</span> Sohbette aç
            </button>
            {task.source_type !== 'manual' && (task.source_id || task.source_meeting_id) && (
              <button
                className="kebab-item"
                onClick={() => { setMenuOpen(false); onSourceOpen?.(task); }}
              >
                <span className="kebab-item-emoji">📂</span>
                {task.source_type === 'meeting' ? ' Toplantıyı aç' : ' Sohbeti aç'}
              </button>
            )}
            <div className="kebab-divider" />
            <button className="kebab-item danger" onClick={() => { onDelete(task.id); setMenuOpen(false); }}>
              <span className="kebab-item-emoji">🗑️</span> Sil
            </button>
          </div>
        )}
      </div>
    </div>
  );
};

// ─── Inline Composer ────────────────────────────────────────

const InlineComposer = ({ onSave, onCancel, defaultGroup }) => {
  const [title, setTitle] = useState('');
  const [priority, setPriority] = useState(1);
  const [category, setCategory] = useState('strategy');
  const [dueOffset, setDueOffset] = useState(defaultGroup === 'today' ? 0 : defaultGroup === 'thisWeek' ? 3 : null);
  const [owner, setOwner] = useState('neset');
  const [picker, setPicker] = useState(null);
  const inputRef = useRef(null);

  useEffect(() => { inputRef.current?.focus(); }, []);

  const submit = (keepOpen = false) => {
    if (!title.trim()) { if (!keepOpen) onCancel(); return; }
    let due_at = null;
    if (dueOffset != null) {
      const d = new Date(); d.setDate(d.getDate() + dueOffset); d.setHours(17, 0, 0, 0);
      due_at = d.toISOString();
    }
    onSave({ title: title.trim(), priority, category, due_at, owner });
    setTitle('');
    if (!keepOpen) onCancel();
  };

  const onKey = (e) => {
    if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) { e.preventDefault(); submit(true); }
    else if (e.key === 'Enter') { e.preventDefault(); submit(false); }
    else if (e.key === 'Escape') { e.preventDefault(); onCancel(); }
  };

  const dueLabel = dueOffset == null ? 'Tarihsiz' : dueOffset === 0 ? 'Bugün' : dueOffset === 1 ? 'Yarın' : dueOffset === 3 ? 'Bu hafta' : `${dueOffset} gün sonra`;

  return (
    <div className="composer-row" onClick={(e) => e.stopPropagation()}>
      <div className="composer-top">
        <div />
        <input
          ref={inputRef}
          className="composer-input"
          placeholder="Bir görev yaz, Enter'a bas…"
          value={title}
          onChange={(e) => setTitle(e.target.value)}
          onKeyDown={onKey}
        />
        <button className="task-kebab" style={{ opacity: 1 }} onClick={onCancel}><CloseIcon /></button>
      </div>
      <div className="composer-meta" style={{ position: 'relative' }}>
        <button className="composer-pill" onClick={() => setPicker(p => p === 'prio' ? null : 'prio')}>
          {window.TASK_PRIO[priority].emoji} {window.TASK_PRIO[priority].label} ▾
        </button>
        <button className="composer-pill" onClick={() => setPicker(p => p === 'cat' ? null : 'cat')}>
          {(window.TASK_CATEGORY[category] || window.TASK_CATEGORY.other || {}).emoji} {(window.TASK_CATEGORY[category] || window.TASK_CATEGORY.other || {}).label || 'Diğer'} ▾
        </button>
        <button className="composer-pill" onClick={() => setPicker(p => p === 'due' ? null : 'due')}>
          📅 {dueLabel} ▾
        </button>
        <button className="composer-pill" onClick={() => setPicker(p => p === 'own' ? null : 'own')}>
          👤 {owner === 'neset' ? 'Neşet' : (window.AGENTS_FOR_DELEGATE.find(a => a.id === owner)||{}).name} ▾
        </button>
        <span className="composer-hint" style={{ marginLeft: 'auto' }}>
          <kbd>↵</kbd> kaydet · <kbd>⌘↵</kbd> kaydet & yeni · <kbd>esc</kbd> kapat
        </span>

        {picker && (
          <div className="kebab-menu" style={{ top: 'calc(100% + 6px)', left: 0, right: 'auto', minWidth: 180 }}>
            {picker === 'prio' && [2,1,0].map(p => (
              <button key={p} className="kebab-item" onClick={() => { setPriority(p); setPicker(null); }}>
                <span className="kebab-item-emoji">{window.TASK_PRIO[p].emoji}</span> {window.TASK_PRIO[p].label}
              </button>
            ))}
            {picker === 'cat' && Object.entries(window.TASK_CATEGORY).map(([k, c]) => (
              <button key={k} className="kebab-item" onClick={() => { setCategory(k); setPicker(null); }}>
                <span className="kebab-item-emoji">{c.emoji}</span> {c.label}
              </button>
            ))}
            {picker === 'due' && [
              { o: 0, l: 'Bugün' }, { o: 1, l: 'Yarın' }, { o: 3, l: 'Bu hafta (Pers)' }, { o: 7, l: 'Gelecek hafta' }, { o: null, l: 'Tarihsiz' },
            ].map(opt => (
              <button key={String(opt.o)} className="kebab-item" onClick={() => { setDueOffset(opt.o); setPicker(null); }}>
                <span className="kebab-item-emoji">📅</span> {opt.l}
              </button>
            ))}
            {picker === 'own' && [{ id: 'neset', name: 'Neşet (sen)', emoji: '🧑‍💼' }, ...window.AGENTS_FOR_DELEGATE].map(a => (
              <button key={a.id} className="kebab-item" onClick={() => { setOwner(a.id); setPicker(null); }}>
                <span className="kebab-item-emoji">{a.emoji}</span> {a.name}
              </button>
            ))}
          </div>
        )}
      </div>
    </div>
  );
};

// ─── Insight Bar ────────────────────────────────────────────

const InsightBar = ({ insight, dismissed, onDismiss, onReprioritize }) => {
  if (!insight || dismissed) return null;
  return (
    <div className="insight-bar">
      <span className="insight-emoji">💡</span>
      <div className="insight-body">
        <span className="insight-head">Chief of Staff özetlemiş</span>
        <p className="insight-text">{insight.summary}</p>
        <div className="insight-actions">
          <button className="insight-link" onClick={onReprioritize}>Önceliklerimi yeniden düzenle →</button>
          <button className="insight-link muted" onClick={onDismiss}>Görmezden gel</button>
        </div>
      </div>
    </div>
  );
};

// ─── View Switch ────────────────────────────────────────────

const ViewSwitch = ({ value, onChange }) => (
  <div className="view-switch">
    <button className={value === 'list' ? 'active' : ''} onClick={() => onChange('list')}>
      <ListIcon /> Liste
    </button>
    <button className={value === 'board' ? 'active' : ''} onClick={() => onChange('board')}>
      <BoardIcon /> Kanban
    </button>
  </div>
);

// ─── Filter Popover ─────────────────────────────────────────

const FilterPop = ({ filters, setFilters, onClose }) => {
  const toggle = (group, val) => {
    setFilters(f => {
      const cur = new Set(f[group] || []);
      if (cur.has(val)) cur.delete(val); else cur.add(val);
      return { ...f, [group]: [...cur] };
    });
  };
  const isOn = (g, v) => (filters[g] || []).includes(v);
  return (
    <div className="tasks-filter-pop" onClick={(e) => e.stopPropagation()}>
      <div className="filter-section">
        <span className="filter-section-h">Öncelik</span>
        <div className="filter-chips">
          {[2,1,0].map(p => (
            <button key={p} className={`filter-chip${isOn('priority', p) ? ' on' : ''}`} onClick={() => toggle('priority', p)}>
              {window.TASK_PRIO[p].emoji} {window.TASK_PRIO[p].label}
            </button>
          ))}
        </div>
      </div>
      <div className="filter-section">
        <span className="filter-section-h">Kategori</span>
        <div className="filter-chips">
          {Object.entries(window.TASK_CATEGORY).map(([k, c]) => (
            <button key={k} className={`filter-chip${isOn('category', k) ? ' on' : ''}`} onClick={() => toggle('category', k)}>
              {c.emoji} {c.label}
            </button>
          ))}
        </div>
      </div>
      <div className="filter-section">
        <span className="filter-section-h">Kaynak</span>
        <div className="filter-chips">
          {[['manual','Manuel'],['meeting','Toplantı'],['chat','Sohbet']].map(([k, l]) => (
            <button key={k} className={`filter-chip${isOn('source', k) ? ' on' : ''}`} onClick={() => toggle('source', k)}>{l}</button>
          ))}
        </div>
      </div>
      <div className="filter-foot">
        <button onClick={() => setFilters({})}>Temizle</button>
        <button className="primary" onClick={onClose}>Uygula</button>
      </div>
    </div>
  );
};

// ─── Bulk Bar ───────────────────────────────────────────────

const BulkBar = ({ count, onAction, onClear }) => (
  <div className="bulk-bar">
    <div className="bulk-count"><span>{count}</span> görev seçildi</div>
    <div className="bulk-actions">
      <button className="bulk-action" onClick={() => onAction('complete')}>✓ Tamamla</button>
      <button className="bulk-action" onClick={() => onAction('snooze')}>📅 Ertele</button>
      <button className="bulk-action" onClick={() => onAction('delegate')}>👤 Birine ata</button>
      <button className="bulk-action danger" onClick={() => onAction('delete')}>🗑️ Sil</button>
    </div>
    <button className="bulk-clear" onClick={onClear}><CloseIcon /></button>
  </div>
);

// ─── Group ──────────────────────────────────────────────────

const TaskGroup = ({ def, items, open, onToggle, onAddInline, ...rowProps }) => {
  const yuksek = items.filter(t => t.priority === 2).length;
  return (
    <div className="task-group">
      <div className="task-group-h" onClick={onToggle}>
        <span className={`task-group-chev${open ? '' : ' collapsed'}`}><ChevronIcon /></span>
        <span className="task-group-emoji">{def.emoji}</span>
        <span className="task-group-label">{def.label}</span>
        <span className="task-group-meta">{items.length} görev{yuksek > 0 ? ` · ${yuksek} yüksek prio` : ''}</span>
        <button className="task-group-add-inline" onClick={(e) => { e.stopPropagation(); onAddInline(def.key); }}>
          <PlusIcon />
        </button>
      </div>
      <div className={`task-group-body${open ? '' : ' collapsed'}`} style={open ? {} : { maxHeight: 0 }}>
        {items.map(t => (
          <TaskRow
            key={t.id}
            task={t}
            selected={!!t.selected}
            isNew={!!t.isNew}
            {...rowProps}
          />
        ))}
        {items.length === 0 && (
          <div style={{ padding: '8px 16px 14px', fontSize: 12, color: 'var(--text-tertiary)' }}>—</div>
        )}
      </div>
    </div>
  );
};

// ─── Kanban Card ────────────────────────────────────────────

const KanbanCard = ({ task, onOpen, onDragStart }) => {
  const cat = window.TASK_CATEGORY[task.category] || window.TASK_CATEGORY.other || { emoji: '📌', label: 'Diğer', color: '#8E8E93' };
  const prio = window.TASK_PRIO[task.priority];
  const dueLabel = formatDue(task.due_at);
  const dayD = dayDiff(task.due_at);
  const dueCls = dayD == null ? '' : (dayD < 0 ? 'due-overdue' : dayD === 0 ? 'due-today' : '');
  const isCompleted = task.status === 'done';
  return (
    <div
      className={`kanban-card${isCompleted ? ' completed' : ''}`}
      draggable
      onDragStart={(e) => onDragStart(e, task.id)}
      onClick={() => onOpen(task)}
    >
      <p className="kanban-card-title">{task.title}</p>
      <div className="kanban-card-meta">
        <span className={`task-pill prio-${task.priority}`}>{prio.emoji} {prio.label}</span>
        <span className="task-pill">{cat.emoji} {cat.label}</span>
        {dueLabel && <span className={`task-pill ${dueCls}`}>📅 {dueLabel}</span>}
      </div>
    </div>
  );
};

// ─── Board View ─────────────────────────────────────────────

const BoardView = ({ tasks, onOpen, onMove, onAdd }) => {
  const [dragOver, setDragOver] = useState(null);
  const cols = useMemo(() => ({
    open: tasks.filter(t => t.status === 'open'),
    in_progress: tasks.filter(t => t.status === 'in_progress'),
    done: tasks.filter(t => t.status === 'done'),
  }), [tasks]);

  const colMeta = {
    open:        { emoji: '📥', label: 'Açık' },
    in_progress: { emoji: '⚙️',  label: 'Devam Ediyor' },
    done:        { emoji: '✅', label: 'Tamamlandı' },
  };

  const onDragStart = (e, id) => {
    e.dataTransfer.setData('text/task-id', id);
    e.dataTransfer.effectAllowed = 'move';
  };
  const onDrop = (e, status) => {
    e.preventDefault();
    const id = e.dataTransfer.getData('text/task-id');
    if (id) onMove(id, status);
    setDragOver(null);
  };

  return (
    <div className="tasks-board">
      {['open', 'in_progress', 'done'].map(status => (
        <div
          key={status}
          className={`kanban-col${dragOver === status ? ' drag-over' : ''}`}
          onDragOver={(e) => { e.preventDefault(); setDragOver(status); }}
          onDragLeave={() => setDragOver(null)}
          onDrop={(e) => onDrop(e, status)}
        >
          <div className="kanban-col-h">
            <span className="kanban-col-h-emoji">{colMeta[status].emoji}</span>
            {colMeta[status].label}
            <span className="kanban-col-count">{cols[status].length}</span>
          </div>
          {cols[status].map(t => <KanbanCard key={t.id} task={t} onOpen={onOpen} onDragStart={onDragStart} />)}
          {status === 'open' && (
            <button className="kanban-add" onClick={onAdd}><PlusIcon size={12} /> Görev ekle</button>
          )}
        </div>
      ))}
    </div>
  );
};

// ─── Shortcuts modal ────────────────────────────────────────

const ShortcutsModal = ({ onClose }) => {
  const items = [
    ['⌘N',     'Yeni görev'],
    ['⌘K',     'Ara'],
    ['⌘F',     'Filtre'],
    ['⌘1 / ⌘2','Liste / Kanban'],
    ['Space',  'Inspector aç'],
    ['⌘↵',     'Tamamla'],
    ['⌘P',     'Sabitle'],
    ['⌘D',     'Sil'],
    ['J / K',  'Sonraki / önceki'],
    ['1/2/3',  'Öncelik düşük/orta/yk'],
    ['⌘⇧↵',    'Toplu tamamla'],
    ['Esc',    'Kapat'],
  ];
  return (
    <div className="shortcuts-overlay" onClick={onClose}>
      <div className="shortcuts-modal" onClick={(e) => e.stopPropagation()}>
        <h3 className="shortcuts-h">Klavye Kısayolları</h3>
        <p className="shortcuts-sub">Linear ve Things 3 hızında çalış.</p>
        <div className="shortcuts-grid">
          {items.map(([k, l]) => (
            <div className="shortcut-row" key={k}>
              <span>{l}</span>
              <span className="shortcut-keys">
                {k.split(' / ').map((part, i) => (
                  <kbd key={i}>{part}</kbd>
                ))}
              </span>
            </div>
          ))}
        </div>
      </div>
    </div>
  );
};

// ─── Inspector ──────────────────────────────────────────────

const TaskInspector = ({ task, onClose, onUpdate, onDelegate, onDelete, onSnooze, onCheck, onPin, onSendChat, onSourceOpen }) => {
  const [delegateOpen, setDelegateOpen] = useState(false);
  const [categoryOpen, setCategoryOpen] = useState(false);
  const overlayRef = useRef(null);

  useEffect(() => {
    const h = (e) => { if (e.key === 'Escape') onClose(); };
    window.addEventListener('keydown', h);
    return () => window.removeEventListener('keydown', h);
  }, [onClose]);

  if (!task) return null;
  const cat = window.TASK_CATEGORY[task.category] || window.TASK_CATEGORY.other || { emoji: '📌', label: 'Diğer', color: '#8E8E93' };
  const prio = window.TASK_PRIO[task.priority];
  const isCompleted = task.status === 'done';
  const dueLabel = task.due_at
    ? new Date(task.due_at).toLocaleDateString('tr-TR', { weekday: 'long', day: 'numeric', month: 'long' })
    : 'Tarih yok';
  const ownerLabel = task.owner === 'neset'
    ? 'Neşet (sen)'
    : (window.AGENTS_FOR_DELEGATE.find(a => a.id === task.owner) || { name: task.owner }).name;
  const sourceLabel = task.source_type === 'meeting' ? 'Toplantı kaynağı'
    : task.source_type === 'chat' ? 'Sohbet kaynağı' : 'Manuel oluşturuldu';
  const history = window.TASK_HISTORY[task.id] || [
    { ts: task.created_at, label: 'Oluşturuldu', who: sourceLabel },
  ];

  return (
    <>
      <div ref={overlayRef} className="task-inspector-overlay" onClick={onClose} />
      <aside className="task-inspector" onClick={(e) => e.stopPropagation()}>
        <div className="insp-head">
          <button
            className={`task-checkbox${isCompleted ? ' checked' : ''}`}
            onClick={() => onCheck(task.id)}
          />
          <h2 className={`insp-title${isCompleted ? ' completed' : ''}`}>{task.title}</h2>
          <button className="insp-close" onClick={onClose}><CloseIcon size={16} /></button>
        </div>

        <div className="insp-pills">
          <span className={`task-pill prio-${task.priority}`}>{prio.emoji} {prio.label}</span>
          <span className="task-pill">{cat.emoji} {cat.label}</span>
          <span className="task-pill">👤 {ownerLabel}</span>
          {task.pinned && <span className="task-pill">📌 Sabit</span>}
        </div>

        {task.description && (
          <div className="insp-section">
            <span className="insp-section-h">Açıklama</span>
            <p className="insp-desc">{task.description}</p>
          </div>
        )}

        <div className="insp-section">
          <div className="insp-rows">
            <button className="insp-row" onClick={() => onSnooze(task.id, 1)}>
              <span className="insp-row-icon">📅</span>
              <span className="insp-row-label">Tarih</span>
              <span className="insp-row-value">{dueLabel}</span>
              <span className="insp-row-arrow"><ArrowIcon /></span>
            </button>
            <button className="insp-row" onClick={() => onUpdate(task.id, { priority: (task.priority + 1) % 3 })}>
              <span className="insp-row-icon">⚡</span>
              <span className="insp-row-label">Öncelik</span>
              <span className="insp-row-value">{prio.label}</span>
              <span className="insp-row-arrow"><ArrowIcon /></span>
            </button>
            <div style={{ position: 'relative' }}>
              <button className="insp-row" onClick={() => setCategoryOpen(o => !o)}>
                <span className="insp-row-icon">{cat.emoji}</span>
                <span className="insp-row-label">Kategori</span>
                <span className="insp-row-value">{cat.label}</span>
                <span className="insp-row-arrow"><ArrowIcon /></span>
              </button>
              {categoryOpen && (
                <div className="insp-delegate-pop" style={{ top: '100%', marginTop: 6 }}>
                  {Object.entries(window.TASK_CATEGORY).map(([k, c]) => (
                    <button
                      key={k}
                      className={`kebab-item${k === task.category ? ' active' : ''}`}
                      onClick={() => { onUpdate(task.id, { category: k }); setCategoryOpen(false); }}
                    >
                      <span className="kebab-item-emoji">{c.emoji}</span> {c.label}
                    </button>
                  ))}
                </div>
              )}
            </div>
            <button className="insp-row" onClick={() => setDelegateOpen(true)}>
              <span className="insp-row-icon">👤</span>
              <span className="insp-row-label">Atanan</span>
              <span className="insp-row-value">{ownerLabel}</span>
              <span className="insp-row-arrow"><ArrowIcon /></span>
            </button>
            {task.source_type !== 'manual' && (task.source_id || task.source_meeting_id) && (
              <button
                className="insp-row"
                onClick={() => { onSourceOpen?.(task); onClose?.(); }}
              >
                <span className="insp-row-icon">📂</span>
                <span className="insp-row-label">Kaynak</span>
                <span className="insp-row-value">
                  {task.source_type === 'meeting' ? 'Toplantıyı aç' : 'Sohbeti aç'} ↗
                </span>
                <span className="insp-row-arrow"><ArrowIcon /></span>
              </button>
            )}
          </div>
        </div>

        {task.rationale && (
          <div className="insp-section">
            <span className="insp-section-h">📜 Rationale — Niye bu task?</span>
            <div className="insp-rationale">"{task.rationale}"</div>
          </div>
        )}

        <div className="insp-section">
          <span className="insp-section-h">📊 Zaman Çizgisi</span>
          <div className="insp-timeline">
            {history.map((h, i) => (
              <div key={i} className="insp-tl-item">
                <div className="insp-tl-dot" />
                <div>
                  <div className="insp-tl-label">{h.label}</div>
                  <span className="insp-tl-who">{h.who}</span>
                </div>
                <div className="insp-tl-time">{formatDateTime(h.ts)}</div>
              </div>
            ))}
          </div>
        </div>

        <div className="insp-actions">
          {delegateOpen && (
            <div className="insp-delegate-pop">
              {window.AGENTS_FOR_DELEGATE.map(a => (
                <button
                  key={a.id}
                  className="kebab-item"
                  onClick={() => {
                    onDelegate(task.id, a.id);
                    setDelegateOpen(false);
                    onClose();
                    // Babam'ı agent'la sohbete yönlendir (backend conversation zaten açıldı)
                    if (onSendChat) {
                      setTimeout(() => onSendChat(`"${task.title}" görevini sana devrettim. Bu konuda ne öneriyorsun?`), 100);
                    }
                  }}
                >
                  <span className="kebab-item-emoji">{a.emoji}</span> {a.name}
                  <span className="kebab-item-arrow" style={{ marginLeft: 'auto', fontSize: 11 }}>{a.label}</span>
                </button>
              ))}
            </div>
          )}
          <button className="insp-cta" onClick={() => setDelegateOpen(o => !o)}>
            💬 Bunu birine devret →
          </button>
          <div className="insp-secondary">
            <button onClick={() => onPin(task.id)}>{task.pinned ? 'Sabitten çıkar' : '📌 Sabitle'}</button>
            <button onClick={() => onSnooze(task.id, 1)}>Yarına ertele</button>
            <button className="danger" onClick={() => { onDelete(task.id); onClose(); }}>🗑️ Sil</button>
          </div>
        </div>
      </aside>
    </>
  );
};

// ─── Main TasksScreen ───────────────────────────────────────

const TasksScreenV3 = ({ onSendChat, onOpenMeeting, onOpenConversation }) => {
  const [tasks, setTasks] = useState(() => (window.TASKS_V3 || []).map(t => ({ ...t })));
  const [insight, setInsight] = useState(window.TASK_INSIGHT || null);
  const [insightDismissed, setInsightDismissed] = useState(false);

  // Mount: backend'den gerçek görevleri + insight'ı çek
  useEffect(() => {
    if (!window.KW?.online) return;
    (async () => {
      try {
        const [list, ins] = await Promise.all([
          window.KW.listTasksV3(true),
          window.KW.getTaskInsights(),
        ]);
        if (list) setTasks(list);
        if (ins) setInsight(ins);
      } catch (e) { console.warn('[tasks] mount fetch fail', e); }
    })();
  }, []);
  const [taskView, setTaskView] = useState('list');
  const [search, setSearch] = useState('');
  const [filters, setFilters] = useState({});
  const [filterOpen, setFilterOpen] = useState(false);
  const [selected, setSelected] = useState(new Set());
  const [openGroups, setOpenGroups] = useState(() => {
    const o = {}; GROUP_DEFS.forEach(g => o[g.key] = g.defaultOpen); return o;
  });
  const [composerGroup, setComposerGroup] = useState(null);   // group key OR '__top'
  const [shortcutsOpen, setShortcutsOpen] = useState(false);
  const [recentlyAddedId, setRecentlyAddedId] = useState(null);
  const [inspectorTaskId, setInspectorTaskId] = useState(null);
  const filterWrapRef = useRef(null);

  // close filter on outside click
  useEffect(() => {
    if (!filterOpen) return;
    const h = (e) => { if (filterWrapRef.current && !filterWrapRef.current.contains(e.target)) setFilterOpen(false); };
    setTimeout(() => document.addEventListener('click', h), 0);
    return () => document.removeEventListener('click', h);
  }, [filterOpen]);

  // ── derive filtered tasks ──
  const filtered = useMemo(() => {
    return tasks.filter(t => {
      if (search && !t.title.toLowerCase().includes(search.toLowerCase())) return false;
      const fp = filters.priority, fc = filters.category, fs = filters.source;
      if (fp && fp.length && !fp.includes(t.priority)) return false;
      if (fc && fc.length && !fc.includes(t.category)) return false;
      if (fs && fs.length && !fs.includes(t.source_type)) return false;
      return true;
    });
  }, [tasks, search, filters]);

  const grouped = useMemo(() => groupTasks(filtered), [filtered]);

  // Header stats (always over full task set)
  const stats = useMemo(() => {
    const open = tasks.filter(t => t.status !== 'done').length;
    const overdue = tasks.filter(t => t.status !== 'done' && dayDiff(t.due_at) != null && dayDiff(t.due_at) < 0).length;
    const doneThisWeek = tasks.filter(t => t.status === 'done' && t.completed_at && dayDiff(t.completed_at) >= -7).length;
    return { open, overdue, doneThisWeek };
  }, [tasks]);

  // ── actions (optimistic + backend persist) ──
  const KW_ON = () => !!window.KW?.online;

  const toggleCheck = useCallback((id) => {
    let prevStatus = null;
    setTasks(ts => ts.map(t => {
      if (t.id !== id) return t;
      prevStatus = t.status;
      const newStatus = t.status === 'done' ? 'open' : 'done';
      return { ...t, status: newStatus, completed_at: newStatus === 'done' ? new Date().toISOString() : null };
    }));
    if (KW_ON()) {
      const newDone = prevStatus !== 'done';
      window.KW.toggleTask(id, newDone).catch(e => console.warn('[tasks] toggle fail', e));
    }
  }, []);

  const togglePin = useCallback((id) => {
    let newPinned = false;
    setTasks(ts => ts.map(t => {
      if (t.id !== id) return t;
      newPinned = !t.pinned;
      return { ...t, pinned: newPinned };
    }));
    if (KW_ON()) window.KW.updateTask(id, { pinned: newPinned ? 1 : 0 }).catch(() => {});
  }, []);

  const deleteTask = useCallback((id) => {
    setTasks(ts => ts.filter(t => t.id !== id));
    setSelected(s => { const n = new Set(s); n.delete(id); return n; });
    if (KW_ON()) window.KW.deleteTask(id).catch(() => {});
  }, []);

  const snoozeTask = useCallback((id, days) => {
    let newDate = null;
    setTasks(ts => ts.map(t => {
      if (t.id !== id) return t;
      const d = new Date(); d.setDate(d.getDate() + days); d.setHours(17, 0, 0, 0);
      newDate = d.toISOString();
      return { ...t, due_at: newDate };
    }));
    if (KW_ON() && newDate) window.KW.updateTask(id, { dueDate: newDate.slice(0, 10) }).catch(() => {});
  }, []);

  const delegateTask = useCallback(async (id, agentId) => {
    setTasks(ts => ts.map(t => t.id === id ? { ...t, owner: agentId, status: 'in_progress' } : t));
    if (KW_ON()) {
      try { await window.KW.delegateTask(id, agentId); }
      catch (e) { console.warn('[tasks] delegate fail', e); }
    }
  }, []);

  const moveTaskStatus = useCallback((id, status) => {
    setTasks(ts => ts.map(t => t.id === id
      ? { ...t, status, completed_at: status === 'done' ? new Date().toISOString() : null }
      : t));
    if (KW_ON()) window.KW.updateTask(id, { status }).catch(() => {});
  }, []);

  const addTask = useCallback(async (data) => {
    const tempId = 't' + Date.now();
    const newTask = {
      id: tempId, ...data,
      description: '', status: 'open', pinned: false,
      source_type: 'manual', source_id: null,
      rationale: null, created_at: new Date().toISOString(),
    };
    setTasks(ts => [...ts, newTask]);
    setRecentlyAddedId(tempId);
    setTimeout(() => setRecentlyAddedId(null), 600);
    if (KW_ON()) {
      try {
        const res = await window.KW.createTask({
          title: data.title,
          description: '',
          priority: data.priority,
          category: data.category,
          owner: data.owner || 'neset',
          dueDate: data.due_at ? data.due_at.slice(0, 10) : null,
        });
        if (res?.id) {
          setTasks(ts => ts.map(t => t.id === tempId ? { ...t, id: res.id } : t));
        }
      } catch (e) { console.warn('[tasks] create fail', e); }
    }
  }, []);

  const updateTask = useCallback((id, patch) => {
    setTasks(ts => ts.map(t => t.id === id ? { ...t, ...patch } : t));
    if (KW_ON()) {
      const beField = {};
      if (patch.title       !== undefined) beField.title = patch.title;
      if (patch.description !== undefined) beField.description = patch.description;
      if (patch.priority    !== undefined) beField.priority = patch.priority;
      if (patch.category    !== undefined) beField.category = patch.category;
      if (patch.owner       !== undefined) beField.owner = patch.owner;
      if (patch.pinned      !== undefined) beField.pinned = patch.pinned ? 1 : 0;
      if (patch.due_at      !== undefined) beField.dueDate = patch.due_at?.slice(0, 10) || null;
      if (Object.keys(beField).length) window.KW.updateTask(id, beField).catch(() => {});
    }
  }, []);

  const onSelect = useCallback((id, multi) => {
    setSelected(s => {
      const n = new Set(s);
      if (n.has(id)) n.delete(id); else n.add(id);
      return n;
    });
  }, []);

  const bulkAction = async (action) => {
    const ids = [...selected];
    if (!ids.length) return;
    if (action === 'delete') {
      if (!confirm(`${ids.length} görev silinsin mi? (Geri alınamaz)`)) return;
    }
    if (action === 'complete') {
      setTasks(ts => ts.map(t => selected.has(t.id) ? { ...t, status: 'done', completed_at: new Date().toISOString() } : t));
    } else if (action === 'delete') {
      setTasks(ts => ts.filter(t => !selected.has(t.id)));
    } else if (action === 'snooze') {
      setTasks(ts => ts.map(t => {
        if (!selected.has(t.id)) return t;
        const d = new Date(); d.setDate(d.getDate() + 7); d.setHours(17, 0, 0, 0);
        return { ...t, due_at: d.toISOString() };
      }));
    }
    setSelected(new Set());
    if (KW_ON()) {
      try {
        const payload = action === 'snooze' ? { days: 7 } : {};
        await window.KW.bulkUpdateTasks(ids, action, payload);
      } catch (e) { console.warn('[tasks] bulk fail', e); }
    }
  };

  // ── keyboard shortcuts ──
  useEffect(() => {
    const handler = (e) => {
      const tag = (e.target.tagName || '').toLowerCase();
      if (tag === 'input' || tag === 'textarea') {
        if (e.key === 'Escape') e.target.blur();
        return;
      }
      const cmd = e.metaKey || e.ctrlKey;
      if (cmd && e.key.toLowerCase() === 'n') { e.preventDefault(); setComposerGroup('__top'); }
      else if (cmd && e.key === '1') { e.preventDefault(); setTaskView('list'); }
      else if (cmd && e.key === '2') { e.preventDefault(); setTaskView('board'); }
      else if (e.key === '?') { e.preventDefault(); setShortcutsOpen(s => !s); }
      else if (e.key === 'Escape') { setSelected(new Set()); setComposerGroup(null); setShortcutsOpen(false); }
    };
    window.addEventListener('keydown', handler);
    return () => window.removeEventListener('keydown', handler);
  }, []);

  // Source link handler (toplantı/sohbet kaynağına yönlendir)
  const handleSourceOpen = useCallback((task) => {
    if (!task) return;
    const sid = task.source_meeting_id || task.source_id;
    if (!sid) return;
    if (task.source_type === 'meeting') {
      onOpenMeeting?.(sid);
    } else if (task.source_type === 'chat') {
      onOpenConversation?.(sid);
    }
  }, [onOpenMeeting, onOpenConversation]);

  const rowProps = {
    onCheck: toggleCheck,
    onOpen:  (t) => setInspectorTaskId(t.id),
    onSelect,
    onPin:   togglePin,
    onDelete: deleteTask,
    onSnooze: snoozeTask,
    onDelegate: delegateTask,
    onSendChat,
    onSourceOpen: handleSourceOpen,
  };

  const inspectorTask = inspectorTaskId ? tasks.find(t => t.id === inspectorTaskId) : null;

  return (
    <div className="tasks-screen fade-in">
      {/* Header */}
      <div className="tasks-header">
        <h1 className="tasks-title">Görevler</h1>
        <div className="tasks-meta">
          {stats.open} açık ·{' '}
          <span className={stats.overdue > 0 ? 'tasks-meta-warn' : ''}>{stats.overdue} gecikmiş</span> ·{' '}
          bu hafta {stats.doneThisWeek} tamamladın <span className="tasks-meta-up">(↑)</span>
        </div>
      </div>

      {/* Insight Bar */}
      <InsightBar
        insight={insight}
        dismissed={insightDismissed}
        onDismiss={() => setInsightDismissed(true)}
        onReprioritize={async () => {
          if (KW_ON()) {
            try {
              await window.KW.reprioritizeTasks();
              const fresh = await window.KW.listTasksV3(true);
              if (fresh) setTasks(fresh);
            } catch (e) { console.warn('[tasks] reprioritize fail', e); }
            return;
          }
          const ranked = [...tasks].filter(t => t.status !== 'done')
            .sort((a, b) => (b.priority - a.priority) || ((dayDiff(a.due_at) ?? 999) - (dayDiff(b.due_at) ?? 999)));
          const top3 = new Set(ranked.slice(0, 3).map(t => t.id));
          setTasks(ts => ts.map(t => ({ ...t, pinned: top3.has(t.id) })));
        }}
      />

      {/* Controls */}
      <div className="tasks-controls">
        <ViewSwitch value={taskView} onChange={setTaskView} />
        <div className="tasks-filter-wrap" ref={filterWrapRef}>
          <button
            className={`tasks-ctl-btn${(filters.priority?.length || filters.category?.length || filters.source?.length) ? ' active' : ''}`}
            onClick={() => setFilterOpen(o => !o)}
          ><FilterIcon /> Filtre{(filters.priority?.length || filters.category?.length || filters.source?.length)
            ? ` · ${(filters.priority?.length || 0) + (filters.category?.length || 0) + (filters.source?.length || 0)}`
            : ''}</button>
          {filterOpen && <FilterPop filters={filters} setFilters={setFilters} onClose={() => setFilterOpen(false)} />}
        </div>
        <div className="tasks-ctl-btn tasks-ctl-search">
          <SearchIcon />
          <input
            placeholder="Görevde ara…"
            value={search}
            onChange={(e) => setSearch(e.target.value)}
          />
        </div>
        <div className="tasks-ctl-spacer" />
        <button className="tasks-ctl-btn" onClick={() => setShortcutsOpen(true)} title="Kısayollar (?)">?</button>
        <button className="tasks-ctl-add" onClick={() => setComposerGroup('__top')}>
          <PlusIcon /> Ekle <kbd>⌘N</kbd>
        </button>
      </div>

      {/* Bulk bar */}
      {selected.size > 0 && (
        <BulkBar count={selected.size} onAction={bulkAction} onClear={() => setSelected(new Set())} />
      )}

      {/* Top composer */}
      {composerGroup === '__top' && (
        <InlineComposer
          defaultGroup="today"
          onSave={(d) => { addTask(d); }}
          onCancel={() => setComposerGroup(null)}
        />
      )}

      {/* Body */}
      {tasks.length === 0 ? (
        <div className="tasks-empty">
          <div className="tasks-empty-emoji">✨</div>
          <div className="tasks-empty-title">Sıfır iş, sıfır kaygı.</div>
          <div className="tasks-empty-text">
            Bugün için boş bir tabağın var. Aklına gelen bir görev yaz: <kbd>⌘N</kbd>
          </div>
        </div>
      ) : taskView === 'list' ? (
        <div className="tasks-list">
          {GROUP_DEFS.map(def => {
            const items = grouped[def.key].map(t => ({
              ...t,
              selected: selected.has(t.id),
              isNew: t.id === recentlyAddedId,
            }));
            const isOpen = openGroups[def.key];
            // skip empty if filtering and no items? show only non-empty when search active
            if ((search || Object.values(filters).some(v => v?.length)) && items.length === 0) return null;
            return (
              <React.Fragment key={def.key}>
                <TaskGroup
                  def={def}
                  items={items}
                  open={isOpen}
                  onToggle={() => setOpenGroups(g => ({ ...g, [def.key]: !g[def.key] }))}
                  onAddInline={(k) => setComposerGroup(k)}
                  onCheck={rowProps.onCheck}
                  onOpen={rowProps.onOpen}
                  onSelect={rowProps.onSelect}
                  onPin={rowProps.onPin}
                  onDelete={rowProps.onDelete}
                  onSnooze={rowProps.onSnooze}
                  onDelegate={rowProps.onDelegate}
                  onSendChat={rowProps.onSendChat}
                  onSourceOpen={rowProps.onSourceOpen}
                />
                {composerGroup === def.key && (
                  <div style={{ padding: '4px 0 12px' }}>
                    <InlineComposer
                      defaultGroup={def.key}
                      onSave={(d) => addTask(d)}
                      onCancel={() => setComposerGroup(null)}
                    />
                  </div>
                )}
              </React.Fragment>
            );
          })}
          {filtered.length === 0 && (search || Object.values(filters).some(v => v?.length)) && (
            <div className="tasks-empty">
              <div className="tasks-empty-emoji">🔍</div>
              <div className="tasks-empty-title">Görev bulunamadı</div>
              <div className="tasks-empty-text">Filtre ya da aramayı değiştir veya temizle.</div>
            </div>
          )}
        </div>
      ) : (
        <BoardView
          tasks={filtered}
          onOpen={(t) => setInspectorTaskId(t.id)}
          onMove={moveTaskStatus}
          onAdd={() => setComposerGroup('__top')}
        />
      )}

      {shortcutsOpen && <ShortcutsModal onClose={() => setShortcutsOpen(false)} />}

      {inspectorTask && (
        <TaskInspector
          task={inspectorTask}
          onClose={() => setInspectorTaskId(null)}
          onUpdate={updateTask}
          onDelegate={delegateTask}
          onDelete={deleteTask}
          onSnooze={snoozeTask}
          onCheck={toggleCheck}
          onPin={togglePin}
          onSendChat={onSendChat}
          onSourceOpen={handleSourceOpen}
        />
      )}
    </div>
  );
};

// Re-render when tasks changes for inspector — pass currentTasks via window
window.TasksScreenV3 = TasksScreenV3;