50e8519220
- Add 6 renderer components: StatCard, Gauge, List, Progress, AlertBanner, Chart - Add IntegrationWidget container with auto-refresh, loading, error states - Add IntegrationAlertOverlay for layout-level critical alerts - Add IntegrationConfigFields for dynamic form generation from Zod schemas - Register integration type in WidgetRenderer - Extend WidgetCreationForm with integration app/endpoint pickers - Extend AppForm with integration config section and test connection button - Add /api/integrations/alerts endpoint
60 lines
3.2 KiB
Markdown
60 lines
3.2 KiB
Markdown
# Phase 10: Planka Integration + Polish
|
|
|
|
**Status:** ⬜ Not Started
|
|
**Parent plan:** [PLAN.md](./PLAN.md)
|
|
**Domain:** fullstack
|
|
|
|
## Objective
|
|
Implement the Planka integration for task/project management visibility, then polish all integration components with proper error states, loading skeletons, empty states, and consistent styling.
|
|
|
|
## Tasks
|
|
|
|
### Planka Integration
|
|
- [ ] Task 1: Create `src/lib/server/integrations/planka/schema.ts` — Auth config: `{ email: string, password: string }`.
|
|
- [ ] Task 2: Create `src/lib/server/integrations/planka/client.ts` — HTTP client. Session-based auth (POST `/api/access-tokens` → Bearer token). Endpoints: `/api/cards`, `/api/boards`.
|
|
- [ ] Task 3: Create `src/lib/server/integrations/planka/transform.ts` — My cards → list with board/list context, overdue → list (red highlight), board summary → stat-card (card counts by list).
|
|
- [ ] Task 4: Create `src/lib/server/integrations/planka/index.ts` — Endpoints: `my-cards` (list), `overdue` (list), `board-summary` (stat-card).
|
|
- [ ] Task 5: Register Planka integration in registry.
|
|
|
|
### Polish & Error Handling
|
|
- [ ] Task 6: Add loading skeleton states to all renderer components (StatCard, Gauge, List, Progress, Chart).
|
|
- [ ] Task 7: Add empty state messaging to all renderers ("No data available", "No active torrents", etc.).
|
|
- [ ] Task 8: Add error state handling to IntegrationWidget — show error message with retry button when fetch fails.
|
|
- [ ] Task 9: Verify all integrations handle network timeouts, invalid credentials, and unexpected response formats gracefully.
|
|
- [ ] Task 10: Add integration type icons to the app form dropdown and widget creation form.
|
|
- [ ] Task 11: Ensure all renderers respect card sizes (compact/medium/large) and are responsive.
|
|
- [ ] Task 12: Review and standardize all integration endpoint refresh intervals (sensible defaults).
|
|
|
|
## Files to Modify/Create
|
|
- `src/lib/server/integrations/planka/{schema,client,transform,index}.ts` — new (4 files)
|
|
- `src/lib/server/integrations/registry.ts` — modify: register Planka
|
|
- `src/lib/components/widget/integration/*.svelte` — modify: add loading/empty/error states
|
|
- `src/lib/components/widget/integration/IntegrationWidget.svelte` — modify: error handling + retry
|
|
- `src/lib/components/app/AppForm.svelte` — modify: integration type icons
|
|
|
|
## Acceptance Criteria
|
|
- Planka: my cards list, overdue cards highlighted, board summary
|
|
- All renderers have loading, empty, and error states
|
|
- All integrations handle network errors gracefully
|
|
- Consistent styling across all integration components
|
|
- Responsive layout on mobile
|
|
- Build passes, tests pass, lint clean
|
|
|
|
## Notes
|
|
- Planka uses session-based auth similar to NPM — reuse the pattern
|
|
- This is the final phase — build and tests MUST pass here (Big Bang strategy final gate)
|
|
- Polish should cover ALL renderers and integrations, not just Planka
|
|
- Overdue detection: compare card due date to current date, highlight in red
|
|
|
|
## Review Checklist
|
|
- [ ] All tasks completed
|
|
- [ ] Code follows project conventions
|
|
- [ ] No unintended side effects
|
|
- [ ] Build passes
|
|
- [ ] Tests pass (new + existing)
|
|
- [ ] All integrations tested end-to-end
|
|
- [ ] Loading/error/empty states verified
|
|
|
|
## Handoff to Next Phase
|
|
<!-- Final phase — no handoff needed -->
|