From 13f26b5fc78907e3fc4be9ca8b4efc6b722b7bcc Mon Sep 17 00:00:00 2001
From: Frank Niessink <frank@niessink.com>
Date: Wed, 26 Feb 2025 10:39:19 +0100
Subject: [PATCH] Correctly format the measurement entity status end dates in
 the measurement details table.

Fixes #10907.
---
 components/frontend/src/source/SourceEntity.jsx |  4 +++-
 .../frontend/src/source/SourceEntity.test.jsx   | 17 +++++++++++++++--
 .../frontend/src/widgets/TimeAgoWithDate.jsx    |  3 +++
 docs/src/changelog.md                           |  1 +
 4 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/components/frontend/src/source/SourceEntity.jsx b/components/frontend/src/source/SourceEntity.jsx
index 4a6b48cefb..d7b3b65c7f 100644
--- a/components/frontend/src/source/SourceEntity.jsx
+++ b/components/frontend/src/source/SourceEntity.jsx
@@ -78,7 +78,9 @@ export function SourceEntity({
             style={{ maxHeight: "100px", overflow: "auto" }}
         >
             <TableCell sx={style}>{SOURCE_ENTITY_STATUS_NAME[status]}</TableCell>
-            <TableCell sx={style}>{status === "unconfirmed" ? "" : status_end_date}</TableCell>
+            <TableCell sx={style}>
+                {status === "unconfirmed" ? "" : <TimeAgoWithDate dateFirst noTime date={status_end_date} />}
+            </TableCell>
             <TableCell sx={style}>
                 <DivWithHTML>{rationale}</DivWithHTML>
             </TableCell>
diff --git a/components/frontend/src/source/SourceEntity.test.jsx b/components/frontend/src/source/SourceEntity.test.jsx
index ef6801593b..c8ca5ceb15 100644
--- a/components/frontend/src/source/SourceEntity.test.jsx
+++ b/components/frontend/src/source/SourceEntity.test.jsx
@@ -48,7 +48,15 @@ it("renders the fixed status", async () => {
 
 it("renders the status end date", async () => {
     const { container } = renderSourceEntity({ status: "fixed", status_end_date: "3000-01-01" })
-    expect(screen.getAllByText(/3000-01-01/).length).toBe(1)
+    const expectedDate = new Date("3000-01-01").toLocaleDateString([], { dateStyle: "short" })
+    expect(screen.getAllByText(RegExp(expectedDate)).length).toBe(1)
+    await expectNoAccessibilityViolations(container)
+})
+
+it("does not render the status end date if the status is unconfirmed", async () => {
+    const { container } = renderSourceEntity({ status: "unconfirmed", status_end_date: "3000-01-01" })
+    const expectedDate = new Date("3000-01-01").toLocaleDateString([], { dateStyle: "short" })
+    expect(screen.queryAllByText(RegExp(expectedDate)).length).toBe(0)
     await expectNoAccessibilityViolations(container)
 })
 
@@ -71,7 +79,12 @@ it("renders the status and rationale past end date", async () => {
         hide_ignored_entities: true,
         rationale: "Because",
     })
-    expect(screen.getAllByText(/2000-01-01/).length).toBe(1)
+    const expectedDate = new Date("2000-01-01").toLocaleDateString(undefined, {
+        day: "2-digit",
+        month: "2-digit",
+        year: "numeric",
+    })
+    expect(screen.getAllByText(RegExp(expectedDate)).length).toBe(1)
     expect(screen.getAllByText(/Because/).length).toBe(1)
     await expectNoAccessibilityViolations(container)
 })
diff --git a/components/frontend/src/widgets/TimeAgoWithDate.jsx b/components/frontend/src/widgets/TimeAgoWithDate.jsx
index 22598f90c7..c88261ac92 100644
--- a/components/frontend/src/widgets/TimeAgoWithDate.jsx
+++ b/components/frontend/src/widgets/TimeAgoWithDate.jsx
@@ -10,6 +10,9 @@ function toLocaleString(date, noTime) {
 }
 
 export function TimeAgoWithDate({ children, date, dateFirst, noTime }) {
+    if (!date) {
+        return null
+    }
     const the_date = new Date(date)
     const prefix = children ? children + " " : ""
     if (dateFirst) {
diff --git a/docs/src/changelog.md b/docs/src/changelog.md
index ba84ce9ca4..87cb7d6ac7 100644
--- a/docs/src/changelog.md
+++ b/docs/src/changelog.md
@@ -27,6 +27,7 @@ If your currently installed *Quality-time* version is not the latest version, pl
 - The software documentation was outdated (among other things, the API-server health check endpoint). Fixes [#10858](https://github.com/ICTU/quality-time/issues/10858).
 - Keep the footer at the bottom of the page even if the report is very short. Fixes [#10877](https://github.com/ICTU/quality-time/issues/10877).
 - Automatically expand long comments when exporting to PDF. Fixes [#10892](https://github.com/ICTU/quality-time/issues/10892).
+- Correctly format the measurement entity status end dates in the measurement details table. Fixes [#10907](https://github.com/ICTU/quality-time/issues/10907).
 
 ### Removed