Codex implemented a portal/context architecture to eliminate layout jank:
- Created FooterControlsProvider context with register/unregister methods
- GlobalFooter now reserves fixed height (88px + insets) for all modes
- Both AgentInputArea and RealtimeControls stack absolutely in same space
- Single shared Reanimated value drives cross-fade (250ms)
- Agent screen registers controls via context instead of rendering inline
- Content padding adjusted to account for footer height
- Borders and safe area moved to shared container
- AgentInputArea simplified to pure component (no internal animations)
This guarantees:
- No layout shifts during transitions
- Smooth cross-fade between control modes
- No gaps or double borders
- Both controls never occupy layout space simultaneously
Implementation by OpenAI Codex per architectural recommendation.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
AgentInputArea was still taking up 88px height when opacity was 0, creating
a gap between status bar and realtime controls. Now switches to position
absolute when hidden (opacity < 0.5) to remove from layout flow completely.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Keep AgentInputArea always mounted, animate opacity (0→1 / 1→0) instead of unmounting
- Use controlled opacity animation for GlobalFooter's RealtimeControls on agent screen
- Both controls fade in/out over 250ms, synchronized for smooth cross-fade
- Disable pointer events on hidden controls to prevent interaction issues
- Keep FadeIn/FadeOut behavior on non-agent screens (home, orchestrator) unchanged
This eliminates the layout "push" effect where GlobalFooter would take up space
while fading in, causing visible jank. Now both controls overlay and cross-fade
smoothly without affecting layout.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add AgentStatusBar back to agent screen layout above controls
- Remove duplicate mode badge from AgentInputArea (now only in status bar)
- Simplify AgentInputArea to horizontal layout matching RealtimeControls
- Set both controls to height: 88 for consistent sizing
- Remove conditional rendering that caused component to unmount
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Lazy initialize audio (on-demand instead of mount) in both player and Speechmatics hooks
- Add audio session teardown on stop for proper cleanup
- Implement agent audio recording with sendAgentAudio in AgentInputArea
- Fix Android navigation race condition in CreateAgentModal (navigate before closing)
- Add animations to global footer and agent screen (FadeIn/FadeOut)
- Auto-cancel stuck agents when sending new messages
- Fix permission request ID propagation from AgentManager to Session
- Apply theme background color via AppContainer wrapper
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Mohamed Boudra