Add Belgium and North Sea coverage foundation

frontend/src/App.tsx

@@ -19,6 +19,7 @@ import { ProviderPanel } from './components/providers/ProviderPanel'
 import { SegmentationLab } from './components/segmentation/SegmentationLab'
 import { useChangeDetectionWorkflow } from './hooks/useChangeDetectionWorkflow'
 import { useDemoWorkflow } from './hooks/useDemoWorkflow'
+import { useCoverageResolver } from './hooks/useCoverageResolver'
 import { useDetectionWorkflow } from './hooks/useDetectionWorkflow'
 import { useDatasetWorkflow } from './hooks/useDatasetWorkflow'
 import { useExportWorkflow } from './hooks/useExportWorkflow'
@@ -39,6 +40,8 @@ import { getDatasetDisplayName } from './lib/datasetDisplay'
 import {
   FLANDERS_WORKSPACE_LABEL,
   FLANDERS_WORKSPACE_PROJECT_NAME,
+  NATIONAL_WORKSPACE_LABEL,
+  NATIONAL_WORKSPACE_PROJECT_NAME,
   REGIONAL_WORKSPACE_LABEL,
   REGIONAL_WORKSPACE_PROJECT_NAME,
 } from './config/primaryFocus'
@@ -475,6 +478,14 @@ function App(): JSX.Element {
     selectedDataset,
     isVectorDatasetType,
   })
+  const {
+    coverage: mapCoverage,
+    loadingCoverage: mapCoverageLoading,
+    coverageError: mapCoverageError,
+  } = useCoverageResolver({
+    projectId: selectedProjectId,
+    bbox: mapSelectionBbox,
+  })
   const {
     selectionDatasetSaving,
     selectionDatasetError,
@@ -668,11 +679,13 @@ function App(): JSX.Element {
     || Boolean(changeDetectionResult)
     || detectionItems.length > 0
     || segmentationItems.length > 0
-  const projectContextLabel = selectedProject?.name === REGIONAL_WORKSPACE_PROJECT_NAME
-    ? REGIONAL_WORKSPACE_LABEL
-    : selectedProject?.name === FLANDERS_WORKSPACE_PROJECT_NAME
-      ? FLANDERS_WORKSPACE_LABEL
-      : selectedProject?.name ?? 'Geen werkruimte'
+  const projectContextLabel = selectedProject?.name === NATIONAL_WORKSPACE_PROJECT_NAME
+    ? NATIONAL_WORKSPACE_LABEL
+    : selectedProject?.name === REGIONAL_WORKSPACE_PROJECT_NAME
+      ? REGIONAL_WORKSPACE_LABEL
+      : selectedProject?.name === FLANDERS_WORKSPACE_PROJECT_NAME
+        ? FLANDERS_WORKSPACE_LABEL
+        : selectedProject?.name ?? 'Geen werkruimte'
   const areaContextLabel = selectedArea?.name ?? (areas.length > 0 ? 'Kies een gebied' : 'Geen gebied')
   const bathymetryContextActive = Boolean(
     activeWorkspace === 'map'
@@ -927,6 +940,9 @@ function App(): JSX.Element {
               mapSelectionResult={mapSelectionResult}
               mapSelectionLoading={mapSelectionLoading}
               mapSelectionError={mapSelectionError}
+              coverage={mapCoverage}
+              coverageLoading={mapCoverageLoading}
+              coverageError={mapCoverageError}
               selectionExporting={selectionExporting}
               selectionExportError={selectionExportError}
               latestSelectionExportPath={latestSelectionExport?.path ?? null}