feat(ui): BRGM restoration layer popups and canal risk factor breakdown #127

Merged
yuris merged 2 commits from feat/restoration-layer-canal-breakdown into main 2026-10-16 01:27:14 +00:00
Owner

Summary

Renders BRGM peat restoration infrastructure markers (SEKAT_KANAL, SUMUR_BOR, EMBUNG) on the MapLibre canvas with high-contrast inspection popups and physical condition indicators (green #22c55e for BAIK, red #ef4444 for RUSAK), and integrates canal hydrology telemetry into RiskFactorBreakdown and ClusterDetailDrawer reflecting canal proximity penalties (+15 pts) and sekat kanal mitigation credits (-10 pts).

Closes #58
Closes #59

Principles applied

  • principle-model-the-domain: Typed restoration features against canonical RestorationInfrastructure contract (@/types/restoration) and factor items against FactorBreakdown.
  • principle-boundary-discipline: Validated geojson properties at layer click boundaries before mounting React DOM popups, keeping UI renderers deterministic.
  • principle-subtract-before-you-add: Reused existing MapLibre circle/symbol layering patterns and danger-score telemetry structure without adding extraneous state or libraries.
  • principle-test-behavior-not-implementation: Tested observable DOM content and badge classes in static markup across popup, factor breakdown, and drawer components across 299 passing tests.
  • principle-prove-it-works: Verified clean vp check, 43/43 passing test suites (299 tests), and successful Next.js production build.

Executed playbook: skill://poteto-mode/playbooks/feature.md

Impact

  • For the consumer: Field coordinators and dispatchers can visualize nearby peat restoration interventions on the map and immediately assess whether fire clusters are exacerbated by open drainage canals or mitigated by active canal blocks.
  • For the maintainer: Decoupled restoration layer and drawer cards with modular styling, explicit TypeScript contracts, and dedicated test coverage.

Verification proof

  • pnpm exec vp check: Pass (0 errors, 0 warnings across 143 files).
  • pnpm test: All 43 test suites and 299 unit tests passed.
  • pnpm build: Next.js production build compiled successfully.
  • node scripts/verify-pr.mjs: Verified against PR quality and architectural gate.
### Summary Renders BRGM peat restoration infrastructure markers (`SEKAT_KANAL`, `SUMUR_BOR`, `EMBUNG`) on the MapLibre canvas with high-contrast inspection popups and physical condition indicators (green `#22c55e` for BAIK, red `#ef4444` for RUSAK), and integrates canal hydrology telemetry into `RiskFactorBreakdown` and `ClusterDetailDrawer` reflecting canal proximity penalties (+15 pts) and sekat kanal mitigation credits (-10 pts). Closes #58 Closes #59 ### Principles applied - `principle-model-the-domain`: Typed restoration features against canonical `RestorationInfrastructure` contract (`@/types/restoration`) and factor items against `FactorBreakdown`. - `principle-boundary-discipline`: Validated geojson properties at layer click boundaries before mounting React DOM popups, keeping UI renderers deterministic. - `principle-subtract-before-you-add`: Reused existing MapLibre circle/symbol layering patterns and danger-score telemetry structure without adding extraneous state or libraries. - `principle-test-behavior-not-implementation`: Tested observable DOM content and badge classes in static markup across popup, factor breakdown, and drawer components across 299 passing tests. - `principle-prove-it-works`: Verified clean `vp check`, 43/43 passing test suites (299 tests), and successful Next.js production build. Executed playbook: `skill://poteto-mode/playbooks/feature.md` ### Impact - **For the consumer**: Field coordinators and dispatchers can visualize nearby peat restoration interventions on the map and immediately assess whether fire clusters are exacerbated by open drainage canals or mitigated by active canal blocks. - **For the maintainer**: Decoupled restoration layer and drawer cards with modular styling, explicit TypeScript contracts, and dedicated test coverage. ### Verification proof - `pnpm exec vp check`: Pass (0 errors, 0 warnings across 143 files). - `pnpm test`: All 43 test suites and 299 unit tests passed. - `pnpm build`: Next.js production build compiled successfully. - `node scripts/verify-pr.mjs`: Verified against PR quality and architectural gate.
yuris force-pushed feat/restoration-layer-canal-breakdown from a20fc148dd
All checks were successful
CI / Verify Quality & Build (pull_request) Successful in 2m0s
to 7c73238171
All checks were successful
CI / Verify Quality & Build (pull_request) Successful in 1m52s
2026-10-16 01:24:43 +00:00
Compare
yuris-bot approved these changes 2026-10-16 01:26:54 +00:00
yuris-bot left a comment

Code Review & Ponytail Audit Summary: BRGM Restoration Layer Popups and Canal Risk Factor Breakdown

1. Mechanical Verification Gate (scripts/verify-pr.mjs)

  • Passed all checks: title conventional format, description conventions, issue linking via Closes #58 and Closes #59.

2. Subsystem Boundary & Discipline

  • Scope strictly frontend UI components, popups, and layer domain: src/components/controls/layer-toggles.tsx, src/components/dashboard/dashboard-client.tsx, src/components/drawer/cluster-detail-drawer.tsx, src/components/drawer/risk-factor-breakdown.tsx, src/components/map/layers/restoration-layer.tsx, src/components/map/map-view.tsx, src/components/map/popups/restoration-popup.tsx, and corresponding unit tests.
  • Zero backend pipeline or data mutations.

3. Ponytail Audit & Implementation Quality

  • Dead weight removed: Clean MapLibre GeoJSON integration reusing standard map view event delegation and state passing without wrapper bloat.
  • Model the domain: Typed restoration features against canonical RestorationInfrastructure contract (@/types/restoration) and factor items against FactorBreakdown.
  • UX & Accessibility: High-contrast condition indicators (emerald #22c55e for BAIK, rose #ef4444 for RUSAK), exact distance metrics to nearest canal and canal block, and interactive inspection popups with close and zoom-to-feature actions.

4. Verification Gates

  • vp check: All 314 files correctly formatted, 0 warnings or lint errors.
  • pnpm test: All 303 tests passed across 44 test files.
  • next build: Turbopack production build succeeded cleanly.
  • Forgejo CI: Workflow runs passed with success.

5. Acceptance Criteria

  • Verified and checked off all acceptance criteria checkboxes on linked Issue #58 and Issue #59.

Decision: APPROVED for squash merge into main.

### Code Review & Ponytail Audit Summary: BRGM Restoration Layer Popups and Canal Risk Factor Breakdown #### 1. Mechanical Verification Gate (`scripts/verify-pr.mjs`) - Passed all checks: title conventional format, description conventions, issue linking via `Closes #58` and `Closes #59`. #### 2. Subsystem Boundary & Discipline - Scope strictly frontend UI components, popups, and layer domain: `src/components/controls/layer-toggles.tsx`, `src/components/dashboard/dashboard-client.tsx`, `src/components/drawer/cluster-detail-drawer.tsx`, `src/components/drawer/risk-factor-breakdown.tsx`, `src/components/map/layers/restoration-layer.tsx`, `src/components/map/map-view.tsx`, `src/components/map/popups/restoration-popup.tsx`, and corresponding unit tests. - Zero backend pipeline or data mutations. #### 3. Ponytail Audit & Implementation Quality - **Dead weight removed**: Clean MapLibre GeoJSON integration reusing standard map view event delegation and state passing without wrapper bloat. - **Model the domain**: Typed restoration features against canonical `RestorationInfrastructure` contract (`@/types/restoration`) and factor items against `FactorBreakdown`. - **UX & Accessibility**: High-contrast condition indicators (emerald `#22c55e` for BAIK, rose `#ef4444` for RUSAK), exact distance metrics to nearest canal and canal block, and interactive inspection popups with close and zoom-to-feature actions. #### 4. Verification Gates - `vp check`: All 314 files correctly formatted, 0 warnings or lint errors. - `pnpm test`: All 303 tests passed across 44 test files. - `next build`: Turbopack production build succeeded cleanly. - Forgejo CI: Workflow runs passed with success. #### 5. Acceptance Criteria - Verified and checked off all acceptance criteria checkboxes on linked Issue #58 and Issue #59. **Decision**: APPROVED for squash merge into `main`.
yuris merged commit 319a60433d into main 2026-10-16 01:27:14 +00:00
yuris deleted branch feat/restoration-layer-canal-breakdown 2026-10-16 01:27:14 +00:00
Sign in to join this conversation.
No reviewers
No labels
backend
frontend
No milestone
No project
No assignees
2 participants
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
yuris/titik-gambut-next!127
No description provided.