From 95575b5e2e3a04512d11e3b2990a108808cfbc16 Mon Sep 17 00:00:00 2001
From: Daniel Volz <mail@danielvolz.org>
Date: Mon, 22 Dec 2025 11:02:07 +0100
Subject: [PATCH] feat: update stock information labels to reflect current
 stock in medication details

---
 frontend/src/App.tsx      | 15 ++++++++++++---
 frontend/src/i18n/de.json |  2 +-
 frontend/src/i18n/en.json |  2 +-
 3 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 4151d75..74c2160 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1396,10 +1396,16 @@ export default function App() {
 						<div className="med-detail-body">
 							<div className="med-detail-section">
 								<h3>{t('modal.stockInfo')}</h3>
+								{(() => {
+									const medCoverage = coverage.all.find(c => c.name === selectedMed.name);
+									const currentStock = medCoverage ? medCoverage.medsLeft : selectedMed.count;
+									const status = medCoverage ? getStockStatus(medCoverage.daysLeft, medCoverage.medsLeft, settings) : null;
+									const textClass = status?.className === "danger" ? "danger-text" : status?.className === "warning" ? "warning-text" : "";
+									return (
 								<div className="med-detail-grid">
 									<div className="med-detail-item">
-										<span className="med-detail-label">{t('modal.totalPills')}</span>
-										<span className="med-detail-value">{formatNumber(selectedMed.count)}</span>
+										<span className="med-detail-label">{t('modal.currentStock')}</span>
+										<span className={`med-detail-value ${textClass}`}>{formatNumber(currentStock)}/{formatNumber(selectedMed.count)}</span>
 									</div>
 									<div className="med-detail-item">
 										<span className="med-detail-label">{t('modal.packs')}</span>
@@ -1430,6 +1436,8 @@ export default function App() {
 										</span>
 									</div>
 								</div>
+									);
+								})()}
 						</div>
 
 							{selectedMed.slices.length > 0 && (
@@ -1527,6 +1535,7 @@ export default function App() {
 							{meds.filter(m => m.takenBy === selectedUser).map((med) => {
 								const medCoverage = coverage.all.find(c => c.name === med.name);
 								const status = medCoverage ? getStockStatus(medCoverage.daysLeft, medCoverage.medsLeft, settings) : null;
+								const currentStock = medCoverage ? formatNumber(medCoverage.medsLeft) : formatNumber(med.count);
 								return (
 									<div 
 										key={med.id} 
@@ -1539,7 +1548,7 @@ export default function App() {
 											{med.genericName && <span className="user-med-generic">{med.genericName}</span>}
 										</div>
 										<div className="user-med-stats">
-											<span className="user-med-pills">{formatNumber(med.count)} {t('common.pills')}</span>
+											<span className="user-med-pills">{currentStock}/{formatNumber(med.count)} {t('common.pills')}</span>
 											{status && <span className={`status-chip ${status.className}`}>{t(status.label)}</span>}
 										</div>
 									</div>
diff --git a/frontend/src/i18n/de.json b/frontend/src/i18n/de.json
index ab962eb..1732422 100644
--- a/frontend/src/i18n/de.json
+++ b/frontend/src/i18n/de.json
@@ -173,7 +173,7 @@
     "for": "für",
     "at": "um",
     "stockInfo": "Bestandsinformationen",
-    "totalPills": "Tabletten gesamt",
+    "currentStock": "Aktueller Bestand",
     "packs": "Packungen",
     "blistersPerPack": "Blister/Packung",
     "pillsPerBlister": "Tabletten/Blister",
diff --git a/frontend/src/i18n/en.json b/frontend/src/i18n/en.json
index c653a7b..0fe1480 100644
--- a/frontend/src/i18n/en.json
+++ b/frontend/src/i18n/en.json
@@ -173,7 +173,7 @@
     "for": "for",
     "at": "at",
     "stockInfo": "Stock Information",
-    "totalPills": "Total Pills",
+    "currentStock": "Current Stock",
     "packs": "Packs",
     "blistersPerPack": "Blisters/Pack",
     "pillsPerBlister": "Pills/Blister",