/* ══════════════════════════════════════════════════════════════════
   ATLAS COCKPIT — DETAIL DRAWER + decision controls
   ══════════════════════════════════════════════════════════════════ */

/* global drawer bus */
const drawerBus = new Set();
function openDrawer(type, id) { drawerBus.forEach(fn => fn({ type, id })); }
function closeDrawer() { drawerBus.forEach(fn => fn(null)); }

const DECISIONS = {
  actions: [
    { act: 'approve', label: 'Approve', cls: 'primary' },
    { act: 'defer', label: 'Defer', cls: '' },
    { act: 'decline', label: 'Decline', cls: 'warning' }
  ],
  recs: [
    { act: 'research', label: 'Research', cls: 'primary' },
    { act: 'defer', label: 'Defer', cls: '' },
    { act: 'pass', label: 'Pass', cls: 'warning' }
  ],
  ideas: [
    { act: 'accept', label: 'Accept', cls: 'primary' },
    { act: 'analyze', label: 'Request full analysis', cls: '' },
    { act: 'reject', label: 'Reject', cls: 'warning' }
  ],
  risks: [
    { act: 'resolved', label: 'Resolve', cls: 'primary' }
  ]
};
const VERB_PAST = {
  approve: 'approved', defer: 'deferred', decline: 'declined', research: 'queued for research',
  pass: 'passed', accept: 'accepted', analyze: 'queued for full analysis', reject: 'rejected',
  resolved: 'resolved', trash: 'trashed'
};

function decide(store, id, act, title, note, after) {
  logDecision(store, store, id, act, title, note);
  toast(`${title} — ${VERB_PAST[act] || act}`, { undo: () => { undoDecision(store, id); toast(`${title} — restored`); } });
  if (after) after();
}

function DecisionBar({ store, id, title, note, compact, onDone }) {
  const opts = DECISIONS[store] || [];
  const sz = compact ? 'sm' : '';
  return React.createElement('div', { className: 'aq-actions' },
    opts.map(o => React.createElement('button', {
      key: o.act, className: cls('btn', sz, o.cls),
      onClick: (e) => { e.stopPropagation(); decide(store, id, o.act, title, typeof note === 'function' ? note() : note, onDone); }
    }, o.label)),
    React.createElement('button', {
      className: cls('btn', sz, 'trash'), title: 'Trash',
      onClick: (e) => { e.stopPropagation(); decide(store, id, 'trash', title, typeof note === 'function' ? note() : note, onDone); }
    }, React.createElement(Icon, { name: 'trash', size: 14, className: 'bico' }), 'Trash')
  );
}

/* checklist toggle with two-way blocker sync */
function toggleChecklist(actionId, idx) {
  Store.set(s => {
    const cl = { ...(s.checklists[actionId] || {}) };
    const next = !cl[idx]; cl[idx] = next;
    const blockers = { ...s.blockers };
    (window.ATLAS_DATA.blockers || []).forEach(b => {
      if (b.linkActionId === actionId && b.linkChecklistIdx === idx) blockers[b.id] = next;
    });
    return { ...s, checklists: { ...s.checklists, [actionId]: cl }, blockers };
  });
}
function Checklist({ action }) {
  const cl = useStore(s => s.checklists[action.id] || {});
  return React.createElement('div', { className: 'checklist' },
    action.checklist.map((item, i) => React.createElement('div', { key: i, className: cls('cl-row', cl[i] && 'done') },
      React.createElement('span', { className: cls('tick', cl[i] && 'on'), onClick: (e) => { e.stopPropagation(); toggleChecklist(action.id, i); } }),
      React.createElement('span', { className: 'cl-text' }, item)
    ))
  );
}

/* ──────────────────────────  DRAWER  ────────────────────────────── */
function DetailDrawer() {
  const [cur, setCur] = useState(null);
  const [tab, setTab] = useState('overview');
  useStore(); // re-render on store changes
  useEffect(() => {
    const fn = (d) => { setCur(d); setTab('overview'); };
    drawerBus.add(fn); return () => drawerBus.delete(fn);
  }, []);
  useEffect(() => {
    const onKey = (e) => {
      if (e.key === 'Escape' && cur) closeDrawer();
      if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === 'l' && cur) {
        const linkKind = { project: 'projects', idea: 'ideas', action: 'actions', risk: 'risks' }[cur.type];
        if (linkKind) { e.preventDefault(); copyEntityLink(linkKind, cur.id); }
      }
    };
    window.addEventListener('keydown', onKey); return () => window.removeEventListener('keydown', onKey);
  }, [cur]);

  const D = window.ATLAS_DATA;
  let entity = null, tabs = [], head = null;
  if (cur) {
    if (cur.type === 'project') {
      entity = D.projects.find(p => p.id === cur.id);
      tabs = ['overview', 'timeline', 'financials', 'risks', 'tasks', 'notes'];
    } else if (cur.type === 'action') {
      entity = getActions().find(a => a.id === cur.id);
      tabs = ['overview', entity && entity.checklist ? 'checklist' : null, 'decision', 'notes'].filter(Boolean);
    } else if (cur.type === 'idea') {
      entity = getIdeas().find(i => i.id === cur.id);
      tabs = ['overview', 'validation', 'decision', 'notes'];
    } else if (cur.type === 'risk') {
      entity = D.risks.find(r => r.id === cur.id);
      tabs = ['overview', 'mitigation', 'notes'];
    } else if (cur.type === 'brief') {
      entity = (Store.get().briefs || {})[cur.id];
      tabs = ['brief'];
    } else if (cur.type === 'connection') {
      entity = { id: cur.id, name: cur.id };
      tabs = ['connection'];
    }
  }

  return React.createElement(React.Fragment, null,
    React.createElement('div', { className: cls('drawer-scrim', cur && 'show'), style: { display: cur ? 'block' : 'none' }, onClick: closeDrawer }),
    React.createElement('aside', { className: cls('drawer', cur && 'show'), 'aria-hidden': !cur },
      entity && DrawerInner({ type: cur.type, entity, tab, setTab, tabs, D })
    )
  );
}

function DrawerInner({ type, entity, tab, setTab, tabs, D }) {
  const projOf = (id) => D.projects.find(p => p.id === id);
  let title = entity.name || entity.title;
  let sub = entity.summary || entity.why || entity.thesis || entity.body || '';
  if (type === 'brief') { title = entity.title; sub = (window.BRIEF_KIND[entity.kind] || 'Brief') + ' brief · ' + relTime(entity.createdAt); }
  if (type === 'connection') { title = entity.name; sub = 'Connection — last failure'; }
  let topPills = [];
  if (type === 'project') topPills = [React.createElement(StatusPill, { key: 's', status: entity.status }), React.createElement(LanePill, { key: 'l', lane: entity.lane }), React.createElement(Conf, { key: 'c', level: entity.confidence })];
  if (type === 'action') topPills = [React.createElement('span', { key: 'u', className: cls('utag', entity.urgency) }, entity.urgency), entity.project && React.createElement(LanePill, { key: 'p', lane: projOf(entity.project) ? projOf(entity.project).lane : '' })];
  if (type === 'idea') topPills = [React.createElement(Pill, { key: 'c', kind: 'ghost' }, entity.category), React.createElement(Conf, { key: 'cf', level: entity.confidence })];
  if (type === 'risk') topPills = [React.createElement(SevPill, { key: 's', sev: entity.severity }), entity.project && React.createElement(LanePill, { key: 'p', lane: projOf(entity.project) ? projOf(entity.project).lane : '' })];

  const linkKind = { project: 'projects', idea: 'ideas', action: 'actions', risk: 'risks' }[type];

  return React.createElement(React.Fragment, null,
    React.createElement('div', { className: 'drawer-head' },
      React.createElement('div', { className: 'drawer-top' },
        React.createElement('div', null,
          type === 'idea' && React.createElement('div', { style: { marginBottom: 8 } }, React.createElement(ScoreRing, { score: entity.score })),
          React.createElement('div', { className: 'drawer-title' }, title),
          sub && React.createElement('div', { className: 'drawer-sub' }, sub)
        ),
        React.createElement('button', { className: 'icon-btn drawer-close', onClick: closeDrawer, 'aria-label': 'Close' }, React.createElement(Icon, { name: 'x', size: 16 }))
      ),
      topPills.length > 0 && React.createElement('div', { style: { display: 'flex', gap: 7, flexWrap: 'wrap', marginBottom: 12 } }, topPills),
      (linkKind || type === 'project') && React.createElement('div', { className: 'drawer-toolbar' },
        type === 'project' && React.createElement('button', { className: 'btn xs', onClick: () => openAddAction(entity.id) }, React.createElement(Icon, { name: 'plus', size: 13, className: 'bico' }), 'Add action'),
        linkKind && React.createElement('button', { className: 'btn xs ghost copy-link', onClick: () => copyEntityLink(linkKind, entity.id), title: 'Copy link to this ' + type },
          React.createElement(Icon, { name: 'link', size: 13, className: 'bico' }), React.createElement('span', { className: 'kbd' }, '⌘L'), 'Copy link')),
      tabs.length > 1 && React.createElement('div', { className: 'drawer-tabs' },
        tabs.map(t => React.createElement('button', { key: t, className: cls('drawer-tab', tab === t && 'on'), onClick: () => setTab(t) }, t[0].toUpperCase() + t.slice(1)))
      )
    ),
    React.createElement('div', { className: 'drawer-body scroll' }, DrawerTab({ type, entity, tab, D }))
  );
}

function Sec({ title, children }) {
  return React.createElement('div', { className: 'drawer-sec' },
    title && React.createElement('div', { className: 'drawer-sec-t' }, title), children);
}
function KVRow({ k, children }) {
  return React.createElement('div', { className: 'kv', style: { marginBottom: 9 } },
    React.createElement('div', { className: 'k' }, k), React.createElement('div', { className: 'v' }, children));
}

function DrawerTab({ type, entity, tab, D }) {
  const projOf = (id) => D.projects.find(p => p.id === id);

  /* ── brief (read-only markdown) ── */
  if (type === 'brief') {
    return React.createElement('div', null,
      React.createElement('div', { style: { display: 'flex', justifyContent: 'flex-end', marginBottom: 10 } },
        React.createElement('button', { className: 'btn xs ghost', onClick: () => downloadFile(entity.id + '.md', entity.markdown, 'text/markdown') }, React.createElement(Icon, { name: 'download', size: 13, className: 'bico' }), 'Download .md')),
      React.createElement(Markdown, { md: entity.markdown }));
  }
  /* ── connection last-failure ── */
  if (type === 'connection') {
    const conn = (Store.get().connections || {})[entity.name] || {};
    return React.createElement('div', null,
      React.createElement(Sec, { title: 'Last failure' },
        React.createElement('div', { className: 'aq-suggest', style: { background: 'var(--danger-weak)' } },
          React.createElement(Icon, { name: 'alert', size: 15, className: 'si', style: { color: 'var(--danger)' } }),
          React.createElement('span', null, conn.lastErrorMsg || 'No error message recorded.'))),
      React.createElement(Sec, { title: 'Retry' },
        React.createElement('div', { style: { fontSize: 13, color: 'var(--ink-muted)', lineHeight: 1.5, marginBottom: 12 } }, 'Re-enter the credentials in Settings → Connections and save again.'),
        React.createElement('button', { className: 'btn', onClick: () => { closeDrawer(); setKV({ view: 'settings' }); } }, 'Open Connections', React.createElement(Icon, { name: 'arrowR', size: 13, className: 'bico' }))));
  }

  /* ── notes (shared) ── */
  if (tab === 'notes') {
    const store = type === 'project' ? 'projectNotes' : type === 'action' ? 'actions' : type === 'idea' ? 'ideas' : 'risks';
    return React.createElement(Sec, { title: 'Working notes' },
      React.createElement(NoteField, { store, id: entity.id, placeholder: 'Notes, links, credentials reference, questions for Claude…' }));
  }

  if (type === 'project') {
    if (tab === 'overview') return React.createElement('div', null,
      React.createElement(Sec, { title: 'Detail' },
        React.createElement(KVRow, { k: 'Owner' }, entity.owner),
        React.createElement(KVRow, { k: 'Updated' }, fmtDate(entity.lastUpdate, { month: 'long', day: 'numeric', year: 'numeric' })),
        React.createElement(KVRow, { k: 'Next' }, entity.nextAction || '—')
      ),
      entity.blocker && React.createElement(Sec, { title: 'Blocker' },
        React.createElement('div', { className: 'aq-suggest', style: { background: 'var(--warning-weak)' } },
          React.createElement(Icon, { name: 'alert', size: 15, className: 'si', style: { color: 'var(--warning)' } }),
          React.createElement('span', null, entity.blocker))),
      entity.revenueNote && React.createElement(Sec, { title: 'Revenue note' }, React.createElement('div', { style: { fontSize: 13, color: 'var(--ink-muted)' } }, entity.revenueNote))
    );
    if (tab === 'timeline') return React.createElement(Sec, { title: 'Activity' },
      React.createElement('div', { className: 'tl' }, (entity.timeline || []).map((t, i) => React.createElement('div', { key: i, className: 'tl-item' },
        React.createElement('div', { className: 'tl-date' }, fmtDate(t.date, { month: 'short', day: 'numeric', year: 'numeric' })),
        React.createElement('div', { className: 'tl-text' }, t.text)))));
    if (tab === 'financials') {
      const cost = D.costs.perProject.find(c => c.projectId === entity.id);
      const target = Store.get().projectTargets[entity.id] != null ? Store.get().projectTargets[entity.id] : (entity.targetMarginPct != null ? entity.targetMarginPct : 30);
      return React.createElement('div', null,
        React.createElement(Sec, { title: 'Revenue' },
          React.createElement(KVRow, { k: 'Week' }, fmt$(entity.weekRevenue)),
          React.createElement(KVRow, { k: 'MTD' }, fmt$(entity.mtdRevenue)),
          React.createElement(KVRow, { k: 'Margin' }, fmtPct(entity.marginPct))),
        React.createElement(Sec, { title: 'Target' },
          React.createElement('div', { className: 'kv', style: { marginBottom: 9, alignItems: 'center' } },
            React.createElement('div', { className: 'k' }, 'Target margin'),
            React.createElement('div', { className: 'v', style: { display: 'flex', alignItems: 'center', gap: 4 } },
              React.createElement(EditableNum, { value: target, prefix: '', placeholder: '30', width: 56, onSave: v => Store.set(s => ({ ...s, projectTargets: { ...s.projectTargets, [entity.id]: v == null ? 30 : v } })) }),
              React.createElement('span', { style: { color: 'var(--ink-faint)' } }, '%'))),
          React.createElement('div', { style: { fontSize: 11.5, color: 'var(--ink-faint)', lineHeight: 1.5 } }, 'Drives the colour of the margin cell in the P&L.')),
        React.createElement(Sec, { title: 'Cost basis' },
          React.createElement('div', { style: { fontSize: 13, color: 'var(--ink-muted)', lineHeight: 1.5 } }, cost ? cost.notes : '—')));
    }
    if (tab === 'risks') {
      const rs = D.risks.filter(r => r.project === entity.id);
      if (!rs.length) return React.createElement(EmptyState, { icon: 'check', title: 'No open risks', children: 'No risks are currently linked to this project.' });
      return React.createElement(Sec, { title: 'Linked risks' }, rs.map(r => React.createElement('div', { key: r.id, className: 'card pad', style: { marginBottom: 10, cursor: 'pointer' }, onClick: () => openDrawer('risk', r.id) },
        React.createElement('div', { style: { display: 'flex', gap: 8, alignItems: 'center', marginBottom: 6 } }, React.createElement(SevPill, { sev: r.severity })),
        React.createElement('div', { style: { fontWeight: 600, fontSize: 14 } }, r.title))));
    }
    if (tab === 'tasks') {
      const acts = getActions().filter(a => a.project === entity.id);
      return React.createElement('div', null,
        React.createElement(Sec, { title: 'Next action' }, React.createElement('div', { style: { fontSize: 13.5 } }, entity.nextAction || '—')),
        acts.length > 0 && React.createElement(Sec, { title: 'Open actions' }, acts.map(a => React.createElement('div', { key: a.id, className: 'card pad', style: { marginBottom: 10, cursor: 'pointer' }, onClick: () => openDrawer('action', a.id) },
          React.createElement('div', { style: { fontWeight: 600, fontSize: 14, marginBottom: 4 } }, a.title),
          a.checklist && React.createElement(ChecklistProgress, { action: a })))));
    }
  }

  if (type === 'action') {
    if (tab === 'overview') return React.createElement('div', null,
      React.createElement(Sec, { title: 'Why it matters' }, React.createElement('div', { style: { fontSize: 13.5, lineHeight: 1.55, color: 'var(--ink-muted)' } }, entity.why)),
      entity.suggestedMove && React.createElement(Sec, { title: 'Suggested move' },
        React.createElement('div', { className: 'aq-suggest' }, React.createElement(Icon, { name: 'sparkle', size: 15, className: 'si' }), React.createElement('span', null, entity.suggestedMove))),
      React.createElement(Sec, { title: 'Detail' },
        React.createElement(KVRow, { k: 'Source' }, entity.source),
        entity.due && React.createElement(KVRow, { k: 'Due' }, fmtDate(entity.due, { month: 'long', day: 'numeric' }) + ' · ' + relDays(entity.due)),
        entity.project && React.createElement(KVRow, { k: 'Project' }, React.createElement('a', { style: { color: 'var(--accent)', cursor: 'pointer' }, onClick: () => openDrawer('project', entity.project) }, projOf(entity.project) ? projOf(entity.project).name : entity.project))));
    if (tab === 'checklist') return React.createElement(Sec, { title: 'Checklist' }, React.createElement(Checklist, { action: entity }));
    if (tab === 'decision') return React.createElement('div', null,
      React.createElement(Sec, { title: 'Your response' }, React.createElement(NoteField, { store: 'actions', id: entity.id, placeholder: 'Notes before deciding…' })),
      React.createElement(Sec, { title: 'Decide' }, React.createElement(DecisionBar, { store: 'actions', id: entity.id, title: entity.title, note: () => loadNote('actions', entity.id), onDone: closeDrawer })));
  }

  if (type === 'idea') {
    if (tab === 'overview') return React.createElement('div', null,
      React.createElement(Sec, { title: 'Thesis' }, React.createElement('div', { style: { fontSize: 13.5, lineHeight: 1.6, color: 'var(--ink-muted)' } }, entity.thesis)),
      React.createElement(Sec, { title: 'Atlas rubric' }, React.createElement(RubricStrip, { rubric: entity.rubric })),
      React.createElement(Sec, { title: 'Detail' },
        React.createElement(KVRow, { k: 'Category' }, entity.category),
        React.createElement(KVRow, { k: 'Time to rev' }, entity.timeToRevenue),
        React.createElement(KVRow, { k: 'Ceiling' }, entity.ceiling),
        React.createElement(KVRow, { k: 'Source' }, entity.src)));
    if (tab === 'validation') return React.createElement(Sec, { title: 'Required next validation step' },
      React.createElement('div', { className: 'aq-suggest' }, React.createElement(Icon, { name: 'target', size: 15, className: 'si' }), React.createElement('span', null, entity.validation)));
    if (tab === 'decision') return React.createElement('div', null,
      React.createElement(Sec, { title: 'Your response' }, React.createElement(NoteField, { store: 'ideas', id: entity.id, placeholder: 'Conditions, questions, “yes if…”' })),
      React.createElement(Sec, { title: 'Decide' }, React.createElement(DecisionBar, { store: 'ideas', id: entity.id, title: entity.name, note: () => loadNote('ideas', entity.id), onDone: closeDrawer })));
  }

  if (type === 'risk') {
    if (tab === 'overview') return React.createElement('div', null,
      React.createElement(Sec, { title: 'Description' }, React.createElement('div', { style: { fontSize: 13.5, lineHeight: 1.55, color: 'var(--ink-muted)' } }, entity.body)),
      React.createElement(Sec, { title: 'Detail' },
        React.createElement(KVRow, { k: 'Impact' }, entity.impact),
        React.createElement(KVRow, { k: 'Owner' }, entity.owner),
        React.createElement(KVRow, { k: 'Review' }, fmtDate(entity.review, { month: 'long', day: 'numeric' })),
        entity.project && React.createElement(KVRow, { k: 'Project' }, React.createElement('a', { style: { color: 'var(--accent)', cursor: 'pointer' }, onClick: () => openDrawer('project', entity.project) }, projOf(entity.project) ? projOf(entity.project).name : entity.project))));
    if (tab === 'mitigation') return React.createElement('div', null,
      React.createElement(Sec, { title: 'Mitigation' }, React.createElement('div', { className: 'aq-suggest' }, React.createElement(Icon, { name: 'check', size: 15, className: 'si' }), React.createElement('span', null, entity.mitigation))),
      React.createElement(Sec, { title: 'Resolve' }, React.createElement(DecisionBar, { store: 'risks', id: entity.id, title: entity.title, note: () => loadNote('risks', entity.id), onDone: closeDrawer })));
  }
  return null;
}

function ChecklistProgress({ action }) {
  const cl = useStore(s => s.checklists[action.id] || {});
  const done = action.checklist.filter((_, i) => cl[i]).length;
  return React.createElement('div', { style: { display: 'flex', alignItems: 'center', gap: 8 } },
    React.createElement('div', { className: 'bar', style: { flex: 1 } }, React.createElement('i', { className: done === action.checklist.length ? 'full' : '', style: { width: (done / action.checklist.length * 100) + '%' } })),
    React.createElement('span', { className: 'mono', style: { fontSize: 11, color: 'var(--ink-faint)' } }, `${done}/${action.checklist.length}`));
}

Object.assign(window, { openDrawer, closeDrawer, DetailDrawer, DecisionBar, Checklist, ChecklistProgress, toggleChecklist, DECISIONS, decide, Sec, KVRow });