From b72031241db7ce1a3f4fcf51f4645bcec7fe7da3 Mon Sep 17 00:00:00 2001
From: Andy <119136210+AndyMik90@users.noreply.github.com>
Date: Sat, 3 Jan 2026 23:57:10 +0100
Subject: [PATCH] fix(ui): update TaskCard description truncation for improved
display (#637)
- Changed the description truncation logic in TaskCard to show a maximum of 120 characters instead of 0, allowing for a more informative preview.
- Updated the CSS class to apply a line clamp for better visual consistency in the card layout.
This change enhances the user experience by providing a clearer view of task descriptions while still allowing full details to be accessed in the modal.
---
apps/frontend/src/renderer/components/TaskCard.tsx | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/apps/frontend/src/renderer/components/TaskCard.tsx b/apps/frontend/src/renderer/components/TaskCard.tsx
index cc3d7bb9..52c14533 100644
--- a/apps/frontend/src/renderer/components/TaskCard.tsx
+++ b/apps/frontend/src/renderer/components/TaskCard.tsx
@@ -100,9 +100,9 @@ export const TaskCard = memo(function TaskCard({ task, onClick }: TaskCardProps)
const isIncomplete = isIncompleteHumanReview(task);
// Memoize expensive computations to avoid running on every render
- // Pass 0 to disable truncation - show full description on cards
+ // Truncate description for card display - full description shown in modal
const sanitizedDescription = useMemo(
- () => task.description ? sanitizeMarkdownForDisplay(task.description, 0) : null,
+ () => task.description ? sanitizeMarkdownForDisplay(task.description, 120) : null,
[task.description]
);
@@ -279,7 +279,7 @@ export const TaskCard = memo(function TaskCard({ task, onClick }: TaskCardProps)
{/* Description - sanitized to handle markdown content (memoized) */}
{sanitizedDescription && (
-
+
{sanitizedDescription}
)}