Task #42 — Timmy Harness: Expo Mobile App ## What was built - New Expo artifact at artifacts/mobile, slug `mobile`, preview path `/mobile/` - Three-tab bottom navigation (Face, Matrix, Feed) — NativeTabs with liquid glass on iOS 26+ - Dark wizard theme (#0A0A12 background, #7C3AED accent) ## WebSocket context (context/TimmyContext.tsx) - Full WebSocket connection to /api/ws with exponential backoff reconnect (1s→30s cap) - Sends visitor_enter handshake on connect, handles ping/pong - Derives timmyMood from agent_state events (idle/thinking/working/speaking) - recentEvents list capped at 100 - sendVisitorMessage() sets mood to "thinking" immediately on send (deterministic waiting state) - speaking mood auto-reverts after estimated TTS duration ## Face tab (app/(tabs)/index.tsx) - Animated 2D wizard face via react-native-svg (hat, head, beard, eyes, pupils, mouth arc, magic orb) - AnimatedPupils: pupilScaleAnim drives actual rendered pupil Circle radius (BASE_PUPIL_R * scale) - AnimatedEyelids: eyeScaleYAnim drives top eyelid overlay via Animated.Value listener - AnimatedMouth: smileAnim + mouthOscAnim combined; SVG Path rebuilt on each frame via listener - speaking mood: 1Hz mouth oscillation via Animated.loop; per-mood body bob speed/amplitude - @react-native-voice/voice installed and statically imported; Voice.onSpeechResults wired properly - startMicPulse/stopMicPulse declared before native voice useEffect (correct hook order) - Web Speech API typed with SpeechRecognitionWindow local interface (zero `any` casts) - sendVisitorMessage() called on final transcript (also triggers thinking mood immediately) - expo-speech TTS speaks Timmy's chat replies on native ## Matrix tab (app/(tabs)/matrix.tsx) - URL normalization: strips existing protocol, uses http for localhost, https for all other hosts - Full-screen WebView with loading spinner and error/retry state; iframe fallback for web ## Feed tab (app/(tabs)/feed.tsx) - FlatList<WsEvent> with proper generics; EventConfig discriminated union (Feather|MaterialCommunityIcons) - Icon names typed via React.ComponentProps["name"] (no `any`) - Color-coded events; event count in header; empty state with connection-aware message ## Type safety - TypeScript typecheck passes with 0 errors - No `any` casts anywhere in new code ## Deviations - expo-av removed (not used; voice input handled via @react-native-voice/voice + Web Speech API) - expo-speech/expo-av NOT in app.json plugins (no config plugins — causes PluginError if listed) - app.json extra.apiDomain added for env-driven domain configuration per requirement - expo-speech pinned ~14.0.8, react-native-webview 13.15.0 for Expo SDK 54 compat - artifact.toml ensurePreviewReachable removed (Expo uses expo-domain router) - @react-native-voice/voice works in Expo Go Android; iOS needs native build (graceful fallback) Replit-Task-Id: 0748cbbf-7b84-4149-8fc0-9d697287a0e6
36 lines
814 B
TypeScript
36 lines
814 B
TypeScript
const ACCENT = "#7C3AED";
|
|
const ACCENT_GLOW = "#A78BFA";
|
|
const MATRIX_GREEN = "#00FF41";
|
|
|
|
export const Colors = {
|
|
dark: {
|
|
background: "#0A0A12",
|
|
surface: "#12121E",
|
|
surfaceElevated: "#1A1A2E",
|
|
border: "#2A2A44",
|
|
text: "#F0EEFF",
|
|
textSecondary: "#8B87A8",
|
|
textMuted: "#4B4868",
|
|
accent: ACCENT,
|
|
accentGlow: ACCENT_GLOW,
|
|
matrixGreen: MATRIX_GREEN,
|
|
tabBar: "transparent",
|
|
tabBarBorder: "#1E1E35",
|
|
tint: ACCENT,
|
|
tabIconDefault: "#4B4868",
|
|
tabIconSelected: ACCENT_GLOW,
|
|
jobStarted: "#F59E0B",
|
|
jobCompleted: "#10B981",
|
|
chat: "#22D3EE",
|
|
agentState: "#6B7280",
|
|
error: "#EF4444",
|
|
speaking: "#7C3AED",
|
|
thinking: "#3B82F6",
|
|
working: "#F59E0B",
|
|
idle: "#6B7280",
|
|
micActive: "#EF4444",
|
|
},
|
|
} as const;
|
|
|
|
export default Colors;
|