Skip to content

Add realtime server monitoring page#8

Open
Derrickkoko1234 wants to merge 1 commit into
xt42io:mainfrom
Derrickkoko1234:feat/server-monitoring
Open

Add realtime server monitoring page#8
Derrickkoko1234 wants to merge 1 commit into
xt42io:mainfrom
Derrickkoko1234:feat/server-monitoring

Conversation

@Derrickkoko1234

@Derrickkoko1234 Derrickkoko1234 commented Jun 15, 2026

Copy link
Copy Markdown
Contributor

Summary

Adds a realtime server monitoring view to Aeroplane, modeled on Dokploy/Coolify's monitoring dashboards. It shows live usage of the machine running Aeroplane.

Reachable from a new owner-only Monitoring link in the projects header (/monitoring).

What it tracks

  • CPU Usage — sampled CPU % across cores
  • Memory Usage — used / total
  • Disk Space — root filesystem via df
  • Docker Disk Usage — images / containers / volumes / build cache via docker system df (donut chart)
  • Block I/O — aggregated container read/write via docker stats
  • Network I/O — aggregated container in/out via docker stats

Implementation

  • src/server/monitoring.tscollectMonitoringSnapshot() gathers all metrics with safe parsing/fallbacks (returns zeros/null when Docker or df is unavailable).
  • src/server/index.ts — owner-only endpoints:
    • GET /api/system/monitoring — one-shot snapshot
    • GET /api/system/monitoring/stream — SSE, pushes a fresh snapshot every 2s (mirrors the existing deployment/runtime log-stream pattern, with abort cleanup)
  • src/client/pages/monitoring-page.tsx + src/client/routes/monitoring.tsx — consumes the SSE stream and renders live SVG sparklines, usage meters, and a Docker-usage donut. Block/Network I/O are charted as per-interval deltas since the docker values are cumulative. No new dependencies — charts are hand-rolled SVG to match the existing dark zinc/mono theme.
  • src/client/api.tsMonitoringSnapshot type + api.monitoring().

Testing

  • npm run typecheck passes
  • vite build passes

🤖 Generated with Claude Code


Summary by cubic

Adds a real-time, owner-only Monitoring page that streams server metrics via SSE and visualizes them with live charts. This gives owners quick visibility into the Aeroplane host’s CPU, memory, disk, Docker usage, and container I/O.

  • New Features
    • Owner-only Monitoring page at "/monitoring" with a new header link from Projects.
    • Endpoints: GET "/api/system/monitoring" (snapshot) and GET "/api/system/monitoring/stream" (SSE every 2s).
    • Metrics: CPU %/cores, memory used/total, root disk used/total, Docker disk breakdown (images/containers/volumes/build cache), aggregated container Block I/O and Network I/O (charted as per-interval deltas).
    • Safe fallbacks when "docker" or "df" are unavailable (returns zeros/null); owner access enforced.
    • UI uses lightweight SVG sparklines/meters and a donut chart; no new dependencies.

Written for commit d1cedd8. Summary will update on new commits.

Review in cubic

Add a live monitoring view for the server running Aeroplane, modeled on
Dokploy/Coolify. A new owner-only SSE endpoint streams a snapshot every
2s with CPU usage, memory, disk, Docker disk breakdown, and aggregated
container block/network I/O. The Monitoring page renders these as live
SVG sparklines, meters, and a Docker usage donut, reachable from a new
header link on the projects page.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant