fix: Memoize formatRelativeTime per thread item

- Wrap formatRelativeTime call in useMemo with thread.updatedAt dependency
- Prevents creating new Date() on every render for each thread item
- Improves thread list rendering performance

Fixes: #1100
This commit is contained in:
Universe Creator 2026-04-04 05:44:17 +03:00
parent 24a2406860
commit fe744c8d8d

View file

@ -9,7 +9,7 @@ import {
TrashIcon,
} from "lucide-react";
import { useRouter } from "next/navigation";
import { memo, useCallback, useEffect, useState } from "react";
import { memo, useCallback, useEffect, useMemo, useState } from "react";
import { Button } from "@/components/ui/button";
import {
DropdownMenu,
@ -237,7 +237,10 @@ const ThreadListItemComponent = memo(function ThreadListItemComponent({
<div className="flex-1 min-w-0">
<p className="truncate text-sm font-medium">{thread.title || "New Chat"}</p>
<p className="truncate text-xs text-muted-foreground">
{formatRelativeTime(new Date(thread.updatedAt))}
{useMemo(
() => formatRelativeTime(new Date(thread.updatedAt)),
[thread.updatedAt]
)}
</p>
</div>
<DropdownMenu>