// A7 stub — full panel ships in D5.
import { api } from '../api.js';
import { el, mount } from '../dom.js';

function row(j) {
  return el('li', {},
    el('span', { class: 'status idle' }, j.state),
    ' ',
    el('span', { style: { fontFamily: 'var(--font-mono)' } }, j.name),
    ' ',
    el('span', { class: 'muted' }, (j.id || '').slice(0, 8))
  );
}

export async function render(main) {
  const wrap = el('div');
  mount(main,
    el('h1', { class: 'view-h1' }, 'Jobs'),
    el('p', { class: 'view-sub muted' }, 'pg-boss queue — recent jobs across states.'),
    wrap
  );
  try {
    const rows = await api.get('/api/jobs?limit=50');
    if (!rows.length) mount(wrap, el('p', { class: 'muted' }, 'No jobs yet.'));
    else mount(wrap, el('ul', { class: 'plain' }, rows.map(row)));
  } catch (e) {
    mount(wrap, el('p', { class: 'muted' }, 'Could not load: ' + e.message));
  }
}