diff --git a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##data-info.data-info.json b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##data-info.data-info.json
index 3c6ae023..6f8569ab 100644
--- a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##data-info.data-info.json
+++ b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##data-info.data-info.json
@@ -123,6 +123,12 @@
}
},
"layouts": {
+ "list": [
+ "id",
+ "slug",
+ "content",
+ "createdAt"
+ ],
"edit": [
[
{
@@ -140,12 +146,6 @@
"size": 6
}
]
- ],
- "list": [
- "id",
- "slug",
- "content",
- "data_sources"
]
}
},
diff --git a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##fishing-protection-level-stat.fishing-protection-level-stat.json b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##fishing-protection-level-stat.fishing-protection-level-stat.json
index aba53dd4..374dfbc4 100644
--- a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##fishing-protection-level-stat.fishing-protection-level-stat.json
+++ b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##fishing-protection-level-stat.fishing-protection-level-stat.json
@@ -127,24 +127,24 @@
"list": [
"id",
"location",
- "area",
- "fishing_protection_level"
+ "fishing_protection_level",
+ "area"
],
"edit": [
[
{
"name": "location",
"size": 6
+ },
+ {
+ "name": "fishing_protection_level",
+ "size": 6
}
],
[
{
"name": "area",
"size": 4
- },
- {
- "name": "fishing_protection_level",
- "size": 6
}
]
]
diff --git a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##habitat-stat.habitat-stat.json b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##habitat-stat.habitat-stat.json
index 05b82a7c..be24cdd4 100644
--- a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##habitat-stat.habitat-stat.json
+++ b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##habitat-stat.habitat-stat.json
@@ -152,6 +152,12 @@
}
},
"layouts": {
+ "list": [
+ "id",
+ "location",
+ "habitat",
+ "year"
+ ],
"edit": [
[
{
@@ -177,14 +183,6 @@
"size": 4
}
]
- ],
- "list": [
- "id",
- "location",
- "habitat",
- "year",
- "protectedArea",
- "totalArea"
]
}
},
diff --git a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##location.location.json b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##location.location.json
index 2a2b3e28..94cd9355 100644
--- a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##location.location.json
+++ b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##location.location.json
@@ -229,9 +229,7 @@
"id",
"code",
"name",
- "type",
- "totalMarineArea",
- "groups"
+ "totalMarineArea"
],
"edit": [
[
@@ -245,6 +243,10 @@
}
],
[
+ {
+ "name": "totalMarineArea",
+ "size": 4
+ },
{
"name": "type",
"size": 6
@@ -252,29 +254,25 @@
],
[
{
- "name": "totalMarineArea",
- "size": 4
+ "name": "groups",
+ "size": 6
},
{
- "name": "groups",
+ "name": "members",
"size": 6
}
],
[
{
- "name": "members",
+ "name": "fishing_protection_level_stats",
"size": 6
},
{
- "name": "fishing_protection_level_stats",
+ "name": "mpaa_protection_level_stats",
"size": 6
}
],
[
- {
- "name": "mpaa_protection_level_stats",
- "size": 6
- },
{
"name": "protection_coverage_stats",
"size": 6
diff --git a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpa-protection-coverage-stat.mpa-protection-coverage-stat.json b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpa-protection-coverage-stat.mpa-protection-coverage-stat.json
index cb0f06ab..988a9767 100644
--- a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpa-protection-coverage-stat.mpa-protection-coverage-stat.json
+++ b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpa-protection-coverage-stat.mpa-protection-coverage-stat.json
@@ -154,6 +154,12 @@
}
},
"layouts": {
+ "list": [
+ "id",
+ "mpa",
+ "fishing_protection_level",
+ "mpaa_protection_level"
+ ],
"edit": [
[
{
@@ -181,13 +187,6 @@
"size": 4
}
]
- ],
- "list": [
- "id",
- "mpa",
- "fishing_protection_level",
- "mpaa_protection_level",
- "location"
]
}
},
diff --git a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpa.mpa.json b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpa.mpa.json
index 4d265ea6..b860c5d6 100644
--- a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpa.mpa.json
+++ b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpa.mpa.json
@@ -181,6 +181,12 @@
}
},
"layouts": {
+ "list": [
+ "id",
+ "wdpaid",
+ "name",
+ "year"
+ ],
"edit": [
[
{
@@ -220,15 +226,6 @@
"size": 6
}
]
- ],
- "list": [
- "id",
- "wdpaid",
- "name",
- "year",
- "protection_status",
- "mpaa_establishment_stage",
- "area"
]
}
},
diff --git a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpaa-establishment-stage-stat.mpaa-establishment-stage-stat.json b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpaa-establishment-stage-stat.mpaa-establishment-stage-stat.json
index 084cec3b..baa0618d 100644
--- a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpaa-establishment-stage-stat.mpaa-establishment-stage-stat.json
+++ b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##mpaa-establishment-stage-stat.mpaa-establishment-stage-stat.json
@@ -153,6 +153,12 @@
}
},
"layouts": {
+ "list": [
+ "id",
+ "location",
+ "mpaa_establishment_stage",
+ "protection_status"
+ ],
"edit": [
[
{
@@ -180,14 +186,6 @@
"size": 4
}
]
- ],
- "list": [
- "id",
- "location",
- "mpaa_establishment_stage",
- "protection_status",
- "year",
- "area"
]
}
},
diff --git a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##protection-coverage-stat.protection-coverage-stat.json b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##protection-coverage-stat.protection-coverage-stat.json
index 163b6b18..0dac0cba 100644
--- a/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##protection-coverage-stat.protection-coverage-stat.json
+++ b/cms/config/sync/core-store.plugin_content_manager_configuration_content_types##api##protection-coverage-stat.protection-coverage-stat.json
@@ -166,6 +166,12 @@
}
},
"layouts": {
+ "list": [
+ "id",
+ "location",
+ "protection_status",
+ "year"
+ ],
"edit": [
[
{
@@ -197,14 +203,6 @@
"size": 4
}
]
- ],
- "list": [
- "id",
- "location",
- "protection_status",
- "year",
- "cumSumProtectedArea",
- "protectedAreasCount"
]
}
},
diff --git a/cms/config/sync/user-role.public.json b/cms/config/sync/user-role.public.json
index 066442e3..0d024b4a 100644
--- a/cms/config/sync/user-role.public.json
+++ b/cms/config/sync/user-role.public.json
@@ -9,36 +9,12 @@
{
"action": "api::data-info.data-info.findOne"
},
- {
- "action": "api::data-source.data-source.find"
- },
- {
- "action": "api::data-source.data-source.findOne"
- },
- {
- "action": "api::fishing-protection-level-stat.fishing-protection-level-stat.find"
- },
- {
- "action": "api::fishing-protection-level-stat.fishing-protection-level-stat.findOne"
- },
- {
- "action": "api::fishing-protection-level.fishing-protection-level.find"
- },
- {
- "action": "api::fishing-protection-level.fishing-protection-level.findOne"
- },
{
"action": "api::habitat-stat.habitat-stat.find"
},
{
"action": "api::habitat-stat.habitat-stat.findOne"
},
- {
- "action": "api::habitat.habitat.find"
- },
- {
- "action": "api::habitat.habitat.findOne"
- },
{
"action": "api::layer.layer.find"
},
@@ -57,48 +33,12 @@
{
"action": "api::mpa-protection-coverage-stat.mpa-protection-coverage-stat.findOne"
},
- {
- "action": "api::mpa.mpa.find"
- },
- {
- "action": "api::mpa.mpa.findOne"
- },
- {
- "action": "api::mpaa-establishment-stage-stat.mpaa-establishment-stage-stat.find"
- },
- {
- "action": "api::mpaa-establishment-stage-stat.mpaa-establishment-stage-stat.findOne"
- },
- {
- "action": "api::mpaa-establishment-stage.mpaa-establishment-stage.find"
- },
- {
- "action": "api::mpaa-establishment-stage.mpaa-establishment-stage.findOne"
- },
- {
- "action": "api::mpaa-protection-level-stat.mpaa-protection-level-stat.find"
- },
- {
- "action": "api::mpaa-protection-level-stat.mpaa-protection-level-stat.findOne"
- },
- {
- "action": "api::mpaa-protection-level.mpaa-protection-level.find"
- },
- {
- "action": "api::mpaa-protection-level.mpaa-protection-level.findOne"
- },
{
"action": "api::protection-coverage-stat.protection-coverage-stat.find"
},
{
"action": "api::protection-coverage-stat.protection-coverage-stat.findOne"
},
- {
- "action": "api::protection-status.protection-status.find"
- },
- {
- "action": "api::protection-status.protection-status.findOne"
- },
{
"action": "plugin::users-permissions.auth.callback"
},
diff --git a/frontend/package.json b/frontend/package.json
index 0b770e54..a5c437c7 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -54,7 +54,7 @@
"lucide-react": "^0.274.0",
"mapbox-gl": "2.15.0",
"next": "13.5.6",
- "next-usequerystate": "1.8.4",
+ "next-usequerystate": "1.9.2",
"orval": "6.18.1",
"postcss": "8.4.21",
"react": "18.2.0",
diff --git a/frontend/src/containers/data-tool/content/index.tsx b/frontend/src/containers/data-tool/content/index.tsx
index ee08a3f0..c05e99ea 100644
--- a/frontend/src/containers/data-tool/content/index.tsx
+++ b/frontend/src/containers/data-tool/content/index.tsx
@@ -7,7 +7,7 @@ const DataToolContent: React.FC = () => {
const [{ showDetails }] = useSyncDataToolContentSettings();
return (
-
+
{showDetails && }
diff --git a/frontend/src/containers/data-tool/content/map/index.tsx b/frontend/src/containers/data-tool/content/map/index.tsx
index 017fb0f3..e22f5bf4 100644
--- a/frontend/src/containers/data-tool/content/map/index.tsx
+++ b/frontend/src/containers/data-tool/content/map/index.tsx
@@ -1,9 +1,12 @@
-import { ComponentProps, useCallback } from 'react';
+import { ComponentProps, useCallback, useEffect, useRef } from 'react';
import { useMap } from 'react-map-gl';
+import { LngLatBoundsLike } from 'react-map-gl';
import dynamic from 'next/dynamic';
+import { useParams } from 'next/navigation';
+import { useQueryClient } from '@tanstack/react-query';
import { useAtomValue, useSetAtom } from 'jotai';
import Map, { ZoomControls, Attributions, DrawControls, Drawing } from '@/components/map';
@@ -12,6 +15,7 @@ import SidebarContent from '@/components/sidebar-content';
import LayersToolbox from '@/containers/data-tool/content/map/layers-toolbox';
import { useSyncMapSettings } from '@/containers/data-tool/content/map/sync-settings';
import { cn } from '@/lib/classnames';
+import { sidebarAtom } from '@/store/data-tool';
import {
drawStateAtom,
layersInteractiveAtom,
@@ -19,6 +23,8 @@ import {
popupAtom,
} from '@/store/map';
import { useGetLayers } from '@/types/generated/layer';
+import { getGetLocationsQueryOptions } from '@/types/generated/location';
+import { LocationListResponse, LocationResponseDataObject } from '@/types/generated/strapi.schemas';
import { LayerTyped } from '@/types/layers';
const LayerManager = dynamic(() => import('@/containers/data-tool/content/map/layer-manager'), {
@@ -26,10 +32,19 @@ const LayerManager = dynamic(() => import('@/containers/data-tool/content/map/la
});
const DataToolMap: React.FC = () => {
- const [{ bbox }, setMapSettings] = useSyncMapSettings();
+ const [{ bbox: customBbox }, setMapSettings] = useSyncMapSettings();
const { default: map } = useMap();
const drawState = useAtomValue(drawStateAtom);
const setPopup = useSetAtom(popupAtom);
+ const queryClient = useQueryClient();
+ const { locationCode } = useParams();
+ const isSidebarOpen = useAtomValue(sidebarAtom);
+ const hoveredPolygonId = useRef
(null);
+
+ const locationData = queryClient.getQueryData([
+ 'locations',
+ locationCode,
+ ]);
const layersInteractive = useAtomValue(layersInteractiveAtom);
const layersInteractiveIds = useAtomValue(layersInteractiveIdsAtom);
@@ -57,7 +72,7 @@ const DataToolMap: React.FC = () => {
.getBounds()
.toArray()
.flat()
- .map((b) => parseFloat(b.toFixed(2))) as typeof bbox,
+ .map((b) => parseFloat(b.toFixed(2))) as typeof customBbox,
}));
}, [map, setMapSettings]);
@@ -71,23 +86,101 @@ const DataToolMap: React.FC = () => {
})
) {
const p = Object.assign({}, e, { features: e.features ?? [] });
-
setPopup(p);
}
},
[layersInteractive, layersInteractiveData, setPopup]
);
+ const handleMouseMove = useCallback(
+ (e: Parameters['onMouseOver']>[0]) => {
+ if (e.features.length > 0) {
+ if (hoveredPolygonId.current !== null) {
+ map.setFeatureState(
+ {
+ source: e.features?.[0].source,
+ id: hoveredPolygonId.current,
+ sourceLayer: e.features?.[0].sourceLayer,
+ },
+ { hover: false }
+ );
+ }
+ map.setFeatureState(
+ {
+ source: e.features?.[0].source,
+ id: e.features[0].id,
+ sourceLayer: e.features?.[0].sourceLayer,
+ },
+ { hover: true }
+ );
+
+ hoveredPolygonId.current = e.features[0].id;
+ }
+ },
+ [map, hoveredPolygonId]
+ );
+
+ const handleMouseLeave = useCallback(() => {
+ if (hoveredPolygonId.current !== null) {
+ map.setFeatureState(
+ // ? not a fan of harcoding the sources here, but there is no other way to find out the source
+ { source: 'ezz-source', id: hoveredPolygonId.current, sourceLayer: 'eez_v11' },
+ { hover: false }
+ );
+ }
+ }, [map, hoveredPolygonId]);
+
+ const bounds = customBbox ?? (locationData?.attributes?.bounds as LngLatBoundsLike);
+
+ useEffect(() => {
+ map?.easeTo({
+ padding: {
+ top: 0,
+ bottom: 0,
+ left: isSidebarOpen ? 430 : 0,
+ right: 0,
+ },
+ duration: 500,
+ });
+ }, [isSidebarOpen, map]);
+
+ useEffect(() => {
+ const { queryKey } = getGetLocationsQueryOptions();
+ const d = queryClient.getQueryData(queryKey);
+ if (d) {
+ const location = d.data.find(({ attributes }) => attributes.code === locationCode);
+
+ map?.fitBounds(location.attributes.bounds as LngLatBoundsLike, {
+ padding: {
+ top: 0,
+ bottom: 0,
+ left: isSidebarOpen ? 430 : 0,
+ right: 0,
+ },
+ });
+ }
+ }, [queryClient, locationCode, isSidebarOpen, map]);
+
return (
-
+