Correctly format the measurement entity status end dates in the measu…

…rement details table.

Fixes #10907.

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>

components/frontend/src/source/SourceEntity.test.jsx

@@ -48,7 +48,23 @@ 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(undefined, {
+        day: "2-digit",
+        month: "2-digit",
+        year: "numeric",
+    })
+    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(undefined, {
+        day: "2-digit",
+        month: "2-digit",
+        year: "numeric",
+    })
+    expect(screen.queryAllByText(RegExp(expectedDate)).length).toBe(0)
     await expectNoAccessibilityViolations(container)
 })
 
@@ -71,7 +87,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)
 })

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) {

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