From e8d9f4f6cf52ae6cc365c4bd39fc69bac1a6fc0c Mon Sep 17 00:00:00 2001
From: Manav Rathi <manav@mnvr.in>
Date: Fri, 21 Feb 2025 12:44:27 +0530
Subject: [PATCH] Conv

---
 web/apps/accounts/src/pages/passkeys/index.tsx |  4 +---
 web/packages/base/date.ts                      |  2 ++
 web/packages/base/i18n-date.ts                 | 17 ++++++++++++++++-
 web/packages/base/i18n.ts                      |  2 ++
 4 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/web/apps/accounts/src/pages/passkeys/index.tsx b/web/apps/accounts/src/pages/passkeys/index.tsx
index d6d501d554..3e3a553907 100644
--- a/web/apps/accounts/src/pages/passkeys/index.tsx
+++ b/web/apps/accounts/src/pages/passkeys/index.tsx
@@ -293,9 +293,7 @@ const ManagePasskeyDrawer: React.FC<ManagePasskeyDrawerProps> = ({
                             onRootClose={onClose}
                         />
                         <CreatedAtEntry>
-                            {formattedDateTime(
-                                new Date(passkey.createdAt / 1000),
-                            )}
+                            {formattedDateTime(passkey.createdAt)}
                         </CreatedAtEntry>
                         <RowButtonGroup>
                             <RowButton
diff --git a/web/packages/base/date.ts b/web/packages/base/date.ts
index f08084f79a..ef46f5dfcb 100644
--- a/web/packages/base/date.ts
+++ b/web/packages/base/date.ts
@@ -1,6 +1,8 @@
 /**
  * Convert an epoch microsecond value to a JavaScript date.
  *
+ * [Note: Remote timestamps are epoch microseconds]
+ *
  * This is a convenience API for dealing with optional epoch microseconds in
  * various data structures. Remote talks in terms of epoch microseconds, but
  * JavaScript dates are underlain by epoch milliseconds, and this does a
diff --git a/web/packages/base/i18n-date.ts b/web/packages/base/i18n-date.ts
index b23fed67f0..bd49fb118c 100644
--- a/web/packages/base/i18n-date.ts
+++ b/web/packages/base/i18n-date.ts
@@ -53,10 +53,25 @@ export const formattedTime = (date: Date) => _timeFormat.format(date);
  * Example:
  * - If within year: "Fri, 21 Feb at 11:51 AM".
  * - Otherwise: "Fri, 21 Feb 2025 at 11:51 AM"
+ *
+ * @param dateOrEpochMicroseconds A JavaScript Date or a numeric epoch
+ * microseconds value.
+ *
+ * As a convenience, this function can be either be directly passed a JavaScript
+ * date, or it can be given the raw epoch microseconds value and it'll convert
+ * internally.
+ *
+ * See: [Note: Remote timestamps are epoch microseconds]
  */
-export const formattedDateTime = (date: Date) =>
+export const formattedDateTime = (dateOrEpochMicroseconds: Date | number) =>
+    _formattedDateTime(toDate(dateOrEpochMicroseconds));
+
+const _formattedDateTime = (date: Date) =>
     [formattedDate(date), t("at"), formattedTime(date)].join(" ");
 
+const toDate = (dm: Date | number) =>
+    typeof dm == "number" ? new Date(dm / 1000) : dm;
+
 let _relativeTimeFormat: Intl.RelativeTimeFormat | undefined;
 
 export const formattedDateRelative = (date: Date) => {
diff --git a/web/packages/base/i18n.ts b/web/packages/base/i18n.ts
index 80407383ec..5b4c6eee33 100644
--- a/web/packages/base/i18n.ts
+++ b/web/packages/base/i18n.ts
@@ -134,6 +134,8 @@ export const setupI18n = async () => {
         // Value is an epoch microsecond so that we can directly pass the
         // timestamps we get from our API responses. The formatter expects
         // milliseconds, so divide by 1000.
+        //
+        // See [Note: Remote timestamps are epoch microseconds].
         return (val) => formatter.format(val / 1000);
     });
 };