From ead65fd7d50ead785f437cc895c74146bd232702 Mon Sep 17 00:00:00 2001
From: bndw <ben@bdw.to>
Date: Sun, 1 Mar 2026 12:02:34 -0800
Subject: feat: Create utils directory structure (+4 more)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- ✅ Create utils directory structure
- ✅ Implement formatRelativeTime function with all time ranges
- ✅ Implement formatSessionLabel function
- ✅ Add import to Header.tsx
- ✅ Update session dropdown option rendering
---
 renderer/src/components/Header.tsx |  3 +-
 renderer/src/utils/timeFormat.ts   | 61 ++++++++++++++++++++++++++++++++++++++
 2 files changed, 63 insertions(+), 1 deletion(-)
 create mode 100644 renderer/src/utils/timeFormat.ts

(limited to 'renderer/src')

diff --git a/renderer/src/components/Header.tsx b/renderer/src/components/Header.tsx
index 1d954ec..dc88a73 100644
--- a/renderer/src/components/Header.tsx
+++ b/renderer/src/components/Header.tsx
@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from "react";
 import type { Project, Session, Phase } from "../types";
+import { formatSessionLabel } from "../utils/timeFormat";
 
 const api = window.api;
 
@@ -165,7 +166,7 @@ export function Header({
                 <option value="">Select Session...</option>
                 {sessions.map((s) => (
                   <option key={s.id} value={s.id}>
-                    {s.name}
+                    {formatSessionLabel(s.name, s.updated_at)}
                   </option>
                 ))}
               </select>
diff --git a/renderer/src/utils/timeFormat.ts b/renderer/src/utils/timeFormat.ts
new file mode 100644
index 0000000..db0f99b
--- /dev/null
+++ b/renderer/src/utils/timeFormat.ts
@@ -0,0 +1,61 @@
+/**
+ * Format a Unix timestamp (seconds) into a relative time string.
+ * Examples: "now", "5m", "2h", "3d", "1w", "2mo", "1y"
+ */
+export function formatRelativeTime(timestamp: number): string {
+  const now = Math.floor(Date.now() / 1000); // Current time in seconds
+  const diffSeconds = now - timestamp;
+
+  // Handle future timestamps (shouldn't happen, but be defensive)
+  if (diffSeconds < 0) {
+    return "now";
+  }
+
+  // Less than 1 minute
+  if (diffSeconds < 60) {
+    return "now";
+  }
+
+  // Less than 1 hour (show minutes)
+  if (diffSeconds < 3600) {
+    const minutes = Math.floor(diffSeconds / 60);
+    return `${minutes}m`;
+  }
+
+  // Less than 24 hours (show hours)
+  if (diffSeconds < 86400) {
+    const hours = Math.floor(diffSeconds / 3600);
+    return `${hours}h`;
+  }
+
+  // Less than 7 days (show days)
+  if (diffSeconds < 604800) {
+    const days = Math.floor(diffSeconds / 86400);
+    return `${days}d`;
+  }
+
+  // Less than 4 weeks (show weeks)
+  if (diffSeconds < 2419200) {
+    const weeks = Math.floor(diffSeconds / 604800);
+    return `${weeks}w`;
+  }
+
+  // Less than 12 months (show months)
+  if (diffSeconds < 31536000) {
+    const months = Math.floor(diffSeconds / 2592000); // Approximate: 30 days per month
+    return `${months}mo`;
+  }
+
+  // 12 months or more (show years)
+  const years = Math.floor(diffSeconds / 31536000);
+  return `${years}y`;
+}
+
+/**
+ * Format session name with relative time indicator.
+ * Example: "Session Name • 2h"
+ */
+export function formatSessionLabel(name: string, updatedAt: number): string {
+  const relativeTime = formatRelativeTime(updatedAt);
+  return `${name} • ${relativeTime}`;
+}
-- 
cgit v1.2.3