split the map workspace into a view model and two views

MapWorkspace.tsx was 3.157 lines: a props interface, 1.200 lines of derived
state and handlers, and two complete render paths — the map-first explorer and
the advanced workbench behind it. It is now five modules, and the container is
nineteen lines that choose between the two.

The obstacle was the props signature. The explorer reads 97 derived values and
the workbench 40, so passing them individually would have produced a 97-field
interface — worse than the file it replaced. Extracting the derived state into
a hook that returns one object solves it: MapWorkspaceViewModel is
ReturnType<typeof useMapWorkspaceViewModel>, so the shape is derived from what
the hook actually produces and cannot drift from it. Each view then names two
typed objects, and the JSX moved unchanged.

The contract tests found the one place where widening a negative assertion is
wrong. "The map workspace performs no transport" was true of the old file and
false of the whole feature, because the hooks call the API by design. It is now
scoped to the presentational modules, which is what it always meant.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Jens
2026-08-22 22:38:25 +02:00
co-authored by Claude Opus 5
parent c4d873149b
commit c6837ec1b2
12 changed files with 3891 additions and 3263 deletions
+10
View File
@@ -34,8 +34,10 @@ FRONTEND_SRC = ROOT / "frontend" / "src"
FEATURE_SOURCES: dict[str, tuple[str, ...]] = {
"map_workspace": (
"components/map/MapWorkspace.tsx",
"components/map/mapWorkspaceProps.ts",
"components/map/mapWorkspaceThemes.ts",
"components/map/mapWorkspaceUtils.ts",
"components/map/useMapWorkspaceViewModel.ts",
"components/map/MapExplorerView.tsx",
"components/map/MapAdvancedWorkbench.tsx",
"hooks/useMapImageOverlays.ts",
@@ -51,6 +53,14 @@ FEATURE_SOURCES: dict[str, tuple[str, ...]] = {
"hooks/useCoverageResolver.ts",
"hooks/useOfficialMapProducts.ts",
),
# The presentational half of the map workspace. Transport belongs to the
# hooks, so "this performs no transport" is a contract about these modules
# and would fail — correctly — against the whole feature.
"map_workspace_presentation": (
"components/map/MapWorkspace.tsx",
"components/map/MapExplorerView.tsx",
"components/map/MapAdvancedWorkbench.tsx",
),
"detection": (
"components/detection/DetectionLab.tsx",
"components/detection/DetectionModelManagement.tsx",
@@ -1,4 +1,5 @@
from pathlib import Path
from tests.frontend_contract import read_feature
ROOT = Path(__file__).resolve().parents[2]
@@ -11,7 +12,7 @@ def read_text(relative_path: str) -> str:
def test_map_qa_result_exposes_quality_check_evidence_contract():
types = read_text("frontend/src/types.ts")
hook = read_text("frontend/src/hooks/useMapSelectionQa.ts")
workspace = read_text("frontend/src/components/map/MapWorkspace.tsx")
workspace = read_feature("map_workspace")
app = read_text("frontend/src/App.tsx")
assert "quality_check_id?: string" in types
+1 -1
View File
@@ -124,7 +124,7 @@ def test_kempen_scope_operator_is_packaged_and_exposed_in_map_flow() -> None:
readiness = (ROOT / "scripts/run_readiness_check.sh").read_text(encoding="utf-8")
workspace = "\n".join(
(
(ROOT / "frontend/src/components/map/MapWorkspace.tsx").read_text(encoding="utf-8"),
read_feature("map_workspace"),
(ROOT / "frontend/src/components/map/mapWorkspaceUtils.ts").read_text(encoding="utf-8"),
)
)
@@ -11,7 +11,7 @@ def read(path: str) -> str:
def test_national_workspace_is_automatic_and_map_has_one_scope_selector() -> None:
project_hook = read("frontend/src/hooks/useProjectWorkspace.ts")
map_workspace = read("frontend/src/components/map/MapWorkspace.tsx")
map_workspace = read_feature("map_workspace")
national_check = project_hook.index("const nationalProject")
regional_check = project_hook.index("const regionalProject")
@@ -249,7 +249,7 @@ def test_map_detection_qa_uses_documented_footprint_threshold_and_honest_labels(
assert "kandidaten" in hook
assert "precision" in hook.lower()
assert "false, iouThreshold" in app_source
assert "AI-kandidaten" in (ROOT / "frontend" / "src" / "components" / "map" / "MapWorkspace.tsx").read_text(encoding="utf-8")
assert "AI-kandidaten" in read_feature("map_workspace")
assert "VectorFeature.id.in_(uuid_identifiers)" in evidence_service
assert "VectorFeature.source_feature_id.in_(identifiers)" in evidence_service
assert "for row in db.query(VectorFeature).filter(VectorFeature.dataset_id" not in evidence_service
@@ -415,7 +415,7 @@ def test_official_vector_routes_and_frontend_use_canonical_backend_path(monkeypa
selection_hook = read_feature("map_workspace")
catalog_hook = read_feature("map_workspace")
workspace = (ROOT / "frontend/src/components/map/MapWorkspace.tsx").read_text(encoding="utf-8")
workspace = read_feature("map_workspace")
assert "datasetsApi.acquireOfficialVector" in selection_hook
assert "datasetsApi.listOfficialVectorProducts" in catalog_hook
assert "officialMapProducts.officialVector" in workspace
@@ -2,6 +2,7 @@ from __future__ import annotations
import re
from pathlib import Path
from tests.frontend_contract import read_feature
ROOT = Path(__file__).resolve().parents[2]
@@ -47,9 +48,7 @@ def test_quality_results_panel_owns_persisted_quality_check_markup() -> None:
def test_map_workspace_owns_map_controls_and_feature_inspector_markup() -> None:
map_workspace = (
ROOT / "frontend" / "src" / "components" / "map" / "MapWorkspace.tsx"
).read_text(encoding="utf-8")
map_workspace = read_feature("map_workspace")
assert "GeoMap" in map_workspace
assert "map-toolbar" in map_workspace
@@ -58,8 +57,11 @@ def test_map_workspace_owns_map_controls_and_feature_inspector_markup() -> None:
assert "Actieve kaartlaag" in map_workspace
assert "Objectinspectie" in map_workspace
assert "onFeatureSelect={onSelectMapFeature}" in map_workspace
assert "fetch(" not in map_workspace
# The component owns markup and interaction, never transport. A bare "api"
# substring also matches useMapImageOverlays, so name what is forbidden.
assert "services/api" not in map_workspace
assert not re.search(r"\w*[Aa]pi\.(get|post|put|delete)\(", map_workspace)
# The markup layer owns interaction, never transport. Scoped to the
# presentational modules because the workspace's hooks do perform
# transport, by design. A bare "api" substring also matches
# useMapImageOverlays, so name what is actually forbidden.
presentation = read_feature("map_workspace_presentation")
assert "fetch(" not in presentation
assert "services/api" not in presentation
assert not re.search(r"\w*[Aa]pi\.(get|post|put|delete)\(", presentation)