fix : action icons overlap session title in chat history (#5684)

Signed-off-by: Abhijay007 <Abhijay007j@gmail.com>
This commit is contained in:
Abhijay Jain
2025-11-12 01:18:44 +05:30
committed by GitHub
parent a2c862b749
commit 775bd90846
@@ -532,33 +532,34 @@ const SessionListView: React.FC<SessionListViewProps> = React.memo(
className="session-item h-full py-3 px-4 hover:shadow-default cursor-pointer transition-all duration-150 flex flex-col justify-between relative group" className="session-item h-full py-3 px-4 hover:shadow-default cursor-pointer transition-all duration-150 flex flex-col justify-between relative group"
ref={(el) => setSessionRefs(session.id, el)} ref={(el) => setSessionRefs(session.id, el)}
> >
<div className="absolute top-3 right-4 flex gap-1 opacity-0 group-hover:opacity-100 transition-opacity"> <div className="flex items-start justify-between gap-2 mb-1">
<button <h3 className="text-base break-words line-clamp-2 flex-1 min-w-0">{session.name}</h3>
onClick={handleEditClick} <div className="flex gap-1 opacity-0 group-hover:opacity-100 transition-opacity flex-shrink-0">
className="p-2 rounded hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer" <button
title="Edit session name" onClick={handleEditClick}
> className="p-2 rounded hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer"
<Edit2 className="w-3 h-3 text-textSubtle hover:text-textStandard" /> title="Edit session name"
</button> >
<button <Edit2 className="w-3 h-3 text-textSubtle hover:text-textStandard" />
onClick={handleDeleteClick} </button>
className="p-2 rounded hover:bg-red-50 dark:hover:bg-red-900/20 cursor-pointer transition-colors" <button
title="Delete session" onClick={handleDeleteClick}
> className="p-2 rounded hover:bg-red-50 dark:hover:bg-red-900/20 cursor-pointer transition-colors"
<Trash2 className="w-3 h-3 text-red-500 hover:text-red-600" /> title="Delete session"
</button> >
<button <Trash2 className="w-3 h-3 text-red-500 hover:text-red-600" />
onClick={handleExportClick} </button>
className="p-2 rounded hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer" <button
title="Export session" onClick={handleExportClick}
> className="p-2 rounded hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer"
<Download className="w-3 h-3 text-textSubtle hover:text-textStandard" /> title="Export session"
</button> >
<Download className="w-3 h-3 text-textSubtle hover:text-textStandard" />
</button>
</div>
</div> </div>
<div className="flex-1"> <div className="flex-1">
<h3 className="text-base mb-1 pr-16 break-words">{session.name}</h3>
<div className="flex items-center text-text-muted text-xs mb-1"> <div className="flex items-center text-text-muted text-xs mb-1">
<Calendar className="w-3 h-3 mr-1 flex-shrink-0" /> <Calendar className="w-3 h-3 mr-1 flex-shrink-0" />
<span>{formatMessageTimestamp(Date.parse(session.updated_at) / 1000)}</span> <span>{formatMessageTimestamp(Date.parse(session.updated_at) / 1000)}</span>