X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/d4489afef9924986e7a04201602f2b810ddfa9d2..ad79cd83fc26c3314a6c79137db02b12d1f2714a:/src/common/formatters.ts

diff --git a/src/common/formatters.ts b/src/common/formatters.ts
index 377e78e4..d8228bf5 100644
--- a/src/common/formatters.ts
+++ b/src/common/formatters.ts
@@ -3,6 +3,7 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import { PropertyValue } from "~/models/search-bar";
+import { Vocabulary, getTagKeyLabel, getTagValueLabel } from "~/models/vocabulary";
 
 export const formatDate = (isoDate?: string | null, utc: boolean = false) => {
     if (isoDate) {
@@ -19,21 +20,31 @@ export const formatDate = (isoDate?: string | null, utc: boolean = false) => {
     return "(none)";
 };
 
-export const formatFileSize = (size?: number) => {
+export const formatFileSize = (size?: number | string) => {
     if (typeof size === "number") {
+        if (size === 0) { return "0 B"; }
+
         for (const { base, unit } of FILE_SIZES) {
             if (size >= base) {
                 return `${(size / base).toFixed()} ${unit}`;
             }
         }
+    } 
+    if ((typeof size === "string" && size === '') || size === undefined) {
+        return '';
     }
-    return "";
+    return "0 B";
 };
 
-export const formatTime = (time: number) => {
+export const formatTime = (time: number, seconds?: boolean) => {
     const minutes = Math.floor(time / (1000 * 60) % 60).toFixed(0);
     const hours = Math.floor(time / (1000 * 60 * 60)).toFixed(0);
 
+    if (seconds) {
+        const seconds = Math.floor(time / (1000) % 60).toFixed(0);
+        return hours + "h " + minutes + "m " + seconds + "s";
+    }
+
     return hours + "h " + minutes + "m";
 };
 
@@ -76,7 +87,10 @@ const FILE_SIZES = [
     }
 ];
 
-export const formatPropertyValue = (pv: PropertyValue) => {
+export const formatPropertyValue = (pv: PropertyValue, vocabulary?: Vocabulary) => {
+    if (vocabulary && pv.keyID && pv.valueID) {
+        return `${getTagKeyLabel(pv.keyID, vocabulary)}: ${getTagValueLabel(pv.keyID, pv.valueID!, vocabulary)}`;
+    }
     if (pv.key) {
         return pv.value
             ? `${pv.key}: ${pv.value}`