clawdex-mobile 5.0.0 → 5.0.2

package/apps/mobile/src/screens/TerminalScreen.tsx

@@ -1,248 +0,0 @@
-import { Ionicons } from '@expo/vector-icons';
-import { useCallback, useEffect, useState } from 'react';
-import {
-  Alert,
-  KeyboardAvoidingView,
-  Platform,
-  Pressable,
-  ScrollView,
-  StyleSheet,
-  Text,
-  TextInput,
-  View,
-} from 'react-native';
-import { SafeAreaView } from 'react-native-safe-area-context';
-
-import type { HostBridgeApiClient } from '../api/client';
-import type { HostBridgeWsClient } from '../api/ws';
-import { colors, radius, spacing, typography } from '../theme';
-
-interface TerminalScreenProps {
-  api: HostBridgeApiClient;
-  ws: HostBridgeWsClient;
-  onOpenDrawer: () => void;
-}
-
-export function TerminalScreen({ api, ws, onOpenDrawer }: TerminalScreenProps) {
-  const [command, setCommand] = useState('pwd');
-  const [output, setOutput] = useState('');
-  const [running, setRunning] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const executeCommand = useCallback(async () => {
-    try {
-      setRunning(true);
-      const result = await api.execTerminal({ command });
-      const lines = [
-        `$ ${result.command}`,
-        result.stdout || '(no stdout)',
-        result.stderr ? `stderr:\n${result.stderr}` : null,
-        `exit ${String(result.code)} · ${result.durationMs}ms`,
-      ]
-        .filter(Boolean)
-        .join('\n\n');
-      setOutput(lines);
-      setError(null);
-    } catch (err) {
-      setError((err as Error).message);
-    } finally {
-      setRunning(false);
-    }
-  }, [api, command]);
-
-  const runCommand = useCallback(() => {
-    const trimmed = command.trim();
-    if (!trimmed || running) {
-      return;
-    }
-
-    Alert.alert('Run command?', trimmed, [
-      {
-        text: 'Cancel',
-        style: 'cancel'
-      },
-      {
-        text: 'Run',
-        onPress: () => {
-          void executeCommand();
-        }
-      }
-    ]);
-  }, [command, executeCommand, running]);
-
-  useEffect(() => {
-    return ws.onEvent((event) => {
-      if (event.method === 'bridge/terminal/completed') {
-        const payload = event.params;
-        const command = typeof payload?.command === 'string' ? payload.command : 'unknown';
-        const code =
-          typeof payload?.code === 'number' || payload?.code === null
-            ? payload.code
-            : null;
-        setOutput((prev) =>
-          `${prev}\n\n[ws] ${command} → ${String(code)}`.trim()
-        );
-      }
-    });
-  }, [ws]);
-
-  return (
-    <SafeAreaView style={styles.container}>
-      <View style={styles.header}>
-        <Pressable onPress={onOpenDrawer} hitSlop={8} style={styles.menuBtn}>
-          <Ionicons name="menu" size={22} color={colors.textMuted} />
-        </Pressable>
-        <Ionicons name="terminal" size={16} color={colors.textMuted} />
-        <Text style={styles.headerTitle}>Terminal</Text>
-      </View>
-
-      <KeyboardAvoidingView
-        style={styles.body}
-        behavior={Platform.OS === 'ios' ? 'padding' : undefined}
-      >
-        <View style={styles.terminalWindow}>
-          {/* macOS-style window header */}
-          <View style={styles.windowHeader}>
-            <View style={styles.trafficLights}>
-              <View style={[styles.trafficLight, { backgroundColor: '#FF5F56' }]} />
-              <View style={[styles.trafficLight, { backgroundColor: '#FFBD2E' }]} />
-              <View style={[styles.trafficLight, { backgroundColor: '#8A93A5' }]} />
-            </View>
-            <Text style={styles.windowTitle}>bash — 80x24</Text>
-            <View style={styles.trafficLightsPlaceholder} />
-          </View>
-
-          <ScrollView style={styles.output} contentContainerStyle={styles.outputContent}>
-            <Text selectable style={styles.outputText}>
-              {output || 'Run a command to see output.'}
-            </Text>
-          </ScrollView>
-        </View>
-
-        {error ? <Text style={styles.errorText}>{error}</Text> : null}
-
-        <View style={styles.inputRow}>
-          <Text style={styles.prompt}>$</Text>
-          <TextInput
-            style={styles.input}
-            value={command}
-            onChangeText={setCommand}
-            keyboardAppearance="dark"
-            autoCapitalize="none"
-            autoCorrect={false}
-            returnKeyType="send"
-            onSubmitEditing={runCommand}
-            placeholder="command"
-            placeholderTextColor={colors.textMuted}
-          />
-          <Pressable
-            onPress={runCommand}
-            disabled={running || !command.trim()}
-            style={({ pressed }) => [
-              styles.runBtn,
-              pressed && styles.runBtnPressed,
-              running && styles.runBtnDisabled,
-            ]}
-          >
-            <Ionicons name={running ? 'pause' : 'play'} size={14} color={colors.white} />
-          </Pressable>
-        </View>
-      </KeyboardAvoidingView>
-    </SafeAreaView>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1, backgroundColor: '#000000' }, // Pure black context for terminal
-  header: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: spacing.sm,
-    paddingHorizontal: spacing.lg,
-    paddingVertical: spacing.md,
-    backgroundColor: colors.bgMain,
-  },
-  menuBtn: { padding: spacing.xs },
-  headerTitle: { ...typography.headline, color: colors.textPrimary },
-  body: { flex: 1, padding: spacing.md },
-  terminalWindow: {
-    flex: 1,
-    backgroundColor: '#1E1E1E', // standard dark term bg
-    borderRadius: radius.md,
-    borderWidth: StyleSheet.hairlineWidth,
-    borderColor: 'rgba(255,255,255,0.1)',
-    overflow: 'hidden',
-    boxShadow: '0px 10px 20px rgba(0, 0, 0, 0.5)',
-  },
-  windowHeader: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    paddingHorizontal: spacing.md,
-    paddingVertical: spacing.sm,
-    backgroundColor: '#323233',
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    borderBottomColor: '#111',
-  },
-  trafficLights: {
-    flexDirection: 'row',
-    gap: 6,
-    width: 50,
-  },
-  trafficLightsPlaceholder: {
-    width: 50,
-  },
-  trafficLight: {
-    width: 12,
-    height: 12,
-    borderRadius: 6,
-  },
-  windowTitle: {
-    ...typography.caption,
-    color: '#9E9E9E',
-    fontWeight: '600',
-  },
-  output: { flex: 1 },
-  outputContent: { padding: spacing.md },
-  outputText: {
-    ...typography.mono,
-    color: '#D4D7DF',
-    fontSize: 13,
-    lineHeight: 20,
-  },
-  errorText: {
-    ...typography.caption,
-    color: colors.error,
-    paddingHorizontal: spacing.lg,
-    paddingBottom: spacing.xs,
-  },
-  inputRow: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: spacing.sm,
-    paddingTop: spacing.md,
-    paddingBottom: Platform.OS === 'ios' ? spacing.xl : spacing.md,
-  },
-  prompt: { ...typography.mono, color: colors.textSecondary, fontWeight: '700' },
-  input: {
-    flex: 1,
-    ...typography.mono,
-    color: colors.textPrimary,
-    backgroundColor: '#1E1E1E',
-    borderWidth: StyleSheet.hairlineWidth,
-    borderColor: 'rgba(255,255,255,0.1)',
-    borderRadius: radius.md,
-    paddingHorizontal: spacing.md,
-    paddingVertical: 10,
-  },
-  runBtn: {
-    width: 30,
-    height: 30,
-    borderRadius: 15,
-    backgroundColor: colors.accent,
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  runBtnPressed: { backgroundColor: colors.accentPressed },
-  runBtnDisabled: { backgroundColor: colors.bgItem },
-});

package/apps/mobile/src/screens/TermsScreen.tsx

@@ -1,192 +0,0 @@
-import { Ionicons } from '@expo/vector-icons';
-import { useCallback, useState } from 'react';
-import {
-  Alert,
-  Linking,
-  Pressable,
-  ScrollView,
-  StyleSheet,
-  Text,
-  View
-} from 'react-native';
-import { BlurView } from 'expo-blur';
-import { LinearGradient } from 'expo-linear-gradient';
-import { SafeAreaView } from 'react-native-safe-area-context';
-
-import { colors, radius, spacing, typography } from '../theme';
-
-interface TermsScreenProps {
-  termsUrl: string | null;
-  onOpenDrawer: () => void;
-}
-
-export function TermsScreen({ termsUrl, onOpenDrawer }: TermsScreenProps) {
-  const [openingTerms, setOpeningTerms] = useState(false);
-
-  const openTerms = useCallback(async () => {
-    if (!termsUrl || openingTerms) {
-      return;
-    }
-
-    try {
-      setOpeningTerms(true);
-      const supported = await Linking.canOpenURL(termsUrl);
-      if (!supported) {
-        Alert.alert('Cannot open link', 'The terms URL is not supported on this device.');
-        return;
-      }
-      await Linking.openURL(termsUrl);
-    } catch {
-      Alert.alert('Could not open link', 'Please open the terms URL manually.');
-    } finally {
-      setOpeningTerms(false);
-    }
-  }, [openingTerms, termsUrl]);
-
-  return (
-    <View style={styles.container}>
-      <LinearGradient
-        colors={[colors.bgMain, colors.bgMain, colors.bgMain]}
-        style={StyleSheet.absoluteFill}
-      />
-      <SafeAreaView style={styles.safeArea}>
-        <BlurView intensity={80} tint="dark" style={styles.header}>
-          <Pressable onPress={onOpenDrawer} hitSlop={8} style={styles.menuBtn}>
-            <Ionicons name="menu" size={22} color={colors.textPrimary} />
-          </Pressable>
-          <Ionicons name="document-text" size={16} color={colors.textPrimary} />
-          <Text style={styles.headerTitle}>Terms</Text>
-        </BlurView>
-
-        <ScrollView style={styles.body} contentContainerStyle={styles.bodyContent}>
-          <Section title="Use Of Service">
-            This mobile app is a client for interacting with a user-owned host bridge and repository.
-            You are responsible for commands, commits, and approvals executed through your setup.
-          </Section>
-
-          <Section title="Account And Credentials">
-            You must keep bridge tokens and provider credentials confidential.
-            Do not share devices or hosts that have active bridge credentials without protection.
-          </Section>
-
-          <Section title="Acceptable Use">
-            You may not use this app to access systems you do not own or have explicit authorization
-            to control.
-          </Section>
-
-          <Section title="Operational Risk">
-            Terminal and Git actions can change files and repository history on your host.
-            Review commands and approvals before execution.
-          </Section>
-
-          <Section title="Availability And Changes">
-            Features may change over time. You are responsible for maintaining your local bridge
-            configuration and secure network setup.
-          </Section>
-
-          <Text style={styles.sectionLabel}>Official Terms</Text>
-          <BlurView intensity={50} tint="dark" style={styles.card}>
-            <Text style={styles.cardTitle}>Terms URL</Text>
-            <Text selectable style={styles.termsUrl}>
-              {termsUrl ?? 'Not configured. Set EXPO_PUBLIC_TERMS_OF_SERVICE_URL.'}
-            </Text>
-            <Pressable
-              disabled={!termsUrl || openingTerms}
-              onPress={() => void openTerms()}
-              style={({ pressed }) => [
-                styles.openBtn,
-                (!termsUrl || openingTerms) && styles.openBtnDisabled,
-                pressed && termsUrl && !openingTerms && styles.openBtnPressed
-              ]}
-            >
-              <Ionicons name="open-outline" size={16} color={colors.white} />
-              <Text style={styles.openBtnText}>
-                {openingTerms ? 'Opening...' : 'Open terms'}
-              </Text>
-            </Pressable>
-          </BlurView>
-        </ScrollView>
-      </SafeAreaView>
-    </View>
-  );
-}
-
-function Section({ title, children }: { title: string; children: string }) {
-  return (
-    <>
-      <Text style={styles.sectionLabel}>{title}</Text>
-      <BlurView intensity={50} tint="dark" style={styles.card}>
-        <Text style={styles.bodyText}>{children}</Text>
-      </BlurView>
-    </>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: { flex: 1, backgroundColor: colors.bgMain },
-  safeArea: { flex: 1 },
-  header: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: spacing.sm,
-    paddingHorizontal: spacing.lg,
-    paddingVertical: spacing.md,
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    borderBottomColor: colors.borderHighlight
-  },
-  menuBtn: { padding: spacing.xs },
-  headerTitle: { ...typography.headline, color: colors.textPrimary },
-  body: { flex: 1 },
-  bodyContent: { padding: spacing.lg, paddingBottom: spacing.xxl },
-  sectionLabel: {
-    ...typography.caption,
-    textTransform: 'uppercase',
-    letterSpacing: 0.8,
-    marginTop: spacing.sm,
-    marginBottom: spacing.sm,
-    color: colors.textMuted,
-    marginLeft: spacing.xs
-  },
-  card: {
-    borderRadius: radius.md,
-    borderWidth: StyleSheet.hairlineWidth,
-    borderColor: colors.borderHighlight,
-    padding: spacing.lg,
-    marginBottom: spacing.sm,
-    overflow: 'hidden'
-  },
-  bodyText: {
-    ...typography.body,
-    color: colors.textSecondary
-  },
-  cardTitle: {
-    ...typography.headline,
-    color: colors.textPrimary
-  },
-  termsUrl: {
-    ...typography.mono,
-    marginTop: spacing.sm,
-    color: colors.textMuted
-  },
-  openBtn: {
-    marginTop: spacing.md,
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'center',
-    gap: spacing.sm,
-    borderRadius: radius.md,
-    paddingVertical: spacing.md,
-    paddingHorizontal: spacing.md,
-    backgroundColor: colors.accent
-  },
-  openBtnPressed: {
-    backgroundColor: colors.accentPressed
-  },
-  openBtnDisabled: {
-    backgroundColor: colors.bgItem
-  },
-  openBtnText: {
-    ...typography.headline,
-    color: colors.white
-  }
-});

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

@@ -1,80 +0,0 @@
-import type { ChatSummary } from '../../api/types';
-import {
-  buildAgentThreadDisplayState,
-  getAgentThreadAccentColor,
-} from '../agentThreadDisplay';
-
-function chat(
-  id: string,
-  partial: Partial<ChatSummary> = {}
-): ChatSummary {
-  return {
-    id,
-    title: partial.title ?? id,
-    status: partial.status ?? 'idle',
-    createdAt: partial.createdAt ?? '2026-03-20T00:00:00.000Z',
-    updatedAt: partial.updatedAt ?? '2026-03-20T00:00:00.000Z',
-    statusUpdatedAt: partial.statusUpdatedAt ?? '2026-03-20T00:00:00.000Z',
-    lastMessagePreview: partial.lastMessagePreview ?? '',
-    cwd: partial.cwd,
-    modelProvider: partial.modelProvider,
-    sourceKind: partial.sourceKind,
-    parentThreadId: partial.parentThreadId,
-    subAgentDepth: partial.subAgentDepth,
-    lastError: partial.lastError,
-  };
-}
-
-describe('agentThreadDisplay', () => {
-  it('uses live runtime activity for running child threads', () => {
-    const display = buildAgentThreadDisplayState(
-      chat('thr_worker', { status: 'idle' }),
-      {
-        activity: {
-          tone: 'running',
-          title: 'Reasoning',
-          detail: 'Inspecting files',
-        },
-        runWatchdogUntil: Date.parse('2026-03-20T10:00:30.000Z'),
-      },
-      Date.parse('2026-03-20T10:00:00.000Z')
-    );
-
-    expect(display.label).toBe('Reasoning');
-    expect(display.detail).toBe('Inspecting files');
-    expect(display.tone).toBe('running');
-  });
-
-  it('shows pending approvals as active waiting state', () => {
-    const display = buildAgentThreadDisplayState(chat('thr_worker'), {
-      pendingApproval: { id: 'appr-1' },
-      activity: {
-        tone: 'running',
-        title: 'Working',
-      },
-    });
-
-    expect(display.label).toBe('Needs approval');
-    expect(display.tone).toBe('running');
-  });
-
-  it('falls back to error details from the chat summary', () => {
-    const display = buildAgentThreadDisplayState(
-      chat('thr_worker', {
-        status: 'error',
-        lastError: 'Command exited 1',
-      }),
-      null
-    );
-
-    expect(display.label).toBe('Error');
-    expect(display.detail).toBe('Command exited 1');
-    expect(display.tone).toBe('error');
-  });
-
-  it('assigns stable accent colors per thread id', () => {
-    expect(getAgentThreadAccentColor('thr_worker')).toBe(
-      getAgentThreadAccentColor('thr_worker')
-    );
-  });
-});

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

@@ -1,170 +0,0 @@
-import type { ChatSummary } from '../../api/types';
-import {
-  collectLiveAgentPanelThreadIds,
-  collectRelatedAgentThreads,
-  describeAgentThreadSource,
-  findMatchingAgentThread,
-} from '../agentThreads';
-
-function chat(
-  id: string,
-  partial: Partial<ChatSummary> = {}
-): ChatSummary {
-  return {
-    id,
-    title: partial.title ?? id,
-    status: partial.status ?? 'complete',
-    createdAt: partial.createdAt ?? '2026-03-20T00:00:00.000Z',
-    updatedAt: partial.updatedAt ?? '2026-03-20T00:00:00.000Z',
-    statusUpdatedAt: partial.statusUpdatedAt ?? '2026-03-20T00:00:00.000Z',
-    lastMessagePreview: partial.lastMessagePreview ?? '',
-    cwd: partial.cwd,
-    modelProvider: partial.modelProvider,
-    agentNickname: partial.agentNickname,
-    agentRole: partial.agentRole,
-    sourceKind: partial.sourceKind,
-    parentThreadId: partial.parentThreadId,
-    subAgentDepth: partial.subAgentDepth,
-    lastError: partial.lastError,
-  };
-}
-
-describe('agentThreads', () => {
-  it('collects the full related thread tree for a spawned sub-agent', () => {
-    const root = chat('thr_root', {
-      title: 'Main task',
-      sourceKind: 'appServer',
-      updatedAt: '2026-03-20T00:00:01.000Z',
-    });
-    const child = chat('thr_child', {
-      title: 'Worker one',
-      sourceKind: 'subAgentThreadSpawn',
-      parentThreadId: 'thr_root',
-      subAgentDepth: 1,
-      status: 'running',
-      updatedAt: '2026-03-20T00:00:03.000Z',
-    });
-    const grandchild = chat('thr_grandchild', {
-      title: 'Nested worker',
-      sourceKind: 'subAgentThreadSpawn',
-      parentThreadId: 'thr_child',
-      subAgentDepth: 2,
-      updatedAt: '2026-03-20T00:00:02.000Z',
-    });
-    const unrelated = chat('thr_other', {
-      title: 'Other thread',
-      sourceKind: 'appServer',
-      updatedAt: '2026-03-20T00:00:04.000Z',
-    });
-
-    const result = collectRelatedAgentThreads(
-      [root, child, grandchild, unrelated],
-      grandchild
-    );
-
-    expect(result.rootThreadId).toBe('thr_root');
-    expect(result.threads.map((entry) => entry.id)).toEqual([
-      'thr_root',
-      'thr_child',
-      'thr_grandchild',
-    ]);
-  });
-
-  it('keeps the full related sub-agent history for the agent selector', () => {
-    const root = chat('thr_root', {
-      title: 'Main task',
-      sourceKind: 'appServer',
-      updatedAt: '2026-03-18T00:00:00.000Z',
-    });
-    const recentChild = chat('thr_recent', {
-      title: 'Recent worker',
-      sourceKind: 'subAgentThreadSpawn',
-      parentThreadId: 'thr_root',
-      subAgentDepth: 1,
-      updatedAt: '2026-03-20T11:00:00.000Z',
-    });
-    const oldRunningChild = chat('thr_running', {
-      title: 'Running worker',
-      sourceKind: 'subAgentThreadSpawn',
-      parentThreadId: 'thr_root',
-      subAgentDepth: 1,
-      status: 'running',
-      updatedAt: '2026-03-17T00:00:00.000Z',
-    });
-    const oldFocusedChild = chat('thr_focused', {
-      title: 'Focused worker',
-      sourceKind: 'subAgentThreadSpawn',
-      parentThreadId: 'thr_root',
-      subAgentDepth: 1,
-      updatedAt: '2026-03-17T00:00:00.000Z',
-    });
-    const oldCompletedChild = chat('thr_old', {
-      title: 'Old worker',
-      sourceKind: 'subAgentThreadSpawn',
-      parentThreadId: 'thr_root',
-      subAgentDepth: 1,
-      updatedAt: '2026-03-16T00:00:00.000Z',
-    });
-
-    const result = collectRelatedAgentThreads(
-      [root, recentChild, oldRunningChild, oldFocusedChild, oldCompletedChild],
-      oldFocusedChild
-    );
-
-    expect(result.threads.map((entry) => entry.id)).toEqual([
-      'thr_root',
-      'thr_running',
-      'thr_recent',
-      'thr_focused',
-      'thr_old',
-    ]);
-  });
-
-  it('matches agent threads by id, title, or preview text', () => {
-    const root = chat('thr_root', { title: 'Main task' });
-    const child = chat('thr_child', {
-      title: 'Docs worker',
-      agentNickname: 'Atlas',
-      agentRole: 'explorer',
-      lastMessagePreview: 'OpenAI docs search',
-    });
-
-    expect(findMatchingAgentThread([root, child], 'thr_child')?.id).toBe('thr_child');
-    expect(findMatchingAgentThread([root, child], 'atlas')?.id).toBe('thr_child');
-    expect(findMatchingAgentThread([root, child], 'explorer')?.id).toBe('thr_child');
-    expect(findMatchingAgentThread([root, child], 'docs worker')?.id).toBe('thr_child');
-    expect(findMatchingAgentThread([root, child], 'docs search')?.id).toBe('thr_child');
-  });
-
-  it('describes root and sub-agent source kinds for the selector', () => {
-    const root = chat('thr_root', { sourceKind: 'appServer' });
-    const review = chat('thr_review', {
-      sourceKind: 'subAgentReview',
-      parentThreadId: 'thr_root',
-    });
-
-    expect(describeAgentThreadSource(root, 'thr_root')).toBe('Main thread');
-    expect(describeAgentThreadSource(review, 'thr_root')).toBe('Review agent');
-  });
-
-  it('includes the main thread in the live agent panel when sub-agents are active', () => {
-    expect(
-      collectLiveAgentPanelThreadIds([
-        { id: 'thr_root', isRootThread: true, isActive: false },
-        { id: 'thr_child_1', isRootThread: false, isActive: true },
-        { id: 'thr_child_2', isRootThread: false, isActive: true },
-        { id: 'thr_child_3', isRootThread: false, isActive: false },
-      ])
-    ).toEqual(['thr_root', 'thr_child_1', 'thr_child_2']);
-  });
-
-  it('keeps the live agent panel hidden when no sub-agent is active', () => {
-    expect(
-      collectLiveAgentPanelThreadIds([
-        { id: 'thr_root', isRootThread: true, isActive: true },
-        { id: 'thr_child_1', isRootThread: false, isActive: false },
-        { id: 'thr_child_2', isRootThread: false, isActive: false },
-      ])
-    ).toEqual([]);
-  });
-});