@frockbot/plugin-shell 0.3.5 → 0.3.7

package/src/client/FrockBotApp.vue

@@ -288,7 +288,7 @@ const threadHeading = computed(() => {
 const threadHint = computed(() => {
   if (!hasBot.value) return "Add your first sheep to start a conversation.";
   if (state.value.modelReady) {
-    return "Start with a conversation. Cordis plugins can add the rest.";
+    return "Say anything to get started.";
   }
   return state.value.modelLabel;
 });
@@ -416,10 +416,47 @@ function toolChipsOf(message: WebChatMessage): WebToolActivity[] {
   return message.tools.filter((tool) => iframeEntriesFor(tool).length === 0);
 }
 
+/**
+ * What a chip calls a tool, in the User's words rather than the model's.
+ *
+ * A tool name is an identifier — `send_to_user`, `user-Github--acme/search_issues`
+ * — and the transcript is a conversation, so the chip drops the namespace,
+ * un-snakes the rest and capitalises it.
+ */
+function toolChipLabel(tool: WebToolActivity): string {
+  const bare = tool.name.split("/").pop() ?? tool.name;
+  const words = bare.replace(/[_.-]+/g, " ").trim();
+  if (words.length === 0) return tool.name;
+  return words.charAt(0).toUpperCase() + words.slice(1);
+}
+
+/**
+ * Whether a chip is drawn as a failure.
+ *
+ * A tool call the model recovered from is not a failure the User has anything
+ * to do with: a refused call followed by a Turn that went on to finish is the
+ * Bot correcting itself, and colouring it red reports a broken Turn that
+ * worked. Only a Turn that itself ended badly keeps the failed state.
+ */
+function toolChipState(
+  tool: WebToolActivity,
+  message: WebChatMessage,
+): "running" | "completed" | "failed" | "retried" {
+  if (tool.status !== "failed") return tool.status;
+  return message.status === "completed" || message.status === "streaming"
+    ? "retried"
+    : "failed";
+}
+
 /** What a chip says a tool is doing. Its status, in the User's words. */
-function toolChipStatus(tool: WebToolActivity): string {
-  if (tool.status === "running") return "running";
-  return tool.status === "failed" ? "failed" : "done";
+function toolChipStatus(
+  tool: WebToolActivity,
+  message: WebChatMessage,
+): string {
+  const state = toolChipState(tool, message);
+  if (state === "running") return "running";
+  if (state === "retried") return "retried";
+  return state === "failed" ? "failed" : "done";
 }
 
 /** Which tool chips the User has opened. Local, and per chip. */
@@ -883,139 +920,159 @@ function handleComposerKeydown(event: KeyboardEvent): void {
                 /></span>
                 <k-slot name="frockbot.bot-avatar" />
               </div>
-              <div v-if="message.text" class="message-bubble">
-                <UiMarkdown :text="message.text" />
-              </div>
               <!--
+                Everything the Turn produced stacks in one column beside the
+                avatar. The row holds exactly two children — avatar, column —
+                so a bubble, a notice and a chip are stacked lines rather than
+                side-by-side columns squeezing the reply to a few pixels.
+              -->
+              <div class="message-column">
+                <div v-if="message.text" class="message-bubble">
+                  <UiMarkdown :text="message.text" />
+                </div>
+                <!--
                 Why the Turn ends where it does, under whatever it had already
                 said rather than in place of it.
               -->
-              <p v-if="message.notice" class="message-notice">
-                {{ message.notice }}
-              </p>
-              <template v-for="tool in message.tools" :key="tool.id">
-                <PackageIframeHost
-                  v-for="entry in iframeEntriesFor(tool)"
-                  :key="`${tool.id}:${entry.contribution.packageId}:${entry.page.id}`"
-                  class="message-package-iframe"
-                  :contribution="entry.contribution"
-                  :page="entry.page"
-                  :slot="entry.slot"
-                  :states="{ [`tool:${tool.name}`]: toolResultState(tool) }"
-                />
-              </template>
-              <!--
+                <p v-if="message.notice" class="message-notice">
+                  {{ message.notice }}
+                </p>
+                <template v-for="tool in message.tools" :key="tool.id">
+                  <PackageIframeHost
+                    v-for="entry in iframeEntriesFor(tool)"
+                    :key="`${tool.id}:${entry.contribution.packageId}:${entry.page.id}`"
+                    class="message-package-iframe"
+                    :contribution="entry.contribution"
+                    :page="entry.page"
+                    :slot="entry.slot"
+                    :states="{ [`tool:${tool.name}`]: toolResultState(tool) }"
+                  />
+                </template>
+                <!--
                 A binary a tool filed in the Workspace, drawn from the
                 Workspace read route. The thread carries the path, never the
                 bytes, so a long conversation costs paths and the image is
                 fetched only when it is on screen.
               -->
-              <div
-                v-if="attachmentsOf(message).length > 0"
-                class="message-attachments"
-              >
-                <a
-                  v-for="attachment in attachmentsOf(message)"
-                  :key="attachment.contentHash"
-                  :href="workspaceFileUrl(attachment.path)"
-                  target="_blank"
-                  rel="noreferrer"
+                <div
+                  v-if="attachmentsOf(message).length > 0"
+                  class="message-attachments"
                 >
-                  <img
-                    :src="workspaceFileUrl(attachment.path)"
-                    :alt="`Attachment from ${message.runId}`"
-                    loading="lazy"
-                  />
-                </a>
-              </div>
-              <!--
+                  <a
+                    v-for="attachment in attachmentsOf(message)"
+                    :key="attachment.contentHash"
+                    :href="workspaceFileUrl(attachment.path)"
+                    target="_blank"
+                    rel="noreferrer"
+                  >
+                    <img
+                      :src="workspaceFileUrl(attachment.path)"
+                      :alt="`Attachment from ${message.runId}`"
+                      loading="lazy"
+                    />
+                  </a>
+                </div>
+                <!--
                 Sends sit beside the derived text rather than inside it: each
                 payload is its own block, and a widget-ended Turn has no text
                 bubble at all.
               -->
-              <div v-if="message.sends.length > 0" class="message-sends">
-                <SendPayloadView
-                  v-for="(send, sendIndex) in message.sends"
-                  :key="sendIndex"
-                  :send="send"
-                />
-              </div>
-              <!--
+                <div v-if="message.sends.length > 0" class="message-sends">
+                  <SendPayloadView
+                    v-for="(send, sendIndex) in message.sends"
+                    :key="sendIndex"
+                    :send="send"
+                  />
+                </div>
+                <!--
                 What the Bot did, while it is doing it. The chip is the
                 conversation's whole account of an ordinary tool call: its
                 name, whether it is running, and — when the User opens it —
                 what it returned.
               -->
-              <div v-if="toolChipsOf(message).length > 0" class="message-tools">
-                <button
-                  v-for="tool in toolChipsOf(message)"
-                  :key="tool.id"
-                  type="button"
-                  class="tool-chip"
-                  :class="`tool-chip-${tool.status}`"
-                  :aria-expanded="expandedTools.has(tool.id)"
-                  @click="toggleTool(tool.id)"
+                <div
+                  v-if="toolChipsOf(message).length > 0"
+                  class="message-tools"
                 >
-                  <span class="tool-chip-name">{{ tool.name }}</span>
-                  <span class="tool-chip-status">{{
-                    toolChipStatus(tool)
-                  }}</span>
-                  <span
-                    v-if="expandedTools.has(tool.id) && tool.text !== undefined"
-                    class="tool-chip-result"
-                    >{{ tool.text }}</span
+                  <button
+                    v-for="tool in toolChipsOf(message)"
+                    :key="tool.id"
+                    type="button"
+                    class="tool-chip"
+                    :class="`tool-chip-${toolChipState(tool, message)}`"
+                    :aria-expanded="expandedTools.has(tool.id)"
+                    @click="toggleTool(tool.id)"
                   >
-                </button>
-              </div>
-              <!--
+                    <span class="tool-chip-name">{{
+                      toolChipLabel(tool)
+                    }}</span>
+                    <span class="tool-chip-status">{{
+                      toolChipStatus(tool, message)
+                    }}</span>
+                    <span
+                      v-if="
+                        expandedTools.has(tool.id) && tool.text !== undefined
+                      "
+                      class="tool-chip-result"
+                      >{{ tool.text }}</span
+                    >
+                  </button>
+                </div>
+                <!--
                 The subagents this Turn dispatched. The child's own Session is
                 never in this transcript, so the chip is the whole of what the
                 conversation says about it; opening one shows the summary the
                 child handed back and nothing else.
               -->
-              <div v-if="taskChipsOf(message).length > 0" class="message-tasks">
-                <button
-                  v-for="entry in taskChipsOf(message)"
-                  :key="entry.chip.taskId"
-                  type="button"
-                  class="task-chip"
-                  :class="`task-chip-${entry.status}`"
-                  :aria-expanded="expandedTasks.has(entry.chip.taskId)"
-                  @click="toggleTask(entry.chip.taskId)"
+                <div
+                  v-if="taskChipsOf(message).length > 0"
+                  class="message-tasks"
                 >
-                  <span class="task-chip-type">{{ entry.chip.taskType }}</span>
-                  <span class="task-chip-description">{{
-                    entry.chip.description
-                  }}</span>
-                  <span class="task-chip-status">{{ entry.status }}</span>
-                  <span class="task-chip-model">{{ entry.chip.model }}</span>
-                  <span
-                    v-if="expandedTasks.has(entry.chip.taskId)"
-                    class="task-chip-summary"
-                    >{{
-                      entry.summary ??
-                      "This subagent has not reported a summary yet."
-                    }}</span
+                  <button
+                    v-for="entry in taskChipsOf(message)"
+                    :key="entry.chip.taskId"
+                    type="button"
+                    class="task-chip"
+                    :class="`task-chip-${entry.status}`"
+                    :aria-expanded="expandedTasks.has(entry.chip.taskId)"
+                    @click="toggleTask(entry.chip.taskId)"
                   >
-                  <!--
+                    <span class="task-chip-type">{{
+                      entry.chip.taskType
+                    }}</span>
+                    <span class="task-chip-description">{{
+                      entry.chip.description
+                    }}</span>
+                    <span class="task-chip-status">{{ entry.status }}</span>
+                    <span class="task-chip-model">{{ entry.chip.model }}</span>
+                    <span
+                      v-if="expandedTasks.has(entry.chip.taskId)"
+                      class="task-chip-summary"
+                      >{{
+                        entry.summary ??
+                        "This subagent has not reported a summary yet."
+                      }}</span
+                    >
+                    <!--
                     Cancellation is the User's, explicit and authenticated. It
                     is offered only while the subagent is live: a settled one
                     has an outcome, and stopping it would rewrite it.
                   -->
-                  <span
-                    v-if="
-                      expandedTasks.has(entry.chip.taskId) &&
-                      isTaskLive(entry.status)
-                    "
-                    class="task-chip-stop"
-                    role="button"
-                    tabindex="0"
-                    @click.stop="stopTask(entry.chip.taskId)"
-                    @keydown.enter.stop.prevent="stopTask(entry.chip.taskId)"
-                    @keydown.space.stop.prevent="stopTask(entry.chip.taskId)"
-                    >Stop this subagent</span
-                  >
-                </button>
+                    <span
+                      v-if="
+                        expandedTasks.has(entry.chip.taskId) &&
+                        isTaskLive(entry.status)
+                      "
+                      class="task-chip-stop"
+                      role="button"
+                      tabindex="0"
+                      @click.stop="stopTask(entry.chip.taskId)"
+                      @keydown.enter.stop.prevent="stopTask(entry.chip.taskId)"
+                      @keydown.space.stop.prevent="stopTask(entry.chip.taskId)"
+                      >Stop this subagent</span
+                    >
+                  </button>
+                </div>
               </div>
             </template>
             <div v-else class="message-bubble">{{ message.text }}</div>
@@ -1046,7 +1103,7 @@ function handleComposerKeydown(event: KeyboardEvent): void {
               type="button"
               @click="web.resumeRun(state.activeRun.runId)"
             >
-              Resolve Turn
+              Try again
             </button>
           </div>
         </Transition>
@@ -1132,6 +1189,19 @@ function handleComposerKeydown(event: KeyboardEvent): void {
               @blur="closeSkillPopover"
             />
           </div>
+          <!--
+            Start a new conversation. Sits beside the composer because that is
+            where you are when you decide the last one is finished. Disabled
+            while a Turn is running: the Bot is still writing to it.
+          -->
+          <UiIconButton
+            icon="plus"
+            label="New conversation"
+            variant="ghost"
+            class="new-conversation-button"
+            :disabled="isRunning"
+            @click="web.startConversation()"
+          />
           <UiIconButton
             v-if="showStop"
             class="stop-button"

package/src/client/PackageIframeHost.vue

@@ -34,6 +34,13 @@ const providedWeb = inject(frockBotWebDataKey);
 if (!providedWeb) throw new Error("Package iframe host data was not provided");
 const web = providedWeb;
 const frame = ref<HTMLIFrameElement>();
+/** Where a page came from, said plainly. First-party pages say nothing. */
+const provenanceLabel = computed(() => {
+  if (props.contribution.provenance === "Bot-authored")
+    return "Built by this Bot";
+  if (props.contribution.provenance === "User-installed") return "Added by you";
+  return undefined;
+});
 const height = ref(240);
 const failure = ref<string>();
 const lastStateWireByName = new Map<string, string>();
@@ -123,7 +130,9 @@ function post(message: PackageIframeHostMessageV2): void {
     postPackageIframeHostMessage(target, message, lastStateWireByName);
   } catch (error) {
     failure.value =
-      error instanceof Error ? error.message : "Package page state is invalid";
+      error instanceof Error
+        ? error.message
+        : "This page sent something FrockBot couldn't read.";
   }
 }
 
@@ -179,7 +188,7 @@ async function onMessage(event: MessageEvent): Promise<void> {
   }
   if (message.type === "focus") {
     if (!packageIframeFocusAllowedV2(props.contribution)) {
-      failure.value = "This Package cannot change the focused Applet.";
+      failure.value = "This plugin can't change which Applet is open.";
       return;
     }
     failure.value = undefined;
@@ -189,7 +198,7 @@ async function onMessage(event: MessageEvent): Promise<void> {
   if (message.type === "openExternal") {
     const origin = catalog.value?.artifactOrigin;
     if (!origin || !packageIframeExternalUrlAllowedV2(message.url, origin)) {
-      failure.value = "This Package page can only open its own pages.";
+      failure.value = "This plugin can only open its own pages.";
       return;
     }
     failure.value = undefined;
@@ -197,7 +206,7 @@ async function onMessage(event: MessageEvent): Promise<void> {
     return;
   }
   if (!packageIframeToolAllowedV1(props.contribution, message.name)) {
-    failure.value = `This Package did not declare ${message.name}.`;
+    failure.value = `This plugin isn't allowed to use ${message.name}.`;
     return;
   }
   failure.value = undefined;
@@ -232,12 +241,12 @@ onBeforeUnmount(() => window.removeEventListener("message", onMessage));
   <section class="package-iframe-frame" :class="`package-iframe-${layout}`">
     <header v-if="attribution" class="package-iframe-attribution">
       <strong>{{ contribution.displayName }}</strong>
-      <span>{{ contribution.provenance }} Package</span>
+      <span v-if="provenanceLabel">{{ provenanceLabel }}</span>
     </header>
     <!-- Load eagerly because lazy iframes defer the init/resize handshake until the browser decides the frame is near the viewport, which headless Chromium may never do. -->
     <iframe
       ref="frame"
-      :title="`${contribution.displayName} Package page`"
+      :title="contribution.displayName"
       :src="source"
       :style="layout === 'fill' ? undefined : { height: `${height}px` }"
       sandbox="allow-scripts"

package/src/client/index.test.ts

@@ -516,7 +516,7 @@ describe("Bot selection", () => {
     const requestCount = requests.length;
     await expect(
       provided.value.callPackageUiTool(contribution, "package_author", {}),
-    ).rejects.toThrow("did not declare");
+    ).rejects.toThrow("isn't allowed to use");
     expect(requests).toHaveLength(requestCount);
   });
 
@@ -571,6 +571,47 @@ describe("Bot selection", () => {
     expect(provided.value.settingsError).toBe("Bot settings unavailable");
   });
 
+  test("says a deployment has no Catalog instead of relaying the gateway's sentence", async () => {
+    // F4: the Plugins/Catalog surface rendered `catalog generation was not
+    // found` beside "No Catalog entry matches that search", for a User who had
+    // searched nothing on a deployment that had published nothing.
+    let provided: Ref<FrockBotWebData> | undefined;
+    let failure = new Error("catalog generation was not found");
+    await shellClientPlugin({
+      transport: {
+        turn: () => Promise.resolve({ runId: "run", text: "", events: [] }),
+        readConfiguration: () => Promise.reject(new Error("unused")),
+        hostedRequest: (path) => {
+          expect(path).toBe("/catalog/v1/index");
+          return Promise.reject(failure);
+        },
+      },
+      slot: () => () => {},
+      inject: () => {
+        throw new Error("unexpected client provider injection");
+      },
+      provide: (_key, value) => {
+        provided = value as Ref<FrockBotWebData>;
+        return () => {};
+      },
+    });
+    if (!provided) throw new Error("shell data was not provided");
+
+    await provided.value.loadPackageCatalog();
+    expect(provided.value.packageCatalog).toEqual([]);
+    expect(provided.value.packageCatalogGeneration).toBeUndefined();
+    expect(provided.value.settingsError).toBe(
+      "No plugins are published for this deployment yet.",
+    );
+
+    // A genuine fault still reaches the operator, labelled as one.
+    failure = new Error("R2 is down");
+    await provided.value.loadPackageCatalog();
+    expect(provided.value.settingsError).toBe(
+      "Plugins could not be loaded: R2 is down",
+    );
+  });
+
   test("commits a catalog without overwriting newer User settings", async () => {
     let provided: Ref<FrockBotWebData> | undefined;
     const catalogManifest = Promise.withResolvers<unknown>();
@@ -648,7 +689,7 @@ describe("Bot selection", () => {
       },
       accountValues: undefined,
       platformModel: undefined,
-      expectedLabel: "Model name · Model provider · Bot override",
+      expectedLabel: "Model name · Model provider · this Bot only",
       expectedProjection: "bot",
       ready: true,
     },
@@ -683,7 +724,7 @@ describe("Bot selection", () => {
       botValues: {},
       accountValues: undefined,
       platformModel: undefined,
-      expectedLabel: "Model unavailable",
+      expectedLabel: "No model available — set one up in Models",
       expectedProjection: "none",
       ready: false,
     },
@@ -900,7 +941,7 @@ describe("Bot selection", () => {
 
     expect(provided.value.modelReady).toBe(false);
     expect(provided.value.modelLabel).toBe(
-      'Connection "model-connection" is disabled; enable or reconnect it',
+      "That account needs reconnecting before this Bot can reply.",
     );
   });
 
@@ -1217,7 +1258,7 @@ describe("detached Turn projection", () => {
       { role: "user", status: "completed" },
       {
         role: "assistant",
-        text: "Provider reconciliation is required",
+        text: "This Bot couldn't finish its reply. Try again.",
         status: "error",
       },
     ]);
@@ -1482,6 +1523,55 @@ describe("active durable Turn projection", () => {
     ]);
   });
 
+  test("a Turn that sent something draws the send, not the model's own text", () => {
+    const state: Pick<
+      FrockBotWebData,
+      "messages" | "activeRunId" | "activeRun"
+    > = { messages: [] };
+
+    projectDurableRuns(
+      state,
+      [],
+      [
+        {
+          runId: "run-once",
+          input: "ping",
+          status: "completed",
+          responseText: "pong",
+          events: [
+            { type: "send/to-user", payload: { type: "text", text: "pong" } },
+          ],
+        },
+      ],
+    );
+
+    expect(state.messages[1]?.text).toBe("");
+    expect(state.messages[1]?.sends).toHaveLength(1);
+  });
+
+  test("a Turn that sent nothing still draws the model's text", () => {
+    const state: Pick<
+      FrockBotWebData,
+      "messages" | "activeRunId" | "activeRun"
+    > = { messages: [] };
+
+    projectDurableRuns(
+      state,
+      [],
+      [
+        {
+          runId: "run-plain",
+          input: "ping",
+          status: "completed",
+          responseText: "pong",
+          events: [],
+        },
+      ],
+    );
+
+    expect(state.messages[1]?.text).toBe("pong");
+  });
+
   test("streams running text without a banner and clears busy state", () => {
     const state: Pick<
       FrockBotWebData,
@@ -1562,11 +1652,11 @@ describe("active durable Turn projection", () => {
     expect(reconciliation.activeRun).toEqual({
       runId: "run-reconciliation",
       status: "reconciliation-required",
-      message: "Provider result needs confirmation",
+      message: "Something went wrong mid-reply. Try again to pick it up.",
       canResume: true,
     });
     expect(reconciliation.messages[1]).toMatchObject({
-      text: "Provider result needs confirmation",
+      text: "This reply stopped partway. Try again to continue it.",
       status: "reconciliation-required",
     });
   });
@@ -1845,8 +1935,7 @@ describe("hosted Stop", () => {
     await provided.value.stopRun();
     expect(provided.value.activeRun).toMatchObject({
       status: "reconciliation-required",
-      message:
-        "Stop accepted; reconciling the provider outcome before cancelling.",
+      message: "Stopping…",
       // A parked Turn is offered the resolve control, Stop included: hiding
       // it there hid it in exactly the case Stop creates.
       canResume: true,
@@ -1858,7 +1947,7 @@ describe("hosted Stop", () => {
     // The Turn keeps whatever it had already said; the notice is the line
     // that says why it ends where it does.
     expect(provided.value.messages[1]).toMatchObject({
-      notice: "Stopped by an authenticated Stop command.",
+      notice: "You stopped this.",
       status: "aborted",
     });
 
@@ -1923,7 +2012,7 @@ describe("hosted Stop", () => {
     expect(provided.value.activeRunId).toBeUndefined();
     expect(provided.value.messages.at(-1)).toMatchObject({
       runId: "run-1",
-      notice: "Stopped by an authenticated Stop command.",
+      notice: "You stopped this.",
       status: "aborted",
     });
   });
@@ -2513,7 +2602,7 @@ describe("Connection operation reconciliation", () => {
     ).rejects.toThrow("Connection state update failed");
     await expect(
       provided.value.disconnectConnection("connection-1"),
-    ).rejects.toThrow("Connection revocation failed");
+    ).rejects.toThrow("Couldn't disconnect that account.");
     expect(commands).toEqual([
       "connection/update-label",
       "connection/set-enabled",