feat(localization): add new label management translations for multiple languages

- Introduced new translation keys for label management features in Albanian, German, Spanish, Portuguese, Chinese, and English.
- Updated placeholder texts, button labels, and paths to enhance user experience in the task list component.

worklenz-frontend/public/locales/alb/task-list-table.json

@@ -48,6 +48,9 @@
   "searchInputPlaceholder": "Kërko ose krijo",
   "assigneeSelectorInviteButton": "Fto një anëtar të ri me email",
   "labelInputPlaceholder": "Kërko ose krijo",
+  "searchLabelsPlaceholder": "Kërko etiketa...",
+  "createLabelButton": "Krijo \"{{name}}\"",
+  "manageLabelsPath": "Cilësimet → Etiketat",
 
   "pendingInvitation": "Ftesë në Pritje",
 

worklenz-frontend/public/locales/de/task-list-table.json

@@ -48,6 +48,9 @@
   "searchInputPlaceholder": "Suchen oder erstellen",
   "assigneeSelectorInviteButton": "Neues Mitglied per E-Mail einladen",
   "labelInputPlaceholder": "Suchen oder erstellen",
+  "searchLabelsPlaceholder": "Labels suchen...",
+  "createLabelButton": "\"{{name}}\" erstellen",
+  "manageLabelsPath": "Einstellungen → Labels",
 
   "pendingInvitation": "Einladung ausstehend",
 

worklenz-frontend/public/locales/en/task-list-table.json

@@ -48,6 +48,9 @@
   "searchInputPlaceholder": "Search or create",
   "assigneeSelectorInviteButton": "Invite a new member by email",
   "labelInputPlaceholder": "Search or create",
+  "searchLabelsPlaceholder": "Search labels...",
+  "createLabelButton": "Create \"{{name}}\"",
+  "manageLabelsPath": "Settings → Labels",
 
   "pendingInvitation": "Pending Invitation",
 

worklenz-frontend/public/locales/es/task-list-table.json

@@ -48,6 +48,9 @@
   "searchInputPlaceholder": "Buscar o crear",
   "assigneeSelectorInviteButton": "Invitar a un nuevo miembro por correo",
   "labelInputPlaceholder": "Buscar o crear",
+  "searchLabelsPlaceholder": "Buscar etiquetas...",
+  "createLabelButton": "Crear \"{{name}}\"",
+  "manageLabelsPath": "Configuración → Etiquetas",
 
   "pendingInvitation": "Invitación pendiente",
 

worklenz-frontend/public/locales/pt/task-list-table.json

@@ -48,6 +48,9 @@
   "searchInputPlaceholder": "Buscar ou criar",
   "assigneeSelectorInviteButton": "Convide um novo membro por e-mail",
   "labelInputPlaceholder": "Buscar ou criar",
+  "searchLabelsPlaceholder": "Buscar etiquetas...",
+  "createLabelButton": "Criar \"{{name}}\"",
+  "manageLabelsPath": "Configurações → Etiquetas",
 
   "pendingInvitation": "Convite Pendente",
 

worklenz-frontend/public/locales/zh/task-list-table.json

@@ -43,6 +43,9 @@
   "searchInputPlaceholder": "搜索或创建",
   "assigneeSelectorInviteButton": "通过电子邮件邀请新成员",
   "labelInputPlaceholder": "搜索或创建",
+  "searchLabelsPlaceholder": "搜索标签...",
+  "createLabelButton": "创建 \"{{name}}\"",
+  "manageLabelsPath": "设置 → 标签",
   "pendingInvitation": "待处理邀请",
   "contextMenu": {
     "assignToMe": "分配给我",

worklenz-frontend/src/components/LabelsSelector.tsx

@@ -2,6 +2,7 @@ import React, { useState, useRef, useEffect, useMemo, useCallback } from 'react'
 import { createPortal } from 'react-dom';
 import { useSelector } from 'react-redux';
 import { PlusOutlined, TagOutlined } from '@ant-design/icons';
+import { useTranslation } from 'react-i18next';
 import { RootState } from '@/app/store';
 import { IProjectTask } from '@/types/project/projectTasksViewModel.types';
 import { ITaskLabel } from '@/types/tasks/taskLabel.types';
@@ -26,6 +27,7 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
   const { labels } = useSelector((state: RootState) => state.taskLabelsReducer);
   const currentSession = useAuthService().getCurrentSession();
   const { socket } = useSocket();
+  const { t } = useTranslation('task-list-table');
 
   const filteredLabels = useMemo(() => {
     return (
@@ -203,7 +205,7 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
                 value={searchQuery}
                 onChange={e => setSearchQuery(e.target.value)}
                 onKeyDown={handleKeyDown}
-                placeholder="Search labels..."
+                placeholder={t('searchLabelsPlaceholder')}
                 className={`
                 w-full px-2 py-1 text-xs rounded border
                 ${
@@ -257,7 +259,7 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
                 <div
                   className={`p-4 text-center ${isDarkMode ? 'text-gray-400' : 'text-gray-500'}`}
                 >
-                  <div className="text-xs">No labels found</div>
+                  <div className="text-xs">{t('noLabelsFound')}</div>
                   {searchQuery.trim() && (
                     <button
                       onClick={handleCreateLabel}
@@ -270,7 +272,7 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
                       }
                     `}
                     >
-                      Create "{searchQuery}"
+                      {t('createLabelButton', { name: searchQuery.trim() })}
                     </button>
                   )}
                 </div>
@@ -279,20 +281,10 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
 
             {/* Footer */}
             <div className={`p-2 border-t ${isDarkMode ? 'border-gray-600' : 'border-gray-200'}`}>
-              <button
+              <div className={`flex items-center justify-center gap-1 px-2 py-1 text-xs ${isDarkMode ? 'text-gray-400' : 'text-gray-500'}`}>
-                className={`
-                w-full flex items-center justify-center gap-1 px-2 py-1 text-xs rounded
-                transition-colors
-                ${isDarkMode ? 'text-blue-400 hover:bg-gray-700' : 'text-blue-600 hover:bg-blue-50'}
-              `}
-                onClick={() => {
-                  // TODO: Implement manage labels functionality
-                  console.log('Manage labels clicked');
-                }}
-              >
                 <TagOutlined />
-                Manage labels
+                {t('manageLabelsPath')}
-              </button>
+              </div>
             </div>
           </div>,
           document.body