chore(cli): tidy timer and image components

Author: brandonkachen

cli/src/components/elapsed-timer.tsx

@@ -7,7 +7,7 @@ import { formatElapsedTime } from '../utils/format-elapsed-time'
 interface ElapsedTimerProps {
   startTime: number | null
   suffix?: string
-  attributes?: number
+  attributes?: TextAttributes
 }
 
 /**
@@ -20,14 +20,9 @@ export const ElapsedTimer = ({
   attributes,
 }: ElapsedTimerProps) => {
   const theme = useTheme()
-  
-  // Calculate elapsed seconds synchronously for SSR/initial render
-  const calculateElapsed = () => {
-    if (!startTime) return 0
-    return Math.floor((Date.now() - startTime) / 1000)
-  }
-  
-  const [elapsedSeconds, setElapsedSeconds] = useState<number>(calculateElapsed)
+  const [elapsedSeconds, setElapsedSeconds] = useState<number>(() =>
+    startTime ? Math.floor((Date.now() - startTime) / 1000) : 0,
+  )
 
   useEffect(() => {
     if (!startTime) {

cli/src/components/image-card.tsx

@@ -108,7 +108,7 @@ export const ImageCard = ({
         {/* Thumbnail or icon area */}
         <box
           style={{
-            height: 3,
+            height: THUMBNAIL_HEIGHT,
             justifyContent: 'center',
             alignItems: 'center',
           }}

cli/src/components/message-block.tsx

@@ -98,9 +98,9 @@ const MessageAttachments = ({
         marginTop: 1,
       }}
     >
-      {attachments.map((attachment, index) => (
+      {attachments.map((attachment) => (
         <ImageCard
-          key={`${attachment.path}-${index}`}
+          key={attachment.path}
           image={attachment}
           showRemoveButton={false}
         />