updates

internal/site/src/components/network-probes-table/network-probes-columns.tsx

@@ -226,7 +226,10 @@ export function getProbeColumns(
 			header: ({ column }) => <HeaderButton column={column} name={t`Updated`} Icon={ClockIcon} />,
 			cell: ({ getValue }) => {
 				const timestamp = getValue() as number
-				return <span className="ms-1.5 tabular-nums">{hourWithSeconds(new Date(timestamp).toISOString())}</span>
+				if (!timestamp) {
+					return <span className="ms-1.5 text-muted-foreground">-</span>
+				}
+				return <span className="ms-1.5 tabular-nums">{hourWithSeconds(timestamp)}</span>
 			},
 		},
 		{

internal/site/src/components/routes/system/chart-data.ts

@@ -48,13 +48,14 @@ export async function getStats<T extends SystemStatsRecord | ContainerStatsRecor
 	collection: string,
 	systemId: string,
 	chartTime: ChartTimes,
-	cachedStats?: { created: string | number | null }[]
+	cachedStats?: { created: string | number | null }[],
+	createdIsNumber?: boolean
 ): Promise<T[]> {
 	const lastCached = cachedStats?.at(-1)?.created as number
 	return await pb.collection<T>(collection).getFullList({
 		filter: pb.filter("system={:id} && created > {:created} && type={:type}", {
 			id: systemId,
-			created: getPbTimestamp(chartTime, lastCached ? new Date(lastCached + 1000) : undefined),
+			created: getPbTimestamp(chartTime, lastCached ? new Date(lastCached + 1000) : undefined, createdIsNumber),
 			type: chartTimeData[chartTime].type,
 		}),
 		fields: "created,stats",

internal/site/src/lib/api.ts

@@ -54,8 +54,11 @@ export async function updateUserSettings() {
 	}
 }
 
-export function getPbTimestamp(timeString: ChartTimes, d?: Date) {
+export function getPbTimestamp(timeString: ChartTimes, d?: Date, createdIsNumber?: boolean) {
 	d ||= chartTimeData[timeString].getOffset(new Date())
+	if (createdIsNumber) {
+		return d.getTime()
+	}
 	const year = d.getUTCFullYear()
 	const month = String(d.getUTCMonth() + 1).padStart(2, "0")
 	const day = String(d.getUTCDate()).padStart(2, "0")

internal/site/src/lib/use-network-probes.ts

@@ -196,7 +196,7 @@ export function useNetworkProbesData(props: UseNetworkProbesProps) {
 			}
 		}
 
-		getStats<NetworkProbeStatsRecord>("network_probe_stats", systemId, chartTime, cachedProbeStats).then(
+		getStats<NetworkProbeStatsRecord>("network_probe_stats", systemId, chartTime, cachedProbeStats, true).then(
 			(probeStats) => {
 				// If another request has been made since this one, ignore the results
 				if (requestId !== statsRequestId.current) {

internal/site/src/lib/utils.ts

@@ -72,7 +72,7 @@ export const formatShortDate = (timestamp: string) => {
 	return shortDateFormatter.format(new Date(timestamp))
 }
 
-export const hourWithSeconds = (timestamp: string) => {
+export const hourWithSeconds = (timestamp: string | number) => {
 	return hourWithSecondsFormatter.format(new Date(timestamp))
 }
 
@@ -111,17 +111,18 @@ export const updateFavicon = (() => {
     </linearGradient>
   </defs>
   <path fill="url(#gradient)" d="M35 70H0V0h35q4.4 0 8.2 1.7a21.4 21.4 0 0 1 6.6 4.5q2.9 2.8 4.5 6.6Q56 16.7 56 21a15.4 15.4 0 0 1-.3 3.2 17.6 17.6 0 0 1-.2.8 19.4 19.4 0 0 1-1.5 4 17 17 0 0 1-2.4 3.4 13.5 13.5 0 0 1-2.6 2.3 12.5 12.5 0 0 1-.4.3q1.7 1 3 2.5Q53 39.1 54 41a18.3 18.3 0 0 1 1.5 4 17.4 17.4 0 0 1 .5 3 15.3 15.3 0 0 1 0 1q0 4.4-1.7 8.2a21.4 21.4 0 0 1-4.5 6.6q-2.8 2.9-6.6 4.6Q39.4 70 35 70ZM14 14v14h21a7 7 0 0 0 2.3-.3 6.6 6.6 0 0 0 .4-.2Q39 27 40 26a6.9 6.9 0 0 0 1.5-2.2q.5-1.3.5-2.8a7 7 0 0 0-.4-2.3 6.6 6.6 0 0 0-.1-.4Q40.9 17 40 16a7 7 0 0 0-2.3-1.4 6.9 6.9 0 0 0-2.5-.6 7.9 7.9 0 0 0-.2 0H14Zm0 28v14h21a7 7 0 0 0 2.3-.4 6.6 6.6 0 0 0 .4-.1Q39 54.9 40 54a7 7 0 0 0 1.5-2.2 6.9 6.9 0 0 0 .5-2.6 7.9 7.9 0 0 0 0-.2 7 7 0 0 0-.4-2.3 6.6 6.6 0 0 0-.1-.4Q40.9 45 40 44a7 7 0 0 0-2.3-1.5 6.9 6.9 0 0 0-2.5-.6 7.9 7.9 0 0 0-.2 0H14Z"/>
-  ${downCount > 0 &&
-			`
+  ${
+		downCount > 0 &&
+		`
 		<circle cx="40" cy="50" r="22" fill="#f00"/>
   	<text x="40" y="60" font-size="34" text-anchor="middle" fill="#fff" font-family="Arial" font-weight="bold">${downCount}</text>
 	`
-			}
+	}
 </svg>
 	`
 		const blob = new Blob([svg], { type: "image/svg+xml" })
 		const url = URL.createObjectURL(blob)
-			; (document.querySelector("link[rel='icon']") as HTMLLinkElement).href = url
+		;(document.querySelector("link[rel='icon']") as HTMLLinkElement).href = url
 	}
 })()
 
@@ -365,12 +366,12 @@ export function formatDuration(
 		.join(" ")
 }
 
-/** Parse semver string into major, minor, and patch numbers 
+/** Parse semver string into major, minor, and patch numbers
  * @example
  * const semVer = "1.2.3"
  * const { major, minor, patch } = parseSemVer(semVer)
  * console.log(major, minor, patch) // 1, 2, 3
-*/
+ */
 export const parseSemVer = (semVer = ""): SemVer => {
 	// if (semVer.startsWith("v")) {
 	// 	semVer = semVer.slice(1)
@@ -452,7 +453,12 @@ export function secondsToString(seconds: number, unit: "hour" | "minute" | "day"
 	const countString = count.toLocaleString()
 	switch (unit) {
 		case "minute":
-			return plural(count, { one: `${countString} minute`, few: `${countString} minutes`, many: `${countString} minutes`, other: `${countString} minutes` })
+			return plural(count, {
+				one: `${countString} minute`,
+				few: `${countString} minutes`,
+				many: `${countString} minutes`,
+				other: `${countString} minutes`,
+			})
 		case "hour":
 			return plural(count, { one: `${countString} hour`, other: `${countString} hours` })
 		case "day":
@@ -469,4 +475,4 @@ export function secondsToUptimeString(seconds: number): string {
 	} else {
 		return secondsToString(seconds, "day")
 	}
-}
+}