refactor: update TTSTable component to improve date formatting and remove Sound ID display

src/components/tts/TTSTable.tsx

@@ -1,5 +1,4 @@
-import { format } from 'date-fns'
-import { CheckCircle, Clock, Loader, Mic, Trash2, Volume2 } from 'lucide-react'
+import { Calendar, CheckCircle, Loader, Mic, Trash2, Volume2 } from 'lucide-react'
 
 import { Badge } from '@/components/ui/badge'
 import { Button } from '@/components/ui/button'
@@ -15,6 +14,7 @@ import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip
 import { type TTSResponse, ttsService } from '@/lib/api/services/tts'
 import { soundsService } from '@/lib/api/services/sounds'
 import { toast } from 'sonner'
+import { formatDateDistanceToNow } from '@/utils/format-date'
 
 interface TTSTableProps {
   ttsHistory: TTSResponse[]
@@ -86,7 +86,6 @@ export function TTSTable({ ttsHistory, onTTSDeleted }: TTSTableProps) {
             <TableHead>Status</TableHead>
             <TableHead>Options</TableHead>
             <TableHead>Created</TableHead>
-            <TableHead>Sound ID</TableHead>
             <TableHead className="w-[120px]">Actions</TableHead>
           </TableRow>
         </TableHeader>
@@ -122,17 +121,10 @@ export function TTSTable({ ttsHistory, onTTSDeleted }: TTSTableProps) {
               </TableCell>
               <TableCell>
                 <div className="flex items-center gap-1 text-sm text-muted-foreground">
-                  <Clock className="h-3 w-3" />
-                  {format(new Date(tts.created_at), 'MMM dd, yyyy HH:mm')}
+                  <Calendar className="h-3 w-3" />
+                 {formatDateDistanceToNow(tts.created_at)}
                 </div>
               </TableCell>
-              <TableCell>
-                {tts.sound_id ? (
-                  <span className="text-sm font-mono">{tts.sound_id}</span>
-                ) : (
-                  <span className="text-muted-foreground text-sm">-</span>
-                )}
-              </TableCell>
               <TableCell>
                 <div className="flex items-center gap-1">
                   <Tooltip>