feat: offer plugin actions in the palette, slash menu and thread menus

apps/mobile/src/features/keyboard/CommandPalette.tsx

@@ -1,6 +1,6 @@
 import { useNavigation } from "@react-navigation/native";
 import type { EnvironmentThreadSearchMatch } from "@t3tools/client-runtime/state/thread-search";
-import { THREAD_JUMP_KEYBINDING_COMMANDS } from "@t3tools/contracts";
+import { AuthOrchestrationOperateScope, THREAD_JUMP_KEYBINDING_COMMANDS } from "@t3tools/contracts";
 import { threadPullRequestSearchTerms } from "@t3tools/shared/threadPullRequests";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
@@ -25,13 +25,16 @@ import { cn } from "../../lib/cn";
 import { scopedProjectKey, scopedThreadKey } from "../../lib/scopedEntities";
 import { T3KeyboardCommands } from "../../native/T3KeyboardCommands";
 import { useProjects, useThreadShell, useThreadShells } from "../../state/entities";
+import { runPluginAction, usePluginActions } from "../../state/plugin-actions";
 import { useThreadSearch } from "../../state/queries";
+import { useEnvironmentScope } from "../../state/session";
 import { useWorkspaceEnvironments } from "../../state/workspace";
 import { useSavedRemoteConnections } from "../../state/use-remote-environment-registry";
 import { useAdaptiveWorkspaceLayout } from "../layout/AdaptiveWorkspaceLayout";
 import { useAppearancePreferences } from "../settings/appearance/AppearancePreferencesProvider";
 import { ThreadSearchMatchExcerpt } from "../threads/thread-search-match";
 import {
+  buildPluginActionPaletteItems,
   filterCommandPaletteItems,
   nextPaletteIndex,
   type CommandPaletteItem,
@@ -66,6 +69,7 @@ const ACTION_ICONS: Record<string, AppSymbolName> = {
 function itemIcon(item: CommandPaletteItem): AppSymbolName {
   if (item.kind === "project") return "folder";
   if (item.kind === "thread") return "text.bubble";
+  if (item.key.startsWith("plugin-action:")) return "cube";
   return ACTION_ICONS[item.key] ?? "ellipsis";
 }
 
@@ -146,6 +150,17 @@ export function CommandPalette(props: {
   const activeThreadRef = useMemo(() => parseActiveThreadPath(props.pathname), [props.pathname]);
   const activeThread = useThreadShell(activeThreadRef);
   const environments = useWorkspaceEnvironments();
+  // Plugin actions belong to the open thread's environment, else the first connected one.
+  const pluginActionEnvironmentId =
+    activeThreadRef?.environmentId ??
+    environments.find((environment) => environment.connectionState === "connected")
+      ?.environmentId ??
+    null;
+  const pluginActions = usePluginActions(pluginActionEnvironmentId);
+  const canRunPluginActions = useEnvironmentScope(
+    pluginActionEnvironmentId,
+    AuthOrchestrationOperateScope,
+  );
   const { savedConnectionsById } = useSavedRemoteConnections();
   const [query, setQuery] = useState("");
   const [selection, setSelection] = useState<string | null>(null);
@@ -300,6 +315,18 @@ export function CommandPalette(props: {
         })),
       );
     }
+    if (pluginActionEnvironmentId !== null) {
+      actions.push(
+        ...buildPluginActionPaletteItems({
+          actions: pluginActions,
+          canOperate: canRunPluginActions,
+          environmentId: pluginActionEnvironmentId,
+          threadId: activeThread?.id ?? null,
+          projectId: activeThread?.projectId ?? null,
+          runAction: (input) => void runPluginAction(input),
+        }),
+      );
+    }
     const projectItems: CommandPaletteItem[] = projects.map((project) => ({
       key: `project:${scopedProjectKey(project.environmentId, project.id)}`,
       kind: "project",
@@ -346,6 +373,9 @@ export function CommandPalette(props: {
     activeThread,
     activeThreadRef,
     navigation,
+    canRunPluginActions,
+    pluginActionEnvironmentId,
+    pluginActions,
     projects,
     runCommand,
     savedConnectionsById,

apps/mobile/src/features/keyboard/commandPaletteItems.test.ts

@@ -1,6 +1,14 @@
-import { describe, expect, it } from "vite-plus/test";
+import {
+  EnvironmentId,
+  PluginActionId,
+  ProjectId,
+  ThreadId,
+  type PluginAction,
+} from "@t3tools/contracts";
+import { describe, expect, it, vi } from "vite-plus/test";
 
 import {
+  buildPluginActionPaletteItems,
   filterCommandPaletteItems,
   nextPaletteIndex,
   type CommandPaletteItem,
@@ -74,3 +82,79 @@ describe("nextPaletteIndex", () => {
     expect(nextPaletteIndex(0, 1, 0)).toBe(0);
   });
 });
+
+describe("buildPluginActionPaletteItems", () => {
+  const environmentId = EnvironmentId.make("environment-1");
+  const thread = {
+    environmentId,
+    threadId: ThreadId.make("thread-1"),
+    projectId: ProjectId.make("project-1"),
+  };
+  const deploy: PluginAction = {
+    id: PluginActionId.make("installation-1:1:deploy"),
+    pluginId: "acme.deploy",
+    pluginName: "Deploy",
+    name: "deploy",
+    title: "Deploy this branch",
+    target: "thread",
+    placements: ["command-palette"],
+  };
+  const refresh: PluginAction = {
+    ...deploy,
+    id: PluginActionId.make("installation-1:1:refresh"),
+    name: "refresh",
+    title: "Refresh caches",
+    target: "environment",
+  };
+
+  it("runs an offered action in the open thread's environment", () => {
+    const runAction = vi.fn();
+    const offered = buildPluginActionPaletteItems({
+      actions: [deploy],
+      canOperate: true,
+      ...thread,
+      runAction,
+    });
+    expect(offered.map((item) => item.title)).toEqual(["Deploy this branch"]);
+
+    offered[0]?.run();
+
+    expect(runAction).toHaveBeenCalledWith({
+      environmentId: thread.environmentId,
+      action: deploy,
+      target: { _tag: "thread", threadId: thread.threadId },
+    });
+  });
+
+  it("offers environment actions when no thread is open", () => {
+    const runAction = vi.fn();
+    const offered = buildPluginActionPaletteItems({
+      actions: [deploy, refresh],
+      canOperate: true,
+      environmentId,
+      threadId: null,
+      projectId: null,
+      runAction,
+    });
+    expect(offered.map((item) => item.title)).toEqual(["Refresh caches"]);
+
+    offered[0]?.run();
+
+    expect(runAction).toHaveBeenCalledWith({
+      environmentId,
+      action: refresh,
+      target: { _tag: "environment" },
+    });
+  });
+
+  it("offers nothing to a connection that cannot operate the environment", () => {
+    expect(
+      buildPluginActionPaletteItems({
+        actions: [deploy],
+        canOperate: false,
+        ...thread,
+        runAction: vi.fn(),
+      }),
+    ).toEqual([]);
+  });
+});

apps/mobile/src/features/keyboard/commandPaletteItems.ts

@@ -1,3 +1,12 @@
+import { pluginActionLabels, pluginActionsAt } from "@t3tools/client-runtime/state/pluginActions";
+import type {
+  EnvironmentId,
+  PluginAction,
+  PluginActionTarget,
+  ProjectId,
+  ThreadId,
+} from "@t3tools/contracts";
+
 export interface CommandPaletteItem {
   readonly key: string;
   readonly kind: "action" | "project" | "thread";
@@ -44,3 +53,37 @@ export function filterCommandPaletteItems(
 export function nextPaletteIndex(index: number, direction: -1 | 1, count: number) {
   return count === 0 ? 0 : (index + direction + count) % count;
 }
+
+/**
+ * The palette plugin actions of one environment, for the open thread and its
+ * project when there is one. Running one needs `orchestration:operate`, so a
+ * connection without it is offered none.
+ */
+export function buildPluginActionPaletteItems(input: {
+  readonly actions: ReadonlyArray<PluginAction>;
+  readonly canOperate: boolean;
+  readonly environmentId: EnvironmentId;
+  readonly threadId: ThreadId | null;
+  readonly projectId: ProjectId | null;
+  readonly runAction: (input: {
+    readonly environmentId: EnvironmentId;
+    readonly action: PluginAction;
+    readonly target: PluginActionTarget;
+  }) => void;
+}): CommandPaletteItem[] {
+  if (!input.canOperate) return [];
+  const { environmentId } = input;
+  const entries = pluginActionsAt(input.actions, "command-palette", {
+    threadId: input.threadId,
+    projectId: input.projectId,
+  });
+  const labels = pluginActionLabels(entries.map((entry) => entry.action));
+  return entries.map(({ action, target }, index) => ({
+    key: `plugin-action:${action.id}`,
+    kind: "action",
+    title: labels[index] ?? action.title,
+    detail: action.description ?? action.pluginName,
+    searchTerms: [action.name, action.pluginName, "plugin"],
+    run: () => input.runAction({ environmentId, action, target }),
+  }));
+}

apps/mobile/src/features/threads/ComposerCommandPopover.tsx

@@ -3,6 +3,8 @@ import {
   type ProviderSkillSourceKind,
 } from "@t3tools/client-runtime/providerSkills";
 import type {
+  PluginAction,
+  PluginActionTarget,
   PullRequestContextMetadata,
   ScopedThreadRef,
   ServerProviderSkill,
@@ -59,6 +61,14 @@ export type ComposerCommandItem =
       readonly skill: ServerProviderSkill;
       readonly label: string;
       readonly description: string;
+    }
+  | {
+      readonly id: string;
+      readonly type: "plugin-action";
+      readonly action: PluginAction;
+      readonly target: PluginActionTarget;
+      readonly label: string;
+      readonly description: string;
     };
 
 interface ComposerCommandPopoverProps {
@@ -109,6 +119,8 @@ function itemIcon(item: ComposerCommandItem): AppSymbolName | null {
       return null;
     case "thread":
       return "text.bubble";
+    case "plugin-action":
+      return "cube";
   }
 }
 

apps/mobile/src/features/threads/NewTaskDraftScreen.tsx

@@ -490,6 +490,8 @@ export function NewTaskDraftScreen(props: {
     draftMessage: flow.prompt,
     ownerKey: flow.draftKey,
     environmentId: selectedProject?.environmentId ?? null,
+    // Project actions run on the selected project; a draft has no thread yet.
+    projectId: selectedProject?.id ?? null,
     threadShells: useThreadShells(),
     pullRequestProjectId: selectedEnvironmentServerConfig?.environment.capabilities.pullRequests
       ? (selectedProject?.id ?? null)

apps/mobile/src/features/threads/ThreadComposer.tsx

@@ -491,6 +491,7 @@ export const ThreadComposer = memo(function ThreadComposer(props: ThreadComposer
     environmentId: props.environmentId,
     threadShells: useThreadShells(),
     currentThreadId: props.selectedThread.id,
+    projectId: props.selectedThread.projectId,
     projectCwd: props.projectCwd,
     pullRequestProjectId: props.serverConfig?.environment.capabilities.pullRequests
       ? (project?.id ?? null)

apps/mobile/src/features/threads/ThreadContributionStatusStrip.tsx

@@ -0,0 +1,120 @@
+import { useAtomValue } from "@effect/atom-react";
+import type {
+  ContributionStatusTone,
+  EnvironmentId,
+  ProviderDriverKind,
+  ThreadId,
+} from "@t3tools/contracts";
+import { useMemo } from "react";
+import { Alert, Platform, Pressable, ScrollView, View } from "react-native";
+
+import { AppText as Text } from "../../components/AppText";
+import { ProviderIcon } from "../../components/ProviderIcon";
+import { cn } from "../../lib/cn";
+import { contributionStatusEnvironment } from "../../state/contribution-status";
+import {
+  reservesContributionStatusBand,
+  threadContributionStatusChips,
+  threadHasContributionStatus,
+} from "./thread-contribution-status-presentation";
+
+/** The strip's height: one row of chip touch targets (44pt iOS, 48dp Android). */
+const STRIP_HEIGHT = Platform.OS === "android" ? 48 : 44;
+
+// Neutral, the default, has no dot: Pi status text often brings its own glyph.
+const TONE_DOT_CLASS = {
+  neutral: null,
+  info: "bg-adaptive-sky-600-400",
+  success: "bg-adaptive-emerald-600-400",
+  warning: "bg-adaptive-amber-700-400",
+  error: "bg-adaptive-rose-600-400",
+} as const satisfies Record<ContributionStatusTone, string | null>;
+
+/**
+ * The band the feed reserves above its first row for the status strip, passed
+ * to ThreadFeed's `topOverlayInset`. See `reservesContributionStatusBand`.
+ */
+export function useThreadContributionStatusStripInset(input: {
+  readonly environmentId: EnvironmentId;
+  readonly threadId: ThreadId;
+  readonly supported: boolean;
+  readonly driver: ProviderDriverKind | undefined;
+}): number {
+  const hasStatus = useAtomValue(
+    contributionStatusEnvironment.threadStatus(input.environmentId, input.threadId),
+    threadHasContributionStatus,
+  );
+  return reservesContributionStatusBand({ ...input, hasStatus }) ? STRIP_HEIGHT : 0;
+}
+
+/**
+ * Advisory statuses the thread's provider set, such as Pi extension
+ * `setStatus` text, as one row of chips floating just under the navigation
+ * header. It overlays the feed like the header does, so a status changing
+ * never resizes the composer; the feed reserves its band through
+ * `useThreadContributionStatusStripInset`. Renders nothing when the server
+ * lacks the capability or the thread has no statuses. Pressing a chip shows
+ * its tooltip and where it came from.
+ */
+export function ThreadContributionStatusStrip(props: {
+  readonly environmentId: EnvironmentId;
+  readonly threadId: ThreadId;
+  /** Distance from the screen's top edge to the bottom of the navigation header. */
+  readonly top: number;
+  readonly contentMaxWidth: number | undefined;
+}) {
+  const entries = useAtomValue(
+    contributionStatusEnvironment.threadStatus(props.environmentId, props.threadId),
+  );
+  const chips = useMemo(() => threadContributionStatusChips(entries), [entries]);
+  if (chips.length === 0) return null;
+
+  return (
+    <View
+      pointerEvents="box-none"
+      className="absolute inset-x-0"
+      style={{ top: props.top, height: STRIP_HEIGHT }}
+    >
+      <View
+        pointerEvents="box-none"
+        className="w-full self-center"
+        style={{ maxWidth: props.contentMaxWidth }}
+      >
+        {/* Sized to its chips, so the feed under the empty rest of the row
+            still takes touches. */}
+        <ScrollView
+          horizontal
+          showsHorizontalScrollIndicator={false}
+          className="max-w-full grow-0 self-start"
+          contentContainerClassName="px-2.5"
+        >
+          {chips.map((chip) => {
+            const dotClass = TONE_DOT_CLASS[chip.tone];
+            // The compact pill sits inside a full-size touch target (44pt
+            // iOS, 48dp Android); neighbours abut without overlapping.
+            return (
+              <Pressable
+                key={chip.id}
+                accessibilityRole="button"
+                accessibilityLabel={chip.accessibilityLabel}
+                accessibilityHint={chip.tooltip ?? chip.help}
+                className="min-h-[44px] min-w-[44px] items-center justify-center px-[3px] active:opacity-60 android:min-h-[48px] android:min-w-[48px]"
+                onPress={() => Alert.alert(chip.details.title, chip.details.message)}
+              >
+                <View className="min-h-7 flex-row items-center gap-1.5 rounded-full border border-border-subtle bg-card-alt px-2.5">
+                  {chip.leadsSource ? <ProviderIcon provider={chip.driver} size={12} /> : null}
+                  {dotClass === null ? null : (
+                    <View className={cn("h-1.5 w-1.5 shrink-0 rounded-full", dotClass)} />
+                  )}
+                  <Text numberOfLines={1} className="text-xs text-foreground-secondary">
+                    {chip.text}
+                  </Text>
+                </View>
+              </Pressable>
+            );
+          })}
+        </ScrollView>
+      </View>
+    </View>
+  );
+}