export function recoveryView(state = {}) {
  return {
    status: state.status ?? "idle",
    message: state.blocked?.[0]?.reason ?? (state.half_commits?.length ? "half_commit_ignored" : state.status ?? "idle"),
    state_hash: state.state_hash ?? null,
    applied: state.applied?.length ?? 0,
    half_commits: state.half_commits?.length ?? 0,
  };
}

export function renderRecoveryPanel(document, state = {}) {
  const view = recoveryView(state);
  const section = document.createElement("section");
  section.className = "panel recovery-panel";
  const title = document.createElement("h2");
  title.className = "panel-title";
  title.textContent = "Project recovery";
  section.append(title);
  const body = document.createElement("p");
  body.className = "recovery-status";
  body.textContent = `${view.status}: ${view.message}`;
  section.append(body);
  const meta = document.createElement("small");
  meta.textContent = `commits ${view.applied} | half-commits ${view.half_commits}`;
  section.append(meta);
  return section;
}