Sammy/t 392 aau i can drag and drop opportunities (#257)

* refactor: extract data from Board component

* feature: display board on opportunities page

* test: add strict mode in storybook

* chore: replace dnd to make it work with React 18 and strict mode

Atlassion has not fixed this issue in a year so we use the fork @hello-pangea/dnd
https://github.com/atlassian/react-beautiful-dnd/issues/2350

* refactor: move mocked-data in a file

* chore: use real column names in mock data

* feature: design columns

* feature: add New button at bottum of columns

* bugfix: move header out of dragable so the cards does not flicker on drop

* lint: remove useless imports

* refactor: rename board item key

front/package.json

@@ -6,6 +6,7 @@
     "@apollo/client": "^3.7.5",
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.5",
+    "@hello-pangea/dnd": "^16.2.0",
     "@tabler/icons-react": "^2.20.0",
     "@tanstack/react-table": "^8.8.5",
     "@types/node": "^16.18.4",
@@ -18,7 +19,6 @@
     "libphonenumber-js": "^1.10.26",
     "luxon": "^3.3.0",
     "react": "^18.2.0",
-    "react-beautiful-dnd": "^13.1.1",
     "react-datepicker": "^4.11.0",
     "react-dom": "^18.2.0",
     "react-hotkeys-hook": "^4.4.0",
@@ -103,7 +103,6 @@
     "@testing-library/user-event": "^13.5.0",
     "@types/jest": "^27.5.2",
     "@types/luxon": "^3.3.0",
-    "@types/react-beautiful-dnd": "^13.1.4",
     "@types/react-datepicker": "^4.11.2",
     "@types/uuid": "^9.0.1",
     "@typescript-eslint/eslint-plugin": "^5.45.0",