fix(growth): move latest card to top, remove duplicate

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Manohar Gupta 2026-05-17 14:46:11 +05:30
parent dcb510964e
commit 0ea81b329a

View file

@ -406,6 +406,65 @@ export default function GrowthPage() {
</div>
)}
{/* Latest Reading Card */}
{latest && (
<div className="mx-4 mb-4 p-4 bg-rose-100 dark:bg-rose-900 rounded-xl">
<div className="text-sm text-gray-600 dark:text-gray-300 mb-2">
Latest: {new Date(latest.measured_at).toLocaleDateString()}
{velocity && (
<span className="ml-2 text-green-600">
({velocity.weight}kg/mo {velocity.direction === "up" ? "↑" : "↓"})
</span>
)}
</div>
<div className="flex gap-4">
{latest.weight_kg && (
<div>
<div className="text-gray-500 text-xs">Weight</div>
<div className="text-xl font-bold">{latest.weight_kg} kg</div>
{weightPercentile && (
<div className={`text-xs font-medium ${getPercentileColor(weightPercentile)}`}>
{weightPercentile} percentile
{savedGoals.weightKg && (
<span className="ml-1">
{((latest.weight_kg / savedGoals.weightKg) * 100).toFixed(0)}% of goal
</span>
)}
</div>
)}
</div>
)}
{latest.height_cm && (
<div>
<div className="text-gray-500 text-xs">Height</div>
<div className="text-xl font-bold">{latest.height_cm} cm</div>
{heightPercentile && (
<div className={`text-xs font-medium ${getPercentileColor(heightPercentile)}`}>
{heightPercentile} percentile
{savedGoals.heightCm && (
<span className="ml-1">
{((latest.height_cm / savedGoals.heightCm) * 100).toFixed(0)}% of goal
</span>
)}
</div>
)}
</div>
)}
{latest.head_circumference_cm && (
<div>
<div className="text-gray-500 text-xs">Head</div>
<div className="text-xl font-bold">{latest.head_circumference_cm} cm</div>
{headPercentile && (
<div className={`text-xs font-medium ${getPercentileColor(headPercentile)}`}>
{headPercentile} percentile
</div>
)}
</div>
)}
</div>
</div>
)}
{/* WHO Standards Card - Enhanced with age-wise targets */}
{child && standard && (
<div className="mx-4 mb-4 p-4 bg-white dark:bg-gray-800 rounded-xl">
@ -515,65 +574,6 @@ export default function GrowthPage() {
</div>
)}
{/* Latest Reading Card */}
{latest && (
<div className="mx-4 mb-4 p-4 bg-rose-100 dark:bg-rose-900 rounded-xl">
<div className="text-sm text-gray-600 dark:text-gray-300 mb-2">
Latest: {new Date(latest.measured_at).toLocaleDateString()}
{velocity && (
<span className="ml-2 text-green-600">
({velocity.weight}kg/mo {velocity.direction === "up" ? "↑" : "↓"})
</span>
)}
</div>
<div className="flex gap-4">
{latest.weight_kg && (
<div>
<div className="text-gray-500 text-xs">Weight</div>
<div className="text-xl font-bold">{latest.weight_kg} kg</div>
{weightPercentile && (
<div className={`text-xs font-medium ${getPercentileColor(weightPercentile)}`}>
{weightPercentile} percentile
{savedGoals.weightKg && (
<span className="ml-1">
{((latest.weight_kg / savedGoals.weightKg) * 100).toFixed(0)}% of goal
</span>
)}
</div>
)}
</div>
)}
{latest.height_cm && (
<div>
<div className="text-gray-500 text-xs">Height</div>
<div className="text-xl font-bold">{latest.height_cm} cm</div>
{heightPercentile && (
<div className={`text-xs font-medium ${getPercentileColor(heightPercentile)}`}>
{heightPercentile} percentile
{savedGoals.heightCm && (
<span className="ml-1">
{((latest.height_cm / savedGoals.heightCm) * 100).toFixed(0)}% of goal
</span>
)}
</div>
)}
</div>
)}
{latest.head_circumference_cm && (
<div>
<div className="text-gray-500 text-xs">Head</div>
<div className="text-xl font-bold">{latest.head_circumference_cm} cm</div>
{headPercentile && (
<div className={`text-xs font-medium ${getPercentileColor(headPercentile)}`}>
{headPercentile} percentile
</div>
)}
</div>
)}
</div>
</div>
)}
{/* Add/Edit Form */}
{showAdd && (
<div className="mx-4 mb-4 p-4 bg-white dark:bg-gray-800 rounded-xl space-y-3">