Mark/kimi_agent_kin_app_sync

Fork 0

Feature: Metrics & Data View — dedicated analytics dashboards #70

New issue

Closed

opened 2026-06-09 01:23:10 +00:00 by Mark · 1 comment

Mark commented

2026-06-09 01:23:10 +00:00

Owner

Goal

Create dedicated Metrics and Data View pages/sections that surface all the rich data already computed by the metrics engine (src/lib/metrics-engine.ts) in an interactive, visual way.

Current State

The app already has:

843-line metrics engine computing CadenceMetrics, EngagementMetrics, ClosenessTrend, MethodBreakdown, MethodCorrelation, CrossPersonMetrics (ranked engagement, overdue list, cadence drift), CycleDetection (day-of-week, time-of-day, weekday-vs-weekend patterns), and Suggestion engine
Store with full data model (people, interactions, dates, etc.)
Existing pages: Dashboard/Home, People, PersonDetail, Dates, Family, Settings, LogInteraction
No dedicated metrics or data view page — metrics data exists in the library but has no visual UI

Proposed Scope

1. Metrics Dashboard (`/metrics`)

Engagement overview: ranked engagement scores across all contacts (bar/radar chart using existing RankedEngagementItem[])
Cadence health: list of overdue contacts + cadence drift warnings (OverdueItem[], CadenceDriftItem[])
Closeness trends: direction arrows and trend lines for each person (ClosenessTrend)
Cycle detection insights: preferred days/times for each contact, weekday vs weekend patterns (CycleDetection)
Suggestions feed: prioritized action items from suggestion engine
Time range filter (7d / 30d / 90d / all)

2. Person-Level Detail View (extend /people/:id)

Charts section showing per-person cadence history, engagement score over time, method breakdown (pie/donut chart for MethodBreakdown.counts)
Method correlation table showing which outreach methods get which responses (MethodCorrelation.correlations)
Closeness trend sparkline
Interaction timeline with filtering by type/method

3. Data Export / Raw View (`/data`)

Table views of raw interaction data with sort/filter
Export to CSV/JSON
Data integrity stats (total interactions, date range, missing fields)

Technical Notes

All metrics engine functions are already pure and tested (metrics-engine.test.ts exists)
New pages should follow existing patterns: lazy-loaded route in App.tsx, nav item in Layout.tsx
Use existing design system (warm/sage color tokens, framer-motion animations, Lucide icons)
Charts can use recharts or build simple SVG bar/radar in-house
/metrics should be accessible from the bottom nav on mobile and sidebar on desktop

Acceptance Criteria

/metrics page renders without console errors
Engagement score ranking is visible and sortable
Overdue/cadence drift list renders correctly
Per-person detail page includes metrics section
Data export at /data produces valid CSV/JSON
Existing tests still pass (npm test)
Navigation item added to both mobile bottom nav and desktop sidebar

## Goal Create dedicated **Metrics** and **Data View** pages/sections that surface all the rich data already computed by the metrics engine (`src/lib/metrics-engine.ts`) in an interactive, visual way. ## Current State The app already has: - 843-line metrics engine computing CadenceMetrics, EngagementMetrics, ClosenessTrend, MethodBreakdown, MethodCorrelation, CrossPersonMetrics (ranked engagement, overdue list, cadence drift), CycleDetection (day-of-week, time-of-day, weekday-vs-weekend patterns), and Suggestion engine - Store with full data model (people, interactions, dates, etc.) - Existing pages: Dashboard/Home, People, PersonDetail, Dates, Family, Settings, LogInteraction - **No dedicated metrics or data view page** — metrics data exists in the library but has no visual UI ## Proposed Scope ### 1. Metrics Dashboard (`/metrics`) - **Engagement overview**: ranked engagement scores across all contacts (bar/radar chart using existing RankedEngagementItem[]) - **Cadence health**: list of overdue contacts + cadence drift warnings (OverdueItem[], CadenceDriftItem[]) - **Closeness trends**: direction arrows and trend lines for each person (ClosenessTrend) - **Cycle detection insights**: preferred days/times for each contact, weekday vs weekend patterns (CycleDetection) - **Suggestions feed**: prioritized action items from suggestion engine - Time range filter (7d / 30d / 90d / all) ### 2. Person-Level Detail View (extend /people/:id) - Charts section showing per-person cadence history, engagement score over time, method breakdown (pie/donut chart for MethodBreakdown.counts) - Method correlation table showing which outreach methods get which responses (MethodCorrelation.correlations) - Closeness trend sparkline - Interaction timeline with filtering by type/method ### 3. Data Export / Raw View (`/data`) - Table views of raw interaction data with sort/filter - Export to CSV/JSON - Data integrity stats (total interactions, date range, missing fields) ## Technical Notes - All metrics engine functions are already pure and tested (`metrics-engine.test.ts` exists) - New pages should follow existing patterns: lazy-loaded route in App.tsx, nav item in Layout.tsx - Use existing design system (warm/sage color tokens, framer-motion animations, Lucide icons) - Charts can use recharts or build simple SVG bar/radar in-house - /metrics should be accessible from the bottom nav on mobile and sidebar on desktop ## Acceptance Criteria - [ ] /metrics page renders without console errors - [ ] Engagement score ranking is visible and sortable - [ ] Overdue/cadence drift list renders correctly - [ ] Per-person detail page includes metrics section - [ ] Data export at /data produces valid CSV/JSON - [ ] Existing tests still pass (npm test) - [ ] Navigation item added to both mobile bottom nav and desktop sidebar

Mark added the

enhancement

feature-request

triage-approved

labels

2026-06-09 01:23:10 +00:00

Mark referenced this issue from a commit

2026-06-12 16:57:34 +00:00

feat: Metrics & Data View dashboards with time range filter, suggestions, cycles, and data export — closes #70

Mark closed this issue

2026-06-12 16:57:34 +00:00

Mark commented

2026-06-12 16:57:39 +00:00

Author

Owner

Implementation Complete

This has been implemented and deployed.

What was done:

Metrics Dashboard (/metrics): Time range filter (7d/30d/90d/all), closeness trends, cycle detection insights, and suggestions feed added alongside existing engagement ranking and cadence health sections
Person-Level Metrics (/people/:id → Metrics tab): Engagement overview cards, closeness trend sparkline, cadence health, method breakdown chart, method correlation table, and interaction timeline with filtering
Data Export (/data): Sortable/filterable interaction table, CSV and JSON export, data integrity statistics
Navigation: Added /data route to App.tsx with lazy loading, sidebar and mobile bottom nav items with Database icon

Verification

All 164 tests pass (metrics-engine tests, component tests, etc.)
Committed and pushed to main (f4200ca)

Closes #70.

## Implementation Complete This has been implemented and deployed. ### What was done: - **Metrics Dashboard** (`/metrics`): Time range filter (7d/30d/90d/all), closeness trends, cycle detection insights, and suggestions feed added alongside existing engagement ranking and cadence health sections - **Person-Level Metrics** (`/people/:id` → Metrics tab): Engagement overview cards, closeness trend sparkline, cadence health, method breakdown chart, method correlation table, and interaction timeline with filtering - **Data Export** (`/data`): Sortable/filterable interaction table, CSV and JSON export, data integrity statistics - **Navigation**: Added /data route to App.tsx with lazy loading, sidebar and mobile bottom nav items with Database icon ### Verification - All 164 tests pass (metrics-engine tests, component tests, etc.) - Committed and pushed to main (f4200ca) Closes #70.

No milestone

No project

No assignees

1 participant

Notifications

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

Mark/kimi_agent_kin_app_sync#70

No description provided.

Rows
Columns