@jskit-ai/assistant-core 0.2.20 → 0.2.22

package/CHANGELOG.md

@@ -2,7 +2,12 @@
 
 ## Unreleased
 
+- The goal menu closes when Cancel succeeds, as it does after Start; Pause and Resume keep it open.
+- `AssistantConversationElement` has an `avatar-thumbnail` slot, with the `{ size, height }` scope of the other avatar slots: while the avatar is hidden, the **Show avatar** button draws its content instead of the anonymous account icon, such as a still miniature of the avatar, clipped to the button's round 32-pixel disc. The button keeps its label, title and 44-pixel target, and shows the icon as before without the slot.
+- A delivered Codex turn is held as not yet started only until Codex reports it: a `turn/started` that arrives before the `turn/start` answer counts, and a thread read listing exactly that turn as completed or failed settles a turn whose notifications were missed, so its answer is no longer kept waiting for a notification that never comes.
 - The API driver's state note, which carries the current time, follows the conversation as its last message instead of ending the system prompt, so the provider's prompt cache keeps the whole history from one turn to the next instead of charging it uncached on each turn's first model call (`@jskit-ai/agent` `runLoop`).
+- The assistant settings card is an elevated Material 3 card without a border, and the long-text preview's table alignment no longer needs `!important`.
+- Icons are Material Symbols `$aliases` (from `@jskit-ai/material-web`) instead of `@mdi/js` paths, and text uses Vuetify 4's Material 3 type classes (`text-body-large`, `text-title-medium`, ...) instead of Material 2 ones, which Vuetify 4 no longer styles. Upgrading: see the guide's [Move an app to the Material 3 defaults](https://mobily-enterprises.github.io/jskit-ai/guide/app-setup/material-3-migration).
 - Assistant failures that reach a person translate: 63 more undotted codes render from `jskit.errors.<code>`, and 98 sentences that share a code with others, or are sent without one, carry a `messageCode` (`assistant.claude.*`, `assistant.codex.*`, `assistant.opencode.*`, `assistant.conversation.*`, `assistant.turn.*`). The English messages are unchanged.
 - The OpenCode version mismatch, Claude control-request timeout and unreadable saved Claude conversation errors carry `params` for their catalog English.
 - The assistant settings resource sends its system prompt field messages in the coded `{ code, message, params }` form.

package/examples/conversation/main.js

@@ -2,8 +2,9 @@ import { createApp } from "vue";
 import { createVuetify } from "vuetify";
 import * as components from "vuetify/components";
 import * as directives from "vuetify/directives";
-import { aliases, mdi } from "vuetify/iconsets/mdi-svg";
 import "vuetify/styles";
+import "@jskit-ai/material-web/client/material.css";
+import { createMaterialVuetifyOptions } from "@jskit-ai/material-web/client";
 import App from "./App.vue";
 
-createApp(App).use(createVuetify({ components, directives, icons: { defaultSet: "mdi", aliases, sets: { mdi } } })).mount("#app");
+createApp(App).use(createVuetify({ components, directives, ...createMaterialVuetifyOptions() })).mount("#app");

package/examples/conversation/package.json

@@ -8,14 +8,14 @@
     "build": "vite build"
   },
   "dependencies": {
-    "@jskit-ai/assistant-core": "0.2.20",
-    "@jskit-ai/http-runtime": "0.2.9",
-    "@jskit-ai/kernel": "0.2.9",
-    "@mdi/js": "^7.4.47",
+    "@jskit-ai/assistant-core": "0.2.22",
+    "@jskit-ai/http-runtime": "0.2.10",
+    "@jskit-ai/kernel": "0.2.10",
+    "@jskit-ai/material-web": "0.1.0",
     "vue": "^3.5.13",
     "vuetify": "^4.0.0",
-    "@jskit-ai/connectors-core": "0.2.10",
-    "@jskit-ai/connectors-catalog": "0.2.10"
+    "@jskit-ai/connectors-core": "0.2.11",
+    "@jskit-ai/connectors-catalog": "0.2.11"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^6.0.7",

package/fixtures/responsive-assistant/main.js

@@ -1,24 +1,23 @@
 import { createApp } from "vue";
 import "vuetify/styles";
+import "@jskit-ai/material-web/client/material.css";
+import { createMaterialVuetifyOptions } from "@jskit-ai/material-web/client";
 import { createVuetify } from "vuetify";
 import * as components from "vuetify/components";
 import * as directives from "vuetify/directives";
-import { aliases as mdiAliases, mdi } from "vuetify/iconsets/mdi-svg";
 import App from "./App.vue";
 import ConversationFixture from "./ConversationFixture.vue";
 import ProgressFixture from "./ProgressFixture.vue";
 import DeliveryFixture from "./DeliveryFixture.vue";
 
 const query = new URLSearchParams(location.search);
+const material = createMaterialVuetifyOptions();
 const vuetify = createVuetify({
   components,
   directives,
-  icons: {
-    defaultSet: "mdi",
-    aliases: mdiAliases,
-    sets: { mdi }
-  },
+  ...material,
   theme: {
+    ...material.theme,
     defaultTheme: query.has("dark") ? "dark" : "light"
   }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jskit-ai/assistant-core",
-  "version": "0.2.20",
+  "version": "0.2.22",
   "type": "module",
   "scripts": {
     "test": "node --test --test-concurrency=1"
@@ -52,9 +52,8 @@
     "@ai-sdk/togetherai": "^3.0.49",
     "@ai-sdk/xai": "^4.0.58",
     "@jskit-ai/agent": "0.1.1",
-    "@jskit-ai/resource-core": "0.1.200",
-    "@jskit-ai/resource-crud-core": "0.1.200",
-    "@mdi/js": "^7.4.47",
+    "@jskit-ai/resource-core": "0.1.201",
+    "@jskit-ai/resource-crud-core": "0.1.201",
     "@openrouter/ai-sdk-provider": "^3.0.0",
     "ai": "^7.0.152",
     "json-rest-schema": "^1.0.17",
@@ -62,10 +61,10 @@
     "ws": "^8.20.1"
   },
   "peerDependencies": {
-    "@jskit-ai/http-runtime": "0.2.9",
-    "@jskit-ai/kernel": "0.2.9",
+    "@jskit-ai/http-runtime": "0.2.10",
+    "@jskit-ai/kernel": "0.2.10",
     "vue": "^3.5.13",
-    "vuetify": "^4.0.0"
+    "vuetify": "^4.3.0"
   },
   "description": "Reusable assistant client/server/shared primitives without surface-specific routes or settings ownership.",
   "jskit": {
@@ -219,5 +218,8 @@
         "capabilities": []
       }
     }
+  },
+  "devDependencies": {
+    "@jskit-ai/material-web": "0.1.0"
   }
 }

package/src/client/components/AssistantSettingsFormCard.vue

@@ -1,8 +1,8 @@
 <template>
   <section :class="props.rootClass">
-    <v-card rounded="lg" elevation="1" border>
+    <v-card>
       <v-card-item>
-        <v-card-title class="text-h6">{{ props.title }}</v-card-title>
+        <v-card-title class="text-title-large">{{ props.title }}</v-card-title>
         <v-card-subtitle>{{ props.subtitle }}</v-card-subtitle>
       </v-card-item>
       <v-divider />
@@ -11,11 +11,11 @@
           <v-skeleton-loader type="text@2, list-item-two-line@4, button" />
         </template>
 
-        <p v-else-if="props.addEdit.loadError" class="text-body-2 text-medium-emphasis mb-4">
+        <p v-else-if="props.addEdit.loadError" class="text-body-medium on-surface-variant mb-4">
           {{ props.addEdit.loadError }}
         </p>
 
-        <p v-else-if="!props.addEdit.canView" class="text-body-2 text-medium-emphasis mb-4">
+        <p v-else-if="!props.addEdit.canView" class="text-body-medium on-surface-variant mb-4">
           {{ props.noPermissionMessage }}
         </p>
 

package/src/client/conversation/AssistantAttachmentPreview.vue

@@ -13,7 +13,7 @@
         <p v-else>{{ t("jskit.assistant.attachments.previewUnavailable") }}</p>
       </v-card-text>
       <v-card-actions>
-        <v-btn :href="downloadUrl" :download="attachment.fileName" :prepend-icon="mdiDownload" variant="tonal">{{ t("jskit.assistant.attachments.download") }}</v-btn>
+        <v-btn :href="downloadUrl" :download="attachment.fileName" prepend-icon="$download" variant="tonal">{{ t("jskit.assistant.attachments.download") }}</v-btn>
         <v-spacer />
         <v-btn @click="emit('close')">{{ t("jskit.assistant.attachments.close") }}</v-btn>
       </v-card-actions>
@@ -23,7 +23,6 @@
 
 <script setup>
 import { ref, watch } from "vue";
-import { mdiDownload } from "@mdi/js";
 import { useJskitText } from "../i18n.js";
 
 const { t } = useJskitText();

package/src/client/conversation/AssistantAttachmentQueue.vue

@@ -74,7 +74,7 @@
             :ref="(element) => setActionElement(item, 'cancel', element)"
             :aria-label="t('jskit.assistant.attachments.cancelItem', { name: itemName(item) })"
             class="assistant-attachment-queue__action"
-            :icon="mdiCloseCircleOutline"
+            icon="$cancel"
             size="small"
             :title="t('jskit.assistant.attachments.cancelItem', { name: itemName(item) })"
             type="button"
@@ -86,7 +86,7 @@
             :ref="(element) => setActionElement(item, 'retry', element)"
             :aria-label="t('jskit.assistant.attachments.retryItem', { name: itemName(item) })"
             class="assistant-attachment-queue__action"
-            :icon="mdiRefresh"
+            icon="$refresh"
             size="small"
             :title="t('jskit.assistant.attachments.retryItem', { name: itemName(item) })"
             type="button"
@@ -98,7 +98,7 @@
             :ref="(element) => setActionElement(item, 'remove', element)"
             :aria-label="t('jskit.assistant.attachments.removeItem', { name: itemName(item) })"
             class="assistant-attachment-queue__action"
-            :icon="mdiClose"
+            icon="$close"
             size="small"
             :title="t('jskit.assistant.attachments.removeItem', { name: itemName(item) })"
             type="button"
@@ -122,11 +122,6 @@
 
 <script setup>
 import { computed, nextTick, onBeforeUnmount, onMounted, ref } from "vue";
-import {
-  mdiClose,
-  mdiCloseCircleOutline,
-  mdiRefresh
-} from "@mdi/js";
 
 import { hasWindowFunction } from "../browser.js";
 import { useJskitText } from "../i18n.js";

package/src/client/conversation/AssistantComposerActions.vue

@@ -4,7 +4,7 @@
     <div class="assistant-composer-actions__delivery">
       <v-btn
         v-if="state.canStop" color="error" :disabled="state.stopDisabled || state.stopPending"
-        :aria-busy="state.stopPending ? 'true' : undefined" :prepend-icon="mdiStopCircleOutline"
+        :aria-busy="state.stopPending ? 'true' : undefined" prepend-icon="$stopCircle"
         size="small" variant="tonal" @click="emit('stop')"
       >
         {{ state.stopPending ? t('jskit.assistant.composer.stopping') : t('jskit.assistant.composer.stop') }}
@@ -12,7 +12,7 @@
       <v-btn
         ref="sendButton" class="assistant-composer-actions__send" color="primary" :disabled="!state.canSend"
         :aria-busy="state.pending && !state.canSend ? 'true' : undefined" :aria-label="state.submitAriaLabel || state.submitLabel || t('jskit.assistant.composer.sendMessage')"
-        :title="state.submitTitle" :prepend-icon="state.submitIcon || mdiSend" size="small" variant="flat"
+        :title="state.submitTitle" :prepend-icon="state.submitIcon || '$send'" size="small" variant="flat"
         @click="emit('submit')"
       >
         {{ state.submitLabel || (state.pending && !state.canSend ? t('jskit.assistant.composer.sending') : t('jskit.assistant.composer.send')) }}
@@ -23,7 +23,6 @@
 </template>
 <script setup>
 import { ref } from "vue";
-import { mdiSend, mdiStopCircleOutline } from "@mdi/js";
 import { useJskitText } from "../i18n.js";
 
 const { t } = useJskitText();

package/src/client/conversation/AssistantComposerSupport.vue

@@ -29,7 +29,7 @@
       <v-icon
         aria-hidden="true"
         class="assistant-composer-support__marker"
-        :icon="mdiLightbulbOnOutline"
+        icon="$lightbulb"
         size="16"
       />
 
@@ -73,7 +73,6 @@
 
 <script setup>
 import { computed } from "vue";
-import { mdiLightbulbOnOutline } from "@mdi/js";
 import { useJskitText } from "../i18n.js";
 
 const { t } = useJskitText();

package/src/client/conversation/AssistantConversationElement.vue

@@ -7,14 +7,14 @@
       <div v-show="avatarSize === 'hidden'" ref="avatarControls" class="assistant-conversation__avatar-controls">
         <slot name="avatar-control" :size="avatarSize" :height="avatarHeight" />
         <v-btn
-          :icon="mdiAccountCircleOutline" size="small"
+          icon="$accountCircle" size="small"
           variant="text" :width="44" :min-width="44" :min-height="44"
           class="assistant-conversation__avatar-size"
           :aria-label="t('jskit.assistant.chat.showAvatar')" :title="t('jskit.assistant.chat.showAvatar')"
           :aria-expanded="avatarSize !== 'hidden'" @click="toggleAvatar"
         >
           <span class="assistant-conversation__avatar-size-disc">
-            <v-icon size="20" :icon="mdiAccountCircleOutline" />
+            <slot name="avatar-thumbnail" :size="avatarSize" :height="avatarHeight"><v-icon size="20" icon="$accountCircle" /></slot>
           </span>
         </v-btn>
       </div>
@@ -25,13 +25,13 @@
         <div class="assistant-conversation__avatar-tools">
           <slot name="avatar-tools" :size="avatarSize" :height="avatarHeight" />
           <v-btn
-            :icon="mdiMinus" size="small" variant="text" color="primary"
+            icon="$minus" size="small" variant="text" color="primary"
             :width="40" :min-width="40" :min-height="44" class="assistant-conversation__avatar-size"
             :aria-label="t('jskit.assistant.chat.minimiseAvatar')" :title="t('jskit.assistant.chat.minimiseAvatar')" :aria-expanded="true"
             @click="toggleAvatar"
           >
             <span class="assistant-conversation__avatar-size-disc assistant-conversation__avatar-size-disc--minimise">
-              <v-icon size="20" :icon="mdiMinus" />
+              <v-icon size="20" icon="$minus" />
             </span>
           </v-btn>
         </div>
@@ -49,13 +49,13 @@
       <template #user-message-actions="scope">
         <div v-if="scope.turn.preview && scope.turn.previewMessage?.actions" class="assistant-conversation__preview-actions">
           <v-btn
-            v-if="scope.turn.previewMessage.actions.discard" :icon="mdiClose" size="small" variant="text"
+            v-if="scope.turn.previewMessage.actions.discard" icon="$close" size="small" variant="text"
             :aria-label="t('jskit.assistant.chat.discardUnsent')" :title="t('jskit.assistant.chat.discardUnsent')"
             :disabled="!scope.turn.previewMessage.actions.canDiscard"
             @click="scope.turn.previewMessage.actions.discard(scope.turn.turnId)"
           />
           <v-btn
-            v-if="scope.turn.previewMessage.actions.edit" :icon="mdiPencil" size="small" variant="text"
+            v-if="scope.turn.previewMessage.actions.edit" icon="$edit" size="small" variant="text"
             :aria-label="t('jskit.assistant.chat.editUnsent')" :title="t('jskit.assistant.chat.editUnsent')"
             :disabled="!scope.turn.previewMessage.actions.canEdit"
             @click="scope.turn.previewMessage.actions.edit(scope.turn.turnId)"
@@ -129,7 +129,7 @@
               @select-variant="adapter.models.selectVariant?.($event)" @apply="applyModel" @reload="adapter.models.reload?.()"
             />
             <v-btn
-              v-if="attachmentsEnabled" :aria-label="t('jskit.assistant.chat.attachFiles')" :title="t('jskit.assistant.chat.attachFiles')" size="small" variant="text" :icon="mdiPaperclip"
+              v-if="attachmentsEnabled" :aria-label="t('jskit.assistant.chat.attachFiles')" :title="t('jskit.assistant.chat.attachFiles')" size="small" variant="text" icon="$attachFile"
               :disabled="!adapter.attachments.canAddFiles" @click="fileInput?.click()"
             />
             <slot
@@ -158,7 +158,6 @@
 </template>
 <script setup>
 import { computed, onBeforeUnmount, onMounted, onUpdated, ref, useId, useSlots, watch } from "vue";
-import { mdiAccountCircleOutline, mdiClose, mdiMinus, mdiPaperclip, mdiPencil } from "@mdi/js";
 import AssistantTranscript from "./AssistantTranscript.vue";
 import AssistantPromptInput from "./AssistantPromptInput.vue";
 import AssistantComposerActions from "./AssistantComposerActions.vue";
@@ -371,7 +370,7 @@ defineExpose({ focus: () => input.value?.focus(), submit, stop });
 .assistant-conversation__avatar-controls { position: absolute; top: 0; right: 100%; display: flex; align-items: center; justify-content: flex-end; min-height: 44px; }
 .assistant-conversation__avatar--hidden .assistant-conversation__avatar-controls { right: 0; }
 .assistant-conversation__avatar-size { min-width: 44px; min-height: 44px; }
-.assistant-conversation__avatar-size-disc { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(var(--v-theme-on-surface), .08); }
+.assistant-conversation__avatar-size-disc { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; overflow: hidden; border-radius: 50%; background: rgba(var(--v-theme-on-surface), .08); }
 .assistant-conversation__avatar-size-disc--minimise { background: rgba(var(--v-theme-primary), .12); }
 .assistant-conversation__avatar-presentation { display: flex; flex-direction: column; align-items: center; min-width: 0; }
 .assistant-conversation__avatar-tools { display: flex; align-items: center; gap: 0; }

package/src/client/conversation/AssistantConversationStatus.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="message.delivery" class="d-flex flex-wrap align-center ga-1 text-caption text-error" role="status">
+  <div v-if="message.delivery" class="d-flex flex-wrap align-center ga-1 text-body-small text-error" role="status">
     <span>{{ message.delivery.error || message.text }}</span>
     <v-btn
       variant="text"

package/src/client/conversation/AssistantGoalControl.vue

@@ -63,6 +63,11 @@ async function setGoal() {
   const result = await props.state.set({ objective: objective.value.trim(), ...(props.state.tokenBudgetSupported === false || tokenBudget.value === "" ? {} : { tokenBudget: Number(tokenBudget.value) }) });
   if (result !== false && result?.ok !== false && !props.state.error) { objective.value = ""; tokenBudget.value = ""; open.value = false; }
 }
+// A successful Cancel closes the menu, as Start does; Pause and Resume keep it open.
+async function cancelGoal() {
+  const result = await props.state.cancel();
+  if (result !== false && result?.ok !== false && !props.state.error) open.value = false;
+}
 </script>
 
 <template>
@@ -78,7 +83,7 @@ async function setGoal() {
       <strong role="status">{{ label }}</strong>
       <v-btn v-if="(running || (state.pauseBlocked && goal?.status === 'blocked')) && state.pause" size="small" :disabled="state.stopPending" @click="state.pause()">{{ state.action === 'pause' ? t('jskit.assistant.goal.pausing') : t('jskit.assistant.goal.pause') }}</v-btn>
       <v-btn v-if="['paused', 'blocked', 'usageLimited'].includes(goal?.status) && state.resume" size="small" :disabled="state.pending" @click="state.resume()">{{ state.action === 'resume' ? t('jskit.assistant.goal.resuming') : t('jskit.assistant.goal.resume') }}</v-btn>
-      <v-btn v-if="goal && goal.status !== 'complete' && state.cancel" color="error" size="small" variant="text" :disabled="state.stopPending" @click="state.cancel()">{{ state.action === 'cancel' ? t('jskit.assistant.goal.cancelling') : t('jskit.assistant.goal.cancel') }}</v-btn>
+      <v-btn v-if="goal && goal.status !== 'complete' && state.cancel" color="error" size="small" variant="text" :disabled="state.stopPending" @click="cancelGoal">{{ state.action === 'cancel' ? t('jskit.assistant.goal.cancelling') : t('jskit.assistant.goal.cancel') }}</v-btn>
       <p v-if="goal" class="my-2">{{ goal.objective }}</p>
       <p v-if="goal?.reason" class="text-body-small my-2">{{ goal.reason }}</p>
       <p v-if="elapsed" class="text-body-small my-2">{{ elapsedText }}</p>

package/src/client/conversation/AssistantMessageAttachments.vue

@@ -41,7 +41,6 @@
 </template>
 
 <script setup>
-import { mdiFileOutline, mdiImageOutline } from "@mdi/js";
 import { useJskitText } from "../i18n.js";
 import { attachmentSizeText } from "./attachmentSize.js";
 
@@ -53,7 +52,7 @@ defineProps({
 });
 const emit = defineEmits(["preview"]);
 function attachmentIcon(attachment) {
-  return /\.(?:avif|bmp|gif|heic|heif|jpe?g|png|svg|webp)$/iu.test(attachment.fileName) ? mdiImageOutline : mdiFileOutline;
+  return /\.(?:avif|bmp|gif|heic|heif|jpe?g|png|svg|webp)$/iu.test(attachment.fileName) ? "$image" : "$description";
 }
 function attachmentKey(attachment, index) {
   return attachment.attachmentId || `${index}:${attachment.fileName}:${attachment.size ?? ""}`;

package/src/client/conversation/AssistantModelControl.vue

@@ -11,7 +11,7 @@
         :aria-label="t('jskit.assistant.model.chooseAi')"
         class="assistant-model-control__button"
         density="comfortable"
-        :icon="mdiCogOutline"
+        icon="$settings"
         rounded="lg"
         size="small"
         :title="buttonTitle ?? t('jskit.assistant.model.chooseAi')"
@@ -29,7 +29,7 @@
     >
       <header class="assistant-model-control__header">
         <v-avatar color="primary" size="36" variant="tonal">
-          <v-icon :icon="mdiBrain" size="20" />
+          <v-icon icon="$psychology" size="20" />
         </v-avatar>
         <div>
           <strong class="text-title-small">{{ t("jskit.assistant.model.controls") }}</strong>
@@ -43,7 +43,7 @@
         rounded="lg"
         role="status"
       >
-        <v-icon :icon="mdiClockOutline" size="18" />
+        <v-icon icon="$schedule" size="18" />
         <span>{{ t("jskit.assistant.model.viewOnly") }}</span>
       </v-sheet>
 
@@ -96,7 +96,7 @@
               @click="selectProvider(provider.id)"
             >
               <span>{{ provider.label }}</span>
-              <v-icon v-if="modelProviderId === provider.id" :icon="mdiCheck" size="15" />
+              <v-icon v-if="modelProviderId === provider.id" icon="$check" size="15" />
             </v-btn>
           </div>
         </section>
@@ -135,7 +135,7 @@
               @click="selectModel(model.id)"
             >
               <span>{{ model.label }}</span>
-              <v-icon v-if="modelId === model.id" :icon="mdiCheck" size="15" />
+              <v-icon v-if="modelId === model.id" icon="$check" size="15" />
             </v-btn>
           </div>
           <span v-else class="assistant-model-control__empty">{{ t("jskit.assistant.model.noModels") }}</span>
@@ -165,7 +165,7 @@
               @click="selectVariant(variant.id)"
             >
               <span>{{ variant.label }}</span>
-              <v-icon v-if="variantId === variant.id" :icon="mdiCheck" size="15" />
+              <v-icon v-if="variantId === variant.id" icon="$check" size="15" />
             </v-btn>
           </div>
         </section>
@@ -189,7 +189,6 @@
 </template>
 
 <script setup>
-import { mdiBrain, mdiCheck, mdiClockOutline, mdiCogOutline } from "@mdi/js";
 import { useJskitText } from "../i18n.js";
 
 const { t } = useJskitText();

package/src/client/conversation/AssistantQuestionInputs.vue

@@ -1,5 +1,4 @@
 <script setup>
-import { mdiPencilOutline } from "@mdi/js";
 import { useJskitText } from "../i18n.js";
 
 const { t } = useJskitText();
@@ -23,7 +22,7 @@ const emit = defineEmits(["dismiss"]);
         :aria-label="t('jskit.assistant.questions.answerNormally')"
         class="ml-auto"
         color="primary"
-        :prepend-icon="mdiPencilOutline"
+        prepend-icon="$edit"
         size="small"
         variant="tonal"
         @click="emit('dismiss')"

package/src/client/conversation/AssistantTranscript.css

@@ -325,13 +325,13 @@
 }
 
 .assistant-transcript__message-header time {
-  color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
+  color: rgb(var(--v-theme-on-surface-variant));
   font-weight: 650;
 }
 
 .assistant-transcript__message-footer {
   align-items: center;
-  color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
+  color: rgb(var(--v-theme-on-surface-variant));
   display: flex;
   font-size: 0.88rem;
   font-weight: 500;

package/src/client/conversation/AssistantTranscript.vue

@@ -11,7 +11,7 @@
       :aria-label="reloadLabel"
       class="assistant-transcript__reload"
       :disabled="reloading"
-      :icon="mdiRefresh"
+      icon="$refresh"
       size="x-small"
       :title="reloadLabel"
       type="button"
@@ -78,7 +78,7 @@
       >
         <div class="assistant-transcript__assistant-header">
           <span class="assistant-transcript__avatar assistant-transcript__avatar--assistant">
-            <v-icon :icon="mdiRobotOutline" size="16" />
+            <v-icon icon="$smartToy" size="16" />
           </span>
           <div class="assistant-transcript__message-header">
             <span>{{ assistantName }}</span>
@@ -120,7 +120,7 @@
         >
           <v-icon
             class="assistant-transcript__system-icon"
-            :icon="mdiInformationOutline"
+            icon="$info"
             size="15"
           />
           <div class="assistant-transcript__system-body">
@@ -225,7 +225,7 @@
             </div>
           </div>
           <span class="assistant-transcript__avatar assistant-transcript__avatar--user">
-            <v-icon :icon="mdiAccountOutline" size="15" />
+            <v-icon icon="$person" size="15" />
           </span>
         </div>
 
@@ -245,7 +245,7 @@
         >
           <div class="assistant-transcript__assistant-header">
             <span class="assistant-transcript__avatar assistant-transcript__avatar--assistant">
-              <v-icon :icon="mdiRobotOutline" size="16" />
+              <v-icon icon="$smartToy" size="16" />
             </span>
             <div class="assistant-transcript__message-header">
               <span :title="entry.message.assistantDetails || entry.turn.assistantDetails || undefined">
@@ -319,12 +319,6 @@
 import AssistantMessageAttachments from "./AssistantMessageAttachments.vue";
 import AssistantConversationStatus from "./AssistantConversationStatus.vue";
 import { computed, ref, watch } from "vue";
-import {
-  mdiAccountOutline,
-  mdiInformationOutline,
-  mdiRefresh,
-  mdiRobotOutline
-} from "@mdi/js";
 import LongTextInlineParts from "./LongTextInlineParts.vue";
 import LongTextPreviewBlocks from "./LongTextPreviewBlocks.vue";
 import AssistantProgress from "./AssistantProgress.vue";

package/src/client/conversation/LongTextPreviewBlocks.vue

@@ -310,13 +310,13 @@ h5.studio-long-text-review__heading {
   word-break: normal;
 }
 
-.studio-long-text-review__table-cell--right {
+.studio-long-text-review__table .studio-long-text-review__table-cell--right {
   font-variant-numeric: tabular-nums;
-  text-align: right !important;
+  text-align: right;
 }
 
-.studio-long-text-review__table-cell--center {
-  text-align: center !important;
+.studio-long-text-review__table .studio-long-text-review__table-cell--center {
+  text-align: center;
 }
 
 .studio-long-text-review__details {

package/src/client/conversation/attachmentQueueItems.js

@@ -1,5 +1,4 @@
 // How the attachment queue shows each item: its key, name, phase, progress, status text, icon and colour.
-import { mdiAlertCircleOutline, mdiCheckCircleOutline, mdiFileOutline } from "@mdi/js";
 import { useJskitText } from "../i18n.js";
 import { attachmentSizeText } from "./attachmentSize.js";
 
@@ -86,12 +85,12 @@ function itemCancelable(item = {}) {
 
 function itemIcon(item = {}) {
   if (itemPhase(item) === "ready") {
-    return mdiCheckCircleOutline;
+    return "$checkCircle";
   }
   if (itemPhase(item) === "failed") {
-    return mdiAlertCircleOutline;
+    return "$error";
   }
-  return mdiFileOutline;
+  return "$description";
 }
 
 function itemColor(item = {}) {

package/src/server/conversation/codexNotificationObserver.js

@@ -1,4 +1,4 @@
-import { codexAppServerTurnStatusIsActive, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerTurnKey, CODEX_APP_SERVER_AGENT_RUN_ID, CODEX_AGENT_PROVIDER, CODEX_APP_SERVER_RUN_STATE } from "./codexTurnState.js";
+import { codexAppServerTurnStatusIsActive, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, CODEX_APP_SERVER_AGENT_RUN_ID, CODEX_AGENT_PROVIDER, CODEX_APP_SERVER_RUN_STATE } from "./codexTurnState.js";
 import { codexAppServerProviderConnectionGeneration } from "./codexModelCatalog.js";
 import {
   codexAppServerAssistantItemText,
@@ -239,8 +239,8 @@ export function createCodexNotificationObserver({
         threadId: normalizedThreadId,
         turnId: codexAppServerNotificationTurnId(notification)
       };
-      // Anything Codex reports about a turn means it has started that turn.
-      journal.unstartedTurns.delete(codexAppServerTurnKey(normalizedThreadId, notificationContext.turnId));
+      // Anything Codex reports about a turn means it has started that turn, even before its answer to turn/start.
+      journal.noteTurnReported(normalizedThreadId, notificationContext.turnId);
       if (method === "thread/tokenUsage/updated") {
         notificationQueue.run(notificationContext, async () => {
           const store = await createStore(normalizedSessionId);

package/src/server/conversation/codexPromptDispatch.js

@@ -1,4 +1,4 @@
-import { codexAppServerTurnStatusIsComplete, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerErrorMessage, codexAppServerSteerFailure, codexAppServerMessageRequiresNewTurn, codexAppServerMessageDeferred, codexAppServerTurnKey } from "./codexTurnState.js";
+import { codexAppServerTurnStatusIsComplete, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerErrorMessage, codexAppServerSteerFailure, codexAppServerMessageRequiresNewTurn, codexAppServerMessageDeferred } from "./codexTurnState.js";
 import { codexAppServerRequestIsInvalid } from "./codexProviderThreads.js";
 import { codexLocalImageInput, codexAppServerDeliveredTurn, sendCodexAppServerPrompt } from "./codexProviderTurns.js";
 import { normalizeText } from "@jskit-ai/kernel/shared/support/normalize";
@@ -74,9 +74,9 @@ export function createCodexPromptDispatch({
     if (!deliveredTurnId) {
       throw new Error("Codex app-server accepted the prompt without returning a turn id.");
     }
-    // Codex answers turn/start before it starts the turn; its notifications about the turn say when it has.
+    // Codex usually answers turn/start before it starts the turn; its notifications about the turn say when it has.
     if (!codexAppServerTurnStatusIsComplete(deliveredTurnStatus)) {
-      journal.unstartedTurns.add(codexAppServerTurnKey(threadId, deliveredTurnId));
+      journal.markTurnUnstarted(threadId, deliveredTurnId);
     }
     delivery.pendingUserMessage(promptSessionId, clientUserMessageId)?.onNativeReceipt();
     await recovery.markTurnActive(sessionId, {

package/src/server/conversation/codexResultSettlement.js

@@ -1,4 +1,4 @@
-import { CODEX_APP_SERVER_AGENT_RUN_ID, CODEX_APP_SERVER_RESULT_PROCESSED_EVENT, codexAppServerTurnCanReceiveProviderCompletion, codexAppServerProcessedResultEvent, codexAppServerTurnAwaitsProviderIdentity, codexAppServerTurnCanAdoptSuccessor, codexAppServerAgentRun, CODEX_APP_SERVER_RUN_STATE, codexAppServerTurnKey } from "./codexTurnState.js";
+import { CODEX_APP_SERVER_AGENT_RUN_ID, CODEX_APP_SERVER_RESULT_PROCESSED_EVENT, codexAppServerTurnCanReceiveProviderCompletion, codexAppServerProcessedResultEvent, codexAppServerTurnAwaitsProviderIdentity, codexAppServerTurnCanAdoptSuccessor, codexAppServerAgentRun, CODEX_APP_SERVER_RUN_STATE } from "./codexTurnState.js";
 import { normalizeText } from "@jskit-ai/kernel/shared/support/normalize";
 
 /**
@@ -325,10 +325,7 @@ export function createCodexResultSettlement({ journal, output, createRuntime, pu
       normalizedThreadId,
       previousTurnId
     );
-    journal.completedTurns.add(codexAppServerTurnKey(
-      normalizedThreadId,
-      previousTurnId
-    ));
+    journal.markTurnCompleted(normalizedThreadId, previousTurnId);
     const previousResultKey = output.resultFinalizationKey(
       normalizedSessionId,
       normalizedThreadId,

package/src/server/conversation/codexRunJournal.js

@@ -3,6 +3,7 @@ import crypto from "node:crypto";
 import { isRecord, normalizeText } from "@jskit-ai/kernel/shared/support/normalize";
 
 const CODEX_APP_SERVER_PROMPT_CLAIM_GRACE_MS = 15000;
+const CODEX_APP_SERVER_REPORTED_TURN_LIMIT = 256;
 const CODEX_APP_SERVER_STOPPED_BY_SHUTDOWN_EVENT = "codex-app-server-stopped-by-shutdown";
 
 /**
@@ -46,6 +47,55 @@ function codexAppServerDateValueMs(value = "") {
   return Number.isFinite(parsed) ? parsed : 0;
 }
 
+/**
+ * Which turns Codex accepted with turn/start but has not reported yet: until it reports one, its thread still reads
+ * idle, so an idle read cannot settle it. Codex's turn/started can also arrive before its answer to turn/start, so the
+ * turns it reported most recently are remembered and never marked as not started. Only a turn whose answer is still on
+ * its way needs that, so the newest few are enough.
+ * @param {Set<string>} completedTurns the journal's settled turn keys, which markTurnCompleted adds to
+ */
+function createCodexAppServerTurnStarts(completedTurns) {
+  const unstartedTurns = new Set();
+  // Oldest first.
+  const reportedTurns = new Set();
+
+  /** Codex reported this turn, in a notification or by listing it as finished, so it has started it. */
+  function noteTurnReported(threadId = "", turnId = "") {
+    if (!normalizeText(turnId)) return;
+    const key = codexAppServerTurnKey(threadId, turnId);
+    unstartedTurns.delete(key);
+    reportedTurns.delete(key);
+    reportedTurns.add(key);
+    if (reportedTurns.size > CODEX_APP_SERVER_REPORTED_TURN_LIMIT) {
+      reportedTurns.delete(reportedTurns.values().next().value);
+    }
+  }
+
+  /** A turn Codex accepted waits for its report before an idle read can settle it, unless Codex already reported it. */
+  function markTurnUnstarted(threadId = "", turnId = "") {
+    const key = codexAppServerTurnKey(threadId, turnId);
+    if (!reportedTurns.has(key)) unstartedTurns.add(key);
+  }
+
+  function turnIsUnstarted(threadId = "", turnId = "") {
+    return unstartedTurns.has(codexAppServerTurnKey(threadId, turnId));
+  }
+
+  /** The run owner settled this turn: nothing waits for Codex to start it any more. */
+  function markTurnCompleted(threadId = "", turnId = "") {
+    const key = codexAppServerTurnKey(threadId, turnId);
+    completedTurns.add(key);
+    unstartedTurns.delete(key);
+  }
+
+  return Object.freeze({
+    noteTurnReported,
+    markTurnUnstarted,
+    turnIsUnstarted,
+    markTurnCompleted
+  });
+}
+
 /**
  * Native run claims, guarded journal writes and status retirement. The containing run owner shares these exact Sets
  * and Maps by reference.
@@ -88,8 +138,7 @@ export function createCodexRunJournal({
   isClosing
 }) {
   const codexAppServerCompletedTurns = new Set();
-  // Turns Codex accepted with turn/start but has not yet reported: until it does, its thread still reads idle.
-  const codexAppServerUnstartedTurns = new Set();
+  const turnStarts = createCodexAppServerTurnStarts(codexAppServerCompletedTurns);
   const codexAppServerProcessedTurns = new Set();
   const codexAppServerActiveTimers = new Map();
   const codexAppServerFinalizingTimers = new Map();
@@ -639,7 +688,10 @@ export function createCodexRunJournal({
 
   return Object.freeze({
     completedTurns: codexAppServerCompletedTurns,
-    unstartedTurns: codexAppServerUnstartedTurns,
+    noteTurnReported: turnStarts.noteTurnReported,
+    markTurnUnstarted: turnStarts.markTurnUnstarted,
+    turnIsUnstarted: turnStarts.turnIsUnstarted,
+    markTurnCompleted: turnStarts.markTurnCompleted,
     processedTurns: codexAppServerProcessedTurns,
     activeTimers: codexAppServerActiveTimers,
     finalizingTimers: codexAppServerFinalizingTimers,

package/src/server/conversation/codexThreadStatus.js

@@ -1,4 +1,4 @@
-import { codexAppServerTurnStatusIsActive, codexAppServerTurnStatusIsComplete, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerThreadStatus, codexAppServerReadThreadStatus, codexAppServerAgentRun, codexAppServerTurnCanReceiveProviderCompletion, codexAppServerTurnCanAdoptSuccessor, codexAppServerErrorMessage, codexAppServerTurnKey } from "./codexTurnState.js";
+import { codexAppServerTurnStatusIsActive, codexAppServerTurnStatusIsComplete, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerThreadStatus, codexAppServerObservedTurnFinished, codexAppServerReadThreadStatus, codexAppServerAgentRun, codexAppServerTurnCanReceiveProviderCompletion, codexAppServerTurnCanAdoptSuccessor, codexAppServerErrorMessage } from "./codexTurnState.js";
 import { isRecord, normalizeText } from "@jskit-ai/kernel/shared/support/normalize";
 import { codexAppServerStatusFromValue } from "./codexEvents.js";
 import { codexAppServerThreadRawValue, codexAppServerThreadTurnId, codexAppServerThreadError } from "./codexThreadSnapshot.js";
@@ -200,12 +200,16 @@ export function createCodexThreadStatus({ journal, settlement, recovery, output,
         turnId
       };
     }
+    // Codex lists the tracked turn as finished: it ran, even if its notifications about it were missed.
+    if (trackedProviderTurn && codexAppServerObservedTurnFinished(thread, trackedProviderTurn.turnId)) {
+      journal.noteTurnReported(trackedProviderTurn.threadId, trackedProviderTurn.turnId);
+    }
     // Codex has accepted the tracked turn but not started it. Until it does, its thread reads idle and lists the
     // turn as interrupted, so only Codex's own report about the turn settles it.
     if (
       trackedProviderTurn?.state === "active" &&
       !codexAppServerTurnStatusIsActive(status) &&
-      journal.unstartedTurns.has(codexAppServerTurnKey(trackedProviderTurn.threadId, trackedProviderTurn.turnId))
+      journal.turnIsUnstarted(trackedProviderTurn.threadId, trackedProviderTurn.turnId)
     ) {
       debugLog("appServerThread.reconcile.awaitingProviderStart", {
         sessionId: normalizedSessionId,

package/src/server/conversation/codexTurnEndings.js

@@ -1,4 +1,4 @@
-import { codexAppServerTurnStatusIsActive, codexAppServerThreadStatus, codexAppServerReadThreadStatus, codexAppServerAgentRun, codexAppServerTurnOwnsActiveGoal, codexAppServerTurnCanReceiveProviderCompletion, codexAppServerTurnAwaitsProviderIdentity, codexAppServerTurnCanReceiveProviderActivity, codexAppServerTurnKey } from "./codexTurnState.js";
+import { codexAppServerTurnStatusIsActive, codexAppServerThreadStatus, codexAppServerReadThreadStatus, codexAppServerAgentRun, codexAppServerTurnOwnsActiveGoal, codexAppServerTurnCanReceiveProviderCompletion, codexAppServerTurnAwaitsProviderIdentity, codexAppServerTurnCanReceiveProviderActivity } from "./codexTurnState.js";
 import { codexAppServerThreadTurnId } from "./codexThreadSnapshot.js";
 import { normalizeText } from "@jskit-ai/kernel/shared/support/normalize";
 
@@ -201,7 +201,7 @@ export function createCodexTurnEndings({
       };
     }
     if (journal.runInputSource(codexAppServerAgentRun(session)) === "terminal") {
-      journal.completedTurns.add(codexAppServerTurnKey(normalizedThreadId, normalizedTurnId));
+      journal.markTurnCompleted(normalizedThreadId, normalizedTurnId);
       output.cleanupUntrackedTurn(normalizedThreadId, normalizedTurnId);
       await journal.markTurnIdle(normalizedSessionId, {
         status: normalizedStatus,
@@ -217,7 +217,7 @@ export function createCodexTurnEndings({
     const alreadyFinalizing = existingTurn.state === "finalizing" &&
       existingTurn.threadId === normalizedThreadId &&
       existingTurn.turnId === normalizedTurnId;
-    journal.completedTurns.add(codexAppServerTurnKey(normalizedThreadId, normalizedTurnId));
+    journal.markTurnCompleted(normalizedThreadId, normalizedTurnId);
     if (!alreadyFinalizing) {
       await journal.markTurnFinalizing(normalizedSessionId, {
         status: normalizedStatus,

package/src/server/conversation/codexTurnRecovery.js

@@ -1,4 +1,4 @@
-import { codexAppServerTurnStatusIsActive, codexAppServerTurnStatusIsComplete, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerThreadStatus, codexAppServerReadThreadStatus, codexAppServerAgentRun, codexAppServerPendingUserMessageOwnership, codexAppServerTurnCanAdoptSuccessor, codexAppServerTurnKey } from "./codexTurnState.js";
+import { codexAppServerTurnStatusIsActive, codexAppServerTurnStatusIsComplete, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerThreadStatus, codexAppServerObservedTurnFinished, codexAppServerReadThreadStatus, codexAppServerAgentRun, codexAppServerPendingUserMessageOwnership, codexAppServerTurnCanAdoptSuccessor } from "./codexTurnState.js";
 import { codexAppServerProviderTurnForOperation, codexAppServerThreadTurnId, codexAppServerThreadError } from "./codexThreadSnapshot.js";
 import { createCodexTurnActivity } from "./codexTurnActivity.js";
 import { createCodexTurnEndings } from "./codexTurnEndings.js";
@@ -270,16 +270,21 @@ export function createCodexTurnRecovery({
     if (!codexAppServerTurnStatusIsComplete(status)) {
       return currentSession;
     }
-    if (journal.unstartedTurns.has(codexAppServerTurnKey(currentTurn.threadId, currentTurn.turnId))) {
-      // Codex has accepted this turn but not started it, and its thread reads idle until it does.
-      debugLog("appServerTurn.reconcile.awaitingProviderStart", {
-        sessionId,
-        status,
-        threadId: currentTurn.threadId,
-        turnId: currentTurn.turnId
-      });
-      scheduleCodexAppServerActiveRecovery(sessionId);
-      return currentSession;
+    if (journal.turnIsUnstarted(currentTurn.threadId, currentTurn.turnId)) {
+      // Codex may have accepted this turn without starting it: its thread reads idle until it does. Only Codex's own
+      // listing of the turn as finished settles it before a notification about the turn arrives.
+      const observed = await codexAppServerReadThreadStatus(provider, currentTurn.threadId, { observeLatestTurn: true });
+      if (!codexAppServerObservedTurnFinished(observed, currentTurn.turnId)) {
+        debugLog("appServerTurn.reconcile.awaitingProviderStart", {
+          sessionId,
+          status,
+          threadId: currentTurn.threadId,
+          turnId: currentTurn.turnId
+        });
+        scheduleCodexAppServerActiveRecovery(sessionId);
+        return currentSession;
+      }
+      journal.noteTurnReported(currentTurn.threadId, currentTurn.turnId);
     }
     const completedTurnId = providerTurnId || currentTurn.turnId;
     debugLog("appServerTurn.reconcile.complete", {

package/src/server/conversation/codexTurnState.js

@@ -38,6 +38,19 @@ function codexAppServerThreadStatus(thread = {}) {
   return liveStatus;
 }
 
+/**
+ * Whether a thread read lists exactly this turn as finished, completed or failed. Codex lists a turn it has accepted
+ * but not yet started as interrupted, so only these two say that it ran.
+ * @param {Record<string, unknown> | null} thread a read with its latest turn observed
+ * @param {string} turnId
+ */
+function codexAppServerObservedTurnFinished(thread = null, turnId = "") {
+  const observed = isRecord(thread?.observedTurn) ? thread.observedTurn : null;
+  const normalizedTurnId = normalizeNullableText(turnId);
+  if (!observed || !normalizedTurnId || normalizeNullableText(observed.id) !== normalizedTurnId) return false;
+  return ["completed", "failed"].includes(normalizeNullableText(observed.status));
+}
+
 /**
  * Reads a native thread's status, and with observeLatestTurn its latest turn too.
  * @param {import("./codexProvider.js").CodexAppServerAgentProvider | null} provider
@@ -604,4 +617,4 @@ function codexPromptInputFromRequest(input = {}) {
   return codexAppServerMessageText(input);
 }
 
-export { codexAppServerRunInputSource, codexAppServerThreadStatus, codexAppServerReadThreadStatus, codexAppServerTurnStatusIsActive, codexAppServerTurnStatusIsComplete, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerErrorMessage, codexAppServerMessageDeferred, codexPromptInputFromRequest, CODEX_APP_SERVER_AGENT_RUN_ID, CODEX_APP_SERVER_RESULT_PROCESSED_EVENT, CODEX_AGENT_PROVIDER, CODEX_APP_SERVER_ACTIVE_RUN_STATES };
+export { codexAppServerRunInputSource, codexAppServerThreadStatus, codexAppServerObservedTurnFinished, codexAppServerReadThreadStatus, codexAppServerTurnStatusIsActive, codexAppServerTurnStatusIsComplete, codexAppServerTurnStatusIsSuccessfulComplete, codexAppServerTurnStatusIsProviderFailure, codexAppServerErrorMessage, codexAppServerMessageDeferred, codexPromptInputFromRequest, CODEX_APP_SERVER_AGENT_RUN_ID, CODEX_APP_SERVER_RESULT_PROCESSED_EVENT, CODEX_AGENT_PROVIDER, CODEX_APP_SERVER_ACTIVE_RUN_STATES };

package/test/codexTurn.test.js

@@ -1955,6 +1955,82 @@ for (const read of ["starting watchdog", "status check"]) {
   });
 }
 
+// A turn Codex has accepted and not yet reported; `sendTurn` runs before Codex's answer to turn/start.
+async function unstartedTurnFixture(t, { sendTurn } = {}) {
+  const notices = [];
+  const f = await receiptFixture({
+    finalizingGraceMs: 30,
+    outcomeNotice(_runtime, _sessionId, _threadId, _turnId, outcome) { notices.push(outcome); }
+  });
+  t.after(() => f.owner.clearSessionRecoveryTimers(f.sessionId));
+  const context = dispatchContext(f);
+  f.codexStatus = "idle";
+  f.notices = notices;
+  f.started = { method: "turn/started", params: { threadId: f.threadId, turn: { id: f.turnId, status: "inProgress" } } };
+  f.run = { ...f.run, state: "starting", providerTurnId: "", providerStatus: "", outerTurnId: context.messageId };
+  f.provider.sendTurn = async () => {
+    await sendTurn?.(f);
+    return { id: f.turnId, status: "inProgress" };
+  };
+  f.provider.readThreadStatus = async () => ({ raw: { status: { type: f.codexStatus } } });
+  f.history = [turn(f.turnId, "interrupted")];
+  f.observe();
+  assert.equal((await f.owner.startTurn(f.sessionId, {}, context)).providerFailure, "");
+  assert.equal(f.run.state, "active");
+  // Codex finishes the turn, and its turn/completed notification is lost: only its thread and history say so.
+  f.finish = () => {
+    f.codexStatus = "idle";
+    f.history = [turn(f.turnId, "completed", "The complete reply.")];
+  };
+  return f;
+}
+
+async function assertSettledWithReply(f) {
+  await f.drain();
+  assert.equal(f.run.state, "completed");
+  assert.deepEqual((await f.replies()).map(row => row.assistant.text), ["The complete reply."]);
+  assert.deepEqual(f.notices, []);
+}
+
+// Codex usually answers turn/start before its turn/started notification, but may send turn/started first. Either way
+// Codex has reported the turn, so a thread status check after it finishes settles the turn with its answer.
+for (const order of ["after", "before"]) {
+  test(`a turn Codex reports ${order} its turn/start answer is settled by a later idle status check`, async t => {
+    const f = await unstartedTurnFixture(t, {
+      sendTurn(fixture) { if (order === "before") fixture.emit(fixture.started); }
+    });
+    if (order === "after") f.emit(f.started);
+    await f.drain();
+    assert.equal(f.run.state, "active");
+    f.finish();
+    await f.owner.reconcileThreadStatus(f.sessionId, f.provider, f.threadId, { source: "wellbeing" });
+    await assertSettledWithReply(f);
+  });
+}
+
+// When turn/started is missed, the mark does not outlive Codex's next report about the turn: a later notification
+// naming it, or Codex listing it as completed, settles it like any other turn. No timer is involved.
+for (const report of ["a later notification naming the turn", "the starting watchdog reading it as completed",
+  "a status check reading it as completed"]) {
+  test(`a delivered turn whose turn/started is missed is settled by ${report}`, async t => {
+    const f = await unstartedTurnFixture(t);
+    await f.owner.reconcileThreadStatus(f.sessionId, f.provider, f.threadId, { observeLatestTurn: true, source: "wellbeing" });
+    await f.drain();
+    assert.equal(f.run.state, "active", "Codex's idle thread and interrupted listing before it reports the turn do not end it");
+    f.finish();
+    if (report === "a later notification naming the turn") {
+      f.emit({ method: "item/started", params: { threadId: f.threadId, turnId: f.turnId, item: { id: "thinking", type: "reasoning" } } });
+      await f.drain();
+      await f.owner.reconcileThreadStatus(f.sessionId, f.provider, f.threadId, { source: "wellbeing" });
+    } else if (report === "the starting watchdog reading it as completed") {
+      await f.owner.recoverActiveTurn(f.sessionId, { provider: f.provider, retryOnError: false });
+    } else {
+      await f.owner.reconcileThreadStatus(f.sessionId, f.provider, f.threadId, { observeLatestTurn: true, source: "wellbeing" });
+    }
+    await assertSettledWithReply(f);
+  });
+}
+
 function controlContext(f, overrides = {}) {
   return {
     runtime: f.runtime,

package/test/conversationAvatarThumbnail.test.js

@@ -0,0 +1,62 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import { readFileSync } from "node:fs";
+import { registerHooks } from "node:module";
+import { compileScript, parse } from "@vue/compiler-sfc";
+import { createSSRApp, defineComponent, h } from "vue";
+import { renderToString } from "vue/server-renderer";
+
+const elementUrl = new URL("../src/client/conversation/AssistantConversationElement.vue", import.meta.url).href;
+const textUrl = new URL("../src/client/i18n.js", import.meta.url).href;
+
+async function importElement() {
+  const hooks = registerHooks({
+    load(url, context, nextLoad) {
+      if (url === textUrl) {
+        return { format: "module", shortCircuit: true, source: "export function useJskitText() { return { t: (key) => key }; }" };
+      }
+      if (!url.endsWith(".vue")) return nextLoad(url, context);
+      if (url !== elementUrl) return { format: "module", shortCircuit: true, source: "export default { render: () => null };" };
+      const { descriptor } = parse(readFileSync(new URL(url), "utf8"));
+      return {
+        format: "module", shortCircuit: true,
+        source: compileScript(descriptor, { id: "assistant-avatar-thumbnail", inlineTemplate: true }).content
+      };
+    }
+  });
+  try {
+    return (await import(elementUrl)).default;
+  } finally {
+    hooks.deregister();
+  }
+}
+
+async function renderShowAvatarButton(element, slots) {
+  const app = createSSRApp({ render: () => h(element, { adapter: { conversation: { turns: [] } }, avatarSize: "hidden" }, slots) });
+  app.component("VBtn", defineComponent({ setup: (_props, { slots: content }) => () => h("button", content.default?.()) }));
+  app.component("VIcon", defineComponent({ props: { icon: { type: String, default: "" } }, setup: (props) => () => h("i", { "data-icon": props.icon }) }));
+  const html = await renderToString(app);
+  const buttons = [...html.matchAll(/<button([^>]*)>(.*?)<\/button>/gs)].filter(([, attributes]) => attributes.includes('aria-label="jskit.assistant.chat.showAvatar"'));
+  assert.equal(buttons.length, 1, "One Show avatar button while the avatar is hidden");
+  const [, attributes, content] = buttons[0];
+  assert.match(attributes, /title="jskit.assistant.chat.showAvatar"/u);
+  assert.match(attributes, /width="44"/u);
+  return content;
+}
+
+test("the hidden avatar's Show button shows the avatar-thumbnail slot, or the account icon without one", async () => {
+  const element = await importElement();
+  const avatar = () => h("span", { class: "fixture-face" });
+
+  const thumbnail = await renderShowAvatarButton(element, {
+    avatar,
+    "avatar-thumbnail": ({ size, height }) => h("span", { class: "fixture-thumbnail", "data-size": size, "data-height": String(height) })
+  });
+  assert.match(thumbnail, /class="assistant-conversation__avatar-size-disc"/u);
+  assert.match(thumbnail, /<span class="fixture-thumbnail" data-size="hidden" data-height="0"><\/span>/u);
+  assert.doesNotMatch(thumbnail, /data-icon=/u);
+
+  const fallback = await renderShowAvatarButton(element, { avatar });
+  assert.match(fallback, /<i data-icon="\$accountCircle"[^>]*><\/i>/u);
+  assert.doesNotMatch(fallback, /fixture-thumbnail/u);
+});

package/test/transcriptTheme.browser.test.js

@@ -38,7 +38,7 @@ function readText(element) {
   return {
     color: [color.red, color.green, color.blue, color.alpha],
     onSurface: style.getPropertyValue("--v-theme-on-surface").split(",").map(Number),
-    mediumEmphasis: Number(style.getPropertyValue("--v-medium-emphasis-opacity")),
+    onSurfaceVariant: style.getPropertyValue("--v-theme-on-surface-variant").split(",").map(Number),
     contrast: (lighter + 0.05) / (darker + 0.05)
   };
 }
@@ -67,15 +67,17 @@ test("the task transcript's user bubble, header time and footer follow the light
         element.append(time);
       });
       const samples = {
-        "user bubble": [bubble.locator(".assistant-transcript__user-content"), 1],
-        "user footer": [bubble.locator(".assistant-transcript__message-footer time"), "medium"],
-        "assistant footer": [page.locator(".assistant-transcript__message-footer--assistant time").first(), "medium"],
-        "header time": [header.locator("time"), "medium"]
+        "user bubble": [bubble.locator(".assistant-transcript__user-content"), "on-surface"],
+        "user footer": [bubble.locator(".assistant-transcript__message-footer time"), "on-surface-variant"],
+        "assistant footer": [page.locator(".assistant-transcript__message-footer--assistant time").first(), "on-surface-variant"],
+        "header time": [header.locator("time"), "on-surface-variant"]
       };
-      for (const [name, [locator, alpha]] of Object.entries(samples)) {
+      // Material 3 secondary text is the solid on-surface-variant role, not on-surface at a lower opacity.
+      for (const [name, [locator, role]] of Object.entries(samples)) {
         const text = await locator.evaluate(readText);
-        assert.deepEqual(text.color.slice(0, 3), text.onSurface, `${theme} ${name}: the colour is the theme's on-surface`);
-        assert.equal(text.color[3], alpha === "medium" ? text.mediumEmphasis : alpha, `${theme} ${name}: the opacity`);
+        const expected = role === "on-surface" ? text.onSurface : text.onSurfaceVariant;
+        assert.deepEqual(text.color.slice(0, 3), expected, `${theme} ${name}: the colour is the theme's ${role}`);
+        assert.equal(text.color[3], 1, `${theme} ${name}: the opacity`);
         assert.ok(text.contrast >= 4.5, `${theme} ${name}: contrast ${text.contrast.toFixed(2)}:1 is under 4.5:1`);
       }
       await page.close();