function showDraftCapacityDialog(captures, qs) {
  const state = captures.capacity();
  if (!state.full) return false;
  const oldest = state.oldest;
  qs('#draft-capacity-oldest').innerHTML = '<strong>' + escapeHtml(oldest.title) + '</strong><div class="small">' +
    escapeHtml(oldest.body || 'No note') + (oldest.hasAttachment ? ' · Screenshot attached' : '') + '</div>';
  qs('#draft-capacity-sheet').dataset.oldestId = oldest.id;
  qs('#draft-capacity-status').textContent = '';
  qs('#draft-capacity-sheet').hidden = false;
  qs('#keep-editing-draft').focus();
  return true;
}

function bindDraftCapacityDialog({
  qs, saveIssueCaptureDraft, closeCreateIssueSheet, mobileTaskDock, refreshMyWorkView,
  unfiledCaptures, currentIssueCaptureDraft, createIssueAttachmentController, issueCapture,
}) {
  qs('#keep-editing-draft').addEventListener('click', () => {
    qs('#draft-capacity-sheet').hidden = true;
    qs('#save-unfiled-issue').focus();
  });
  qs('#review-full-drafts').addEventListener('click', () => {
    const oldestId = qs('#draft-capacity-sheet').dataset.oldestId;
    saveIssueCaptureDraft();
    qs('#draft-capacity-sheet').hidden = true;
    closeCreateIssueSheet(true, false);
    qs('[data-work-filter="draft"]').click();
    mobileTaskDock.select('queues');
    refreshMyWorkView();
    requestAnimationFrame(() => {
      const card = qs('[data-capture-id="' + CSS.escape(oldestId) + '"]');
      card?.scrollIntoView({block:'nearest'});
      card?.focus({preventScroll:true});
    });
  });
  qs('#replace-oldest-draft').addEventListener('click', async () => {
    const oldest = unfiledCaptures.capacity().oldest;
    if (!oldest || oldest.id !== qs('#draft-capacity-sheet').dataset.oldestId) {
      qs('#draft-capacity-status').textContent = 'Drafts changed. Review them before replacing anything.';
      return;
    }
    if (!window.confirm('Replace “' + oldest.title + '” and permanently delete its saved contents?')) return;
    const button = qs('#replace-oldest-draft');
    button.disabled = true;
    try {
      const draft = currentIssueCaptureDraft();
      const evidence = await createIssueAttachmentController.serialize();
      Object.assign(draft,
        Array.isArray(evidence) ? {attachments:evidence} : {attachment:evidence});
      const saved = await unfiledCaptures.replaceOldest(draft, oldest.id);
      qs('#draft-capacity-sheet').hidden = true;
      issueCapture.clearDraft();
      qs('#create-issue-title').value = '';
      qs('#create-issue-body').value = '';
      createIssueAttachmentController.clear();
      closeCreateIssueSheet(true, false);
      qs('[data-work-filter="draft"]').click();
      mobileTaskDock.select('queues');
      refreshMyWorkView();
      requestAnimationFrame(() => qs('[data-capture-id="' + CSS.escape(saved.id) + '"]')?.focus());
      qs('#my-work-action-status').textContent = 'Oldest Draft replaced. New work saved to Drafts.';
    } catch (error) {
      qs('#draft-capacity-status').textContent = error.message + ' Nothing was replaced.';
    } finally { button.disabled = false; }
  });
}

if (typeof module !== 'undefined' && module.exports) module.exports = {showDraftCapacityDialog, bindDraftCapacityDialog};