Use relative formatting for ls output (#270)

packages/replay/src/cli/formatRecordings.ts

@@ -6,6 +6,28 @@ import table from "text-table";
 import { generateDefaultTitle } from "../generateDefaultTitle";
 import { ExternalRecordingEntry } from "../types";
 
+const MsPerSecond = 1000;
+const MsPerMinute = MsPerSecond * 60;
+const MsPerHour = MsPerMinute * 60;
+const MsPerDay = MsPerHour * 24;
+
+function formatTime(time: Date) {
+  const fmt = new Intl.RelativeTimeFormat("en", {
+    style: "long",
+  });
+
+  const ds = Date.now() - time.getTime();
+  if (ds < MsPerMinute) {
+    return fmt.format(Math.round(-ds / MsPerSecond), "second");
+  } else if (ds < MsPerHour) {
+    return fmt.format(Math.round(-ds / MsPerMinute), "minute");
+  } else if (ds < MsPerDay) {
+    return fmt.format(Math.round(-ds / MsPerHour), "hour");
+  }
+
+  return fmt.format(Math.round(-ds / MsPerDay), "day");
+}
+
 export function formatAllRecordingsHumanReadable(recordings: ExternalRecordingEntry[]) {
   // sort by created at date
   recordings.sort((a, b) => {
@@ -16,11 +38,11 @@ export function formatAllRecordingsHumanReadable(recordings: ExternalRecordingEn
       typeof recording.metadata?.title === "string"
         ? recording.metadata.title
         : generateDefaultTitle(recording.metadata);
-    return [recording.id, recording.status, title || "", recording.createTime.toISOString()];
+    return [recording.id, recording.status, title || "", formatTime(recording.createTime)];
   });
 
   const tableBody: Array<Array<string>> = [
-    ["ID", "Status", "Title", "Created At"],
+    ["ID", "Status", "Title", "Created"],
     ...formattedRecordings,
   ];