From 55526e443763b3ea201e6a7d54c657c08a877d2a Mon Sep 17 00:00:00 2001
From: Matt Rubens <mrubens@users.noreply.github.com>
Date: Sat, 31 May 2025 16:49:21 -0400
Subject: [PATCH] Show the mode used (#60)

---
 src/actions/analytics/events.ts              |  4 +++-
 src/app/(authenticated)/usage/Messages.tsx   | 15 +++++++++++----
 src/app/(authenticated)/usage/TaskDrawer.tsx |  6 ++++++
 src/components/usage/TaskCard.tsx            |  5 +++++
 src/types/analytics/message.ts               |  1 +
 src/types/analytics/task.ts                  |  1 +
 6 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/src/actions/analytics/events.ts b/src/actions/analytics/events.ts
index 4e756b88a8..08d3987117 100644
--- a/src/actions/analytics/events.ts
+++ b/src/actions/analytics/events.ts
@@ -258,7 +258,8 @@ export const getTasks = async ({
       WITH first_messages AS (
         SELECT
           taskId,
-          argMin(text, ts) as title
+          argMin(text, ts) as title,
+          argMin(mode, ts) as mode
         FROM messages
         WHERE orgId = {orgId: String}
         GROUP BY taskId
@@ -268,6 +269,7 @@ export const getTasks = async ({
         e.userId,
         e.apiProvider AS provider,
         e.modelId as model,
+        any(fm.mode) AS mode,
         MAX(CASE WHEN e.type = 'Task Completed' THEN 1 ELSE 0 END) AS completed,
         SUM(CASE WHEN e.type = 'LLM Completion' THEN COALESCE(e.inputTokens, 0) + COALESCE(e.outputTokens, 0) ELSE 0 END) AS tokens,
         SUM(CASE WHEN e.type = 'LLM Completion' THEN COALESCE(e.cost, 0) ELSE 0 END) AS cost,
diff --git a/src/app/(authenticated)/usage/Messages.tsx b/src/app/(authenticated)/usage/Messages.tsx
index 9143602b8e..3881377443 100644
--- a/src/app/(authenticated)/usage/Messages.tsx
+++ b/src/app/(authenticated)/usage/Messages.tsx
@@ -28,10 +28,17 @@ export const Messages = ({ messages }: MessagesProps) => {
             message.role === 'user' ? 'bg-primary/10' : 'bg-secondary/10',
           )}
         >
-          <div className="flex flex-row items-center gap-1 text-xs font-medium text-muted-foreground">
-            <div>{message.name}</div>
-            <div>&middot;</div>
-            <div>{message.timestamp}</div>
+          <div className="flex flex-row items-center justify-between gap-1 text-xs font-medium text-muted-foreground">
+            <div className="flex items-center gap-1">
+              <div>{message.name}</div>
+              <div>&middot;</div>
+              <div>{message.timestamp}</div>
+            </div>
+            {message.mode && (
+              <div className="px-2 py-1 bg-muted rounded text-xs font-medium">
+                {message.mode}
+              </div>
+            )}
           </div>
           <div className="text-sm markdown-prose">
             <ReactMarkdown>{message.text}</ReactMarkdown>
diff --git a/src/app/(authenticated)/usage/TaskDrawer.tsx b/src/app/(authenticated)/usage/TaskDrawer.tsx
index 3b5e18e57a..6514228d33 100644
--- a/src/app/(authenticated)/usage/TaskDrawer.tsx
+++ b/src/app/(authenticated)/usage/TaskDrawer.tsx
@@ -56,6 +56,12 @@ export const TaskDrawer = ({ task, onClose }: TaskDrawerProps) => {
               <span className="text-muted-foreground">Model</span>
               <span className="max-w-64 truncate font-mono">{task.model}</span>
             </div>
+            {task.mode && (
+              <div className="flex justify-between items-center">
+                <span className="text-muted-foreground">Mode</span>
+                <span className="max-w-64 truncate">{task.mode}</span>
+              </div>
+            )}
             <div className="flex justify-between items-center">
               <span className="text-muted-foreground">Tokens</span>
               <span className="max-w-64 truncate font-mono">
diff --git a/src/components/usage/TaskCard.tsx b/src/components/usage/TaskCard.tsx
index 864ede4427..6eb613d4be 100644
--- a/src/components/usage/TaskCard.tsx
+++ b/src/components/usage/TaskCard.tsx
@@ -51,6 +51,11 @@ export const TaskCard = ({ task, onFilter, onTaskSelected }: TaskCardProps) => {
               >
                 {task.user.name}
               </Button>
+              {task.mode && (
+                <span className="px-2 py-1 bg-muted rounded text-xs font-medium">
+                  {task.mode}
+                </span>
+              )}
               <Button
                 variant="link"
                 size="sm"
diff --git a/src/types/analytics/message.ts b/src/types/analytics/message.ts
index 191469807d..cc538ea714 100644
--- a/src/types/analytics/message.ts
+++ b/src/types/analytics/message.ts
@@ -5,6 +5,7 @@ export const messageSchema = z.object({
   orgId: z.string(),
   userId: z.string(),
   taskId: z.string(),
+  mode: z.string().nullable(),
   ts: z.number(),
   type: z.enum(['ask', 'say']),
   ask: z.string().nullable(),
diff --git a/src/types/analytics/task.ts b/src/types/analytics/task.ts
index 3c277968d1..4e18bca2d9 100644
--- a/src/types/analytics/task.ts
+++ b/src/types/analytics/task.ts
@@ -5,6 +5,7 @@ export const taskSchema = z.object({
   userId: z.string(),
   provider: z.string(),
   model: z.string(),
+  mode: z.string().nullable(),
   completed: z.coerce.boolean(),
   tokens: z.coerce.number(),
   cost: z.coerce.number(),