- Backend: maintain _step_number_cache in DataEngine and include step_number in all step_updated SSE events (summary, thinking, execution result) - Admin console: query unassigned trace step_ids in stepless_rows to prevent orphan traces from being lost - Showcase UI: implement dual-indexed entity deduplication (by step_id and step_number) in extractStepReplayFrames to eliminate phantom ghost steps - Showcase UI: filter visual screenshot steps before generating sequential 1-based frame numbers, preventing step-4 start and index shift bugs - Showcase UI: add rawStepNumber and summary properties to StepReplayFrame - Showcase UI: update FloatingVideoPlayerComponent session reset effect to only reset playback on sessionId change rather than on every stepFrames mutation - Showcase UI: add stepSeekRequest signal and stepIndex parameter to AgentService.openVideoPlayer - Unit tests: add Karma and Pytest unit tests verifying step 1 start, dual-indexing, and SSE step_number payloads
✨ Artemis Showcase & User Workspace UI
A modern, highly aesthetic presentation and interaction frontend built with Angular 19 and SCSS for showcasing the Artemis mobile autonomous agent.
🎨 Visual Design Highlights
- Aurora Glow Dynamics: Ambient background lighting with smooth gradients.
- Glassmorphism Aesthetic: Translucent frosted-glass panels with subtle borders.
- Real-time Dual-Pane Workspace:
- Left Pane (
app-agent-stream): Live streaming of Agent thought steps, plan breakdowns, tool actions, and status. - Right Pane (
app-chat-interface): Natural language chat input sidebar with interactive feedback and status pills.
- Left Pane (
🚀 How to Run
Prerequisites
- Node.js (>= 18)
- Backend API running on
http://localhost:8000(viaapps/admin_consoleorartemis ui)
Development Server
cd apps/showcase_ui
npm install
npm start
This runs ng serve --proxy-config proxy.conf.json on http://localhost:4200/.
Production Build
npm run build
Build artifacts will be emitted to dist/, which can be served statically by apps.admin_console or artemis ui.