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/src/pages/opportunities/Opportunities.tsx

@@ -2,10 +2,16 @@ import { FaBullseye } from 'react-icons/fa';
 
 import { WithTopBarContainer } from '@/ui/layout/containers/WithTopBarContainer';
 
+import {
+  initialBoard,
+  items,
+} from '../../modules/ui/components/board/__stories__/mock-data';
+import { Board } from '../../modules/ui/components/board/Board';
+
 export function Opportunities() {
   return (
     <WithTopBarContainer title="Opportunities" icon={<FaBullseye />}>
-      <></>
+      <Board initialBoard={initialBoard} items={items} />
     </WithTopBarContainer>
   );
 }