[feat] Ajout du useEffect de type componentdidMount pour le drag&drop

MTES-MCT · May 21, 2024 · b599ed0 · b599ed0
1 parent 4b9c228
commit b599ed0
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 35 deletions.
diff --git a/frontend/src/features/map/layers/styles/interestPoint.style.test.ts b/frontend/src/features/map/layers/styles/interestPoint.style.test.ts
@@ -1,12 +1,6 @@
 import { describe, expect, it } from '@jest/globals'
-import { THEME } from '@mtes-mct/monitor-ui'
-import { Icon, Stroke, Style } from 'ol/style'
 
-import { getInterestPointStyle } from './interestPoint.style'
-import {
-  INTEREST_POINT_STYLE_ICON_FILENAME,
-  INTEREST_POINT_STYLE_ZINDEX
-} from '../../../../domain/entities/interestPoints'
+import { getIconStyle, getInterestPointStyle, getStrokeStyles } from './interestPoint.style'
 
 describe('getInterestPointStyle', () => {
   it('should return stroke style when it should style it', async () => {
@@ -18,15 +12,7 @@ describe('getInterestPointStyle', () => {
     const strokeStyle = getInterestPointStyle(shouldStyleStroke, dummyResolution)
 
     // Then
-    const styleExpected = [
-      new Style({
-        stroke: new Stroke({
-          color: THEME.color.slateGray,
-          lineDash: [4, 4],
-          width: 2
-        })
-      })
-    ]
+    const styleExpected = getStrokeStyles()
 
     expect(strokeStyle).toEqual(styleExpected)
   })
@@ -39,15 +25,7 @@ describe('getInterestPointStyle', () => {
     const strokeStyle = getInterestPointStyle(shouldStyleStroke, dummyResolution)
 
     // Then
-    const styleExpected = new Style({
-      image: new Icon({
-        offset: [0, 0],
-        scale: 1 / dummyResolution ** (1 / 8) + 0.3,
-        size: [30, 79],
-        src: INTEREST_POINT_STYLE_ICON_FILENAME
-      }),
-      zIndex: INTEREST_POINT_STYLE_ZINDEX
-    })
+    const styleExpected = getIconStyle(dummyResolution)
 
     expect(styleExpected).toEqual(strokeStyle)
   })

diff --git a/frontend/src/features/map/layers/styles/interestPoint.style.ts b/frontend/src/features/map/layers/styles/interestPoint.style.ts
@@ -9,7 +9,17 @@ import {
   INTEREST_POINT_STYLE_ZINDEX
 } from '../../../../domain/entities/interestPoints'
 
-const getStrokeStyles = () => [
+export const getIconStyle = (resolution: number) =>
+  new Style({
+    image: new Icon({
+      displacement: [0, 10],
+      scale: 1 / resolution ** (1 / 8) + 0.3,
+      src: INTEREST_POINT_STYLE_ICON_FILENAME
+    }),
+    zIndex: INTEREST_POINT_STYLE_ZINDEX
+  })
+
+export const getStrokeStyles = () => [
   new Style({
     stroke: new Stroke({
       color: THEME.color.slateGray,
@@ -23,16 +33,8 @@ export const getInterestPointStyle = (shouldStyleStroke: boolean | undefined, re
   if (shouldStyleStroke) {
     return getStrokeStyles()
   }
-  const style = new Style({
-    image: new Icon({
-      displacement: [0, 10],
-      scale: 1 / resolution ** (1 / 8) + 0.3,
-      src: INTEREST_POINT_STYLE_ICON_FILENAME
-    }),
-    zIndex: INTEREST_POINT_STYLE_ZINDEX
-  })
 
-  return style
+  return getIconStyle(resolution)
 }
 
 export const POIStyle = new Style({