From fd5d0e768876110d6abc0c6756f51568b3ebe8c4 Mon Sep 17 00:00:00 2001
From: menuja-stack <menujaaluthwathe@gmail.com>
Date: Tue, 14 Oct 2025 16:56:10 +0530
Subject: [PATCH 1/5] new fetures add for the labels

---
 .../src/controllers/tasks-controller-v2.ts    |  1 +
 .../src/components/LabelsSelector.tsx         | 20 +++++++++++++------
 .../components/TaskRowColumns.tsx             |  2 +-
 .../labelsSelector/LabelsSelector.tsx         | 18 +++++++++++++----
 .../src/types/tasks/task.types.ts             |  2 +-
 5 files changed, 31 insertions(+), 12 deletions(-)

diff --git a/worklenz-backend/src/controllers/tasks-controller-v2.ts b/worklenz-backend/src/controllers/tasks-controller-v2.ts
index daa29ee5b..8385bcac3 100644
--- a/worklenz-backend/src/controllers/tasks-controller-v2.ts
+++ b/worklenz-backend/src/controllers/tasks-controller-v2.ts
@@ -1280,6 +1280,7 @@ export default class TasksControllerV2 extends TasksControllerBase {
             end: l.end,
             names: l.names,
           })) || [],
+        all_labels: task.all_labels || [],
         dueDate: task.end_date || task.END_DATE,
         startDate: task.start_date,
         timeTracking: {
diff --git a/worklenz-frontend/src/components/LabelsSelector.tsx b/worklenz-frontend/src/components/LabelsSelector.tsx
index 0faf6ec3f..1c31315a5 100644
--- a/worklenz-frontend/src/components/LabelsSelector.tsx
+++ b/worklenz-frontend/src/components/LabelsSelector.tsx
@@ -30,12 +30,20 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
   const { t } = useTranslation('task-list-table');
 
   const filteredLabels = useMemo(() => {
-    return (
-      (labels as ITaskLabel[])?.filter(label =>
-        label.name?.toLowerCase().includes(searchQuery.toLowerCase())
-      ) || []
-    );
-  }, [labels, searchQuery]);
+    const filtered = (labels as ITaskLabel[])?.filter(label =>
+      label.name?.toLowerCase().includes(searchQuery.toLowerCase())
+    ) || [];
+    
+    // Sort labels: selected ones first, then unselected ones
+    return filtered.sort((a, b) => {
+      const aSelected = task?.all_labels?.some(existingLabel => existingLabel.id === a.id) || false;
+      const bSelected = task?.all_labels?.some(existingLabel => existingLabel.id === b.id) || false;
+      
+      if (aSelected && !bSelected) return -1;
+      if (!aSelected && bSelected) return 1;
+      return 0;
+    });
+  }, [labels, searchQuery, task?.labels]);
 
   // Update dropdown position
   const updateDropdownPosition = useCallback(() => {
diff --git a/worklenz-frontend/src/components/task-list-v2/components/TaskRowColumns.tsx b/worklenz-frontend/src/components/task-list-v2/components/TaskRowColumns.tsx
index 3681140e5..84d3432b9 100644
--- a/worklenz-frontend/src/components/task-list-v2/components/TaskRowColumns.tsx
+++ b/worklenz-frontend/src/components/task-list-v2/components/TaskRowColumns.tsx
@@ -1,4 +1,4 @@
-import React, { memo } from 'react';
+ import React, { memo } from 'react';
 import { CheckCircleOutlined, HolderOutlined } from '@/shared/antd-imports';
 import { Checkbox } from '@/shared/antd-imports';
 import { Task } from '@/types/task-management.types';
diff --git a/worklenz-frontend/src/components/taskListCommon/labelsSelector/LabelsSelector.tsx b/worklenz-frontend/src/components/taskListCommon/labelsSelector/LabelsSelector.tsx
index 5a711ca85..2a447903e 100644
--- a/worklenz-frontend/src/components/taskListCommon/labelsSelector/LabelsSelector.tsx
+++ b/worklenz-frontend/src/components/taskListCommon/labelsSelector/LabelsSelector.tsx
@@ -67,8 +67,18 @@ const LabelsSelector = ({ task }: LabelsSelectorProps) => {
 
   // used useMemo hook for re render the list when searching
   const filteredLabelData = useMemo(() => {
-    return labelList.filter(label => label.name?.toLowerCase().includes(searchQuery.toLowerCase()));
-  }, [labelList, searchQuery]);
+    const filtered = labelList.filter(label => label.name?.toLowerCase().includes(searchQuery.toLowerCase()));
+    
+    // Sort labels: selected ones first, then unselected ones
+    return filtered.sort((a, b) => {
+      const aSelected = task?.labels?.some(existingLabel => existingLabel.id === a.id) || false;
+      const bSelected = task?.labels?.some(existingLabel => existingLabel.id === b.id) || false;
+      
+      if (aSelected && !bSelected) return -1;
+      if (!aSelected && bSelected) return 1;
+      return 0;
+    });
+  }, [labelList, searchQuery, task?.labels]);
 
   const labelDropdownContent = (
     <Card className="custom-card" styles={{ body: { padding: 8, overflow: 'hidden' } }}>
@@ -113,8 +123,8 @@ const LabelsSelector = ({ task }: LabelsSelectorProps) => {
                 <Checkbox
                   id={label.id}
                   checked={
-                    task?.all_labels
-                      ? task?.all_labels.some(existingLabel => existingLabel.id === label.id)
+                    task?.labels
+                      ? task?.labels.some(existingLabel => existingLabel.id === label.id)
                       : false
                   }
                   onChange={() => handleLabelChange(label)}
diff --git a/worklenz-frontend/src/types/tasks/task.types.ts b/worklenz-frontend/src/types/tasks/task.types.ts
index 204d14189..6ae329e95 100644
--- a/worklenz-frontend/src/types/tasks/task.types.ts
+++ b/worklenz-frontend/src/types/tasks/task.types.ts
@@ -32,7 +32,7 @@ export interface ITask {
   project_id: string;
   team_id: string;
   task_key: string;
-  labels: string[];
+  labels: ITaskLabel[];
   assignees: string[];
   names: string[];
   sub_tasks_count: number;

From 455aff36853b79fa5379746dc16228d11c446a1a Mon Sep 17 00:00:00 2001
From: menuja-stack <menujaaluthwathe@gmail.com>
Date: Wed, 15 Oct 2025 12:50:45 +0530
Subject: [PATCH 2/5] remove feature add labels

---
 worklenz-frontend/src/App.tsx                 |  2 +-
 .../task-drawer-labels/task-drawer-labels.tsx | 19 +++++++++++++++++--
 .../src/hooks/useTaskSocketHandlers.ts        |  5 ++---
 3 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/worklenz-frontend/src/App.tsx b/worklenz-frontend/src/App.tsx
index 92beecd6a..778d8d102 100644
--- a/worklenz-frontend/src/App.tsx
+++ b/worklenz-frontend/src/App.tsx
@@ -203,7 +203,7 @@ const App: React.FC = memo(() => {
   return (
     <Suspense fallback={<SuspenseFallback />}>
       <ThemeWrapper>
-        <UpdateNotificationProvider>
+        <UpdateNotificationProvider enableAutoCheck={false}>
           <ModuleErrorBoundary>
             <RouterProvider
               router={router}
diff --git a/worklenz-frontend/src/components/task-drawer/shared/info-tab/details/task-drawer-labels/task-drawer-labels.tsx b/worklenz-frontend/src/components/task-drawer/shared/info-tab/details/task-drawer-labels/task-drawer-labels.tsx
index 2b70d41fc..1ae09ddad 100644
--- a/worklenz-frontend/src/components/task-drawer/shared/info-tab/details/task-drawer-labels/task-drawer-labels.tsx
+++ b/worklenz-frontend/src/components/task-drawer/shared/info-tab/details/task-drawer-labels/task-drawer-labels.tsx
@@ -98,8 +98,18 @@ const TaskDrawerLabels = ({ task, t }: TaskDrawerLabelsProps) => {
 
   // used useMemo hook for re render the list when searching
   const filteredLabelData = useMemo(() => {
-    return labelList.filter(label => label.name?.toLowerCase().includes(searchQuery.toLowerCase()));
-  }, [labelList, searchQuery]);
+    const filtered = labelList.filter(label => label.name?.toLowerCase().includes(searchQuery.toLowerCase()));
+    
+    // Sort labels: selected ones first, then unselected ones
+    return filtered.sort((a, b) => {
+      const aSelected = task?.labels?.some(existingLabel => existingLabel.id === a.id) || false;
+      const bSelected = task?.labels?.some(existingLabel => existingLabel.id === b.id) || false;
+      
+      if (aSelected && !bSelected) return -1;
+      if (!aSelected && bSelected) return 1;
+      return 0;
+    });
+  }, [labelList, searchQuery, task?.labels]);
 
   const labelDropdownContent = (
     <Card
@@ -186,6 +196,11 @@ const TaskDrawerLabels = ({ task, t }: TaskDrawerLabelsProps) => {
           <Tag
             key={label.id}
             color={label.color_code + ALPHA_CHANNEL}
+            closable
+            onClose={(e) => {
+              e.preventDefault();
+              handleLabelChange(label);
+            }}
             style={{
               display: 'flex',
               alignItems: 'center',
diff --git a/worklenz-frontend/src/hooks/useTaskSocketHandlers.ts b/worklenz-frontend/src/hooks/useTaskSocketHandlers.ts
index 72a1f71a5..462fd5915 100644
--- a/worklenz-frontend/src/hooks/useTaskSocketHandlers.ts
+++ b/worklenz-frontend/src/hooks/useTaskSocketHandlers.ts
@@ -180,9 +180,8 @@ export const useTaskSocketHandlers = () => {
       await Promise.all([
         dispatch(updateTaskLabel(labels)),
         dispatch(setTaskLabels(labels)),
-        // Remove unnecessary refetches - real-time updates handle this
-        // dispatch(fetchLabels()),
-        // projectId && dispatch(fetchLabelsByProject(projectId)),
+        // Fetch labels when a new label is created to update the global labels list
+        labels.is_new && dispatch(fetchLabels()),
       ]);
 
       // Update enhanced kanban slice

From bf89715487e17d989acaba984b9532ba063ceafe Mon Sep 17 00:00:00 2001
From: menuja-stack <menujaaluthwathe@gmail.com>
Date: Wed, 15 Oct 2025 13:17:13 +0530
Subject: [PATCH 3/5] assigned labels are not visible on label dropdown fix
 that

---
 .../src/components/LabelsSelector.tsx         | 31 +++++++++++--------
 1 file changed, 18 insertions(+), 13 deletions(-)

diff --git a/worklenz-frontend/src/components/LabelsSelector.tsx b/worklenz-frontend/src/components/LabelsSelector.tsx
index 1c31315a5..8e0fd2d5d 100644
--- a/worklenz-frontend/src/components/LabelsSelector.tsx
+++ b/worklenz-frontend/src/components/LabelsSelector.tsx
@@ -269,19 +269,24 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
                 >
                   <div className="text-xs">{t('noLabelsFound')}</div>
                   {searchQuery.trim() && (
-                    <button
-                      onClick={handleCreateLabel}
-                      className={`
-                      mt-2 px-3 py-1 text-xs rounded border transition-colors
-                      ${
-                        isDarkMode
-                          ? 'border-gray-600 text-gray-300 hover:bg-gray-700'
-                          : 'border-gray-300 text-gray-600 hover:bg-gray-50'
-                      }
-                    `}
-                    >
-                      {t('createLabelButton', { name: searchQuery.trim() })}
-                    </button>
+                    <>
+                      <button
+                        onClick={handleCreateLabel}
+                        className={`
+                        mt-2 px-3 py-1 text-xs rounded border transition-colors
+                        ${
+                          isDarkMode
+                            ? 'border-gray-600 text-gray-300 hover:bg-gray-700'
+                            : 'border-gray-300 text-gray-600 hover:bg-gray-50'
+                        }
+                      `}
+                      >
+                        {t('createLabelButton', { name: searchQuery.trim() })}
+                      </button>
+                      <div className={`mt-2 text-xs ${isDarkMode ? 'text-gray-500' : 'text-gray-400'}`}>
+                        {t('labelsSelectorInputTip')}
+                      </div>
+                    </>
                   )}
                 </div>
               )}

From b13ee31f2b6e519695ff8e7d8d0332cffb05750d Mon Sep 17 00:00:00 2001
From: menuja-stack <menujaaluthwathe@gmail.com>
Date: Fri, 17 Oct 2025 09:23:49 +0530
Subject: [PATCH 4/5] when delete buton click  in the label apper the edit
 funtion then fix that

---
 .../src/pages/settings/labels/LabelsSettings.tsx           | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/worklenz-frontend/src/pages/settings/labels/LabelsSettings.tsx b/worklenz-frontend/src/pages/settings/labels/LabelsSettings.tsx
index 659a7d63e..6c73951bb 100644
--- a/worklenz-frontend/src/pages/settings/labels/LabelsSettings.tsx
+++ b/worklenz-frontend/src/pages/settings/labels/LabelsSettings.tsx
@@ -129,7 +129,12 @@ const LabelsSettings = () => {
               onConfirm={() => deleteLabel(record.id!)}
             >
               <Tooltip title={t('deleteTooltip', 'Delete')}>
-                <Button shape="default" icon={<DeleteOutlined />} size="small" />
+                <Button 
+                  shape="default" 
+                  icon={<DeleteOutlined />} 
+                  size="small"
+                  onClick={(e) => e.stopPropagation()}
+                />
               </Tooltip>
             </Popconfirm>
           </Flex>

From b061896415e5921c593414452fc949d023a46d9c Mon Sep 17 00:00:00 2001
From: Chamika J <75464293+chamikaJ@users.noreply.github.com>
Date: Fri, 17 Oct 2025 11:42:40 +0530
Subject: [PATCH 5/5] refactor: extract shared label sorting and selection
 logic to labelUtils

---
 .../src/components/LabelsSelector.tsx         | 17 ++++-----
 .../task-drawer-labels/task-drawer-labels.tsx | 24 +++++--------
 .../labelsSelector/LabelsSelector.tsx         | 24 +++++--------
 worklenz-frontend/src/utils/labelUtils.ts     | 35 +++++++++++++++++++
 4 files changed, 57 insertions(+), 43 deletions(-)
 create mode 100644 worklenz-frontend/src/utils/labelUtils.ts

diff --git a/worklenz-frontend/src/components/LabelsSelector.tsx b/worklenz-frontend/src/components/LabelsSelector.tsx
index 8e0fd2d5d..5a7c7d7e2 100644
--- a/worklenz-frontend/src/components/LabelsSelector.tsx
+++ b/worklenz-frontend/src/components/LabelsSelector.tsx
@@ -10,6 +10,7 @@ import { useSocket } from '@/socket/socketContext';
 import { SocketEvents } from '@/shared/socket-events';
 import { useAuthService } from '@/hooks/useAuth';
 import { Button, Checkbox, Tag } from '@/components';
+import { sortLabelsBySelection, isLabelSelected } from '@/utils/labelUtils';
 
 interface LabelsSelectorProps {
   task: IProjectTask;
@@ -33,16 +34,9 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
     const filtered = (labels as ITaskLabel[])?.filter(label =>
       label.name?.toLowerCase().includes(searchQuery.toLowerCase())
     ) || [];
-    
-    // Sort labels: selected ones first, then unselected ones
-    return filtered.sort((a, b) => {
-      const aSelected = task?.all_labels?.some(existingLabel => existingLabel.id === a.id) || false;
-      const bSelected = task?.all_labels?.some(existingLabel => existingLabel.id === b.id) || false;
-      
-      if (aSelected && !bSelected) return -1;
-      if (!aSelected && bSelected) return 1;
-      return 0;
-    });
+
+    // Sort to show selected labels first using shared utility
+    return sortLabelsBySelection(filtered, task?.labels || []);
   }, [labels, searchQuery, task?.labels]);
 
   // Update dropdown position
@@ -157,7 +151,8 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
   };
 
   const checkLabelSelected = (labelId: string) => {
-    return task?.all_labels?.some(existingLabel => existingLabel.id === labelId) || false;
+    // Use task.labels (currently selected labels) instead of all_labels
+    return isLabelSelected(labelId, task?.labels);
   };
 
   const handleKeyDown = (e: React.KeyboardEvent) => {
diff --git a/worklenz-frontend/src/components/task-drawer/shared/info-tab/details/task-drawer-labels/task-drawer-labels.tsx b/worklenz-frontend/src/components/task-drawer/shared/info-tab/details/task-drawer-labels/task-drawer-labels.tsx
index 1ae09ddad..914abd787 100644
--- a/worklenz-frontend/src/components/task-drawer/shared/info-tab/details/task-drawer-labels/task-drawer-labels.tsx
+++ b/worklenz-frontend/src/components/task-drawer/shared/info-tab/details/task-drawer-labels/task-drawer-labels.tsx
@@ -31,6 +31,7 @@ import { setBoardLabels, updateBoardTaskLabel } from '@/features/board/board-sli
 import { updateEnhancedKanbanTaskLabels } from '@/features/enhanced-kanban/enhanced-kanban.slice';
 import { ILabelsChangeResponse } from '@/types/tasks/taskList.types';
 import { ITaskLabelFilter } from '@/types/tasks/taskLabel.types';
+import { sortLabelsBySelection, isLabelSelected } from '@/utils/labelUtils';
 
 interface TaskDrawerLabelsProps {
   task: ITaskViewModel;
@@ -98,17 +99,12 @@ const TaskDrawerLabels = ({ task, t }: TaskDrawerLabelsProps) => {
 
   // used useMemo hook for re render the list when searching
   const filteredLabelData = useMemo(() => {
-    const filtered = labelList.filter(label => label.name?.toLowerCase().includes(searchQuery.toLowerCase()));
-    
-    // Sort labels: selected ones first, then unselected ones
-    return filtered.sort((a, b) => {
-      const aSelected = task?.labels?.some(existingLabel => existingLabel.id === a.id) || false;
-      const bSelected = task?.labels?.some(existingLabel => existingLabel.id === b.id) || false;
-      
-      if (aSelected && !bSelected) return -1;
-      if (!aSelected && bSelected) return 1;
-      return 0;
-    });
+    const filtered = labelList.filter(label =>
+      label.name?.toLowerCase().includes(searchQuery.toLowerCase())
+    );
+
+    // Sort to show selected labels first using shared utility
+    return sortLabelsBySelection(filtered, task?.labels || []);
   }, [labelList, searchQuery, task?.labels]);
 
   const labelDropdownContent = (
@@ -153,11 +149,7 @@ const TaskDrawerLabels = ({ task, t }: TaskDrawerLabelsProps) => {
               >
                 <Checkbox
                   id={label.id}
-                  checked={
-                    task?.labels
-                      ? task?.labels.some(existingLabel => existingLabel.id === label.id)
-                      : false
-                  }
+                  checked={isLabelSelected(label.id || '', task?.labels)}
                   onChange={e => e.preventDefault()}
                 >
                   <Flex gap={8}>
diff --git a/worklenz-frontend/src/components/taskListCommon/labelsSelector/LabelsSelector.tsx b/worklenz-frontend/src/components/taskListCommon/labelsSelector/LabelsSelector.tsx
index 2a447903e..026aff04c 100644
--- a/worklenz-frontend/src/components/taskListCommon/labelsSelector/LabelsSelector.tsx
+++ b/worklenz-frontend/src/components/taskListCommon/labelsSelector/LabelsSelector.tsx
@@ -20,6 +20,7 @@ import { IProjectTask } from '@/types/project/projectTasksViewModel.types';
 import { useAuthService } from '@/hooks/useAuth';
 import { SocketEvents } from '@/shared/socket-events';
 import { useSocket } from '@/socket/socketContext';
+import { sortLabelsBySelection, isLabelSelected } from '@/utils/labelUtils';
 
 interface LabelsSelectorProps {
   task: IProjectTask;
@@ -67,17 +68,12 @@ const LabelsSelector = ({ task }: LabelsSelectorProps) => {
 
   // used useMemo hook for re render the list when searching
   const filteredLabelData = useMemo(() => {
-    const filtered = labelList.filter(label => label.name?.toLowerCase().includes(searchQuery.toLowerCase()));
-    
-    // Sort labels: selected ones first, then unselected ones
-    return filtered.sort((a, b) => {
-      const aSelected = task?.labels?.some(existingLabel => existingLabel.id === a.id) || false;
-      const bSelected = task?.labels?.some(existingLabel => existingLabel.id === b.id) || false;
-      
-      if (aSelected && !bSelected) return -1;
-      if (!aSelected && bSelected) return 1;
-      return 0;
-    });
+    const filtered = labelList.filter(label =>
+      label.name?.toLowerCase().includes(searchQuery.toLowerCase())
+    );
+
+    // Sort to show selected labels first using shared utility
+    return sortLabelsBySelection(filtered, task?.labels || []);
   }, [labelList, searchQuery, task?.labels]);
 
   const labelDropdownContent = (
@@ -122,11 +118,7 @@ const LabelsSelector = ({ task }: LabelsSelectorProps) => {
               >
                 <Checkbox
                   id={label.id}
-                  checked={
-                    task?.labels
-                      ? task?.labels.some(existingLabel => existingLabel.id === label.id)
-                      : false
-                  }
+                  checked={isLabelSelected(label.id || '', task?.labels)}
                   onChange={() => handleLabelChange(label)}
                 >
                   <Flex gap={8}>
diff --git a/worklenz-frontend/src/utils/labelUtils.ts b/worklenz-frontend/src/utils/labelUtils.ts
new file mode 100644
index 000000000..5a1d50232
--- /dev/null
+++ b/worklenz-frontend/src/utils/labelUtils.ts
@@ -0,0 +1,35 @@
+import { ITaskLabel } from '@/types/tasks/taskLabel.types';
+
+/**
+ * Sorts labels to show selected labels first
+ * @param labels - All available labels
+ * @param selectedLabels - Currently selected labels
+ * @returns Sorted array with selected labels first
+ */
+export const sortLabelsBySelection = (
+  labels: ITaskLabel[],
+  selectedLabels: ITaskLabel[]
+): ITaskLabel[] => {
+  return [...labels].sort((a, b) => {
+    const aSelected = selectedLabels.some(label => label.id === a.id);
+    const bSelected = selectedLabels.some(label => label.id === b.id);
+
+    if (aSelected && !bSelected) return -1;
+    if (!aSelected && bSelected) return 1;
+    return 0;
+  });
+};
+
+/**
+ * Checks if a label is selected
+ * @param labelId - ID of the label to check
+ * @param selectedLabels - Currently selected labels
+ * @returns true if label is selected
+ */
+export const isLabelSelected = (
+  labelId: string,
+  selectedLabels?: ITaskLabel[]
+): boolean => {
+  if (!selectedLabels || selectedLabels.length === 0) return false;
+  return selectedLabels.some(label => label.id === labelId);
+};