-
-
Notifications
You must be signed in to change notification settings - Fork 5.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Convert interval seconds to days, hours, minutes, and seconds #5220
base: master
Are you sure you want to change the base?
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -213,3 +213,78 @@ export function getToastErrorTimeout() { | |
|
||
return errorTimeout; | ||
} | ||
|
||
class RelativeTimeFormatter { | ||
/** | ||
* Default locale and options for Relative Time Formatter | ||
*/ | ||
constructor() { | ||
this.options = { numeric: "auto" }; | ||
this.instance = new Intl.RelativeTimeFormat(currentLocale(), this.options); | ||
} | ||
|
||
/** | ||
* Method to update the instance locale and options | ||
* @param {string} locale Localization identifier (e.g., "en", "ar-sy") to update the instance with. | ||
* @returns {void} No return value. | ||
*/ | ||
updateLocale(locale) { | ||
this.instance = new Intl.RelativeTimeFormat(locale, this.options); | ||
} | ||
|
||
/** | ||
* Method to convert seconds into Human readable format | ||
* @param {number} seconds Receive value in seconds. | ||
* @returns {string} String converted to Days Mins Seconds Format | ||
*/ | ||
secondsToHumanReadableFormat(seconds) { | ||
const days = Math.floor(seconds / 86400); | ||
const hours = Math.floor((seconds % 86400) / 3600); | ||
const minutes = Math.floor(((seconds % 86400) % 3600) / 60); | ||
const secs = ((seconds % 86400) % 3600) % 60; | ||
const parts = []; | ||
/** | ||
* Build the formatted string from parts | ||
* 1. Get the relative time formatted parts from the instance. | ||
* 2. Filter out the relevant parts literal (unit of time) or integer (value). | ||
* 3. Map out the required values. | ||
* @param {number} value Receives value in seconds. | ||
* @param {string} unitOfTime Expected unit of time after conversion. | ||
* @returns {void} | ||
*/ | ||
const toFormattedPart = (value, unitOfTime) => { | ||
const partsArray = this.instance.formatToParts(value, unitOfTime); | ||
const filteredParts = partsArray | ||
.filter( | ||
(part, index) => | ||
(part.type === "literal" || part.type === "integer") && | ||
index > 0 | ||
) | ||
.map((part) => part.value); | ||
|
||
const formattedString = filteredParts.join("").trim(); | ||
parts.push(formattedString); | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The controllflow in this function is quite non-obvious. Please refactor this to not abuse scoping as heavily ^^ There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. I have refactored the control flow, made it easy and intuitive to understand. |
||
}; | ||
|
||
if (days > 0) { | ||
toFormattedPart(days, "days"); | ||
} | ||
if (hours > 0) { | ||
toFormattedPart(hours, "hour"); | ||
} | ||
if (minutes > 0) { | ||
toFormattedPart(minutes, "minute"); | ||
} | ||
if (secs > 0) { | ||
toFormattedPart(secs, "second"); | ||
} | ||
|
||
if (parts.length > 0) { | ||
return `${parts.join(" ")}`; | ||
} | ||
return this.instance.format(0, "second"); // Handle case for 0 seconds | ||
} | ||
} | ||
|
||
export const relativeTimeFormatter = new RelativeTimeFormatter(); | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could you add a few quick unit tests to ensure that this works as expected?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm seeing e2e tests but no unit tests for frontend, do we have the setup for it?