From 1298b2384495c4da32094396f0359c5a276e5175 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 17 Jun 2025 11:32:35 +0800 Subject: [PATCH 1/2] update time format function --- .../Components/UptimeStatusBoxes/index.jsx | 2 +- client/src/Utils/timeUtils.js | 43 ++++++++++++------- 2 files changed, 29 insertions(+), 16 deletions(-) diff --git a/client/src/Pages/Uptime/Details/Components/UptimeStatusBoxes/index.jsx b/client/src/Pages/Uptime/Details/Components/UptimeStatusBoxes/index.jsx index 0e362e187..3778e4c6d 100644 --- a/client/src/Pages/Uptime/Details/Components/UptimeStatusBoxes/index.jsx +++ b/client/src/Pages/Uptime/Details/Components/UptimeStatusBoxes/index.jsx @@ -80,7 +80,7 @@ const UptimeStatusBoxes = ({ }; UptimeStatusBoxes.propTypes = { - shouldRender: PropTypes.bool, + isLoading: PropTypes.bool, monitor: PropTypes.object, monitorStats: PropTypes.object, certificateExpiry: PropTypes.string, diff --git a/client/src/Utils/timeUtils.js b/client/src/Utils/timeUtils.js index 3a84dfcf4..e03f0b5b7 100644 --- a/client/src/Utils/timeUtils.js +++ b/client/src/Utils/timeUtils.js @@ -79,22 +79,35 @@ export const formatDurationSplit = (ms) => { export const getHumanReadableDuration = (ms) => { const durationObj = dayjs.duration(ms); - if (durationObj.asDays() >= 1) { - const days = Math.floor(durationObj.asDays()); - return { time: days, units: days === 1 ? "day" : "days" }; - } else if (durationObj.asHours() >= 1) { - const hoursRounded = Math.round(durationObj.asHours() * 10) / 10; - const hours = Number.isInteger(hoursRounded) - ? Math.floor(hoursRounded) - : hoursRounded; - return { time: hours, units: hours <= 1 ? "hour" : "hours" }; - } else if (durationObj.asMinutes() >= 1) { - const minutes = Math.floor(durationObj.asMinutes()); - return { time: minutes, units: minutes === 1 ? "minute" : "minutes" }; - } else { - const seconds = Math.floor(durationObj.asSeconds()); - return { time: seconds, units: seconds === 1 ? "second" : "seconds" }; + + const parts = { + days: Math.floor(durationObj.asDays()), + hours: durationObj.hours(), + minutes: durationObj.minutes(), + seconds: durationObj.seconds(), + }; + + const result = []; + + if (parts.days > 0) { + result.push(`${parts.days}d`); } + if (parts.hours > 0) { + result.push(`${parts.hours}h`); + } + if (result.length < 2 && parts.minutes > 0) { + result.push(`${parts.minutes}m`); + } + if (result.length < 2 && parts.seconds > 0) { + result.push(`${parts.seconds}s`); + } + + if (result.length === 0) { + // fallback for durations < 1s + return { time: 0, units: "seconds" }; + } + + return { time: result.join(" "), units: null }; }; export const formatDate = (date, customOptions) => { From 9c400213182a8cc60114b02ad882a8ec01961ad0 Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Tue, 17 Jun 2025 13:41:25 +0800 Subject: [PATCH 2/2] return time string --- .../Components/PageSpeedStatusBoxes/index.jsx | 13 +++---------- .../Details/Components/UptimeStatusBoxes/index.jsx | 14 +++----------- client/src/Utils/timeUtils.js | 4 ++-- 3 files changed, 8 insertions(+), 23 deletions(-) diff --git a/client/src/Pages/PageSpeed/Details/Components/PageSpeedStatusBoxes/index.jsx b/client/src/Pages/PageSpeed/Details/Components/PageSpeedStatusBoxes/index.jsx index d3c597c3d..cb79198e9 100644 --- a/client/src/Pages/PageSpeed/Details/Components/PageSpeedStatusBoxes/index.jsx +++ b/client/src/Pages/PageSpeed/Details/Components/PageSpeedStatusBoxes/index.jsx @@ -5,13 +5,8 @@ import { getHumanReadableDuration } from "../../../../../Utils/timeUtils"; import { useTranslation } from "react-i18next"; const PageSpeedStatusBoxes = ({ shouldRender, monitor }) => { - const { time: uptimeDuration, units: uptimeUnits } = getHumanReadableDuration( - monitor?.uptimeDuration - ); - - const { time: lastCheckTime, units: lastCheckUnits } = getHumanReadableDuration( - monitor?.lastChecked - ); + const uptimeDuration = getHumanReadableDuration(monitor?.uptimeDuration); + const time = getHumanReadableDuration(monitor?.lastChecked); const { t } = useTranslation(); @@ -22,7 +17,6 @@ const PageSpeedStatusBoxes = ({ shouldRender, monitor }) => { subHeading={ <> {uptimeDuration} - {uptimeUnits} {t("ago")} } @@ -31,8 +25,7 @@ const PageSpeedStatusBoxes = ({ shouldRender, monitor }) => { heading="last check" subHeading={ <> - {lastCheckTime} - {lastCheckUnits} + {time} {t("ago")} } diff --git a/client/src/Pages/Uptime/Details/Components/UptimeStatusBoxes/index.jsx b/client/src/Pages/Uptime/Details/Components/UptimeStatusBoxes/index.jsx index 3778e4c6d..abeb251fe 100644 --- a/client/src/Pages/Uptime/Details/Components/UptimeStatusBoxes/index.jsx +++ b/client/src/Pages/Uptime/Details/Components/UptimeStatusBoxes/index.jsx @@ -24,30 +24,22 @@ const UptimeStatusBoxes = ({ const timeOfLastCheck = monitorStats?.lastCheckTimestamp; const timeSinceLastCheck = Date.now() - timeOfLastCheck; - const { time: streakTime, units: streakUnits } = - getHumanReadableDuration(timeSinceLastFailure); + const streakTime = getHumanReadableDuration(timeSinceLastFailure); - const { time: lastCheckTime, units: lastCheckUnits } = - getHumanReadableDuration(timeSinceLastCheck); + const lastCheckTime = getHumanReadableDuration(timeSinceLastCheck); return ( - {streakTime} - {streakUnits} - - } + subHeading={streakTime} /> {lastCheckTime} - {lastCheckUnits} {"ago"} } diff --git a/client/src/Utils/timeUtils.js b/client/src/Utils/timeUtils.js index e03f0b5b7..568b77b14 100644 --- a/client/src/Utils/timeUtils.js +++ b/client/src/Utils/timeUtils.js @@ -104,10 +104,10 @@ export const getHumanReadableDuration = (ms) => { if (result.length === 0) { // fallback for durations < 1s - return { time: 0, units: "seconds" }; + return "0s"; } - return { time: result.join(" "), units: null }; + return result.join(" "); }; export const formatDate = (date, customOptions) => {