1c0a7cb850
Phase 4 — New Widget Types: - Clock/Weather, System Stats, RSS/Feed, Calendar, Markdown, Metric/Counter, Link Group, Camera/Stream widgets - Backend services with caching for each data source - Full creation form with dynamic config fields per type Phase 5 — Visual & Styling Enhancements: - Glassmorphism card style (solid/glass/outline) - Board-level themes with per-board hue/saturation - Animated SVG status rings replacing static dots - Card size options (compact/medium/large) - Custom CSS injection (admin + per-board, sanitized) - Wallpaper backgrounds with blur/overlay/parallax Phase 6 — Functional Features: - Favorites bar with drag-and-drop reordering - Recent apps tracking with privacy toggle - Uptime dashboard page (/status, guest-accessible) - Notifications system (Discord/Slack/Telegram/HTTP webhooks) - App tags with filtering in board view - Multi-URL app cards with expandable sub-links - Personal API tokens with scoped permissions - Audit log with retention and admin viewer Phase 7 — Quality of Life: - Onboarding wizard (5-step first-launch setup) - App URL health preview with favicon/title detection - Board templates (4 built-in + custom import/export) - Keyboard shortcut overlay (j/k nav, 1-9 boards, ? help) 212 files changed, 15641 insertions, 980 deletions. Build, lint, type check, and 222 tests all pass.
4.3 KiB
4.3 KiB
Phase 4: App Registry & Healthcheck
Status: ✅ Complete Parent plan: PLAN.md Domain: fullstack
Objective
Build the app (service) registry with CRUD operations, the icon resolution system, healthcheck scheduler with node-cron, and status APIs. Create the app management UI.
Tasks
- Task 1: Create
src/routes/api/apps/+server.ts— GET (list), POST (create) - Task 2: Create
src/routes/api/apps/[id]/+server.ts— GET, PATCH, DELETE - Task 3: Create
src/routes/api/apps/[id]/status/+server.ts— GET healthcheck status - Task 4: Implement
src/lib/server/services/healthcheckService.ts— perform HTTP health checks - Task 5: Implement
src/lib/server/jobs/healthcheckScheduler.ts— node-cron scheduled pings - Task 6: Implement
src/lib/server/utils/iconResolver.ts— resolve icon by type (Lucide, Simple Icons, Dashboard Icons CDN, upload path) - Task 7: Create
src/routes/apps/+page.server.ts— load app list - Task 8: Create
src/routes/apps/+page.svelte— app registry list page - Task 9: Create
src/lib/components/app/AppCard.svelte— app card with status indicator - Task 10: Create
src/lib/components/app/AppForm.svelte— create/edit app form (Superforms) - Task 11: Create
src/lib/components/app/AppIconPicker.svelte— icon selection UI - Task 12: Create
src/lib/components/app/AppHealthBadge.svelte— status badge (online/offline/degraded/unknown) - Task 13: Create
src/routes/api/health/+server.ts— app health endpoint for Docker healthcheck - Task 14: Handle custom icon uploads — file upload endpoint + static serving from
static/uploads/
Files to Modify/Create
src/routes/api/apps/+server.tssrc/routes/api/apps/[id]/+server.tssrc/routes/api/apps/[id]/status/+server.tssrc/routes/api/health/+server.tssrc/lib/server/services/healthcheckService.tssrc/lib/server/jobs/healthcheckScheduler.tssrc/lib/server/utils/iconResolver.tssrc/routes/apps/+page.server.tssrc/routes/apps/+page.sveltesrc/lib/components/app/AppCard.sveltesrc/lib/components/app/AppForm.sveltesrc/lib/components/app/AppIconPicker.sveltesrc/lib/components/app/AppHealthBadge.svelte
Acceptance Criteria
- Apps can be created, read, updated, deleted via API
- Healthcheck scheduler runs on configured intervals per app
- Status is correctly derived: online/offline/degraded/unknown
- Icon resolver correctly maps all icon types to renderable output
- App list page displays apps with status badges
- Docker health endpoint returns 200 when server is running
Notes
- Healthcheck runs in-process via node-cron (no external job runner)
- Default healthcheck: HTTP HEAD to app URL, expect 200, 5s timeout, 60s interval
- Store last N status records in AppStatus for history (sparklines are post-MVP)
- Custom icon uploads go to
static/uploads/(Docker volume mount) - ⚠️ Big Bang: pages will be functional but minimally styled until Phase 7
Review Checklist
- All tasks completed
- Code follows project conventions
- No unintended side effects
- Build passes
- Tests pass (new + existing)
Handoff to Next Phase
All 14 tasks are implemented. Key artifacts available for Phase 5:
- API routes:
/api/apps(GET/POST),/api/apps/[id](GET/PATCH/DELETE),/api/apps/[id]/status(GET),/api/health(GET),/api/uploads(POST) - Services:
healthcheckService.tsprovidescheckAppHealth()andcheckAllApps();healthcheckScheduler.tsprovidesstartScheduler()/stopScheduler()using node-cron - Icon resolution:
iconResolver.tsmaps all 4 icon types (lucide, simple, url, emoji) to renderable objects;AppCard.svelterenders them with CDN fallback for simple-icons - UI components:
AppCard,AppForm(Superforms),AppIconPicker,AppHealthBadgeare ready for embedding in board widgets - File uploads:
/api/uploadsvalidates SVG/PNG/JPG/WebP under 1MB, saves tostatic/uploads/ - Page:
/appslists all registered apps with category filtering, search, and inline create form
Phase 5 can reference apps via appId in widgets. The appService.findAll() and appService.findById() include latest status in responses. The healthcheck scheduler should be started from hooks.server.ts or a startup hook in Phase 8.