feat: Centralize Twig slash command handling (split out from session work) (#1064)

Author: charlesvien

apps/twig/src/renderer/features/message-editor/commands.ts

@@ -0,0 +1,76 @@
+import type { AvailableCommand } from "@agentclientprotocol/sdk";
+import { track } from "@renderer/lib/analytics";
+import { ANALYTICS_EVENTS, type FeedbackType } from "@shared/types/analytics";
+import { toast } from "@utils/toast";
+
+interface CommandContext {
+  taskId: string;
+  repoPath: string | null | undefined;
+  session: {
+    taskRunId?: string;
+    logUrl?: string;
+    events: unknown[];
+  } | null;
+  taskRun: { id?: string; log_url?: string } | null;
+}
+
+interface TwigCommand {
+  name: string;
+  description: string;
+  input?: { hint: string };
+  execute: (
+    args: string | undefined,
+    context: CommandContext,
+  ) => Promise<void> | void;
+}
+
+function makeFeedbackCommand(
+  name: string,
+  feedbackType: FeedbackType,
+  label: string,
+): TwigCommand {
+  return {
+    name,
+    description: `Capture ${label.toLowerCase()} feedback`,
+    input: { hint: "optional comment" },
+    execute(args, ctx) {
+      track(ANALYTICS_EVENTS.TASK_FEEDBACK, {
+        task_id: ctx.taskId,
+        task_run_id: ctx.session?.taskRunId ?? ctx.taskRun?.id,
+        log_url: ctx.session?.logUrl ?? ctx.taskRun?.log_url,
+        event_count: ctx.session?.events.length ?? 0,
+        feedback_type: feedbackType,
+        feedback_comment: args?.trim() || undefined,
+      });
+      toast.success(`${label} feedback captured`);
+    },
+  };
+}
+
+const commands: TwigCommand[] = [
+  makeFeedbackCommand("good", "good", "Positive"),
+  makeFeedbackCommand("bad", "bad", "Negative"),
+  makeFeedbackCommand("feedback", "general", "General"),
+];
+
+export const TWIG_COMMANDS: AvailableCommand[] = commands.map((cmd) => ({
+  name: cmd.name,
+  description: cmd.description,
+  input: cmd.input,
+}));
+
+const commandMap = new Map(commands.map((cmd) => [cmd.name, cmd]));
+
+export async function tryExecuteTwigCommand(
+  text: string,
+  context: CommandContext,
+): Promise<boolean> {
+  const match = text.match(/^\/(\S+)(?:\s+(.*))?$/);
+  if (!match) return false;
+
+  const cmd = commandMap.get(match[1]);
+  if (!cmd) return false;
+
+  await cmd.execute(match[2], context);
+  return true;
+}

apps/twig/src/renderer/features/message-editor/suggestions/getSuggestions.ts

@@ -1,28 +1,11 @@
 import type { AvailableCommand } from "@agentclientprotocol/sdk";
+import { TWIG_COMMANDS } from "@features/message-editor/commands";
 import { getAvailableCommandsForTask } from "@features/sessions/stores/sessionStore";
 import { fetchRepoFiles, searchFiles } from "@hooks/useRepoFiles";
 import Fuse, { type IFuseOptions } from "fuse.js";
 import { useDraftStore } from "../stores/draftStore";
 import type { CommandSuggestionItem, FileSuggestionItem } from "../types";
 
-const TWIG_COMMANDS: AvailableCommand[] = [
-  {
-    name: "good",
-    description: "Capture positive feedback",
-    input: { hint: "optional comment" },
-  },
-  {
-    name: "bad",
-    description: "Capture negative feedback",
-    input: { hint: "optional comment" },
-  },
-  {
-    name: "feedback",
-    description: "Capture general feedback",
-    input: { hint: "optional comment" },
-  },
-];
-
 const COMMAND_LIMIT = 5;
 
 const COMMAND_FUSE_OPTIONS: IFuseOptions<AvailableCommand> = {

apps/twig/src/renderer/features/task-detail/components/TaskLogsPanel.tsx

@@ -1,5 +1,6 @@
 import { BackgroundWrapper } from "@components/BackgroundWrapper";
 import { ErrorBoundary } from "@components/ErrorBoundary";
+import { tryExecuteTwigCommand } from "@features/message-editor/commands";
 import { useDraftStore } from "@features/message-editor/stores/draftStore";
 import { SessionView } from "@features/sessions/components/SessionView";
 import { getSessionService } from "@features/sessions/service/service";
@@ -13,13 +14,11 @@ import { WorkspaceSetupPrompt } from "@features/task-detail/components/Workspace
 import { useWorkspaceStore } from "@features/workspace/stores/workspaceStore";
 import { useConnectivity } from "@hooks/useConnectivity";
 import { Box, Button, Flex, Spinner, Text } from "@radix-ui/themes";
-import { track } from "@renderer/lib/analytics";
 import { logger } from "@renderer/lib/logger";
 import { useNavigationStore } from "@renderer/stores/navigationStore";
 import { useTaskDirectoryStore } from "@renderer/stores/taskDirectoryStore";
 import { trpcVanilla } from "@renderer/trpc/client";
 import type { Task } from "@shared/types";
-import { ANALYTICS_EVENTS, type FeedbackType } from "@shared/types/analytics";
 import { useQueryClient } from "@tanstack/react-query";
 import { getTaskRepository } from "@utils/repository";
 import { toast } from "@utils/toast";
@@ -168,29 +167,19 @@ export function TaskLogsPanel({ taskId, task }: TaskLogsPanelProps) {
 
   const handleSendPrompt = useCallback(
     async (text: string) => {
-      const feedbackMatch = text.match(/^\/(good|bad|feedback)(?:\s+(.*))?$/);
-      if (feedbackMatch) {
-        const rawType = feedbackMatch[1];
-        const feedbackType: FeedbackType =
-          rawType === "feedback" ? "general" : (rawType as FeedbackType);
-        const comment = feedbackMatch[2]?.trim() || undefined;
-        track(ANALYTICS_EVENTS.TASK_FEEDBACK, {
-          task_id: taskId,
-          task_run_id: session?.taskRunId ?? task.latest_run?.id,
-          log_url: session?.logUrl ?? task.latest_run?.log_url,
-          event_count: events.length,
-          feedback_type: feedbackType,
-          feedback_comment: comment,
-        });
-        const label =
-          feedbackType === "good"
-            ? "Positive"
-            : feedbackType === "bad"
-              ? "Negative"
-              : "General";
-        toast.success(`${label} feedback captured`);
-        return;
-      }
+      const handled = await tryExecuteTwigCommand(text, {
+        taskId,
+        repoPath,
+        session: session
+          ? {
+              taskRunId: session.taskRunId,
+              logUrl: session.logUrl,
+              events,
+            }
+          : null,
+        taskRun: task.latest_run ?? null,
+      });
+      if (handled) return;
 
       try {
         markAsViewed(taskId);
@@ -215,13 +204,12 @@ export function TaskLogsPanel({ taskId, task }: TaskLogsPanelProps) {
     },
     [
       taskId,
+      repoPath,
       markActivity,
       markAsViewed,
-      events.length,
-      session?.logUrl,
-      session?.taskRunId,
-      task.latest_run?.id,
-      task.latest_run?.log_url,
+      events,
+      session,
+      task.latest_run,
     ],
   );