Optimize timestamp updates with variable intervals and visibility detection

Co-authored-by: alexr00 <38270282+alexr00@users.noreply.github.com>

Author: Copilot

webviews/components/timestamp.tsx

@@ -15,13 +15,70 @@ export const Timestamp = ({ date, href }: { date: Date | string; href?: string }
 		// Update the time string immediately
 		setTimeString(dateFromNow(date));
 
-		// Set up an interval to update the time string every minute
-		const intervalId = setInterval(() => {
-			setTimeString(dateFromNow(date));
-		}, 60000); // Update every 60 seconds
+		// Calculate appropriate update interval based on how old the timestamp is
+		const getUpdateInterval = () => {
+			const now = Date.now();
+			const timestamp = typeof date === 'string' ? new Date(date).getTime() : date.getTime();
+			const ageInMinutes = (now - timestamp) / (1000 * 60);
+			
+			// For very recent timestamps (< 1 hour), update every minute
+			if (ageInMinutes < 60) {
+				return 60000; // 1 minute
+			}
+			// For timestamps < 1 day old, update every 5 minutes
+			else if (ageInMinutes < 60 * 24) {
+				return 5 * 60000; // 5 minutes
+			}
+			// For older timestamps, update less frequently or not at all
+			// since they likely show absolute dates
+			else {
+				return 15 * 60000; // 15 minutes
+			}
+		};
 
-		// Clean up the interval on component unmount
-		return () => clearInterval(intervalId);
+		const intervalDuration = getUpdateInterval();
+		let intervalId: number;
+
+		const updateTimeString = () => {
+			// Only update if the page is visible
+			if (document.visibilityState === 'visible') {
+				setTimeString(dateFromNow(date));
+			}
+		};
+
+		const startInterval = () => {
+			intervalId = window.setInterval(updateTimeString, intervalDuration);
+		};
+
+		const handleVisibilityChange = () => {
+			if (document.visibilityState === 'visible') {
+				// Page became visible, update immediately and restart interval
+				setTimeString(dateFromNow(date));
+				if (intervalId) {
+					clearInterval(intervalId);
+				}
+				startInterval();
+			} else {
+				// Page became hidden, pause the interval
+				if (intervalId) {
+					clearInterval(intervalId);
+				}
+			}
+		};
+
+		// Start the interval
+		startInterval();
+
+		// Listen for visibility changes
+		document.addEventListener('visibilitychange', handleVisibilityChange);
+
+		// Clean up on component unmount
+		return () => {
+			if (intervalId) {
+				clearInterval(intervalId);
+			}
+			document.removeEventListener('visibilitychange', handleVisibilityChange);
+		};
 	}, [date]);
 
 	return href ? (