clawdex-mobile 1.3.2 → 2.0.0

package/apps/mobile/package.json

@@ -1,12 +1,12 @@
 {
   "name": "clawdex-mobile",
-  "version": "0.1.0",
+  "version": "2.0.0",
   "private": true,
   "main": "index.js",
   "scripts": {
     "start": "expo start",
-    "ios": "expo start --ios",
-    "android": "expo start --android",
+    "ios": "expo run:ios",
+    "android": "expo run:android",
     "lint": "eslint App.tsx src --ext .ts,.tsx",
     "typecheck": "tsc --noEmit",
     "build": "expo export --platform all --output-dir dist",
@@ -14,36 +14,37 @@
     "test:watch": "jest --watch"
   },
   "dependencies": {
-    "@expo/metro-runtime": "6.1.2",
+    "@expo/metro-runtime": "~55.0.6",
     "@expo/vector-icons": "15.0.3",
-    "babel-preset-expo": "54.0.10",
-    "expo": "54.0.33",
-    "expo-blur": "15.0.8",
-    "expo-document-picker": "14.0.8",
-    "expo-file-system": "19.0.21",
-    "expo-image-picker": "17.0.10",
-    "expo-linear-gradient": "15.0.8",
-    "react": "19.1.0",
-    "react-dom": "19.1.0",
-    "react-native": "0.81.5",
-    "react-native-gesture-handler": "2.28.0",
+    "expo": "~55.0.3",
+    "expo-audio": "~55.0.8",
+    "expo-blur": "~55.0.8",
+    "expo-camera": "~55.0.9",
+    "expo-document-picker": "~55.0.8",
+    "expo-file-system": "~55.0.9",
+    "expo-image-picker": "~55.0.9",
+    "expo-linear-gradient": "~55.0.8",
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
+    "react-native": "0.83.2",
+    "react-native-gesture-handler": "~2.30.0",
     "react-native-markdown-display": "7.0.2",
-    "react-native-reanimated": "4.1.1",
+    "react-native-reanimated": "4.2.1",
     "react-native-safe-area-context": "5.6.2",
-    "react-native-screens": "4.16.0",
+    "react-native-screens": "~4.23.0",
     "react-native-web": "0.21.2",
-    "react-native-worklets": "0.5.1"
+    "react-native-worklets": "0.7.2"
   },
   "devDependencies": {
-    "@types/jest": "^30.0.0",
+    "@types/jest": "29.5.14",
     "@types/node": "^22.10.1",
-    "@types/react": "~19.1.10",
+    "@types/react": "~19.2.10",
     "@typescript-eslint/eslint-plugin": "^8.18.1",
     "@typescript-eslint/parser": "^8.18.1",
     "eslint": "^10.0.0",
     "globals": "^16.5.0",
     "jest": "^29.7.0",
-    "jest-expo": "54.0.17",
+    "jest-expo": "~55.0.9",
     "typescript": "~5.9.2"
   },
   "jest": {

package/apps/mobile/plugins/withAndroidCleartextTraffic.js

@@ -0,0 +1,14 @@
+const { AndroidConfig, withAndroidManifest } = require('@expo/config-plugins');
+
+function withAndroidCleartextTraffic(config) {
+  return withAndroidManifest(config, (modConfig) => {
+    const mainApplication = AndroidConfig.Manifest.getMainApplicationOrThrow(
+      modConfig.modResults
+    );
+
+    mainApplication.$['android:usesCleartextTraffic'] = 'true';
+    return modConfig;
+  });
+}
+
+module.exports = withAndroidCleartextTraffic;

package/apps/mobile/src/api/__tests__/ws.test.ts

@@ -74,18 +74,30 @@ describe('HostBridgeWsClient', () => {
     });
   });
 
-  it('supports web query token auth fallback when enabled', () => {
-    if (Platform.OS !== 'web') {
-      return;
-    }
-
+  it('supports query token auth fallback when enabled', () => {
     const client = new HostBridgeWsClient('http://localhost:8787', {
       authToken: 'token-xyz',
       allowQueryTokenAuth: true,
     });
     client.connect();
 
-    expect(global.WebSocket).toHaveBeenCalledWith('ws://localhost:8787/rpc?token=token-xyz');
+    if (Platform.OS === 'web') {
+      expect(global.WebSocket).toHaveBeenCalledWith('ws://localhost:8787/rpc?token=token-xyz');
+      return;
+    }
+
+    if (Platform.OS === 'android') {
+      expect(global.WebSocket).toHaveBeenCalledWith('ws://localhost:8787/rpc?token=token-xyz');
+      return;
+    }
+
+    expect(global.WebSocket).toHaveBeenCalledWith(
+      'ws://localhost:8787/rpc?token=token-xyz',
+      undefined,
+      {
+        headers: { Authorization: 'Bearer token-xyz' },
+      }
+    );
   });
 
   it('onEvent emits rpc notifications', () => {
@@ -222,6 +234,32 @@ describe('HostBridgeWsClient', () => {
     await expect(waitPromise).resolves.toBeUndefined();
   });
 
+  it('waitForTurnCompletion resolves from codex event using source parent_thread_id', async () => {
+    const client = new HostBridgeWsClient('http://localhost:8787');
+    client.connect();
+
+    const waitPromise = client.waitForTurnCompletion('thr_5', 'turn_5', 100);
+    latestMockSocket().simulateMessage(
+      JSON.stringify({
+        method: 'codex/event/task_complete',
+        params: {
+          msg: {
+            type: 'task_complete',
+            source: {
+              subagent: {
+                thread_spawn: {
+                  parent_thread_id: 'thr_5',
+                },
+              },
+            },
+          },
+        },
+      })
+    );
+
+    await expect(waitPromise).resolves.toBeUndefined();
+  });
+
   it('deduplicates notifications by eventId', () => {
     const client = new HostBridgeWsClient('http://localhost:8787');
     const listener = jest.fn();

package/apps/mobile/src/api/chatMapping.ts

@@ -82,15 +82,32 @@ function unixSecondsToIso(value: number | undefined): string {
   return new Date(value * 1000).toISOString();
 }
 
+function normalizeLifecycleStatus(value: string | null | undefined): string | null {
+  if (!value) {
+    return null;
+  }
+
+  const normalized = value.trim().toLowerCase().replace(/[^a-z0-9]/g, '');
+  return normalized.length > 0 ? normalized : null;
+}
+
 function mapRawStatus(status: unknown, turns: RawTurn[] | undefined): ChatStatus {
   const statusRecord = toRecord(status);
-  const statusType = readString(statusRecord?.type) ?? readString(status);
+  const statusType = normalizeLifecycleStatus(
+    readString(statusRecord?.type) ?? readString(status)
+  );
   const hasTurns = Array.isArray(turns) && turns.length > 0;
   const lastTurn = hasTurns ? turns[turns.length - 1] : null;
-  const lastTurnStatus = readString(lastTurn?.status);
-  const isIdleLikeStatus = statusType === 'idle' || statusType === 'notLoaded';
-
-  if (lastTurnStatus === 'inProgress') {
+  const lastTurnStatus = normalizeLifecycleStatus(readString(lastTurn?.status));
+  const isIdleLikeStatus = statusType === 'idle' || statusType === 'notloaded';
+
+  if (
+    lastTurnStatus === 'inprogress' ||
+    lastTurnStatus === 'running' ||
+    lastTurnStatus === 'active' ||
+    lastTurnStatus === 'queued' ||
+    lastTurnStatus === 'pending'
+  ) {
     // Some thread/read payloads can return stale turn state while the thread
     // itself is already idle/notLoaded. Prefer the thread lifecycle in that case.
     if (isIdleLikeStatus) {
@@ -99,18 +116,41 @@ function mapRawStatus(status: unknown, turns: RawTurn[] | undefined): ChatStatus
     return 'running';
   }
 
-  if (lastTurnStatus === 'failed' || lastTurnStatus === 'interrupted') {
+  if (
+    lastTurnStatus === 'failed' ||
+    lastTurnStatus === 'interrupted' ||
+    lastTurnStatus === 'error' ||
+    lastTurnStatus === 'aborted'
+  ) {
     return 'error';
   }
 
-  if (lastTurnStatus === 'completed') {
+  if (
+    lastTurnStatus === 'completed' ||
+    lastTurnStatus === 'complete' ||
+    lastTurnStatus === 'success' ||
+    lastTurnStatus === 'succeeded'
+  ) {
     return 'complete';
   }
 
-  if (statusType === 'systemError') {
+  if (
+    statusType === 'systemerror' ||
+    statusType === 'error' ||
+    statusType === 'failed'
+  ) {
     return 'error';
   }
 
+  if (
+    statusType === 'running' ||
+    statusType === 'inprogress' ||
+    statusType === 'queued' ||
+    statusType === 'pending'
+  ) {
+    return 'running';
+  }
+
   if (statusType === 'active') {
     // Some backends keep a thread "active" while loaded in memory even when no
     // turn is running. If there is no in-progress turn, avoid false "working" UI.

package/apps/mobile/src/api/client.ts

@@ -32,6 +32,8 @@ import type {
   LocalImageInput,
   UploadAttachmentRequest,
   UploadAttachmentResponse,
+  VoiceTranscribeRequest,
+  VoiceTranscribeResponse,
   ModelOption,
   ReasoningEffort,
   ModelReasoningEffortOption,
@@ -477,6 +479,10 @@ export class HostBridgeApiClient {
     return this.ws.request<UploadAttachmentResponse>('bridge/attachments/upload', body);
   }
 
+  transcribeVoice(body: VoiceTranscribeRequest): Promise<VoiceTranscribeResponse> {
+    return this.ws.request<VoiceTranscribeResponse>('bridge/voice/transcribe', body);
+  }
+
   async listModels(includeHidden = false): Promise<ModelOption[]> {
     const response = await this.ws.request<AppServerModelListResponse>('model/list', {
       cursor: null,

package/apps/mobile/src/api/types.ts

@@ -310,6 +310,17 @@ export interface RunEvent {
   detail?: string;
 }
 
+export interface VoiceTranscribeRequest {
+  dataBase64: string;
+  prompt?: string;
+  fileName?: string;
+  mimeType?: string;
+}
+
+export interface VoiceTranscribeResponse {
+  text: string;
+}
+
 export interface RpcNotification {
   method: string;
   params: Record<string, unknown> | null;

package/apps/mobile/src/api/ws.ts

@@ -311,8 +311,12 @@ export class HostBridgeWsClient {
       await new Promise<void>((resolve, reject) => {
         const WebSocketCtor = globalThis.WebSocket as unknown as ReactNativeWebSocketConstructor;
         const socketUrl = this.socketUrl();
+        const shouldUseHeaderAuth =
+          Boolean(this.authToken) &&
+          Platform.OS !== 'web' &&
+          !(Platform.OS === 'android' && this.allowQueryTokenAuth);
         const socket =
-          this.authToken && Platform.OS !== 'web'
+          shouldUseHeaderAuth
             ? new WebSocketCtor(socketUrl, undefined, {
                 headers: {
                   Authorization: `Bearer ${this.authToken}`,
@@ -640,7 +644,7 @@ export class HostBridgeWsClient {
       : this.baseUrl.replace('http://', 'ws://');
     const base = `${wsBase}/rpc`;
 
-    if (!this.authToken || Platform.OS !== 'web' || !this.allowQueryTokenAuth) {
+    if (!this.authToken || !this.allowQueryTokenAuth) {
       return base;
     }
 
@@ -690,8 +694,8 @@ function toTurnCompletionSnapshot(value: unknown): TurnCompletionSnapshot | null
     return null;
   }
 
-  const threadId = readString(params.threadId) ?? readString(params.thread_id);
   const turn = toRecord(params.turn);
+  const threadId = extractNotificationThreadId(params, turn);
   const turnId =
     readString(turn?.id) ?? readString(params.turnId) ?? readString(params.turn_id);
   if (!threadId) {
@@ -752,13 +756,7 @@ function toCodexEventSnapshot(
     return null;
   }
 
-  const threadId =
-    readString(msg?.thread_id) ??
-    readString(msg?.threadId) ??
-    readString(params?.threadId) ??
-    readString(params?.thread_id) ??
-    readString(params?.conversationId) ??
-    readString(msg?.conversation_id);
+  const threadId = extractNotificationThreadId(params, msg);
 
   return {
     type,
@@ -766,6 +764,50 @@ function toCodexEventSnapshot(
   };
 }
 
+function extractNotificationThreadId(
+  params: Record<string, unknown> | null,
+  msgArg?: Record<string, unknown> | null
+): string | null {
+  if (!params && !msgArg) {
+    return null;
+  }
+
+  const msg = msgArg ?? toRecord(params?.msg);
+  const threadRecord =
+    toRecord(params?.thread) ??
+    toRecord(params?.threadState) ??
+    toRecord(params?.thread_state) ??
+    toRecord(msg?.thread);
+  const sourceRecord = toRecord(params?.source) ?? toRecord(msg?.source);
+  const subagentThreadSpawnRecord = toRecord(
+    toRecord(sourceRecord?.subagent)?.thread_spawn
+  );
+
+  return (
+    readString(msg?.thread_id) ??
+    readString(msg?.threadId) ??
+    readString(msg?.conversation_id) ??
+    readString(msg?.conversationId) ??
+    readString(params?.thread_id) ??
+    readString(params?.threadId) ??
+    readString(params?.conversation_id) ??
+    readString(params?.conversationId) ??
+    readString(threadRecord?.id) ??
+    readString(threadRecord?.thread_id) ??
+    readString(threadRecord?.threadId) ??
+    readString(threadRecord?.conversation_id) ??
+    readString(threadRecord?.conversationId) ??
+    readString(sourceRecord?.thread_id) ??
+    readString(sourceRecord?.threadId) ??
+    readString(sourceRecord?.conversation_id) ??
+    readString(sourceRecord?.conversationId) ??
+    readString(sourceRecord?.parent_thread_id) ??
+    readString(sourceRecord?.parentThreadId) ??
+    readString(subagentThreadSpawnRecord?.parent_thread_id) ??
+    null
+  );
+}
+
 function normalizeCodexEventType(value: string | null): string | null {
   if (!value) {
     return null;

package/apps/mobile/src/bridgeUrl.ts

@@ -0,0 +1,105 @@
+const SUPPORTED_PROTOCOLS = new Set(['http:', 'https:', 'ws:', 'wss:']);
+
+export function normalizeBridgeUrlInput(value: string): string | null {
+  if (typeof value !== 'string') {
+    return null;
+  }
+
+  const trimmed = value.trim();
+  if (!trimmed) {
+    return null;
+  }
+
+  let parsed: URL;
+  try {
+    parsed = new URL(trimmed);
+  } catch {
+    return null;
+  }
+
+  if (!SUPPORTED_PROTOCOLS.has(parsed.protocol)) {
+    return null;
+  }
+
+  if (!parsed.hostname || parsed.username || parsed.password) {
+    return null;
+  }
+
+  const normalizedProtocol =
+    parsed.protocol === 'ws:' ? 'http:' : parsed.protocol === 'wss:' ? 'https:' : parsed.protocol;
+  const normalizedPath = parsed.pathname.replace(/\/+$/, '');
+
+  parsed.protocol = normalizedProtocol;
+  parsed.pathname = normalizedPath || '';
+  parsed.search = '';
+  parsed.hash = '';
+  parsed.username = '';
+  parsed.password = '';
+
+  return parsed.toString().replace(/\/$/, '');
+}
+
+export function isInsecureRemoteUrl(url: string): boolean {
+  try {
+    const parsed = new URL(url);
+    if (parsed.protocol !== 'http:') {
+      return false;
+    }
+
+    return !isLikelyPrivateHost(parsed.hostname);
+  } catch {
+    return false;
+  }
+}
+
+export function toBridgeHealthUrl(baseUrl: string): string {
+  return `${baseUrl.replace(/\/$/, '')}/health`;
+}
+
+function isLikelyPrivateHost(hostname: string): boolean {
+  const normalized = hostname.trim().toLowerCase();
+  const host =
+    normalized.startsWith('[') && normalized.endsWith(']')
+      ? normalized.slice(1, -1)
+      : normalized;
+  if (!host) {
+    return false;
+  }
+
+  if (
+    host === 'localhost' ||
+    host === '127.0.0.1' ||
+    host === '::1' ||
+    host.endsWith('.local')
+  ) {
+    return true;
+  }
+
+  if (host.includes(':')) {
+    return (
+      host.startsWith('fc') ||
+      host.startsWith('fd') ||
+      host.startsWith('fe80:')
+    );
+  }
+
+  const octets = host.split('.');
+  if (octets.length !== 4) {
+    return false;
+  }
+
+  const [firstStr, secondStr] = octets;
+  const first = Number.parseInt(firstStr, 10);
+  const second = Number.parseInt(secondStr, 10);
+  if (!Number.isInteger(first) || !Number.isInteger(second)) {
+    return false;
+  }
+
+  return (
+    first === 10 ||
+    (first === 172 && second >= 16 && second <= 31) ||
+    (first === 192 && second === 168) ||
+    (first === 169 && second === 254) ||
+    (first === 100 && second >= 64 && second <= 127)
+  );
+}

package/apps/mobile/src/components/ActivityBar.tsx

@@ -1,6 +1,7 @@
 import { Ionicons } from '@expo/vector-icons';
+import { BlurView } from 'expo-blur';
 import { useEffect, useState } from 'react';
-import { ActivityIndicator, StyleSheet, Text, View } from 'react-native';
+import { ActivityIndicator, Platform, StyleSheet, Text, View } from 'react-native';
 
 import { colors, spacing, typography } from '../theme';
 
@@ -46,29 +47,47 @@ export function ActivityBar({ title, detail, tone }: ActivityBarProps) {
   const text = `${title}${suffix}${dots}`;
 
   return (
-    <View style={styles.container}>
-      {tone === 'running' ? (
-        <ActivityIndicator size="small" color={color} />
-      ) : (
-        <Ionicons name={ICON_BY_TONE[tone]} size={14} color={color} />
-      )}
-      <Text style={styles.text} numberOfLines={1}>
-        {text}
-      </Text>
-    </View>
+    <BlurView
+      intensity={42}
+      tint={Platform.OS === 'ios' ? 'systemUltraThinMaterialDark' : 'dark'}
+      blurMethod="dimezisBlurViewSdk31Plus"
+      style={styles.container}
+    >
+      <View style={styles.content}>
+        {tone === 'running' ? (
+          <ActivityIndicator size="small" color={color} />
+        ) : (
+          <Ionicons name={ICON_BY_TONE[tone]} size={13} color={color} />
+        )}
+        <Text style={styles.text} numberOfLines={1}>
+          {text}
+        </Text>
+      </View>
+    </BlurView>
   );
 }
 
 const styles = StyleSheet.create({
   container: {
+    borderRadius: 10,
+    overflow: 'hidden',
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: 'rgba(255, 255, 255, 0.12)',
+    backgroundColor: 'rgba(18, 22, 28, 0.16)',
+    marginHorizontal: spacing.lg,
+    marginBottom: spacing.xs / 2,
+  },
+  content: {
     flexDirection: 'row',
     alignItems: 'center',
     gap: spacing.xs,
-    marginHorizontal: spacing.lg,
-    paddingVertical: spacing.xs,
+    paddingHorizontal: spacing.sm + 2,
+    paddingVertical: 3,
   },
   text: {
     ...typography.caption,
+    fontSize: 11,
+    lineHeight: 15,
     fontWeight: '600',
     color: colors.textPrimary,
     flex: 1,

package/apps/mobile/src/components/ChatHeader.tsx

@@ -1,5 +1,6 @@
 import { Ionicons } from '@expo/vector-icons';
-import { Pressable, SafeAreaView, StyleSheet, Text, View } from 'react-native';
+import { Pressable, StyleSheet, Text, View } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
 import { BrandMark } from './BrandMark';
 import { colors, spacing, typography } from '../theme';
 
@@ -22,7 +23,7 @@ export function ChatHeader({
 
   return (
     <View style={styles.headerContainer}>
-      <SafeAreaView>
+      <SafeAreaView edges={['top', 'left', 'right']}>
         <View style={styles.header}>
           <Pressable onPress={onOpenDrawer} hitSlop={8} style={styles.menuBtn}>
             <Ionicons name="menu" size={22} color={colors.textPrimary} />