diff --git a/prd.json b/prd.json index 7a27321..429b4ac 100644 --- a/prd.json +++ b/prd.json @@ -216,7 +216,7 @@ "Verify in browser using dev-browser skill" ], "priority": 12, - "passes": false, + "passes": true, "notes": "Dependencies: US-058, US-059, US-060, US-061" }, { diff --git a/progress.txt b/progress.txt index 1c5272e..a9bc7d7 100644 --- a/progress.txt +++ b/progress.txt @@ -183,3 +183,18 @@ - Supabase client-side fetching from `createClient()` (browser) automatically scopes by the logged-in user's RLS policies, so fetching other projects just uses `.neq('id', currentProjectId)` and RLS handles ownership filtering. - No browser testing tools are available; manual verification is needed. --- + +## 2026-01-23 - US-064 +- What was implemented: Export validation that scans nodes/edges for undefined character/variable references before exporting, with a warning modal and canvas highlighting +- Files changed: + - `src/components/editor/ExportValidationModal.tsx` - New component: warning modal listing validation issues by type (character/variable), showing node type badge and content snippet, with "Export anyway" and "Cancel" buttons + - `src/app/editor/[projectId]/FlowchartEditor.tsx` - Updated `handleExport` to scan nodes (dialogue, variable, choice) and edges for characterId/variableId references not matching defined entries; added `performExport`, `handleExportAnyway`, `handleExportCancel` callbacks; added `validationIssues` and `warningNodeIds` state; applied `export-warning-node` className to affected nodes via `styledNodes` memo + - `src/app/globals.css` - Added `.react-flow__node.export-warning-node` CSS with orange outline and pulse animation for highlighted nodes +- **Learnings for future iterations:** + - React Flow nodes support a `className` prop that gets applied to the `.react-flow__node` wrapper div, so custom styling can be applied via CSS without modifying node component internals. + - The validation scans four sources of references: dialogue nodes (characterId), variable nodes (variableId), choice node option conditions (variableId), and edge conditions (variableId). + - The `handleExport` is the validation gate; `performExport` is where actual export logic (US-035) will go. When no issues are found, `performExport` is called directly. Otherwise the modal is shown and the user decides. + - Warning highlighting is cleared either by canceling the modal or by proceeding with "Export anyway". + - Pre-existing lint issues in `ConditionEditor.tsx` and `OptionConditionEditor.tsx` (React Compiler `preserve-manual-memoization` errors) are from prior stories and not related to this change. + - No browser testing tools are available; manual verification is needed. +---