From 968311ea421c853a4a53fe5adb2bce9bb0a17397 Mon Sep 17 00:00:00 2001
From: Thomas Zemp <tom@dhis2.org>
Date: Fri, 27 Sep 2024 12:47:26 +0200
Subject: [PATCH] fix: use period name in invalid period warning

---
 .../period-selector-bar-item.js                  | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/context-selection/period-selector-bar-item/period-selector-bar-item.js b/src/context-selection/period-selector-bar-item/period-selector-bar-item.js
index 38f6b16bb..4efbf12cf 100644
--- a/src/context-selection/period-selector-bar-item/period-selector-bar-item.js
+++ b/src/context-selection/period-selector-bar-item/period-selector-bar-item.js
@@ -109,16 +109,18 @@ export const PeriodSelectorBarItem = () => {
     ])
 
     useEffect(() => {
-        const resetPeriod = (id) => {
-            showWarningAlert(`The Period (${id}) is not open or is invalid.`)
-            i18n.t('The Period ({{id}}) is not open or is invalid.', {
-                id,
-            })
+        const resetPeriod = (id, displayName) => {
+            showWarningAlert(
+                i18n.t('The Period ({{id}}) is not open or is invalid.', {
+                    id: displayName ? displayName : id,
+                })
+            )
             setPeriodId(undefined)
         }
 
         if (selectedPeriod) {
             const endDate = selectedPeriod?.endDate
+            const displayName = selectedPeriod?.displayName
 
             // date comparison
             if (
@@ -127,11 +129,11 @@ export const PeriodSelectorBarItem = () => {
                     calendar,
                 })
             ) {
-                resetPeriod(periodId)
+                resetPeriod(periodId, displayName)
             }
 
             if (selectedPeriod?.periodType !== dataSetPeriodType) {
-                resetPeriod(periodId)
+                resetPeriod(periodId, selectedPeriod?.displayName)
             }
         } else if (periodId) {
             setPeriodId(undefined)