Skip to content

Commit

Permalink
VTAdmin: Show time elapsed in seconds instead of dayjs relative time
Browse files Browse the repository at this point in the history
Signed-off-by: Noble Mittal <noblemittal@outlook.com>
  • Loading branch information
beingnoble03 committed Sep 19, 2024
1 parent 9d47262 commit b1918eb
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 3 deletions.
6 changes: 4 additions & 2 deletions web/vtadmin/src/components/routes/Transactions.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ import { Select } from '../inputs/Select';
import { FetchTransactionsParams } from '../../api/http';
import { formatTransactionState } from '../../util/transactions';
import { ShardLink } from '../links/ShardLink';
import { formatDateTime, formatRelativeTime } from '../../util/time';
import { formatDateTime, formatRelativeTimeInSeconds } from '../../util/time';
import { orderBy } from 'lodash-es';

const COLUMNS = ['ID', 'State', 'Participants', 'Time Created'];
Expand Down Expand Up @@ -78,7 +78,9 @@ export const Transactions = () => {
</DataCell>
<DataCell>
<div className="font-sans whitespace-nowrap">{formatDateTime(row.time_created)}</div>
<div className="font-sans text-sm text-secondary">{formatRelativeTime(row.time_created)}</div>
<div className="font-sans text-sm text-secondary">
{formatRelativeTimeInSeconds(row.time_created)}
</div>
</DataCell>
</tr>
);
Expand Down
10 changes: 9 additions & 1 deletion web/vtadmin/src/util/time.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import * as dayjs from 'dayjs';
import dayjs from 'dayjs';
import localizedFormat from 'dayjs/plugin/localizedFormat';
import relativeTime from 'dayjs/plugin/relativeTime';

Expand Down Expand Up @@ -44,3 +44,11 @@ export const formatRelativeTime = (timestamp: number | Long | null | undefined):
export const formatDateTimeShort = (timestamp: number | Long | null | undefined): string | null => {
return format(timestamp, 'MM/DD/YY HH:mm:ss Z');
};

export const formatRelativeTimeInSeconds = (timestamp: number | Long | null | undefined): string | null => {
const u = parse(timestamp);
if (!u) return null;
const currentTime = dayjs();
const secondsElapsed = currentTime.diff(u, 'second');
return `${secondsElapsed} seconds ago`;
};

0 comments on commit b1918eb

Please sign in to comment.