From a32007f56be5ddab709dff52438acf9af87e5303 Mon Sep 17 00:00:00 2001
From: tigattack <10629864+tigattack@users.noreply.github.com>
Date: Thu, 25 Sep 2025 00:11:08 +0100
Subject: [PATCH] fix(frontend): Static Elements should not be interactive

---
 frontend/src/pages/Packages.jsx     | 7 ++++---
 frontend/src/pages/Repositories.jsx | 7 ++++---
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/frontend/src/pages/Packages.jsx b/frontend/src/pages/Packages.jsx
index e0b75fb..101e3a2 100644
--- a/frontend/src/pages/Packages.jsx
+++ b/frontend/src/pages/Packages.jsx
@@ -660,13 +660,14 @@ const ColumnSettingsModal = ({
 
 				<div className="space-y-2">
 					{columnConfig.map((column, index) => (
-						<div
+						<button
+							type="button"
 							key={column.id}
 							draggable
 							onDragStart={(e) => handleDragStart(e, index)}
 							onDragOver={handleDragOver}
 							onDrop={(e) => handleDrop(e, index)}
-							className={`flex items-center justify-between p-3 border rounded-lg cursor-move ${
+							className={`flex items-center justify-between p-3 border rounded-lg cursor-move w-full text-left ${
 								draggedIndex === index
 									? "opacity-50"
 									: "hover:bg-secondary-50 dark:hover:bg-secondary-700"
@@ -693,7 +694,7 @@ const ColumnSettingsModal = ({
 									<EyeOffIcon className="h-4 w-4" />
 								)}
 							</button>
-						</div>
+						</button>
 					))}
 				</div>
 
diff --git a/frontend/src/pages/Repositories.jsx b/frontend/src/pages/Repositories.jsx
index c757117..d6e641b 100644
--- a/frontend/src/pages/Repositories.jsx
+++ b/frontend/src/pages/Repositories.jsx
@@ -580,13 +580,14 @@ const ColumnSettingsModal = ({
 
 				<div className="space-y-3">
 					{columnConfig.map((column, index) => (
-						<div
+						<button
+							type="button"
 							key={column.id}
 							draggable
 							onDragStart={(e) => handleDragStart(e, index)}
 							onDragOver={handleDragOver}
 							onDrop={(e) => handleDrop(e, index)}
-							className="flex items-center justify-between p-3 bg-secondary-50 dark:bg-secondary-700 rounded-lg cursor-move hover:bg-secondary-100 dark:hover:bg-secondary-600 transition-colors"
+							className="flex items-center justify-between p-3 bg-secondary-50 dark:bg-secondary-700 rounded-lg cursor-move hover:bg-secondary-100 dark:hover:bg-secondary-600 transition-colors w-full text-left"
 						>
 							<div className="flex items-center gap-3">
 								<GripVertical className="h-4 w-4 text-secondary-400" />
@@ -605,7 +606,7 @@ const ColumnSettingsModal = ({
 							>
 								{column.visible && <Check className="h-3 w-3 text-white" />}
 							</button>
-						</div>
+						</button>
 					))}
 				</div>