bazaar-compute-node 0.2.1rc5__tar.gz → 0.2.1rc6__tar.gz

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: bazaar-compute-node
-Version: 0.2.1rc5
+Version: 0.2.1rc6
 Summary: Runtime-agnostic computer node daemon for agents and channels.
 License-Expression: AGPL-3.0-only
 License-File: LICENSE

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "bazaar-compute-node"
-version = "0.2.1rc5"
+version = "0.2.1rc6"
 description = "Runtime-agnostic computer node daemon for agents and channels."
 readme = "README.md"
 license = "AGPL-3.0-only"

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/pyproject.toml.orig

@@ -1,6 +1,6 @@
 [project]
 name = "bazaar-compute-node"
-version = "0.2.1rc5"
+version = "0.2.1rc6"
 description = "Runtime-agnostic computer node daemon for agents and channels."
 readme = "README.md"
 license = "AGPL-3.0-only"

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/locales/en.toml

@@ -316,3 +316,5 @@
 "event.reminder.fired" = "Reminder triggered"
 "event.agent.start.succeeded" = "Agent started"
 "event.agent.start.failed" = "Agent failed to start"
+
+"app.loading" = "Loading…"

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/locales/zh-CN.toml

@@ -316,3 +316,5 @@
 "event.reminder.fired" = "提醒已触发"
 "event.agent.start.succeeded" = "智能体已启动"
 "event.agent.start.failed" = "智能体启动失败"
+
+"app.loading" = "正在加载…"

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/static/app.css

@@ -61,6 +61,12 @@ a { color: inherit; text-decoration: none; }
 .body { padding: 14px 18px; overflow: auto; }
 .list-items { padding: 6px 8px; overflow-y: auto; flex: 1; }
 .empty { color: var(--muted); padding: 24px 18px; }
+.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 140px; text-align: center; font-size: 13px; }
+.empty-state .i svg { width: 36px; height: 36px; stroke-width: 1.25; opacity: .55; }
+.list-items:has(> .empty-state) { display: flex; flex-direction: column; }
+.list-items > .empty-state { flex: 1; }
+.drawer .rows .empty-state { min-height: 100px; }
+.drawer .empty-state .i svg { width: 28px; height: 28px; }
 
 /* list items */
 .li { --px: 8px; --py: 8px; display: flex; align-items: center; gap: 10px; padding: var(--py) var(--px); border-radius: var(--r-sm); position: relative; }
@@ -209,10 +215,23 @@ a { color: inherit; text-decoration: none; }
 .card .ev span.t { color: var(--muted); margin-right: 8px; }
 .card .ev .live { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--ok); margin-right: 6px; vertical-align: 1px; }
 .card .more { margin-top: 8px; font-size: .9em; color: var(--muted); }
-/* until the card's first load arrives, a turning ring where the words will be */
+/* feedback while navigation or inline content is loading */
 .loading { display: flex; justify-content: center; align-items: center; min-height: 140px; color: var(--muted); }
-.loading .i svg { width: 20px; height: 20px; animation: turn 1s linear infinite; }
+.loading .i svg { width: 20px; height: 20px; }
+.navigation-loading { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 60; display: flex; color: var(--muted); pointer-events: none; }
+.navigation-loading .i svg { width: 28px; height: 28px; }
+.i .lucide-loader > path { animation: loading-fade 1s linear infinite; }
+.i .lucide-loader > path:nth-child(1) { animation-delay: -1s; }
+.i .lucide-loader > path:nth-child(2) { animation-delay: -0.875s; }
+.i .lucide-loader > path:nth-child(3) { animation-delay: -0.75s; }
+.i .lucide-loader > path:nth-child(4) { animation-delay: -0.625s; }
+.i .lucide-loader > path:nth-child(5) { animation-delay: -0.5s; }
+.i .lucide-loader > path:nth-child(6) { animation-delay: -0.375s; }
+.i .lucide-loader > path:nth-child(7) { animation-delay: -0.25s; }
+.i .lucide-loader > path:nth-child(8) { animation-delay: -0.125s; }
 @keyframes turn { to { transform: rotate(360deg); } }
+@keyframes loading-fade { from { opacity: 1; } to { opacity: .2; } }
+@media (prefers-reduced-motion: reduce) { .i .lucide-loader > path { animation: none; } }
 
 /* forms and buttons */
 /* buttons side by side sit level, whether or not one carries an icon: on their middles, not their baselines */
@@ -456,7 +475,6 @@ a { color: inherit; text-decoration: none; }
 .blank .kinds > .loading { min-height: 38px; }
 .blank .kinds > .err { margin: 0; }
 .field .wait { display: inline-flex; color: var(--muted); }
-.field .wait .i svg { animation: turn 1s linear infinite; }
 .field [data-again] { margin-left: 0; }
 .field .wait[hidden], .field [data-again][hidden] { display: none; }
 /* a logo beside words sits on their middle, not their baseline */
@@ -489,7 +507,7 @@ a { color: inherit; text-decoration: none; }
 .profile .hd .face-at .dot { position: absolute; left: calc(var(--r-av) * .2929 - 4px); top: calc(28px - var(--r-av) * .2929 - 4px); box-shadow: 0 0 0 2px var(--panel); }
 .profile .hd .icons { margin-left: 6px; font-weight: 400; }
 .switch.text { margin: 8px 14px 0; }
-.switch.text .tab { width: auto; padding: 0 12px; font: inherit; }
+.switch.text .tab { width: auto; gap: 6px; padding: 0 12px; font: inherit; }
 .profile .body { flex: 1; }
 .profile .body > .dialog, .profile .config { max-width: 480px; }
 .profile .config .dialog, .profile .body > .dialog.part { max-width: none; margin: 0 0 12px; box-shadow: none; }

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/static/components.js

@@ -73,14 +73,17 @@ document.addEventListener('alpine:init', () => {
     destroy() { this.cancel?.(); },
   }));
 
-  Alpine.data('application', () => ({stale: false, unreachable: false}));
+  Alpine.data('application', () => ({stale: false, unreachable: false, pending: new Set()}));
   Alpine.bind('connection', () => ({
     '@poll-online.window'() { this.unreachable = false; },
     '@poll-offline.window'() { this.unreachable = true; },
     '@stale.window'() { this.stale = true; },
     '@htmx:before:request.window'(event) {
-      if (this.stale) event.preventDefault();
+      if (this.stale) { event.preventDefault(); return; }
+      const ctx = event.detail.ctx;
+      if (ctx.target?.id === 'main') this.pending.add(ctx);
     },
+    '@htmx:finally:request.window'(event) { this.pending.delete(event.detail.ctx); },
     '@htmx:error.window'(event) {
       if (event.detail?.error instanceof TypeError) this.unreachable = true;
     },

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agent_form.html

@@ -39,7 +39,7 @@
 {# a field waiting on what the computer lists: turning while it is asked,
    the way to ask again when it did not answer #}
 {% macro waiting() -%}
-<span class="wait" x-show="card.modelState === 'loading'">{{ c.icon("loader-circle") }}</span><button class="btn icon" type="button" data-again x-show="card.modelState === 'error'" :title="card.modelError" @click="loadModels(card)" aria-label="{{ t.text("agents.retry") }}">{{ c.icon("rotate-cw") }}</button>
+<span class="wait" x-show="card.modelState === 'loading'">{{ c.icon("loader") }}</span><button class="btn icon" type="button" data-again x-show="card.modelState === 'error'" :title="card.modelError" @click="loadModels(card)" aria-label="{{ t.text("agents.retry") }}">{{ c.icon("rotate-cw") }}</button>
 {%- endmacro %}
 
 {% macro initial(values, reply, kept=false, origins=none) -%}
@@ -128,7 +128,7 @@
   </div></template>
   <div class="dialog part blank" data-blank="{{ family }}" :class="{shown: selected.{{ family }} === cards.{{ family }}.length}">
     <div class="title">{{ t.text('agents.blank.' ~ family) }}</div>
-    <div class="loading" x-show="kinds.{{ family }} === 'loading'">{{ c.icon('loader-circle') }}</div>
+    <div class="loading" x-show="kinds.{{ family }} === 'loading'">{{ c.icon('loader') }}</div>
     <div class="kinds" x-show="kinds.{{ family }} !== 'loading'"></div>
     <button class="btn sm" type="button" x-show="kinds.{{ family }} === 'error'" @click="loadKinds('{{ family }}', true)">{{ c.icon('rotate-cw') }} {{ t.text('agents.retry') }}</button>
   </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agent_list.html

@@ -6,5 +6,5 @@
    they have loaded #}
 <div class="list-items" id="agent-list" hx-get="/agents/list{% if selected_key %}?selected={{ selected_key }}{% endif %}" hx-vals='js:{until: this.querySelector(".edge")?.dataset.after ?? ""}' hx-trigger="poll-refresh" x-poll data-poll='{{ poll("agents", page)|tojson }}' hx-swap="outerMorph">
   {% include "agent_rows.html" %}
-  {% if not page.agents %}{{ c.empty(t.text("agents.empty")) }}{% endif %}
+  {% if not page.agents %}{{ c.empty(t.text("agents.empty"), "users") }}{% endif %}
 </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agent_profile.html

@@ -11,5 +11,5 @@
   </div>
   <div class="body" id="profile-body" x-show="!pending">{% include "agent_profile_" ~ profile ~ ".html" %}</div>
   <div id="agent-remove" hidden></div>
-  <div class="body" x-show="pending" x-cloak><div class="loading">{{ c.icon("loader-circle") }}</div></div>
+  <div class="body" x-show="pending" x-cloak><div class="loading">{{ c.icon("loader") }}</div></div>
 </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agent_profile_activity.html

@@ -1,3 +1,4 @@
+{% import "components.html" as c with context %}
 {# the agent's events as a log in a box, newest on top; the top asks for
    newer ones when the event subscription changes - with the day of the newest line when no
    date marks it yet - and the end for older ones as it comes into view #}
@@ -7,6 +8,6 @@
   <div class="lines" id="events">
     <div class="fresh" hx-get="{{ base }}" hx-vals='js:{after: document.querySelector("#events .ln")?.dataset.id ?? "0", below: document.querySelector("#events .fresh + .ln")?.dataset.day ?? ""}' hx-trigger="poll-refresh" x-poll data-poll='{{ poll("events", selected, since=lines[0].id if lines else 0)|tojson }}' hx-target="this" hx-swap="afterend"></div>
     {% include "agent_profile_events.html" %}
-    {% if not lines %}<div class="empty" id="events-empty">{{ t.text("agents.no_activity") }}</div>{% endif %}
+    {% if not lines %}{{ c.empty(t.text("agents.no_activity"), "message-square-text", id="events-empty") }}{% endif %}
   </div>
 </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agent_profile_skills.html

@@ -1,8 +1,9 @@
+{% import "components.html" as c with context %}
 {# what the agent's runtimes found for it to do, by where they found it #}
 {% if skills.answer != "listed" %}
 <p class="err">{{ t.text("agents." ~ skills.answer, {"code": skills.code}) }}</p>
 {% elif not skills.groups|map(attribute=1)|select|list %}
-<div class="empty">{{ t.text("agents.no_skills") }}</div>
+{{ c.empty(t.text("agents.no_skills"), "grid-2x2") }}
 {% else %}
 {% for source, items in skills.groups if items %}
 <div class="section">{{ t.text("agents.skills." ~ source) }}</div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agent_profile_status.html

@@ -8,7 +8,7 @@
 <div class="field"><label>{{ t.text("agents.health." ~ label) }}</label><span class="v">{{ caller() }}</span></div>
 {%- endmacro %}
 {% if health is none %}
-<div class="empty">{{ t.text("agents.no_status") }}</div>
+{{ c.empty(t.text("agents.no_status"), "monitor") }}
 {% else %}
 <div class="health">
   <div class="dialog part">

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agent_profile_workspace.html

@@ -10,7 +10,7 @@
 {% else %}
 <div class="section head">{{ t.text("agents.workspace_entries") }}<button class="btn icon" type="button" hx-get="/agents/{{ ref(selected.computer_id) }}/{{ ref(selected.id) }}/profile/workspace" hx-target="#profile-body" hx-swap="innerHTML" title="{{ t.text("agents.refresh") }}" aria-label="{{ t.text("agents.refresh") }}">{{ c.icon("rotate-cw") }}</button></div>
 {% if not workspace.entries %}
-<div class="empty">{{ t.text("agents.workspace_empty") }}</div>
+{{ c.empty(t.text("agents.workspace_empty"), "folder") }}
 {% else %}
 <div class="dialog part files">{% include "agent_profile_files.html" %}</div>
 {% endif %}

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agent_row.html

@@ -4,5 +4,5 @@
 {% call c.list_item(agent.name, icons=c.agent_icons(agent), settings="/agents/" ~ key ~ "/profile", status=agent.status, identity=agent.name, href="/agents/" ~ key, on=(selected_key == key), off=(agent.status == "offline"), extra_class="agent", id="agent-" ~ key|replace("/", "-"), opens=".agent", live_status=true, attrs=attributes) %}
   {# the card shows while the pointer is on the avatar, by the pointer; it
      fetches itself the first time the mouse enters its row #}
-  <div class="card" :style="{left: left + 'px', top: top + 'px'}" hx-morph-skip hx-get="/agents/{{ key }}/activity" hx-trigger='mouseenter once from:"closest .agent"' hx-target="this" hx-swap="innerMorph"><div class="loading">{{ c.icon("loader-circle") }}</div></div>
+  <div class="card" :style="{left: left + 'px', top: top + 'px'}" hx-morph-skip hx-get="/agents/{{ key }}/activity" hx-trigger='mouseenter once from:"closest .agent"' hx-target="this" hx-swap="innerMorph"><div class="loading">{{ c.icon("loader") }}</div></div>
 {% endcall %}

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/agents.html

@@ -19,7 +19,7 @@
   </div>
   {# the conversations are the node's to list, so the page comes up first and
      the column asks for them once it is there #}
-  <div class="list-items" id="contacts" hx-get="/agents/{{ ref(selected.computer_id) }}/{{ ref(selected.id) }}/contacts{{ ("?" ~ query) if query }}" hx-trigger="load" hx-swap="outerHTML"><div class="loading">{{ c.icon("loader-circle") }}</div></div>
+  <div class="list-items" id="contacts" hx-get="/agents/{{ ref(selected.computer_id) }}/{{ ref(selected.id) }}/contacts{{ ("?" ~ query) if query }}" hx-trigger="load" hx-swap="outerHTML"><div class="loading">{{ c.icon("loader") }}</div></div>
 </div>
 {% endif %}
 {% include "chat.html" %}

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/chat.html

@@ -17,7 +17,7 @@
     <button class="av sm face" type="button" title="{{ t.text("profile.open") }}" hx-get="{{ profile_url }}" :hx-get="url" x-data="contactName" data-name="{{ contact.name }}" data-thread="{{ ref(contact.thread_id) }}" @contact-name.window="update($event)" x-bind="opener" hx-target="#profile" hx-swap="outerHTML">{{ contact.thread_id|identicon|safe }}</button>
     <span class="heading" x-data="contactName" data-name="{{ contact.name }}" data-thread="{{ ref(contact.thread_id) }}" x-text="name" @contact-name.window="update($event)">{{ contact.name }}</span><span class="sub">{{ c.channels((contact.channel,)) }}{{ t.text("contacts." ~ contact.kind) }}</span>
   </div>
-  <div class="chat" id="history" hx-get="{{ c.messages_url(selected, contact) }}{% if latest %}&latest={{ latest|urlencode }}{% endif %}" hx-trigger="load" hx-swap="outerHTML"><div class="loading">{{ c.icon("loader-circle") }}</div></div>
+  <div class="chat" id="history" hx-get="{{ c.messages_url(selected, contact) }}{% if latest %}&latest={{ latest|urlencode }}{% endif %}" hx-trigger="load" hx-swap="outerHTML"><div class="loading">{{ c.icon("loader") }}</div></div>
   <div id="profile" hidden></div>
   {% endif %}
 </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/components.html

@@ -121,6 +121,6 @@
 <div class="section">{{ text }}</div>
 {%- endmacro %}
 
-{% macro empty(text) -%}
-<div class="empty">{{ text }}</div>
+{% macro empty(text, symbol=none, id=none) -%}
+<div class="empty{{ " empty-state" if symbol }}"{% if id %} id="{{ id }}"{% endif %}>{% if symbol %}{{ icon(symbol) }}<span>{{ text }}</span>{% else %}{{ text }}{% endif %}</div>
 {%- endmacro %}

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/computer_detail.html

@@ -17,7 +17,7 @@
     {% set attrs %}x-data="agentStatus" data-agent='{{ dict(poll("agent-status", agent), labels=status_labels)|tojson }}'{% endset %}
     {{ c.list_item(agent.name, icons=c.agent_icons(agent, with_system=false), settings="/agents/" ~ ref(selected.computer.id) ~ "/" ~ ref(agent.id) ~ "/profile", status=agent.status, identity=agent.name, href="/agents/" ~ ref(selected.computer.id) ~ "/" ~ ref(agent.id), off=(agent.status == "offline"), live_status=true, attrs=attrs) }}
     {% endfor %}
-    {% if not selected.agents %}{{ c.empty(t.text("computers.no_agents")) }}{% endif %}
+    {% if not selected.agents %}{{ c.empty(t.text("computers.no_agents"), "users") }}{% endif %}
   </div>
   <div class="roster-foot"><button class="add" type="button" hx-get="/computers/{{ ref(selected.computer.id) }}/agents/new" x-bind="opener" hx-target="#agent-new" hx-swap="outerHTML" title="{{ t.text("computers.new_agent") }}" aria-label="{{ t.text("computers.new_agent") }}" :disabled="!online"{% if not selected.online %} disabled{% endif %}>{{ c.icon("plus") }}</button></div>
   {# the question takes the button's place whole - a morph would leave a

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/computer_list.html

@@ -1,5 +1,5 @@
 {% import "components.html" as c with context %}
 <div class="list-items" id="computer-list" hx-get="/computers/list{% if selected_key %}?selected={{ selected_key }}{% endif %}" hx-vals='js:{until: this.querySelector(".edge")?.dataset.after ?? ""}' hx-trigger="poll-refresh" x-poll data-poll='{{ poll("computers", fleet)|tojson }}' hx-swap="outerMorph">
   {% include "computer_rows.html" %}
-  {% if not fleet.computers %}{{ c.empty(t.text("computers.empty")) }}{% endif %}
+  {% if not fleet.computers %}{{ c.empty(t.text("computers.empty"), "monitor") }}{% endif %}
 </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/contacts.html

@@ -14,6 +14,6 @@
   {% elif listing.answer != "listed" %}
   <div class="empty">{{ t.text("contacts." ~ listing.answer, {"code": listing.code}) }} <button class="btn sm" hx-get="{{ url }}{% if selected_thread %}?selected={{ selected_thread }}{% endif %}{{ tab|replace("&", "&" if selected_thread else "?", 1) }}" hx-target="#contacts" hx-swap="outerHTML">{{ t.text("contacts.retry") }}</button></div>
   {% elif not listing.contacts %}
-  {{ c.empty(t.text("contacts.no_requests" if listing.review == "pending" else "contacts.empty")) }}
+  {{ c.empty(t.text("contacts.no_requests" if listing.review == "pending" else "contacts.empty"), "user-plus" if listing.review == "pending" else "message-circle") }}
   {% endif %}
 </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/conversation_reminders.html

@@ -7,6 +7,6 @@
       {% endfor %}
       {% if reminders.answer == "offline" %}<div class="empty">{{ t.text("contacts.offline") }}</div>
       {% elif reminders.answer != "listed" %}<div class="empty">{{ t.text("contacts." ~ reminders.answer, {"code": reminders.code}) }}</div>
-      {% elif not reminders.items %}<div class="empty">{{ t.text("profile.no_reminders") }}</div>{% endif %}
+      {% elif not reminders.items %}{{ c.empty(t.text("profile.no_reminders"), "alarm-clock") }}{% endif %}
     </div>
 </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/history.html

@@ -7,7 +7,7 @@
   <div class="empty">{{ t.text("contacts." ~ history.answer, {"code": history.code}) }} <button class="btn sm" hx-get="{{ url }}{% if latest %}&latest={{ latest|urlencode }}{% endif %}" hx-target="#history" hx-swap="outerHTML">{{ t.text("contacts.retry") }}</button></div>
   {% else %}
   {% include "history_rows.html" %}
-  {% if not history.turns %}{{ c.empty(t.text("history.empty")) }}{% endif %}
+  {% if not history.turns %}{{ c.empty(t.text("history.empty"), "message-square-text") }}{% endif %}
   {% endif %}
   {% include "history_end.html" %}
 </div>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/history_rows.html

@@ -4,7 +4,7 @@
    scrolling it into view asks for the page before, which takes its place;
    the column notes how tall it was, so the page can be put above what is
    being read without moving it #}
-{% if history.before %}<div class="edge loading" hx-get="{{ url }}&before={{ history.before|urlencode }}" hx-trigger="revealed" hx-swap="outerHTML">{{ c.icon("loader-circle") }}</div>{% endif %}
+{% if history.before %}<div class="edge loading" hx-get="{{ url }}&before={{ history.before|urlencode }}" hx-trigger="revealed" hx-swap="outerHTML">{{ c.icon("loader") }}</div>{% endif %}
 {# a day's turns start under a line with its date: the first loaded when
    there is nothing before it, and any whose day is not the one above; a page
    put above others ends with the line for the day below it, when that one
@@ -24,7 +24,7 @@
   {# the agent's own face opens onto what it is doing, the way its row in the
      list does; the card fetches itself the first time the pointer reaches
      the avatar, and shows by the pointer while it is there #}
-  <div class="card" :style="{left: left + 'px', top: top + 'px'}" hx-morph-skip hx-get="/agents/{{ ref(history.agent.computer_id) }}/{{ ref(history.agent.id) }}/activity" hx-trigger='mouseenter once from:"previous .av"' hx-target="this" hx-swap="innerMorph"><div class="loading">{{ c.icon("loader-circle") }}</div></div>
+  <div class="card" :style="{left: left + 'px', top: top + 'px'}" hx-morph-skip hx-get="/agents/{{ ref(history.agent.computer_id) }}/{{ ref(history.agent.id) }}/activity" hx-trigger='mouseenter once from:"previous .av"' hx-target="this" hx-swap="innerMorph"><div class="loading">{{ c.icon("loader") }}</div></div>
   {% endif %}
   <div class="said">
     <div class="who"><b>{{ turn.speaker }}</b>{% if turn.kind in ("agent", "human") %} <span class="k">{{ t.text("history." ~ turn.kind) }}</span>{% endif %} <span class="at">{{ turn.at_ms|time }}</span></div>

bazaar_compute_node-0.2.1rc6/src/bazaar_compute_server/resources/templates/icons/loader.svg

@@ -0,0 +1,22 @@
+<!-- @license lucide-static v1.46.0 - ISC -->
+<svg
+  class="lucide lucide-loader"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12 2v4" />
+  <path d="m16.2 7.8 2.9-2.9" />
+  <path d="M18 12h4" />
+  <path d="m16.2 16.2 2.9 2.9" />
+  <path d="M12 18v4" />
+  <path d="m4.9 19.1 2.9-2.9" />
+  <path d="M2 12h4" />
+  <path d="m4.9 4.9 2.9 2.9" />
+</svg>

{bazaar_compute_node-0.2.1rc5 → bazaar_compute_node-0.2.1rc6}/src/bazaar_compute_server/resources/templates/shell.html

@@ -20,9 +20,11 @@
 <body data-build="{{ build }}" x-data="application" x-bind="connection" hx-swap:inherited="innerMorph" hx-headers:inherited='js:{"X-Timezone": Intl.DateTimeFormat().resolvedOptions().timeZone, "X-Build": "{{ build }}"}'>
 <div class="app">
   {% include "rail.html" %}
-  <div id="main" class="main" x-show="!unreachable">{% include content %}</div>
+  <div id="main" class="main" :aria-busy="pending.size > 0" x-show="!unreachable">{% include content %}</div>
   {% include "unreachable.html" %}
 </div>
+{% import "components.html" as c with context %}
+<div class="navigation-loading" x-cloak x-show="pending.size > 0 && !stale" role="status" aria-label="{{ t.text('app.loading') }}">{{ c.icon("loader") }}</div>
 <div class="veil" id="stale" x-cloak x-show="stale">
   <div class="dialog" role="dialog" aria-modal="true" aria-labelledby="stale-title" x-trap.inert.noscroll="stale">
     <h3 id="stale-title">{{ t.text("stale.title") }}</h3>

bazaar_compute_node-0.2.1rc5/src/bazaar_compute_server/resources/templates/icons/loader-circle.svg

@@ -1 +0,0 @@
-<!-- @license lucide-static v1.46.0 - ISC --><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" ><path d="M21 12a9 9 0 1 1-6.219-8.56" /></svg>