feat(task-filters): enhance localization and UI for task filters

- Added new translation keys for task filter functionalities across multiple languages, improving user experience and accessibility.
- Updated the ImprovedTaskFilters component to utilize localized strings for search placeholders, loading states, and filter messages.
- Enhanced styling for filter buttons and dropdowns to ensure consistency in both light and dark modes.
- Introduced a description column in task management components, improving the display of task details.

worklenz-frontend/src/components/task-list-v2/SubtaskLoadingSkeleton.tsx

@@ -32,6 +32,12 @@ const SubtaskLoadingSkeleton: React.FC<SubtaskLoadingSkeletonProps> = ({ visible
             <div className="h-4 w-32 bg-gray-200 dark:bg-gray-700 rounded animate-pulse" />
           </div>
         );
+      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>
+        );
       case 'status':
         return (
           <div style={baseStyle} className="flex items-center">

worklenz-frontend/src/components/task-list-v2/TaskRow.tsx

@@ -352,6 +352,24 @@ const TaskRow: React.FC<TaskRowProps> = memo(({ taskId, projectId, visibleColumn
           </div>
         );
 
+      case 'description':
+        return (
+          <div style={baseStyle} className="px-2">
+            <div
+              className="text-sm text-gray-600 dark:text-gray-400 truncate"
+              style={{
+                whiteSpace: 'nowrap',
+                overflow: 'hidden',
+                textOverflow: 'ellipsis',
+                maxHeight: '24px',
+                lineHeight: '24px',
+              }}
+              title={task.description || ''}
+              dangerouslySetInnerHTML={{ __html: task.description || '' }}
+            />
+          </div>
+        );
+
       case 'status':
         return (
           <div style={baseStyle}>

worklenz-frontend/src/components/task-list-v2/TaskRowWithSubtasks.tsx

@@ -93,6 +93,8 @@ const AddSubtaskRow: React.FC<AddSubtaskRowProps> = memo(({
         return <div style={baseStyle} />;
       case 'taskKey':
         return <div style={baseStyle} />;
+      case 'description':
+        return <div style={baseStyle} />;
       case 'title':
         return (
           <div className="flex items-center h-full" style={baseStyle}>

worklenz-frontend/src/components/task-list-v2/components/AddTaskRow.tsx

@@ -92,6 +92,7 @@ const AddTaskRow: React.FC<AddTaskRowProps> = memo(({
       case 'dragHandle':
       case 'checkbox':
       case 'taskKey':
+      case 'description':
         return <div style={baseStyle} />;
       case 'title':
         return (

worklenz-frontend/src/components/task-list-v2/constants/columns.ts

@@ -17,6 +17,7 @@ export const BASE_COLUMNS = [
   { id: 'checkbox', label: '', width: '28px', isSticky: true, key: 'checkbox' },
   { id: 'taskKey', label: 'keyColumn', width: '100px', key: COLUMN_KEYS.KEY, minWidth: '100px', maxWidth: '150px' },
   { id: 'title', label: 'taskColumn', width: '470px', isSticky: true, key: COLUMN_KEYS.NAME },
+  { id: 'description', label: 'descriptionColumn', width: '260px', key: COLUMN_KEYS.DESCRIPTION },
   { id: 'status', label: 'statusColumn', width: '120px', key: COLUMN_KEYS.STATUS },
   { id: 'assignees', label: 'assigneesColumn', width: '150px', key: COLUMN_KEYS.ASSIGNEES },
   { id: 'priority', label: 'priorityColumn', width: '120px', key: COLUMN_KEYS.PRIORITY },