Release 0.1.7 — sidebar step dots track status live (hc-l0j)

After an AJAX status save, repaint the matching sidebar step-list dot instead
of leaving it stale until the next page load. Recolouring the dot's class is
enough for the link text too: the existing `li:has(.dot-done) a` rule turns it
green when done and back to the default blue otherwise.

- Sidebar dots gained a data-step attribute so the save script can find them.
- applyStatus() now also sets the sidebar dot class alongside the header badge
  and escalation banner it already updated.

Plugin-only. Bumps header, ATT_HC_VERSION and updates.json.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-27 08:42:16 +01:00
parent bf226e4174
commit 5be5ad2398
4 changed files with 14 additions and 8 deletions

View File

@@ -508,8 +508,10 @@ function att_hc_print_step_save_assets(ATT_HC_Session $session): void {
});
}
// Reflect a status change in the header badge + escalation banner,
// matching what a full server render would have produced.
// Reflect a status change in the header badge, escalation banner and
// sidebar dot, matching what a full server render would have produced.
// Recolouring the sidebar dot's class is enough for the link text too:
// the `li:has(.dot-done) a` CSS rule turns it green / back to default.
function applyStatus(status, label) {
if (card) {
var badge = card.querySelector('header .att-hc-step-status');
@@ -520,6 +522,8 @@ function att_hc_print_step_save_assets(ATT_HC_Session $session): void {
var esc = card.querySelector('[data-role="escalation"]');
if (esc) esc.hidden = (status !== 'blocked');
}
var dot = document.querySelector('.att-hc-sidebar .dot[data-step="' + stepId + '"]');
if (dot) dot.className = 'dot dot-' + status;
}
select.addEventListener('change', function () { save(select); });
@@ -546,9 +550,10 @@ function att_hc_render_sidebar(ATT_HC_Session $session): void {
$state = $session->step_state($step->id());
$cls = 'dot-' . $state['status'];
printf(
'<li><span class="dot %s"></span><a href="#step-%s">%s</a></li>',
'<li><span class="dot %s" data-step="%s"></span><a href="#step-%s">%s</a></li>',
esc_attr($cls),
esc_attr($step->id()),
esc_attr($step->id()),
esc_html($step->title())
);
}