@jskit-ai/assistant-core 0.1.187 → 0.1.189

package/examples/conversation/package.json

@@ -8,14 +8,14 @@
     "build": "vite build"
   },
   "dependencies": {
-    "@jskit-ai/assistant-core": "0.1.187",
-    "@jskit-ai/http-runtime": "0.1.207",
-    "@jskit-ai/kernel": "0.1.209",
+    "@jskit-ai/assistant-core": "0.1.189",
+    "@jskit-ai/http-runtime": "0.1.209",
+    "@jskit-ai/kernel": "0.1.211",
     "@mdi/js": "^7.4.47",
     "vue": "^3.5.13",
     "vuetify": "^4.0.0",
-    "@jskit-ai/connectors-core": "0.1.26",
-    "@jskit-ai/connectors-catalog": "0.1.26"
+    "@jskit-ai/connectors-core": "0.1.28",
+    "@jskit-ai/connectors-catalog": "0.1.28"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^6.0.7",

package/fixtures/responsive-assistant/DeliveryFixture.vue

@@ -8,8 +8,9 @@ const turns = ref([]);
 const requests = ref([]);
 const configuration = ref({ tone: "concise" });
 const clearedFiles = ref([]);
+const queueWhileSending = new URLSearchParams(location.search).has("queue");
 const attachments = reactive({
-  attachments: [{ attachmentId: "original-file", fileName: "original.txt" }],
+  attachments: queueWhileSending ? [] : [{ attachmentId: "original-file", fileName: "original.txt" }],
   queueItems: [], canSubmit: true, canAddFiles: false,
   clearAttachments({ attachmentIds }) {
     clearedFiles.value.push(...attachmentIds);
@@ -24,14 +25,14 @@ const delivery = createAssistantMessageDelivery({ deliver(payload) {
 } });
 function accept() {
   const payload = requests.value.at(-1);
-  turns.value = [{ turnId: "accepted", user: { messageId: payload.messageId, text: payload.message },
+  turns.value = [...turns.value, { turnId: payload.messageId, user: { messageId: payload.messageId, text: payload.message },
     assistant: { text: "Accepted once." } }];
   pendingRequest.resolve({ ok: true });
 }
 const adapter = reactive({
   delivery, attachments,
   conversation: { turns, visible: true, scrollKey: "delivery", welcomeMessage: "Start a conversation." },
-  composer: { draft, canSend: true, submitOnEnter: true },
+  composer: { draft, canSend: true, submitOnEnter: true, queueWhileSending },
   actions: {
     setDraft(value) { draft.value = value; }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jskit-ai/assistant-core",
-  "version": "0.1.187",
+  "version": "0.1.189",
   "type": "module",
   "scripts": {
     "test": "node --test"
@@ -34,8 +34,8 @@
     "@ai-sdk/perplexity": "^4.0.43",
     "@ai-sdk/togetherai": "^3.0.49",
     "@ai-sdk/xai": "^4.0.58",
-    "@jskit-ai/resource-core": "0.1.151",
-    "@jskit-ai/resource-crud-core": "0.1.151",
+    "@jskit-ai/resource-core": "0.1.153",
+    "@jskit-ai/resource-crud-core": "0.1.153",
     "@mdi/js": "^7.4.47",
     "@openrouter/ai-sdk-provider": "^3.0.0",
     "ai": "^7.0.101",
@@ -44,8 +44,8 @@
     "ws": "^8.20.1"
   },
   "peerDependencies": {
-    "@jskit-ai/http-runtime": "0.1.207",
-    "@jskit-ai/kernel": "0.1.209",
+    "@jskit-ai/http-runtime": "0.1.209",
+    "@jskit-ai/kernel": "0.1.211",
     "vue": "^3.5.13",
     "vuetify": "^4.0.0"
   },

package/src/client/conversation/AssistantComposerActions.vue

@@ -11,11 +11,11 @@
       </v-btn>
       <v-btn
         ref="sendButton" class="assistant-composer-actions__send" color="primary" :disabled="!state.canSend"
-        :aria-busy="state.pending ? 'true' : undefined" :aria-label="state.submitAriaLabel || state.submitLabel || 'Send message'"
+        :aria-busy="state.pending && !state.canSend ? 'true' : undefined" :aria-label="state.submitAriaLabel || state.submitLabel || 'Send message'"
         :title="state.submitTitle" :prepend-icon="state.submitIcon || mdiSend" size="small" variant="flat"
         @click="emit('submit')"
       >
-        {{ state.submitLabel || (state.pending ? 'Sending…' : 'Send') }}
+        {{ state.submitLabel || (state.pending && !state.canSend ? 'Sending…' : 'Send') }}
       </v-btn>
     </div>
     <slot name="feedback" />

package/src/client/conversation/AssistantConversationElement.vue

@@ -125,6 +125,7 @@ watch(() => [props.adapter.delivery, props.adapter.conversation.turns], ([contro
   controller?.reconcile(turns || []);
 }, { immediate: true });
 const pending = computed(() => Boolean(props.adapter.delivery?.state.sending || props.adapter.composer?.pending));
+const queueWhileSending = computed(() => props.adapter.composer?.queueWhileSending === true);
 const working = computed(() => conversation.value.working ?? (!pending.value && Boolean(
   props.adapter.composer?.canStop || conversation.value.turns?.some(turn => turn.pending)
 )));
@@ -139,14 +140,17 @@ const attachmentState = computed(() => ({
   count: attachmentsEnabled.value ? props.adapter.attachments.queueItems?.length || 0 : 0,
   canSubmit: !attachmentsEnabled.value || props.adapter.attachments.canSubmit !== false
 }));
-const canSend = computed(() => !pending.value && props.adapter.composer?.canSend && attachmentState.value.canSubmit);
+const canSend = computed(() => (
+  (!pending.value || (queueWhileSending.value && attachmentState.value.count === 0)) &&
+  props.adapter.composer?.canSend && attachmentState.value.canSubmit
+));
 async function resend(id) {
   if (props.adapter.actions?.resend) return props.adapter.actions.resend(id);
   const controller = props.adapter.delivery;
   const payload = controller?.find(id)?.payload;
   const attachments = props.adapter.attachments;
   try {
-    const response = await controller?.resend(id);
+    const response = await controller?.resend(id, { queue: queueWhileSending.value });
     clearAcceptedAttachments(response, payload, attachments);
     return response;
   }
@@ -202,7 +206,7 @@ async function submit() {
   };
   props.adapter.actions.setDraft("");
   try {
-    const response = await controller.send(payload);
+    const response = await controller.send(payload, { queue: queueWhileSending.value });
     clearAcceptedAttachments(response, payload, attachments);
     return response;
   } catch { return false; /* Delivery retains the failed message and its actions. */ }

package/src/client/conversation/AssistantTranscript.vue

@@ -124,7 +124,13 @@
           v-else-if="entry.role === 'user'"
           class="assistant-transcript__message-row assistant-transcript__message-row--user"
         >
-          <div class="assistant-transcript__message assistant-transcript__message--user">
+          <div
+            class="assistant-transcript__message assistant-transcript__message--user"
+            :class="{
+              'assistant-transcript__message--pending': entry.turn.optimistic?.status === 'pending',
+              'assistant-transcript__message--failed': entry.turn.optimistic?.status === 'failed'
+            }"
+          >
             <div
               class="assistant-transcript__user-content"
             >
@@ -146,27 +152,30 @@
             </button>
             <slot name="attachments" :items="entry.message.attachments" :message="entry.message"><AssistantMessageAttachments :attachments="entry.message.attachments || []" /></slot>
             <div
-              v-if="entry.message.displayAt"
+              v-if="entry.message.displayAt || entry.turn.optimistic?.status === 'pending'"
               class="assistant-transcript__message-footer assistant-transcript__message-footer--user"
             >
               <time v-if="entry.message.displayAt">{{ entry.message.displayAt }}</time>
+              <span v-if="entry.turn.optimistic?.status === 'pending'" role="status">Pending</span>
             </div>
             <div
               v-if="entry.turn.optimistic?.status === 'failed'"
               class="assistant-transcript__optimistic-failure"
             >
-              <span>{{ entry.turn.optimistic.error || "Message could not be sent." }}</span>
+              <span role="status">Failed: {{ entry.turn.optimistic.error || "Message could not be sent." }}</span>
               <div class="assistant-transcript__optimistic-actions">
                 <v-btn
+                  class="assistant-transcript__delivery-action"
                   color="primary"
                   size="x-small"
                   type="button"
                   variant="tonal"
                   @click="emit('resend-turn', entry.turn.optimistic.id)"
                 >
-                  Resend
+                  Retry
                 </v-btn>
                 <v-btn
+                  class="assistant-transcript__delivery-action"
                   size="x-small"
                   type="button"
                   variant="text"
@@ -175,6 +184,7 @@
                   Cancel
                 </v-btn>
                 <v-btn
+                  class="assistant-transcript__delivery-action"
                   size="x-small"
                   type="button"
                   variant="text"
@@ -1101,6 +1111,21 @@ watch(timelineScrollTrigger, () => {
   width: fit-content;
 }
 
+.assistant-transcript__message--user.assistant-transcript__message--pending {
+  background: rgba(var(--v-theme-on-surface), 0.04);
+  outline: 1px dashed rgba(var(--v-theme-on-surface), 0.4);
+  outline-offset: -1px;
+}
+
+.assistant-transcript__message--pending .assistant-transcript__message-footer {
+  color: rgba(var(--v-theme-on-surface), 0.7);
+}
+
+.assistant-transcript__message--user.assistant-transcript__message--failed {
+  outline: 1px solid rgb(var(--v-theme-error));
+  outline-offset: -1px;
+}
+
 .assistant-transcript__message--assistant {
   background: rgb(var(--v-theme-surface));
   color: rgb(var(--v-theme-on-surface));
@@ -1232,6 +1257,13 @@ watch(timelineScrollTrigger, () => {
   gap: 0.25rem;
 }
 
+@media (max-width: 600px), (pointer: coarse) {
+  .assistant-transcript__delivery-action {
+    min-height: 3rem;
+    min-width: 3rem;
+  }
+}
+
 .assistant-transcript__message--assistant :deep(.studio-long-text-review__blocks),
 .assistant-transcript__message--user :deep(.studio-long-text-review__blocks) {
   color: inherit;

package/src/client/conversation/messageDelivery.js

@@ -34,7 +34,8 @@ function unmatchedOptimisticMessages(turns = [], optimisticMessages = []) {
 // the shared assistant element renders these pending and failed turns.
 function createAssistantMessageDelivery({ deliver: defaultDeliver } = {}) {
   const state = reactive({ messages: [], sending: false });
-  let generation = 0;
+  let deliveryTail = null;
+  let pendingSends = new Map();
 
   function find(messageId) {
     return state.messages.find((message) => message.id === messageId) || null;
@@ -65,12 +66,21 @@ function createAssistantMessageDelivery({ deliver: defaultDeliver } = {}) {
     ];
   }
 
-  async function send(payload, { messageId = crypto.randomUUID(), deliver = defaultDeliver, isCurrent = () => true } = {}) {
-    if (state.sending || !String(payload?.message || "").trim()) return false;
+  async function send(payload, {
+    messageId = crypto.randomUUID(),
+    deliver = defaultDeliver,
+    isCurrent = () => true,
+    queue = false
+  } = {}) {
+    if ((state.sending && !queue) || pendingSends.has(messageId) || !messageText(payload?.message)) return false;
     if (typeof deliver !== "function") throw new TypeError("Message delivery requires a deliver function.");
     const snapshot = JSON.parse(JSON.stringify(payload));
-    const ownerGeneration = generation;
-    const current = () => generation === ownerGeneration && isCurrent();
+    const ownerPendingSends = pendingSends;
+    const current = () => pendingSends === ownerPendingSends && isCurrent();
+    const predecessor = deliveryTail;
+    const settled = Promise.withResolvers();
+    deliveryTail = settled.promise;
+    ownerPendingSends.set(messageId, settled);
     const now = new Date();
     const message = {
       attachments: snapshot.displayAttachments || [],
@@ -85,10 +95,15 @@ function createAssistantMessageDelivery({ deliver: defaultDeliver } = {}) {
     state.messages = [...state.messages.filter((entry) => entry.id !== messageId), message];
     state.sending = true;
     try {
+      if (predecessor) await predecessor;
+      if (!current()) return false;
       const response = await deliver({ ...snapshot, messageId });
       if (!current()) return false;
       if (response === false || response?.ok === false) {
         fail(messageId, response?.error || "Message could not be sent.");
+      } else {
+        const acceptedMessage = find(messageId);
+        if (acceptedMessage) acceptedMessage.status = "accepted";
       }
       return response;
     } catch (error) {
@@ -96,7 +111,12 @@ function createAssistantMessageDelivery({ deliver: defaultDeliver } = {}) {
       fail(messageId, error);
       throw error;
     } finally {
-      if (generation === ownerGeneration) state.sending = false;
+      ownerPendingSends.delete(messageId);
+      if (pendingSends === ownerPendingSends) {
+        state.sending = ownerPendingSends.size > 0;
+        if (!state.sending) deliveryTail = null;
+      }
+      settled.resolve();
     }
   }
 
@@ -109,7 +129,7 @@ function createAssistantMessageDelivery({ deliver: defaultDeliver } = {}) {
   }
 
   function cancel(messageId) {
-    if (state.sending || find(messageId)?.status !== "failed") return false;
+    if (find(messageId)?.status !== "failed") return false;
     remove(messageId);
     return true;
   }
@@ -120,14 +140,16 @@ function createAssistantMessageDelivery({ deliver: defaultDeliver } = {}) {
     return !draft || draft.startsWith(message.text) ? draft || message.text : `${message.text}\n\n${draft}`;
   }
 
-  function resend(messageId) {
+  function resend(messageId, { queue = false } = {}) {
     const message = find(messageId);
     if (message?.status !== "failed") return false;
-    return send(message.payload, { messageId });
+    return send(message.payload, { messageId, queue });
   }
 
   function reset() {
-    generation += 1;
+    deliveryTail = null;
+    for (const pending of pendingSends.values()) pending.resolve();
+    pendingSends = new Map();
     state.messages = [];
     state.sending = false;
   }

package/test/messageDelivery.browser.test.js

@@ -26,10 +26,10 @@ test("the shared element renders delayed sends and supplies retry, edit and canc
       await expect(page.getByText("Start a conversation.", { exact: true })).toHaveCount(0);
       await expect(page.locator(".assistant-composer-support__assistant-status")).toHaveText("Sending to assistant…");
       await fail();
-      await expect(page.getByText("Delivery unavailable.", { exact: true })).toHaveCount(1);
+      await expect(page.getByText("Failed: Delivery unavailable.", { exact: true })).toHaveCount(1);
       await input.fill("Keep my newer draft.");
       await page.getByRole("button", { name: "Prepare newer input" }).click();
-      await page.getByRole("button", { name: "Resend", exact: true }).click();
+      await page.getByRole("button", { name: "Retry", exact: true }).click();
       await expect(input).toHaveValue("Keep my newer draft.");
       await page.getByRole("button", { name: "Accept request" }).click();
       await expect(page.getByText("Accepted once.", { exact: true })).toBeVisible();
@@ -53,6 +53,34 @@ test("the shared element renders delayed sends and supplies retry, edit and canc
       await page.getByRole("button", { name: "Cancel", exact: true }).click();
       await expect(input).toHaveValue("Retain this.");
       await expect(page.getByText("Cancel this question.", { exact: true })).toHaveCount(0);
+      await page.goto(`${vite.baseURL}/?delivery=1&queue=1`);
+      await send("First steer.");
+      await send("Second steer.");
+      await send("Third steer.");
+      await expect(input).toHaveValue("");
+      await expect(page.getByText("Pending", { exact: true })).toHaveCount(3);
+      await expect(page.locator(".assistant-transcript__message--pending")).toHaveCount(3);
+      assert.equal(JSON.parse(await page.locator("[data-requests]").textContent()).length, 1);
+      await input.fill("Keep this newer draft.");
+      await fail();
+      await expect(page.locator(".assistant-transcript__message--failed")).toHaveCount(1);
+      await expect(page.getByRole("button", { name: "Retry", exact: true })).toBeVisible();
+      if (width === 390) {
+        const retryBox = await page.getByRole("button", { name: "Retry", exact: true }).boundingBox();
+        assert.ok(retryBox.width >= 48 && retryBox.height >= 48);
+      }
+      await page.getByRole("button", { name: "Retry", exact: true }).click();
+      await expect(page.getByText("Pending", { exact: true })).toHaveCount(3);
+      for (let count = 2; count <= 4; count += 1) {
+        await expect.poll(async () => JSON.parse(await page.locator("[data-requests]").textContent()).length).toBe(count);
+        await page.getByRole("button", { name: "Accept request" }).click();
+      }
+      await expect(page.getByText("Pending", { exact: true })).toHaveCount(0);
+      await expect(page.locator(".assistant-transcript__message--pending")).toHaveCount(0);
+      await expect(input).toHaveValue("Keep this newer draft.");
+      const queuedRequests = JSON.parse(await page.locator("[data-requests]").textContent());
+      assert.deepEqual(queuedRequests.map(item => item.message), ["First steer.", "Second steer.", "Third steer.", "First steer."]);
+      assert.deepEqual(queuedRequests[0], queuedRequests[3]);
       assert.deepEqual(errors, []);
       assert.ok(await page.evaluate(() => document.documentElement.scrollWidth <= innerWidth));
       await page.close();

package/test/messageDelivery.test.js

@@ -41,7 +41,7 @@ test("failed delivery retains the original payload and identity for an explicit
   assert.deepEqual(sent[0], sent[1]);
   assert.equal(sent[1].configuration.model, "one");
   assert.equal(delivery.state.messages.length, 1);
-  assert.equal(delivery.state.messages[0].status, "pending");
+  assert.equal(delivery.state.messages[0].status, "accepted");
 });
 
 test("cancel and edit affect failed messages and preserve a newer draft", async () => {
@@ -70,3 +70,79 @@ test("retiring a conversation isolates late responses from the next conversation
   await newSend;
   assert.equal(delivery.state.sending, false);
 });
+
+test("queued messages appear immediately and deliver in order with captured payloads", async () => {
+  const requests = [Promise.withResolvers(), Promise.withResolvers(), Promise.withResolvers()];
+  const sent = [];
+  const delivery = createAssistantMessageDelivery({ deliver: payload => {
+    sent.push(payload);
+    return requests[sent.length - 1].promise;
+  } });
+  const first = delivery.send({ message: "First" }, { messageId: "one" });
+  const payload = { message: "Second", configuration: { model: "original" } };
+  const second = delivery.send(payload, { messageId: "two", queue: true });
+  const third = delivery.send({ message: "Third" }, { messageId: "three", queue: true });
+  payload.configuration.model = "changed";
+  assert.deepEqual(delivery.turns().map(turn => [turn.user.text, turn.optimistic.status]),
+    [["First", "pending"], ["Second", "pending"], ["Third", "pending"]]);
+  assert.equal(await delivery.send({ message: "Duplicate" }, { messageId: "two", queue: true }), false);
+  assert.deepEqual(sent.map(message => message.messageId), ["one"]);
+  requests[0].resolve({ ok: true });
+  await first;
+  assert.equal(delivery.state.sending, true);
+  assert.equal(delivery.find("one").status, "accepted");
+  assert.deepEqual(sent.map(message => message.messageId), ["one", "two"]);
+  assert.equal(sent[1].configuration.model, "original");
+  requests[1].resolve({ ok: true });
+  await second;
+  assert.deepEqual(sent.map(message => message.messageId), ["one", "two", "three"]);
+  requests[2].resolve({ ok: true });
+  await third;
+  assert.equal(delivery.state.sending, false);
+});
+
+test("a failed message retains its retry identity while later guidance is pending", async () => {
+  const firstRequest = Promise.withResolvers();
+  const secondRequest = Promise.withResolvers();
+  const sent = [];
+  const delivery = createAssistantMessageDelivery({ deliver: payload => {
+    sent.push(payload);
+    return [firstRequest.promise, secondRequest.promise, { ok: true }][sent.length - 1];
+  } });
+  const first = delivery.send({ message: "First", configuration: { model: "one" } }, { messageId: "one" });
+  const second = delivery.send({ message: "Second" }, { messageId: "two", queue: true });
+  const rejected = assert.rejects(first, /Offline/);
+  firstRequest.reject(new Error("Offline"));
+  await rejected;
+  assert.equal(delivery.find("one").status, "failed");
+  assert.equal(delivery.find("one").error, "Offline");
+  const retry = delivery.resend("one", { queue: true });
+  assert.equal(delivery.find("one").status, "pending");
+  assert.equal(sent.length, 2);
+  secondRequest.resolve({ ok: true });
+  await second;
+  await retry;
+  assert.deepEqual(sent[2], sent[0]);
+  assert.equal(delivery.state.sending, false);
+});
+
+test("reset discards queued delivery without waiting for the old transport", async () => {
+  const request = Promise.withResolvers();
+  const sent = [];
+  const delivery = createAssistantMessageDelivery({ deliver: payload => {
+    sent.push(payload.message);
+    return request.promise;
+  } });
+  const first = delivery.send({ message: "Old" });
+  const queued = delivery.send({ message: "Queued" }, { queue: true });
+  delivery.reset();
+  assert.equal(await queued, false);
+  assert.deepEqual(sent, ["Old"]);
+  const next = delivery.send({ message: "New" });
+  assert.deepEqual(sent, ["Old", "New"]);
+  assert.equal(delivery.state.sending, true);
+  request.resolve({ ok: true });
+  assert.equal(await first, false);
+  assert.deepEqual(await next, { ok: true });
+  assert.equal(delivery.state.sending, false);
+});