clawdex-mobile 2.0.1 → 3.0.0

package/apps/mobile/src/screens/agentThreadDisplay.ts

@@ -0,0 +1,261 @@
+import type { ComponentProps } from 'react';
+import type { Ionicons } from '@expo/vector-icons';
+
+import type { ChatSummary } from '../api/types';
+import type { ActivityTone } from '../components/ActivityBar';
+import { colors } from '../theme';
+
+type IoniconName = ComponentProps<typeof Ionicons>['name'];
+
+const AGENT_ACCENT_PALETTE = [
+  '#F5A524',
+  '#4CC9F0',
+  '#7ED957',
+  '#FF8A65',
+  '#F472B6',
+  '#8BD3DD',
+] as const;
+
+const RUNNING_STATUS_COLOR = '#7EE787';
+const WAITING_STATUS_COLOR = '#F5A524';
+const COMPLETE_STATUS_COLOR = '#93C5FD';
+
+export interface AgentThreadRuntimeSnapshotLike {
+  activity?: {
+    tone: ActivityTone;
+    title: string;
+    detail?: string;
+  };
+  activeCommands?: unknown[];
+  pendingApproval?: unknown | null;
+  pendingUserInputRequest?: unknown | null;
+  activeTurnId?: string | null;
+  runWatchdogUntil?: number;
+  updatedAtMs?: number;
+}
+
+export interface AgentThreadDisplayState {
+  icon: IoniconName;
+  label: string;
+  detail: string | null;
+  tone: ActivityTone;
+  accentColor: string;
+  statusColor: string;
+  statusSurfaceColor: string;
+  statusBorderColor: string;
+  isActive: boolean;
+}
+
+export function buildAgentThreadDisplayState(
+  chat: ChatSummary,
+  snapshot: AgentThreadRuntimeSnapshotLike | null | undefined,
+  nowMs = Date.now()
+): AgentThreadDisplayState {
+  const accentColor = getAgentThreadAccentColor(chat.id);
+  const status = resolveAgentRuntimeStatus(chat, snapshot, nowMs);
+
+  return {
+    ...status,
+    accentColor,
+  };
+}
+
+export function getAgentThreadAccentColor(threadId: string): string {
+  let hash = 0;
+  for (let index = 0; index < threadId.length; index += 1) {
+    hash = (hash * 33 + threadId.charCodeAt(index)) >>> 0;
+  }
+
+  return AGENT_ACCENT_PALETTE[hash % AGENT_ACCENT_PALETTE.length];
+}
+
+function resolveAgentRuntimeStatus(
+  chat: ChatSummary,
+  snapshot: AgentThreadRuntimeSnapshotLike | null | undefined,
+  nowMs: number
+): Omit<AgentThreadDisplayState, 'accentColor'> {
+  const activity = snapshot?.activity;
+  const activityTitle = normalizeValue(activity?.title);
+  const activityDetail = normalizeValue(activity?.detail);
+  const hasActiveTurn = Boolean(snapshot?.activeTurnId);
+  const watchdogActive =
+    typeof snapshot?.runWatchdogUntil === 'number' && snapshot.runWatchdogUntil > nowMs;
+  const hasActiveCommands = (snapshot?.activeCommands?.length ?? 0) > 0;
+  const needsApproval = snapshot?.pendingApproval != null;
+  const needsInput = snapshot?.pendingUserInputRequest != null;
+
+  if (chat.status === 'error' || activity?.tone === 'error') {
+    return {
+      icon: 'alert-circle-outline',
+      label: 'Error',
+      detail:
+        activityDetail ??
+        normalizeErrorActivityTitle(activityTitle) ??
+        normalizeValue(chat.lastError) ??
+        null,
+      tone: 'error',
+      statusColor: colors.statusError,
+      statusSurfaceColor: 'rgba(239, 68, 68, 0.16)',
+      statusBorderColor: 'rgba(239, 68, 68, 0.42)',
+      isActive: false,
+    };
+  }
+
+  if (needsApproval) {
+    return {
+      icon: 'hand-left-outline',
+      label: 'Needs approval',
+      detail: activityDetail ?? normalizeRunningDetail(activityTitle),
+      tone: 'running',
+      statusColor: WAITING_STATUS_COLOR,
+      statusSurfaceColor: 'rgba(245, 165, 36, 0.16)',
+      statusBorderColor: 'rgba(245, 165, 36, 0.4)',
+      isActive: true,
+    };
+  }
+
+  if (needsInput) {
+    return {
+      icon: 'help-circle-outline',
+      label: 'Needs input',
+      detail: activityDetail ?? normalizeRunningDetail(activityTitle),
+      tone: 'running',
+      statusColor: WAITING_STATUS_COLOR,
+      statusSurfaceColor: 'rgba(245, 165, 36, 0.16)',
+      statusBorderColor: 'rgba(245, 165, 36, 0.4)',
+      isActive: true,
+    };
+  }
+
+  if (
+    activity?.tone === 'running' ||
+    chat.status === 'running' ||
+    hasActiveTurn ||
+    watchdogActive ||
+    hasActiveCommands
+  ) {
+    const label = normalizeRunningLabel(activityTitle);
+    return {
+      icon: runningIconForLabel(label),
+      label,
+      detail: activityDetail,
+      tone: 'running',
+      statusColor: RUNNING_STATUS_COLOR,
+      statusSurfaceColor: 'rgba(126, 231, 135, 0.14)',
+      statusBorderColor: 'rgba(126, 231, 135, 0.34)',
+      isActive: true,
+    };
+  }
+
+  if (chat.status === 'complete' || activity?.tone === 'complete') {
+    return {
+      icon: 'checkmark-circle-outline',
+      label: 'Complete',
+      detail:
+        activityDetail ??
+        normalizeCompleteActivityTitle(activityTitle) ??
+        null,
+      tone: 'complete',
+      statusColor: COMPLETE_STATUS_COLOR,
+      statusSurfaceColor: 'rgba(147, 197, 253, 0.15)',
+      statusBorderColor: 'rgba(147, 197, 253, 0.34)',
+      isActive: false,
+    };
+  }
+
+  return {
+    icon: 'ellipse-outline',
+    label: 'Idle',
+    detail: null,
+    tone: 'idle',
+    statusColor: colors.statusIdle,
+    statusSurfaceColor: 'rgba(180, 188, 203, 0.12)',
+    statusBorderColor: 'rgba(180, 188, 203, 0.24)',
+    isActive: false,
+  };
+}
+
+function normalizeRunningLabel(activityTitle: string | null): string {
+  const normalized = activityTitle?.trim().toLowerCase();
+  if (!normalized || normalized === 'turn started' || normalized === 'ready') {
+    return 'Working';
+  }
+
+  if (normalized === 'working') {
+    return 'Working';
+  }
+  if (normalized === 'reasoning') {
+    return 'Reasoning';
+  }
+  if (normalized === 'planning') {
+    return 'Planning';
+  }
+
+  return activityTitle ?? 'Working';
+}
+
+function normalizeRunningDetail(activityTitle: string | null): string | null {
+  if (!activityTitle) {
+    return null;
+  }
+
+  const normalized = activityTitle.trim().toLowerCase();
+  if (
+    normalized === 'working' ||
+    normalized === 'reasoning' ||
+    normalized === 'planning' ||
+    normalized === 'turn started' ||
+    normalized === 'ready'
+  ) {
+    return null;
+  }
+
+  return activityTitle;
+}
+
+function normalizeCompleteActivityTitle(activityTitle: string | null): string | null {
+  if (!activityTitle) {
+    return null;
+  }
+
+  const normalized = activityTitle.trim().toLowerCase();
+  if (normalized === 'turn completed' || normalized === 'ready') {
+    return null;
+  }
+
+  return activityTitle;
+}
+
+function normalizeErrorActivityTitle(activityTitle: string | null): string | null {
+  if (!activityTitle) {
+    return null;
+  }
+
+  const normalized = activityTitle.trim().toLowerCase();
+  if (
+    normalized === 'turn failed' ||
+    normalized === 'turn interrupted' ||
+    normalized === 'error'
+  ) {
+    return null;
+  }
+
+  return activityTitle;
+}
+
+function runningIconForLabel(label: string): IoniconName {
+  const normalized = label.trim().toLowerCase();
+  if (normalized === 'planning') {
+    return 'map-outline';
+  }
+  if (normalized === 'reasoning') {
+    return 'sparkles-outline';
+  }
+
+  return 'sync-outline';
+}
+
+function normalizeValue(value: string | null | undefined): string | null {
+  const trimmed = value?.trim();
+  return trimmed ? trimmed : null;
+}

package/apps/mobile/src/screens/agentThreads.ts

@@ -0,0 +1,167 @@
+import type { ChatSummary } from '../api/types';
+
+export interface RelatedAgentThreadsResult {
+  rootThreadId: string | null;
+  threads: ChatSummary[];
+}
+
+export interface LiveAgentPanelThreadLike {
+  id: string;
+  isRootThread: boolean;
+  isActive: boolean;
+}
+
+export function collectRelatedAgentThreads(
+  chats: ChatSummary[],
+  focusChat: ChatSummary | null
+): RelatedAgentThreadsResult {
+  if (!focusChat) {
+    return {
+      rootThreadId: null,
+      threads: [],
+    };
+  }
+
+  const chatMap = new Map<string, ChatSummary>();
+  for (const chat of chats) {
+    chatMap.set(chat.id, chat);
+  }
+  if (!chatMap.has(focusChat.id)) {
+    chatMap.set(focusChat.id, focusChat);
+  }
+
+  const rootThreadId = resolveRootThreadId(focusChat.id, chatMap);
+  const threads = Array.from(chatMap.values())
+    .filter((chat) => resolveRootThreadId(chat.id, chatMap) === rootThreadId)
+    .sort((left, right) => compareAgentThreads(left, right, rootThreadId));
+
+  return {
+    rootThreadId,
+    threads,
+  };
+}
+
+export function findMatchingAgentThread(
+  threads: ChatSummary[],
+  query: string
+): ChatSummary | null {
+  const normalized = query.trim().toLowerCase();
+  if (!normalized) {
+    return null;
+  }
+
+  const exactMatch =
+    threads.find((chat) => {
+      const title = chat.title.trim().toLowerCase();
+      return chat.id.toLowerCase() === normalized || title === normalized;
+    }) ?? null;
+  if (exactMatch) {
+    return exactMatch;
+  }
+
+  return (
+    threads.find((chat) => {
+      const nickname = chat.agentNickname?.trim().toLowerCase() ?? '';
+      const role = chat.agentRole?.trim().toLowerCase() ?? '';
+      const title = chat.title.trim().toLowerCase();
+      const preview = chat.lastMessagePreview.trim().toLowerCase();
+      return (
+        chat.id.toLowerCase().includes(normalized) ||
+        nickname.includes(normalized) ||
+        role.includes(normalized) ||
+        title.includes(normalized) ||
+        preview.includes(normalized)
+      );
+    }) ?? null
+  );
+}
+
+export function describeAgentThreadSource(
+  chat: ChatSummary,
+  rootThreadId: string | null
+): string {
+  if (rootThreadId && chat.id === rootThreadId) {
+    return 'Main thread';
+  }
+
+  switch (chat.sourceKind) {
+    case 'subAgentReview':
+      return 'Review agent';
+    case 'subAgentCompact':
+      return 'Compaction agent';
+    case 'subAgentThreadSpawn':
+    case 'subAgent':
+      return 'Spawned sub-agent';
+    case 'subAgentOther':
+      return 'Sub-agent';
+    default:
+      return 'Agent thread';
+  }
+}
+
+export function collectLiveAgentPanelThreadIds(
+  threads: LiveAgentPanelThreadLike[]
+): string[] {
+  const hasActiveSubAgent = threads.some((thread) => !thread.isRootThread && thread.isActive);
+  if (!hasActiveSubAgent) {
+    return [];
+  }
+
+  return threads
+    .filter((thread) => thread.isRootThread || thread.isActive)
+    .map((thread) => thread.id);
+}
+
+function resolveRootThreadId(
+  threadId: string,
+  chatMap: Map<string, ChatSummary>
+): string {
+  let currentId = threadId;
+  const seen = new Set<string>();
+
+  while (true) {
+    if (seen.has(currentId)) {
+      return currentId;
+    }
+    seen.add(currentId);
+
+    const current = chatMap.get(currentId);
+    const parentThreadId = current?.parentThreadId?.trim();
+    if (!parentThreadId) {
+      return currentId;
+    }
+    if (!chatMap.has(parentThreadId)) {
+      return parentThreadId;
+    }
+
+    currentId = parentThreadId;
+  }
+}
+
+function compareAgentThreads(
+  left: ChatSummary,
+  right: ChatSummary,
+  rootThreadId: string
+): number {
+  if (left.id === rootThreadId && right.id !== rootThreadId) {
+    return -1;
+  }
+  if (right.id === rootThreadId && left.id !== rootThreadId) {
+    return 1;
+  }
+
+  if (left.status === 'running' && right.status !== 'running') {
+    return -1;
+  }
+  if (right.status === 'running' && left.status !== 'running') {
+    return 1;
+  }
+
+  const leftDepth = left.subAgentDepth ?? 0;
+  const rightDepth = right.subAgentDepth ?? 0;
+  if (leftDepth !== rightDepth) {
+    return leftDepth - rightDepth;
+  }
+
+  return right.updatedAt.localeCompare(left.updatedAt);
+}

package/apps/mobile/src/screens/planCardState.ts

@@ -0,0 +1,40 @@
+import type { CollaborationMode, TurnPlanStep } from '../api/types';
+
+export interface PlanCardStateLike {
+  explanation: string | null;
+  steps: TurnPlanStep[];
+}
+
+export type WorkflowCardMode = 'plan' | 'approval' | 'execution';
+
+export interface ResolveWorkflowCardModeArgs {
+  collaborationMode: CollaborationMode;
+  hasStructuredPlan: boolean;
+  hasPlanApprovalPrompt: boolean;
+}
+
+export function hasStructuredPlanCardContent(
+  plan: PlanCardStateLike | null | undefined
+): boolean {
+  return Boolean(plan && (plan.steps.length > 0 || plan.explanation?.trim()));
+}
+
+export function resolveWorkflowCardMode({
+  collaborationMode,
+  hasStructuredPlan,
+  hasPlanApprovalPrompt,
+}: ResolveWorkflowCardModeArgs): WorkflowCardMode | null {
+  if (hasPlanApprovalPrompt) {
+    return 'approval';
+  }
+
+  if (hasStructuredPlan && collaborationMode === 'default') {
+    return 'execution';
+  }
+
+  if (hasStructuredPlan) {
+    return 'plan';
+  }
+
+  return null;
+}

package/apps/mobile/src/screens/subAgentTranscript.ts

@@ -0,0 +1,149 @@
+import type { ChatMessage } from '../api/types';
+
+export interface TrimmedSubAgentTranscript {
+  messages: ChatMessage[];
+  hiddenInheritedMessageCount: number;
+}
+
+export function trimInheritedParentMessages(
+  parentMessages: ChatMessage[],
+  childMessages: ChatMessage[],
+  childThreadId?: string | null
+): TrimmedSubAgentTranscript {
+  const normalizedChildThreadId = childThreadId?.trim() ?? '';
+  if (normalizedChildThreadId) {
+    const startIndex = findSpawnPromptStartIndex(
+      parentMessages,
+      childMessages,
+      normalizedChildThreadId
+    );
+    if (startIndex > 0 && startIndex < childMessages.length) {
+      return {
+        messages: childMessages.slice(startIndex),
+        hiddenInheritedMessageCount: startIndex,
+      };
+    }
+  }
+
+  const sharedLeadingCount = sharedLeadingMessageCount(parentMessages, childMessages);
+  if (sharedLeadingCount <= 0 || sharedLeadingCount >= childMessages.length) {
+    return {
+      messages: childMessages,
+      hiddenInheritedMessageCount: 0,
+    };
+  }
+
+  return {
+    messages: childMessages.slice(sharedLeadingCount),
+    hiddenInheritedMessageCount: sharedLeadingCount,
+  };
+}
+
+function findSpawnPromptStartIndex(
+  parentMessages: ChatMessage[],
+  childMessages: ChatMessage[],
+  childThreadId: string
+): number {
+  const prompt = findSpawnPrompt(parentMessages, childThreadId);
+  if (!prompt) {
+    return -1;
+  }
+
+  const normalizedPrompt = normalizeMessageContent(prompt);
+  if (!normalizedPrompt) {
+    return -1;
+  }
+
+  const sharedLeadingCount = sharedLeadingMessageCount(parentMessages, childMessages);
+  return childMessages.findIndex((message, index) => {
+    if (index < sharedLeadingCount) {
+      return false;
+    }
+    if (message.role !== 'user') {
+      return false;
+    }
+
+    const candidate = normalizeUserPromptContent(message.content);
+    if (!candidate) {
+      return false;
+    }
+
+    return (
+      candidate === normalizedPrompt ||
+      candidate.includes(normalizedPrompt) ||
+      normalizedPrompt.includes(candidate)
+    );
+  });
+}
+
+function findSpawnPrompt(
+  parentMessages: ChatMessage[],
+  childThreadId: string
+): string | null {
+  let fallbackPrompt: string | null = null;
+
+  for (const message of parentMessages) {
+    if (message.systemKind !== 'subAgent') {
+      continue;
+    }
+
+    const meta = message.subAgentMeta;
+    if (!meta) {
+      continue;
+    }
+
+    const receiverThreadIds = meta.receiverThreadIds ?? [];
+    if (!receiverThreadIds.includes(childThreadId)) {
+      continue;
+    }
+
+    const prompt = meta.prompt?.trim();
+    if (!prompt) {
+      continue;
+    }
+
+    const normalizedTool = normalizeMessageContent(meta.tool ?? '');
+    if (normalizedTool === 'spawn_agent' || normalizedTool === 'spawnagent') {
+      return prompt;
+    }
+
+    if (!fallbackPrompt) {
+      fallbackPrompt = prompt;
+    }
+  }
+
+  return fallbackPrompt;
+}
+
+function sharedLeadingMessageCount(left: ChatMessage[], right: ChatMessage[]): number {
+  const max = Math.min(left.length, right.length);
+  let count = 0;
+
+  while (count < max && messagesMatch(left[count], right[count])) {
+    count += 1;
+  }
+
+  return count;
+}
+
+function messagesMatch(left: ChatMessage, right: ChatMessage): boolean {
+  return (
+    left.role === right.role &&
+    left.systemKind === right.systemKind &&
+    normalizeMessageContent(left.content) === normalizeMessageContent(right.content)
+  );
+}
+
+function normalizeUserPromptContent(value: string): string {
+  const lines = value
+    .split('\n')
+    .map((line) => line.trim())
+    .filter((line) => line.length > 0)
+    .filter((line) => !/^\[(file|image|local image):/i.test(line));
+
+  return normalizeMessageContent(lines.join('\n'));
+}
+
+function normalizeMessageContent(value: string): string {
+  return value.replace(/\s+/g, ' ').trim();
+}

package/apps/mobile/src/screens/transcriptMessages.ts

@@ -0,0 +1,102 @@
+import type { ChatMessage, ChatStatus } from '../api/types';
+
+export function getVisibleTranscriptMessages(
+  messages: ChatMessage[],
+  showToolCalls: boolean
+): ChatMessage[] {
+  const filtered = messages.filter((msg) => {
+    const text = msg.content || '';
+    if (!showToolCalls && msg.role === 'system' && msg.systemKind !== 'subAgent') {
+      return false;
+    }
+    if (text.includes('FINAL_TASK_RESULT_JSON')) {
+      return false;
+    }
+    if (text.includes('Current working directory is:')) {
+      return false;
+    }
+    if (text.includes('You are operating in task worktree')) {
+      return false;
+    }
+    if (msg.role === 'assistant' && !text.trim()) {
+      return false;
+    }
+    return true;
+  });
+
+  return filtered.filter((msg, index) => {
+    if (msg.role !== 'assistant') {
+      return true;
+    }
+
+    const next = filtered[index + 1];
+    return !next || next.role !== 'assistant';
+  });
+}
+
+export function syncVisibleSubAgentStatuses(
+  messages: ChatMessage[],
+  threadStatuses: ReadonlyMap<string, ChatStatus>
+): ChatMessage[] {
+  if (threadStatuses.size === 0) {
+    return messages;
+  }
+
+  return messages.map((message) => syncSubAgentMessageStatus(message, threadStatuses));
+}
+
+function syncSubAgentMessageStatus(
+  message: ChatMessage,
+  threadStatuses: ReadonlyMap<string, ChatStatus>
+): ChatMessage {
+  if (message.systemKind !== 'subAgent' || !message.subAgentMeta) {
+    return message;
+  }
+
+  const receiverThreadIds = message.subAgentMeta.receiverThreadIds ?? [];
+  const nextStatus =
+    receiverThreadIds
+      .map((threadId) => threadStatuses.get(threadId))
+      .find((status): status is ChatStatus => typeof status === 'string') ?? null;
+
+  if (!nextStatus) {
+    return message;
+  }
+
+  const nextContent = replaceSubAgentStatusLine(message.content, nextStatus);
+  const previousStatus = message.subAgentMeta.agentStatus;
+  if (nextContent === message.content && previousStatus === nextStatus) {
+    return message;
+  }
+
+  return {
+    ...message,
+    content: nextContent,
+    subAgentMeta: {
+      ...message.subAgentMeta,
+      agentStatus: nextStatus,
+    },
+  };
+}
+
+function replaceSubAgentStatusLine(content: string, status: ChatStatus): string {
+  const statusLine = `Status: ${status}`;
+  const lines = content.split('\n');
+  let replaced = false;
+
+  const nextLines = lines.map((line) => {
+    if (!/^\s*Status:\s*/i.test(line)) {
+      return line;
+    }
+
+    replaced = true;
+    const indentation = line.match(/^\s*/)?.[0] ?? '';
+    return `${indentation}${statusLine}`;
+  });
+
+  if (replaced) {
+    return nextLines.join('\n');
+  }
+
+  return [...nextLines, `  ${statusLine}`].join('\n');
+}