diff --git a/Client/package-lock.json b/Client/package-lock.json
index b24ef8cad..314d4991d 100644
--- a/Client/package-lock.json
+++ b/Client/package-lock.json
@@ -20,9 +20,12 @@
 				"@reduxjs/toolkit": "2.4.0",
 				"axios": "^1.7.4",
 				"dayjs": "1.11.13",
+				"immutability-helper": "^3.1.1",
 				"joi": "17.13.3",
 				"jwt-decode": "^4.0.0",
 				"react": "^18.2.0",
+				"react-dnd": "^16.0.1",
+				"react-dnd-html5-backend": "^16.0.1",
 				"react-dom": "^18.2.0",
 				"react-redux": "9.1.2",
 				"react-router": "^6.23.0",
@@ -1606,6 +1609,21 @@
 				"url": "https://opencollective.com/popperjs"
 			}
 		},
+		"node_modules/@react-dnd/asap": {
+			"version": "5.0.2",
+			"resolved": "https://registry.npmjs.org/@react-dnd/asap/-/asap-5.0.2.tgz",
+			"integrity": "sha512-WLyfoHvxhs0V9U+GTsGilGgf2QsPl6ZZ44fnv0/b8T3nQyvzxidxsg/ZltbWssbsRDlYW8UKSQMTGotuTotZ6A=="
+		},
+		"node_modules/@react-dnd/invariant": {
+			"version": "4.0.2",
+			"resolved": "https://registry.npmjs.org/@react-dnd/invariant/-/invariant-4.0.2.tgz",
+			"integrity": "sha512-xKCTqAK/FFauOM9Ta2pswIyT3D8AQlfrYdOi/toTPEhqCuAs1v5tcJ3Y08Izh1cJ5Jchwy9SeAXmMg6zrKs2iw=="
+		},
+		"node_modules/@react-dnd/shallowequal": {
+			"version": "4.0.2",
+			"resolved": "https://registry.npmjs.org/@react-dnd/shallowequal/-/shallowequal-4.0.2.tgz",
+			"integrity": "sha512-/RVXdLvJxLg4QKvMoM5WlwNR9ViO9z8B/qPcc+C0Sa/teJY7QG7kJ441DwzOjMYEY7GmU4dj5EcGHIkKZiQZCA=="
+		},
 		"node_modules/@react-spring/animated": {
 			"version": "9.7.5",
 			"resolved": "https://registry.npmjs.org/@react-spring/animated/-/animated-9.7.5.tgz",
@@ -3174,6 +3192,24 @@
 				"node": ">=0.4.0"
 			}
 		},
+		"node_modules/dnd-core": {
+			"version": "16.0.1",
+			"resolved": "https://registry.npmjs.org/dnd-core/-/dnd-core-16.0.1.tgz",
+			"integrity": "sha512-HK294sl7tbw6F6IeuK16YSBUoorvHpY8RHO+9yFfaJyCDVb6n7PRcezrOEOa2SBCqiYpemh5Jx20ZcjKdFAVng==",
+			"dependencies": {
+				"@react-dnd/asap": "^5.0.1",
+				"@react-dnd/invariant": "^4.0.1",
+				"redux": "^4.2.0"
+			}
+		},
+		"node_modules/dnd-core/node_modules/redux": {
+			"version": "4.2.1",
+			"resolved": "https://registry.npmjs.org/redux/-/redux-4.2.1.tgz",
+			"integrity": "sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w==",
+			"dependencies": {
+				"@babel/runtime": "^7.9.2"
+			}
+		},
 		"node_modules/doctrine": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/doctrine/-/doctrine-3.0.0.tgz",
@@ -3730,7 +3766,6 @@
 			"version": "3.1.3",
 			"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
 			"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
-			"dev": true,
 			"license": "MIT"
 		},
 		"node_modules/fast-equals": {
@@ -4177,6 +4212,11 @@
 				"url": "https://opencollective.com/immer"
 			}
 		},
+		"node_modules/immutability-helper": {
+			"version": "3.1.1",
+			"resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-3.1.1.tgz",
+			"integrity": "sha512-Q0QaXjPjwIju/28TsugCHNEASwoCcJSyJV3uO1sOIQGI0jKgm9f41Lvz0DZj3n46cNCyAZTsEYoY4C2bVRUzyQ=="
+		},
 		"node_modules/import-fresh": {
 			"version": "3.3.0",
 			"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@@ -5313,6 +5353,43 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/react-dnd": {
+			"version": "16.0.1",
+			"resolved": "https://registry.npmjs.org/react-dnd/-/react-dnd-16.0.1.tgz",
+			"integrity": "sha512-QeoM/i73HHu2XF9aKksIUuamHPDvRglEwdHL4jsp784BgUuWcg6mzfxT0QDdQz8Wj0qyRKx2eMg8iZtWvU4E2Q==",
+			"dependencies": {
+				"@react-dnd/invariant": "^4.0.1",
+				"@react-dnd/shallowequal": "^4.0.1",
+				"dnd-core": "^16.0.1",
+				"fast-deep-equal": "^3.1.3",
+				"hoist-non-react-statics": "^3.3.2"
+			},
+			"peerDependencies": {
+				"@types/hoist-non-react-statics": ">= 3.3.1",
+				"@types/node": ">= 12",
+				"@types/react": ">= 16",
+				"react": ">= 16.14"
+			},
+			"peerDependenciesMeta": {
+				"@types/hoist-non-react-statics": {
+					"optional": true
+				},
+				"@types/node": {
+					"optional": true
+				},
+				"@types/react": {
+					"optional": true
+				}
+			}
+		},
+		"node_modules/react-dnd-html5-backend": {
+			"version": "16.0.1",
+			"resolved": "https://registry.npmjs.org/react-dnd-html5-backend/-/react-dnd-html5-backend-16.0.1.tgz",
+			"integrity": "sha512-Wu3dw5aDJmOGw8WjH1I1/yTH+vlXEL4vmjk5p+MHxP8HuHJS1lAGeIdG/hze1AvNeXWo/JgULV87LyQOr+r5jw==",
+			"dependencies": {
+				"dnd-core": "^16.0.1"
+			}
+		},
 		"node_modules/react-dom": {
 			"version": "18.3.1",
 			"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
diff --git a/Client/package.json b/Client/package.json
index 1f4480fa2..4582a7222 100644
--- a/Client/package.json
+++ b/Client/package.json
@@ -23,9 +23,12 @@
 		"@reduxjs/toolkit": "2.4.0",
 		"axios": "^1.7.4",
 		"dayjs": "1.11.13",
+		"immutability-helper": "^3.1.1",
 		"joi": "17.13.3",
 		"jwt-decode": "^4.0.0",
 		"react": "^18.2.0",
+		"react-dnd": "^16.0.1",
+		"react-dnd-html5-backend": "^16.0.1",
 		"react-dom": "^18.2.0",
 		"react-redux": "9.1.2",
 		"react-router": "^6.23.0",
diff --git a/Client/src/main.jsx b/Client/src/main.jsx
index c07cad40b..d6226c393 100644
--- a/Client/src/main.jsx
+++ b/Client/src/main.jsx
@@ -6,6 +6,8 @@ import { Provider } from "react-redux";
 import { persistor, store } from "./store";
 import { PersistGate } from "redux-persist/integration/react";
 import NetworkServiceProvider from "./Utils/NetworkServiceProvider.jsx";
+import { DndProvider } from 'react-dnd'
+import { HTML5Backend } from 'react-dnd-html5-backend'
 import { networkService } from "./Utils/NetworkService";
 export { networkService };
 
@@ -17,7 +19,9 @@ ReactDOM.createRoot(document.getElementById("root")).render(
 		>
 			<Router>
 				<NetworkServiceProvider>
-					<App />
+					<DndProvider backend={HTML5Backend}>
+						<App />
+					</DndProvider>
 				</NetworkServiceProvider>
 			</Router>
 		</PersistGate>