feat(task-list): refine task list components and improve UI consistency

- Updated SubtaskLoadingSkeleton and TaskRow components for better spacing and visual consistency.
- Simplified TaskGroupHeader by removing unnecessary elements and enhancing the display of group names.
- Adjusted TaskListV2 to improve column rendering and added state management for field visibility synchronization with the database.
- Enhanced AddTaskRow and AddSubtaskRow components for improved user interaction and layout.
- Updated placeholder texts in CustomColumnComponents for better clarity.
This commit is contained in:
chamiakJ
2025-07-07 03:39:39 +05:30
parent 01298928c7
commit 746d38017f
9 changed files with 226 additions and 195 deletions

View File

@@ -26,7 +26,6 @@ const SubtaskLoadingSkeleton: React.FC<SubtaskLoadingSkeletonProps> = ({ visible
case 'title':
return (
<div style={baseStyle} className="flex items-center">
{/* Subtask indentation - tighter spacing */}
<div className="w-4" />
<div className="w-2" />
<div className="h-4 w-32 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" />
@@ -35,7 +34,7 @@ const SubtaskLoadingSkeleton: React.FC<SubtaskLoadingSkeletonProps> = ({ visible
case 'description':
return (
<div style={baseStyle} className="flex items-center px-2">
<div className="h-4 w-40 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" />
<div className="h-4 w-24 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" />
</div>
);
case 'status':
@@ -66,7 +65,7 @@ const SubtaskLoadingSkeleton: React.FC<SubtaskLoadingSkeletonProps> = ({ visible
case 'progress':
return (
<div style={baseStyle} className="flex items-center">
<div className="h-2 w-16 bg-gray-200 dark:bg-gray-700 rounded-full animate-pulse" />
<div className="h-4 w-16 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" />
</div>
);
case 'labels':
@@ -91,7 +90,7 @@ const SubtaskLoadingSkeleton: React.FC<SubtaskLoadingSkeletonProps> = ({ visible
case 'estimation':
return (
<div style={baseStyle} className="flex items-center">
<div className="h-4 w-10 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" />
<div className="h-4 w-8 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" />
</div>
);
case 'startDate':
@@ -132,7 +131,7 @@ const SubtaskLoadingSkeleton: React.FC<SubtaskLoadingSkeletonProps> = ({ visible
return (
<div className="bg-gray-50 dark:bg-gray-800/50 border-l-2 border-blue-200 dark:border-blue-700">
<div className="flex items-center min-w-max px-4 py-2 border-b border-gray-200 dark:border-gray-700">
{visibleColumns.map((column) => (
{visibleColumns.map((column, index) => (
<div key={column.id}>
{renderColumn(column.id, column.width)}
</div>