Introduces the full-featured, modern Angular 19 web dashboard for ARTEMIS. Provides real-time multimodal agent stream visualization, live device feeds, interactive step inspection, task queue management, and model telemetry. Key Features & UI Architecture: - Workspace & Layout: * Split-pane responsive layout with draggable resizer bar for execution stream and chat/task panel. * Standalone Angular components powered by Signals and reactive computed state. - Real-Time Multimodal Agent Stream: * SSE connection (/api/stream/:session_id) for live streaming of thoughts, actions, and tool calls. * Hierarchical phase grouping (Planning -> Execution -> Verification -> Summary). * Interactive step viewer with before/after screenshot overlays, coordinate pins, bounding boxes, and OCR text highlights. * Live planning loader, error diagnostics banner, retry status indicator, and token usage metrics. - Task Queue & Chat Interface: * Goal submission with instant dispatch to backend runner (/api/run). * Active task queue tracker (running, pending queue in FIFO order, completed/failed historical sessions). * Session switcher with model info badges and Markdown notes viewer (e.g. task_plan.md). - Floating Video Player & Live Stream: * Draggable, floating video player overlay for reviewing session recordings and live device feeds (/api/stream/device-live). * Playback controls: play/pause, seek scrubber, speed multipliers (0.5x - 4.0x), looping, and theater mode. - Formatting & Parsing Utilities: * Android UI action formatter (tap, type, swipe, drag, keyevent, app launch). * Tool call formatter for ADB commands, note management, video inspection, and failure recovery. * Markdown parsing and milestone checklist rendering.
40 lines
1.0 KiB
JSON
40 lines
1.0 KiB
JSON
{
|
|
"name": "latte-showcase-ui",
|
|
"version": "1.0.0",
|
|
|
|
"scripts": {
|
|
"ng": "ng",
|
|
"start": "ng serve --proxy-config proxy.conf.json",
|
|
"build": "ng build",
|
|
"watch": "ng build --watch --configuration development",
|
|
"test": "ng test"
|
|
},
|
|
"private": true,
|
|
"dependencies": {
|
|
"@angular/common": "^19.2.0",
|
|
"@angular/compiler": "^19.2.0",
|
|
"@angular/core": "^19.2.0",
|
|
"@angular/forms": "^19.2.0",
|
|
"@angular/platform-browser": "^19.2.0",
|
|
"@angular/platform-browser-dynamic": "^19.2.0",
|
|
"@angular/router": "^19.2.0",
|
|
"node": "^26.5.1",
|
|
"rxjs": "~7.8.0",
|
|
"tslib": "^2.3.0",
|
|
"zone.js": "~0.15.0"
|
|
},
|
|
"devDependencies": {
|
|
"@angular-devkit/build-angular": "^19.2.27",
|
|
"@angular/cli": "^19.2.27",
|
|
"@angular/compiler-cli": "^19.2.0",
|
|
"@types/jasmine": "~5.1.0",
|
|
"jasmine-core": "~5.6.0",
|
|
"karma": "~6.4.0",
|
|
"karma-chrome-launcher": "~3.2.0",
|
|
"karma-coverage": "~2.2.0",
|
|
"karma-jasmine": "~5.1.0",
|
|
"karma-jasmine-html-reporter": "~2.1.0",
|
|
"typescript": "~5.7.2"
|
|
}
|
|
}
|