[txn] Fix really large timestamp (#812)

src/components/IndividualPageContent/ContentValue/TimestampValue.tsx

@@ -1,5 +1,5 @@
 import React, {useState} from "react";
-import {parseTimestamp, timestampDisplay} from "../../../pages/utils";
+import {parseTimestampString} from "../../../pages/utils";
 import EmptyValue from "./EmptyValue";
 import ContentCopyIcon from "@mui/icons-material/ContentCopy";
 import {IconButton, Stack, Typography, useTheme} from "@mui/material";
@@ -27,8 +27,7 @@ export default function TimestampValue({
     return <EmptyValue />;
   }
 
-  const moment = parseTimestamp(timestamp, ensureMilliSeconds);
-  const timestamp_display = timestampDisplay(moment);
+  const timestamp_display = parseTimestampString(timestamp, ensureMilliSeconds);
 
   const copyTimestamp = async () => {
     await navigator.clipboard.writeText(timestamp);
@@ -42,9 +41,7 @@ export default function TimestampValue({
 
   return (
     <Stack direction="row" spacing={1} alignItems="center">
-      <Typography fontSize="inherit">
-        {timestamp_display.local_formatted}
-      </Typography>
+      <Typography fontSize="inherit">{timestamp_display}</Typography>
       <StyledTooltip
         title="Timestamp copied"
         placement="right"

src/pages/utils.tsx

@@ -1,6 +1,6 @@
 import moment from "moment";
 
-function ensureMillisecondTimestamp(timestamp: string): number {
+function ensureMillisecondTimestamp(timestamp: string): bigint {
   /*
   Could be: 1646458457
         or: 1646440953658538
@@ -11,24 +11,47 @@ function ensureMillisecondTimestamp(timestamp: string): number {
   if (timestamp.length == 10) {
     timestamp = timestamp + "000";
   }
-  return parseInt(timestamp);
+  return BigInt(timestamp);
 }
 
 export function parseTimestamp(
   timestamp: string,
   ensureMilliSeconds: boolean = true,
 ): moment.Moment {
+  let time: bigint;
   if (ensureMilliSeconds) {
-    return moment(ensureMillisecondTimestamp(timestamp));
+    time = ensureMillisecondTimestamp(timestamp);
   } else {
-    return moment(parseInt(timestamp));
+    time = BigInt(timestamp);
+  }
+  if (time > 8640000000000000n) {
+    return moment(8640000000000000);
+  } else {
+    return moment(parseInt(time.toString()));
+  }
+}
+
+export function parseTimestampString(
+  timestamp: string,
+  ensureMilliSeconds: boolean = true,
+): string {
+  let time: bigint;
+  if (ensureMilliSeconds) {
+    time = ensureMillisecondTimestamp(timestamp);
+  } else {
+    time = BigInt(timestamp);
+  }
+  if (time > 8640000000000000n) {
+    return `> ${timestampDisplay(moment(8640000000000000)).local_formatted}`;
+  } else {
+    return timestampDisplay(moment(parseInt(time.toString()))).local_formatted;
   }
 }
 
 // expiration_timestamp can be user inputted so we don't want to do any ensuring of milliseconds
 // but it comes back at a different factor than what we need for parsing on the frontend
-export function parseExpirationTimestamp(timestamp: string) {
-  return timestamp + "000";
+export function parseExpirationTimestamp(timestamp: string): string {
+  return (BigInt(timestamp) * 1000n).toString(10);
 }
 
 export interface TimestampDisplay {
@@ -106,22 +129,10 @@ export function isNumeric(text: string) {
   return /^-?\d+$/.test(text);
 }
 
-export function getFormattedTimestamp(timestamp?: string): string {
-  if (!timestamp || timestamp === "0") return "-";
-
-  const moment = parseTimestamp(timestamp);
-  const timestamp_display = timestampDisplay(moment);
-
-  return timestamp_display.local_formatted;
-}
-
 export function getTableFormattedTimestamp(timestamp?: string): string {
   if (!timestamp || timestamp === "0") return "-";
 
-  const moment = parseTimestamp(timestamp);
-  const timestamp_display = timestampDisplay(moment);
-
-  return timestamp_display.local_formatted;
+  return parseTimestampString(timestamp);
 }
 
 export function isValidUrl(url: string): boolean {