Show long cache values as days/hours/minutes. (#144)

Author: tobli

src/ts/helpers/parse.ts

@@ -65,6 +65,24 @@ export function formatMilliseconds(millis: number): string {
   return `${roundNumber(millis, 3)} ms`;
 }
 
+const SECONDS_PER_MINUTE = 60;
+const SECONDS_PER_HOUR = 60 * SECONDS_PER_MINUTE;
+const SECONDS_PER_DAY = 24 * SECONDS_PER_HOUR;
+
+export function formatSeconds(seconds: number): string {
+  const raw = `${roundNumber(seconds, 3)} s`;
+  if (seconds > SECONDS_PER_DAY) {
+    return `${raw} (~${roundNumber(seconds / SECONDS_PER_DAY, 0)} days)`;
+  }
+  if (seconds > SECONDS_PER_HOUR) {
+    return `${raw} (~${roundNumber(seconds / SECONDS_PER_HOUR, 0)} hours)`;
+  }
+  if (seconds > SECONDS_PER_MINUTE) {
+    return `${raw} (~${roundNumber(seconds / SECONDS_PER_MINUTE, 0)} minutes)`;
+  }
+  return raw;
+}
+
 export function formatDateLocalized(date: Date): string {
   return `${date.toUTCString()}</br>(local time: ${date.toLocaleString()})`;
 }

src/ts/waterfall/details-overlay/extract-details-keys.ts

@@ -1,6 +1,6 @@
 import {getHeader} from "../../helpers/har";
 import {
-  formatBytes, formatDateLocalized, formatMilliseconds, parseAndFormat, parseDate, parseNonEmpty,
+  formatBytes, formatDateLocalized, formatMilliseconds, formatSeconds, parseAndFormat, parseDate, parseNonEmpty,
   parseNonNegative, parsePositive,
 } from "../../helpers/parse";
 import {Entry, Header} from "../../typing/har";
@@ -31,7 +31,7 @@ function parseGeneralDetails(entry: WaterfallEntry, requestID: number): KvTuple[
     ["IP", harEntry._ip_addr],
     ["Client Port", parseAndFormat(harEntry._client_port, parsePositive)],
     ["Expires", harEntry._expires],
-    ["Cache Time", parseAndFormat(harEntry._cache_time, parsePositive)],
+    ["Cache Time", parseAndFormat(harEntry._cache_time, parsePositive, formatSeconds)],
     ["CDN Provider", harEntry._cdn_provider],
     byteSizeProperty("ObjectSize", harEntry._objectSize),
     byteSizeProperty("Bytes In (downloaded)", harEntry._bytesIn),
@@ -113,7 +113,7 @@ function parseResponseDetails(harEntry: Entry): KvTuple[] {
     stringHeader("Connection"),
     stringHeader("ETag"),
     stringHeader("Accept-Patch"),
-    stringHeader("Age"),
+    ["Age", parseAndFormat(getHeader(headers, "Age"), parseNonNegative, formatSeconds)],
     stringHeader("Allow"),
     stringHeader("Content-Disposition"),
     stringHeader("Location"),