fix: Refine diagram naming and display with tabs

[spenceriam]

Summary

Improves diagram handling by implementing proper naming conventions and adding a dedicated Diagrams tab on the results screen.

Changes Made

• Enhanced extractMermaidDiagrams to assign descriptive names based on diagram type (user-flow, admin-flow, system-flow, etc.)
• Added Documents/Diagrams tabs on workflow complete screen for better organization
• Documents tab shows requirements, design, and tasks
• Diagrams tab displays all Mermaid diagrams with expandable previews
• Export ZIP now includes properly named diagram files

Testing

• Generated documents with multiple diagrams - each has descriptive name
• Diagrams tab correctly shows all diagrams from all phases
• Export ZIP includes properly named .mermaid files
• Can expand/collapse diagrams for better viewing

Fixes #29

---

Note

Adds a Diagrams tab and extracts/names Mermaid diagrams, exporting them with descriptive filenames.

• UI (app/page.tsx):
  • Results Tabs: Adds Documents/Diagrams toggle; Documents shows requirements, design, tasks; Diagrams aggregates Mermaid diagrams from all phases with expand/collapse.
  • Diagram Extraction: Introduces extractMermaidDiagrams to detect type and assign descriptive names (e.g., user-flow, system-flow).
  • UX tweaks: Adds activeTab state and minor preview/expand controls for content cards.
• Export (lib/exportUtils.ts):
  • Mermaid Naming: Enhances extractMermaidDiagrams to return { name, content }.
  • ZIP Output: Saves diagrams as {name}.mermaid and updates README.md to reflect descriptive diagram files.

^{Written by Cursor Bugbot for commit e3649e1. This will update automatically on new commits. Configure here.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
open-spec	Ready	Preview	Comment	Nov 3, 2025 1:41am