fix(targets): label the systolic bar on the blood-pressure target card

The card stacks two range bars for blood pressure. The diastolic bar
carried its label; the systolic one had none and no key to render, so the
pair read as one unnamed bar above a "Diastolic" one. Both bars now name
their reading (new key targets.systolic in every locale).
This commit is contained in:
Marc-André Bombeck committed 2026-10-20 15:07:51 +02:00
1 parent a934e948d8
commit 74244efbe1
10 files changed
+37 -9

No files matched your search

+1
View File
@@ -8901,6 +8901,7 @@
"inTarget": "Im Zielbereich",
"aboveTarget": "{delta} {unit} über Zielbereich",
"belowTarget": "{delta} {unit} unter Zielbereich",
"systolic": "Systolisch",
"diastolic": "Diastolisch",
"glucoseFasting": "Glukose, nüchtern",
"glucosePostprandial": "Glukose, postprandial",
+1
View File
@@ -8901,6 +8901,7 @@
"inTarget": "Within target range",
"aboveTarget": "{delta} {unit} above target",
"belowTarget": "{delta} {unit} below target",
"systolic": "Systolic",
"diastolic": "Diastolic",
"glucoseFasting": "Glucose (fasting)",
"glucosePostprandial": "Glucose (post-meal)",
+1
View File
@@ -8901,6 +8901,7 @@
"inTarget": "En rango objetivo",
"aboveTarget": "{delta} {unit} por encima del rango",
"belowTarget": "{delta} {unit} por debajo del rango",
"systolic": "Sistólica",
"diastolic": "Diastólica",
"glucoseFasting": "Glucemia (en ayunas)",
"glucosePostprandial": "Glucemia (posprandial)",
+1
View File
@@ -8901,6 +8901,7 @@
"inTarget": "Dans la plage cible",
"aboveTarget": "{delta} {unit} au-dessus de la plage",
"belowTarget": "{delta} {unit} en dessous de la plage",
"systolic": "Systolique",
"diastolic": "Diastolique",
"glucoseFasting": "Glycémie (à jeun)",
"glucosePostprandial": "Glycémie (postprandiale)",
+1
View File
@@ -8901,6 +8901,7 @@
"inTarget": "Nel range obiettivo",
"aboveTarget": "{delta} {unit} sopra il range",
"belowTarget": "{delta} {unit} sotto il range",
"systolic": "Sistolica",
"diastolic": "Diastolica",
"glucoseFasting": "Glicemia (a digiuno)",
"glucosePostprandial": "Glicemia (postprandiale)",
+1
View File
@@ -8901,6 +8901,7 @@
"inTarget": "목표 범위 안",
"aboveTarget": "목표보다 {delta} {unit} 높음",
"belowTarget": "목표보다 {delta} {unit} 낮음",
"systolic": "수축기",
"diastolic": "이완기",
"glucoseFasting": "혈당 (공복)",
"glucosePostprandial": "혈당 (식후)",
+1
View File
@@ -8901,6 +8901,7 @@
"inTarget": "Binnen het streefbereik",
"aboveTarget": "{delta} {unit} boven het doel",
"belowTarget": "{delta} {unit} onder het doel",
"systolic": "Systolisch",
"diastolic": "Diastolisch",
"glucoseFasting": "Glucose (nuchter)",
"glucosePostprandial": "Glucose (na de maaltijd)",
+1
View File
@@ -8901,6 +8901,7 @@
"inTarget": "W zakresie docelowym",
"aboveTarget": "{delta} {unit} powyżej zakresu",
"belowTarget": "{delta} {unit} poniżej zakresu",
"systolic": "Skurczowe",
"diastolic": "Rozkurczowe",
"glucoseFasting": "Glikemia: na czczo",
"glucosePostprandial": "Glikemia: po posiłku",
@@ -214,10 +214,21 @@ describe("<MetricTargetSummary>", () => {
// The diastolic range bar renders alongside the systolic one.
const barCount = (html.match(/data-slot="target-range-bar"/g) ?? []).length;
expect(barCount).toBe(2);
// Each stacked bar names its reading, the systolic one first. The
// systolic label was missing while the diastolic one rendered.
const sys = html.indexOf(">Systolic</p>");
const dia = html.indexOf(">Diastolic</p>");
expect(sys).toBeGreaterThan(-1);
expect(dia).toBeGreaterThan(sys);
// 30-day average stitches the diastolic pair — kept on the BP panel.
expect(html).toContain("30-day average: 122/76 mmHg");
});
it("labels a single-band bar with nothing extra", () => {
const html = renderWith("weight", WEIGHT_DATA);
expect(html).not.toContain(">Systolic</p>");
});
it("keeps the adjust-target affordance out of the card body", () => {
// The "Adjust target range" affordance moved to the page-header gear
// (`<TargetAdjustButton>` via `TargetAdjustProvider`); the card is now
@@ -367,16 +367,25 @@ function TargetReferencePanel({
) : null}
</CardHeader>
<CardContent className="space-y-3">
{/* Row 2: range bar — where today's value sits inside the band. */}
{/* Row 2: range bar — where today's value sits inside the band.
Blood pressure stacks two bars, so each one names its reading;
an unlabelled first bar read as the diastolic one's sibling. */}
{currentValue != null ? (
<RangeBar
value={currentValue}
min={range.min}
max={range.max}
unit={unit}
orangeMin={isMedicationCompliance ? 70 : undefined}
orangeMax={isMedicationCompliance ? 100 : undefined}
/>
<div className={isBp ? "space-y-1" : undefined}>
{isBp ? (
<p className="text-muted-foreground text-xs">
{t("targets.systolic")}
</p>
) : null}
<RangeBar
value={currentValue}
min={range.min}
max={range.max}
unit={unit}
orangeMin={isMedicationCompliance ? 70 : undefined}
orangeMax={isMedicationCompliance ? 100 : undefined}
/>
</div>
) : null}
{/* Row 2b: diastolic range bar for blood pressure. */}