From 7ebda924b82ad6da515ecc9534573f652f2ef40e Mon Sep 17 00:00:00 2001
From: Julien <roidelapluie@o11y.eu>
Date: Fri, 20 Sep 2024 11:59:12 +0200
Subject: [PATCH] fix(web): properly format sub-millisecond durations in target
 status page

Previously, scrapes durations that are very short (e.g., connection refused)
could show as empty (durations under 1 millisecond).

This commit ensures that sub-millisecond durations are correctly
displayed as "0ms" or "1ms" when necessary.

- Adjusted `humanizeDuration` to round sub-millisecond durations to the
  nearest millisecond.
- Updated unit tests to verify the correct handling of sub-millisecond
  values.

Signed-off-by: Julien <roidelapluie@o11y.eu>
---
 web/ui/mantine-ui/src/lib/formatTime.test.ts | 6 ++++++
 web/ui/mantine-ui/src/lib/formatTime.ts      | 3 +++
 2 files changed, 9 insertions(+)

diff --git a/web/ui/mantine-ui/src/lib/formatTime.test.ts b/web/ui/mantine-ui/src/lib/formatTime.test.ts
index c8b743cc0..597d6909b 100644
--- a/web/ui/mantine-ui/src/lib/formatTime.test.ts
+++ b/web/ui/mantine-ui/src/lib/formatTime.test.ts
@@ -57,6 +57,12 @@ describe("humanizeDuration", () => {
     expect(humanizeDuration(0)).toBe("0s");
   });
 
+  test("formats submilliseconds correctly", () => {
+    expect(humanizeDuration(0.1)).toBe("0ms");
+    expect(humanizeDuration(0.6)).toBe("1ms");
+    expect(humanizeDuration(0.000001)).toBe("0ms");
+  });
+
   test("formats milliseconds correctly", () => {
     expect(humanizeDuration(1)).toBe("1ms");
     expect(humanizeDuration(999)).toBe("999ms");
diff --git a/web/ui/mantine-ui/src/lib/formatTime.ts b/web/ui/mantine-ui/src/lib/formatTime.ts
index 3b6722209..95beb21d6 100644
--- a/web/ui/mantine-ui/src/lib/formatTime.ts
+++ b/web/ui/mantine-ui/src/lib/formatTime.ts
@@ -86,6 +86,9 @@ const formatDuration = (
         r.push(`${v}${unit}`);
       }
     }
+    if (r.length == 0 && unit == "ms") {
+        r.push(`${Math.round(ms)}ms`)
+    }
   }
 
   return sign + r.join(componentSeparator || "");