Heart Rate Ring
Source: components/home/heart-rate-ring.tsx
What You See
A card titled 'Heart Health Score' with a Heart icon. The main feature is a large composite ring showing your overall heart health score (0 to 100) in the center with a quality label. The ring is segmented with different colors for each metric: red for Resting HR, green for HRV, purple for Max HR, blue for VO2max, and yellow for Stress. Below the main ring is a 2-column grid of smaller individual rings, one per available metric, showing the raw value (like '58 bpm' or '42 ml/kg/min') with a colored ring fill proportional to that metric's normalized score. Each metric has an info popover explaining what it means.
How the Numbers Work
Each metric is normalized to a 0-100 score. Resting HR is scored inversely: lower is better (40 bpm scores 100, 100 bpm scores 0). HRV is scored directly: higher ms is better (clamped 0-100). VO2max is scored relative to ACSM age-and-gender reference ranges: for example, a 35-year-old male's range is 23-43.8 ml/kg/min, so a value in the middle of that range scores around 50. Stress is scored inversely: lower stress is better. The composite score is the average of all available metric scores. Only metrics your wearable provides are included.
Step by Step
Terra sends daily-vitals webhooks with resting HR, HRV, VO2max, stress level, and max HR. The backend normalizes these through normalize_daily_entry and stores them in the physiology table. The dashboard fetches the most recent row. The component builds a list of metrics, filters out any that are null, and normalizes each to 0-100. Resting HR: 100 minus ((value - 40) / 60) * 100. HRV: clamped to 0-100 directly. VO2max: ((value - floor) / (ceiling - floor)) * 100, where floor and ceiling come from ACSM reference tables indexed by age decade and gender (male/female, 5 age brackets from 20-29 to 60+; default range 20-70 if age/gender unknown). Stress: 100 minus the value. Max HR: ((value - 140) / 70) * 100. The composite = mean of all active metric scores. The main ring fills to composite percent and is split into colored arcs proportional to each metric's share of the total score. Individual metric rings use either the normalized score or a ring-specific normalization (Resting HR ring fills as value/maxHR, Stress ring fills as raw value/100).