change display format of the container uptime (#3706)

* change display format of the container uptime

Display `day, hour, min` if days is more than 0, otherwise default to existing `hour, min, sec`. Removes pads to make it more clean in this new format.

* clean the return
This commit is contained in:
Alex 2021-10-25 00:41:01 +03:00 committed by GitHub
parent c4ab318d5a
commit 4dca4f0aa9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 8 deletions

View file

@ -92,7 +92,7 @@ const ServerDetailsBlock = () => {
/>
 {!status ? 'Connecting...' : (isInstalling ? 'Installing' : (isTransferring) ? 'Transferring' : status)}
{stats.uptime > 0 &&
<span css={tw`ml-2`}>
<span css={tw`ml-2 lowercase`}>
(<UptimeDuration uptime={stats.uptime / 1000}/>)
</span>
}

View file

@ -1,14 +1,15 @@
import React from 'react';
export default ({ uptime }: { uptime: number }) => {
const hours = Math.floor(Math.floor(uptime) / 60 / 60);
const days = Math.floor(uptime / (24 * 60 * 60));
const hours = Math.floor(Math.floor(uptime) / 60 / 60 % 24);
const remainder = Math.floor(uptime - (hours * 60 * 60));
const minutes = Math.floor(remainder / 60);
const minutes = Math.floor(remainder / 60 % 60);
const seconds = remainder % 60;
return (
<>
{hours.toString().padStart(2, '0')}:{minutes.toString().padStart(2, '0')}:{seconds.toString().padStart(2, '0')}
</>
);
if (days > 0) {
return <>{days}d {hours}h {minutes}m</>;
}
return <>{hours}h {minutes}m {seconds}s</>;
};