feat(inbox): show relative timestamp on signal cards

apps/code/src/renderer/components/ui/RelativeTimestamp.tsx

@@ -0,0 +1,34 @@
+import { Tooltip } from "@components/ui/Tooltip";
+import { Text } from "@radix-ui/themes";
+import { formatRelativeTimeLong } from "@utils/time";
+
+interface RelativeTimestampProps {
+  timestamp: string | number | Date | null | undefined;
+  className?: string;
+}
+
+export function RelativeTimestamp({
+  timestamp,
+  className,
+}: RelativeTimestampProps) {
+  const date =
+    timestamp instanceof Date
+      ? timestamp
+      : timestamp !== null && timestamp !== undefined
+        ? new Date(timestamp)
+        : null;
+
+  if (date === null || Number.isNaN(date.getTime())) {
+    return null;
+  }
+
+  return (
+    <Tooltip content={date.toLocaleString()}>
+      <Text
+        className={`shrink-0 text-(--gray-10) text-[11px] ${className ?? ""}`}
+      >
+        {formatRelativeTimeLong(date.getTime())}
+      </Text>
+    </Tooltip>
+  );
+}

apps/code/src/renderer/features/inbox/components/detail/SignalCard.tsx

@@ -1,3 +1,4 @@
+import { RelativeTimestamp } from "@components/ui/RelativeTimestamp";
 import { useAuthStateValue } from "@features/auth/hooks/authQueries";
 import { MarkdownRenderer } from "@features/editor/components/MarkdownRenderer";
 import { SOURCE_PRODUCT_META } from "@features/inbox/components/utils/source-product-icons";
@@ -261,6 +262,7 @@ function SignalCardHeader({
         {signalCardSourceLine(signal)}
       </Text>
       <span className="flex-1" />
+      <RelativeTimestamp timestamp={signal.timestamp} />
       {verified === true && <VerificationBadge />}
     </Flex>
   );
@@ -769,9 +771,6 @@ function GenericSignalCard({
     <Box className="min-w-0 overflow-hidden rounded-lg border border-gray-6 bg-gray-1 p-3">
       <SignalCardHeader signal={signal} verified={verified} />
       <CollapsibleBody body={signal.content} />
-      <Text className="mt-2 block text-(--gray-10) text-[11px]">
-        {new Date(signal.timestamp).toLocaleString()}
-      </Text>
       <CodePathsCollapsible paths={codePaths ?? []} />
       <DataQueriedCollapsible text={dataQueried ?? ""} />
     </Box>