From 40fa0ced907d9cf68b4e3b6a7157cdc8f3eddf3d Mon Sep 17 00:00:00 2001 From: Loup Theron Date: Tue, 13 Feb 2024 12:40:16 +0100 Subject: [PATCH 1/5] Add wms endpoint for FAO zones --- .github/workflows/cicd.yml | 2 +- .../layers/AdministrativeLayers.tsx | 9 +++++++++ .../AdministrativeZone/layers/constants.ts | 13 +++++++++++++ .../layers/styles/administrativeLayer.style.ts | 17 ----------------- 4 files changed, 23 insertions(+), 18 deletions(-) create mode 100644 frontend/src/features/AdministrativeZone/layers/constants.ts diff --git a/.github/workflows/cicd.yml b/.github/workflows/cicd.yml index e055f3a2a5..3f17f81786 100644 --- a/.github/workflows/cicd.yml +++ b/.github/workflows/cicd.yml @@ -304,7 +304,7 @@ jobs: name: Push to registry needs: [version, e2e_test, e2e_multi_windows_test] runs-on: ubuntu-22.04 - if: needs.version.outputs.IS_RELEASE && !contains(github.ref, 'dependabot') + if: !contains(github.ref, 'dependabot') env: IS_RELEASE: ${{ needs.version.outputs.IS_RELEASE }} ACTIONS_ALLOW_UNSECURE_COMMANDS: true diff --git a/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx b/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx index eacf7d95a0..eb8be06953 100644 --- a/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx +++ b/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx @@ -1,3 +1,4 @@ +import { FAO_LAYER } from '@features/AdministrativeZone/layers/constants' import React, { useEffect } from 'react' import { @@ -7,6 +8,7 @@ import { layersNotInCurrentOLMap, layersNotInShowedLayers } from '../../../domain/entities/layers' +import { LayerProperties } from '../../../domain/entities/layers/constants' import { useMainAppSelector } from '../../../hooks/useMainAppSelector' import { monitorfishMap } from '../../map/monitorfishMap' import { getVectorOLLayer } from '../useCases/showAdministrativeZone' @@ -30,6 +32,13 @@ function UnmemoizedAdministrativeLayers() { if (!layerToInsert) { return } + + if (layerToInsert.type === LayerProperties.FAO.code) { + olLayers.push(FAO_LAYER) + + return + } + const VectorLayer = getVectorOLLayer(layerToInsert.type, layerToInsert.zone, isBackoffice) olLayers.push(VectorLayer) }) diff --git a/frontend/src/features/AdministrativeZone/layers/constants.ts b/frontend/src/features/AdministrativeZone/layers/constants.ts new file mode 100644 index 0000000000..f494a7834d --- /dev/null +++ b/frontend/src/features/AdministrativeZone/layers/constants.ts @@ -0,0 +1,13 @@ +import TileLayer from 'ol/layer/Tile' +import { TileWMS } from 'ol/source' + +export const FAO_LAYER = new TileLayer({ + source: new TileWMS({ + params: { FORMAT: 'image/png', LAYERS: 'monitorfish:fao_areas', STYLES: 'monitorfish:FAO style', TILED: true }, + serverType: 'geoserver', + // Countries have transparency, so do not fade tiles: + transition: 0, + + url: `${import.meta.env.FRONTEND_GEOSERVER_REMOTE_URL}/geoserver/monitorfish/wms` + }) +}) diff --git a/frontend/src/features/AdministrativeZone/layers/styles/administrativeLayer.style.ts b/frontend/src/features/AdministrativeZone/layers/styles/administrativeLayer.style.ts index 75ae7130a8..05bc743ef2 100644 --- a/frontend/src/features/AdministrativeZone/layers/styles/administrativeLayer.style.ts +++ b/frontend/src/features/AdministrativeZone/layers/styles/administrativeLayer.style.ts @@ -29,23 +29,6 @@ export function getAdministrativeLayerStyle(type: string) { }` }) }) - case LayerProperties.FAO.code: - return (feature: Feature | undefined) => - new Style({ - stroke: new Stroke({ - color: '#767AB2', - width: 1 - }), - text: new Text({ - fill: new Fill({ color: THEME.color.gunMetal }), - font: '12px Marianne', - overflow: true, - stroke: new Stroke({ color: 'rgba(255,255,255,0.4)', width: 2 }), - text: `${ - (LayerProperties.FAO.zoneNamePropertyKey && feature?.get(LayerProperties.FAO.zoneNamePropertyKey)) || '' - }` - }) - }) case LayerProperties.AEM.code: return (feature: Feature | undefined) => new Style({ From f90fa408750730c2ccd22ba214e78fa49a8a9fe2 Mon Sep 17 00:00:00 2001 From: Loup Theron Date: Tue, 13 Feb 2024 14:02:57 +0100 Subject: [PATCH 2/5] Update cicd.yml --- .github/workflows/cicd.yml | 1 - 1 file changed, 1 deletion(-) diff --git a/.github/workflows/cicd.yml b/.github/workflows/cicd.yml index 3f17f81786..e21f0abead 100644 --- a/.github/workflows/cicd.yml +++ b/.github/workflows/cicd.yml @@ -304,7 +304,6 @@ jobs: name: Push to registry needs: [version, e2e_test, e2e_multi_windows_test] runs-on: ubuntu-22.04 - if: !contains(github.ref, 'dependabot') env: IS_RELEASE: ${{ needs.version.outputs.IS_RELEASE }} ACTIONS_ALLOW_UNSECURE_COMMANDS: true From ab94994c5ead5c2165585bab691665a534ab8cdc Mon Sep 17 00:00:00 2001 From: Loup Theron Date: Tue, 13 Feb 2024 17:43:00 +0100 Subject: [PATCH 3/5] Add name to layer --- frontend/src/domain/types/layer.ts | 7 +++++++ .../AdministrativeZone/layers/AdministrativeLayers.tsx | 2 +- .../features/AdministrativeZone/layers/constants.ts | 10 ++++++++-- 3 files changed, 16 insertions(+), 3 deletions(-) diff --git a/frontend/src/domain/types/layer.ts b/frontend/src/domain/types/layer.ts index e6d5ec2865..f1550ecbfc 100644 --- a/frontend/src/domain/types/layer.ts +++ b/frontend/src/domain/types/layer.ts @@ -1,3 +1,6 @@ +import TileLayer from 'ol/layer/Tile' +import { TileWMS } from 'ol/source' + import type { RegulatoryZone } from '../../features/Regulation/types' import type { Point } from 'ol/geom' import type VectorLayer from 'ol/layer/Vector' @@ -30,6 +33,10 @@ export type VectorLayerWithName = VectorLayer & { name?: string } +export type TileLayerWithName = TileLayer & { + name?: string +} + export type WebGLPointsLayerWithName = WebGLPointsLayer> & { name?: string } diff --git a/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx b/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx index eb8be06953..9f6e1f274b 100644 --- a/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx +++ b/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx @@ -33,7 +33,7 @@ function UnmemoizedAdministrativeLayers() { return } - if (layerToInsert.type === LayerProperties.FAO.code) { + if (layerToInsert.type === LayerProperties.FAO.code && FAO_LAYER) { olLayers.push(FAO_LAYER) return diff --git a/frontend/src/features/AdministrativeZone/layers/constants.ts b/frontend/src/features/AdministrativeZone/layers/constants.ts index f494a7834d..14f648cfc0 100644 --- a/frontend/src/features/AdministrativeZone/layers/constants.ts +++ b/frontend/src/features/AdministrativeZone/layers/constants.ts @@ -1,13 +1,19 @@ +import { getLayerNameFromTypeAndZone } from '@features/AdministrativeZone/useCases/utils' import TileLayer from 'ol/layer/Tile' import { TileWMS } from 'ol/source' +import { LayerProperties } from '../../../domain/entities/layers/constants' + +import type { TileLayerWithName } from '../../../domain/types/layer' + export const FAO_LAYER = new TileLayer({ source: new TileWMS({ params: { FORMAT: 'image/png', LAYERS: 'monitorfish:fao_areas', STYLES: 'monitorfish:FAO style', TILED: true }, serverType: 'geoserver', // Countries have transparency, so do not fade tiles: transition: 0, - url: `${import.meta.env.FRONTEND_GEOSERVER_REMOTE_URL}/geoserver/monitorfish/wms` }) -}) +}) as TileLayerWithName + +FAO_LAYER.name = getLayerNameFromTypeAndZone(LayerProperties.FAO.code, undefined) From 2c916258d77a548dd2debc7effc90a49ac3b2a37 Mon Sep 17 00:00:00 2001 From: Loup Theron Date: Wed, 14 Feb 2024 14:34:51 +0100 Subject: [PATCH 4/5] Add larger tile size and document layer style --- .../layers/AdministrativeLayers.tsx | 2 +- .../AdministrativeZone/layers/constants.ts | 2 + .../layers/styles/geoserver_fao_style.md | 51 +++++++++++++++++++ 3 files changed, 54 insertions(+), 1 deletion(-) create mode 100644 frontend/src/features/AdministrativeZone/layers/styles/geoserver_fao_style.md diff --git a/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx b/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx index 9f6e1f274b..9fc2b08cf5 100644 --- a/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx +++ b/frontend/src/features/AdministrativeZone/layers/AdministrativeLayers.tsx @@ -1,4 +1,5 @@ import { FAO_LAYER } from '@features/AdministrativeZone/layers/constants' +import { useMainAppSelector } from '@hooks/useMainAppSelector' import React, { useEffect } from 'react' import { @@ -9,7 +10,6 @@ import { layersNotInShowedLayers } from '../../../domain/entities/layers' import { LayerProperties } from '../../../domain/entities/layers/constants' -import { useMainAppSelector } from '../../../hooks/useMainAppSelector' import { monitorfishMap } from '../../map/monitorfishMap' import { getVectorOLLayer } from '../useCases/showAdministrativeZone' diff --git a/frontend/src/features/AdministrativeZone/layers/constants.ts b/frontend/src/features/AdministrativeZone/layers/constants.ts index 14f648cfc0..ec5a562e2c 100644 --- a/frontend/src/features/AdministrativeZone/layers/constants.ts +++ b/frontend/src/features/AdministrativeZone/layers/constants.ts @@ -1,6 +1,7 @@ import { getLayerNameFromTypeAndZone } from '@features/AdministrativeZone/useCases/utils' import TileLayer from 'ol/layer/Tile' import { TileWMS } from 'ol/source' +import { createXYZ } from 'ol/tilegrid' import { LayerProperties } from '../../../domain/entities/layers/constants' @@ -10,6 +11,7 @@ export const FAO_LAYER = new TileLayer({ source: new TileWMS({ params: { FORMAT: 'image/png', LAYERS: 'monitorfish:fao_areas', STYLES: 'monitorfish:FAO style', TILED: true }, serverType: 'geoserver', + tileGrid: createXYZ({ tileSize: 512 }), // Countries have transparency, so do not fade tiles: transition: 0, url: `${import.meta.env.FRONTEND_GEOSERVER_REMOTE_URL}/geoserver/monitorfish/wms` diff --git a/frontend/src/features/AdministrativeZone/layers/styles/geoserver_fao_style.md b/frontend/src/features/AdministrativeZone/layers/styles/geoserver_fao_style.md new file mode 100644 index 0000000000..b6df13d42f --- /dev/null +++ b/frontend/src/features/AdministrativeZone/layers/styles/geoserver_fao_style.md @@ -0,0 +1,51 @@ +# Geoserver FAO style + +The `fao_areas` layer is served as a Geoserver `wms` layer. + +For `geowebcache` to be running under `/wms` routes, the `WMS` caching direct integration must be setup: +https://docs.geoserver.org/stable/en/user/geowebcache/webadmin/defaults.html#enable-direct-integration-with-geoserver-wms + +The style (named `FAO style`) is defined as the following SLD: +```xml + + + + FAO areas layer + + FAO areas + FAO Areas + + + Line + + + #767ab2 + 1 + + + + + Text + + + + 12 + + + + #ffffff + + + + #282F3E + 1 + + + + + + + +``` From 8d31bbeb710f8d80e941d2eacf8984fe27312c6b Mon Sep 17 00:00:00 2001 From: Loup Theron Date: Thu, 15 Feb 2024 17:24:39 +0100 Subject: [PATCH 5/5] Re-add blocker to push image on pull request --- .github/workflows/cicd.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/.github/workflows/cicd.yml b/.github/workflows/cicd.yml index e21f0abead..e055f3a2a5 100644 --- a/.github/workflows/cicd.yml +++ b/.github/workflows/cicd.yml @@ -304,6 +304,7 @@ jobs: name: Push to registry needs: [version, e2e_test, e2e_multi_windows_test] runs-on: ubuntu-22.04 + if: needs.version.outputs.IS_RELEASE && !contains(github.ref, 'dependabot') env: IS_RELEASE: ${{ needs.version.outputs.IS_RELEASE }} ACTIONS_ALLOW_UNSECURE_COMMANDS: true