cabbage/local-mcp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix consumed instruction ordering and clear history

Browse Source
This commit is contained in:
Brandon Zhang
2026-03-27 18:32:18 +08:00
parent 27592f2750
commit 07e31ce215
3 changed files with 30 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
static/js/instructions.js
View File

@@ -45,6 +45,16 @@ function fmtAbsTime(isoStr) {
return d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' });
}
function comparePending(a, b) {
return (a.position - b.position) || String(a.created_at).localeCompare(String(b.created_at));
}
function compareConsumed(a, b) {
const consumedDelta = new Date(b.consumed_at || 0).getTime() - new Date(a.consumed_at || 0).getTime();
if (consumedDelta !== 0) return consumedDelta;
return b.position - a.position;
}
/** Refresh all relative-time spans in the lists (called by app.js on a timer). */
export function refreshTimestamps() {
document.querySelectorAll('[data-ts]').forEach(el => {
@@ -62,7 +72,7 @@ function renderPendingCard(item, index) {
card.innerHTML = `
<div class="instruction-card__meta">
<span class="instruction-card__pos">#${item.position}</span>
<span class="instruction-card__pos">#${index + 1}</span>
<span class="instruction-card__time" data-ts="${item.created_at}">${fmtRelativeTime(item.created_at)}</span>
</div>
<div class="instruction-card__content">${escapeHtml(item.content)}</div>
@@ -141,14 +151,14 @@ function renderPendingCard(item, index) {
return card;
}
function renderConsumedCard(item) {
function renderConsumedCard(item, index) {
const card = document.createElement('div');
card.className = 'instruction-card instruction-card--consumed';
card.dataset.id = item.id;
card.innerHTML = `
<div class="instruction-card__meta">
<span class="instruction-card__pos">#${item.position}</span>
<span class="instruction-card__pos">#${index + 1}</span>
<span class="instruction-card__time">${fmtAbsTime(item.consumed_at)}</span>
${item.consumed_by_agent_id
? `<span class="instruction-card__consumed-by">→ ${escapeHtml(item.consumed_by_agent_id)}</span>`
@@ -171,8 +181,8 @@ export function initInstructions() {
function render(instructions) {
if (!instructions) return;
const pending = instructions.filter(i => i.status === 'pending');
const consumed = instructions.filter(i => i.status === 'consumed').reverse();
const pending = instructions.filter(i => i.status === 'pending').sort(comparePending);
const consumed = instructions.filter(i => i.status === 'consumed').sort(compareConsumed);
// Pending
pendingList.innerHTML = '';
@@ -194,7 +204,7 @@ export function initInstructions() {
consumedList.innerHTML = `<div class="empty-state"><div class="empty-state__icon">◈</div>No consumed instructions yet</div>`;
clearHistoryBtn.style.display = 'none';
} else {
consumed.forEach(item => consumedList.appendChild(renderConsumedCard(item)));
consumed.forEach((item, i) => consumedList.appendChild(renderConsumedCard(item, i)));
clearHistoryBtn.style.display = '';
}
consumedBadge.textContent = consumed.length;
@@ -209,7 +219,8 @@ export function initInstructions() {
clearHistoryBtn.disabled = true;
try {
const res = await api.clearConsumed();
toast(`Cleared ${res.cleared} consumed instruction${res.cleared !== 1 ? 's' : ''}`, 'info');
const cleared = res?.cleared ?? 0;
toast(`Cleared ${cleared} consumed instruction${cleared !== 1 ? 's' : ''}`, 'info');
} catch (e) {
toast(e.message, 'error');
} finally {