Mermaid Flow AI — Cyberpunk Mermaid Visualizer

Verified: Mermaid Flow AI (also known as cyberpunk-mermaid-visualizer) is a diagram editor with a cyberpunk aesthetic, built as a solo engineering project and published at github.com/danielxxomg/cyberpunk-mermaid-visualizer under the MIT license.

Verified: The editor combines React 18, TypeScript 5, Vite 5, Tailwind CSS 3, Shadcn/ui, Monaco Editor, Mermaid.js, React Flow, Supabase (PostgreSQL with RLS), Google Gemini API, Zustand, Bun, and Vercel.

Verified: The AI-assisted workflow is human-owned: Gemini assists with syntax correction, code optimization, and natural-language-to-Mermaid conversion, but all engineering decisions, security review, and final output remain mine.

Verified: The editor provides a responsive split-pane layout with a Monaco editor, live Mermaid preview, syntax highlighting, auto-completion, and error detection.

Verified: The AI assistance path converts natural language to Mermaid, corrects syntax errors, and optimizes diagram code through the Google Gemini API.

Verified: Diagrams export as PNG, JPG, SVG, and PDF.

Partial: The AI-assisted path depends on the Gemini API availability and model behavior; a point-in-time description does not prove uptime or model quality guarantees.

Verified: Dark and light themes with a cyberpunk aesthetic were a deliberate visual direction, distinct from default editor chrome.

Verified: Supabase with PostgreSQL and RLS provides cloud storage with version history and per-user isolation; API keys are stored encrypted.

Partial: The exact encryption-at-rest implementation for stored keys is described at the feature level; no independent security audit is claimed.

Verified: The project chose a client-heavy editor (Monaco + React Flow + Mermaid) for a rich live-editing experience, trading a larger client bundle for responsiveness.

Partial: Exact bundle-size measurements were not published; the tradeoff is described from the architecture, not from a dated performance report.

Verified: RLS user isolation on Supabase keeps each user’s stored diagrams and history scoped to that user.

Partial: Security review depth, penetration testing, and production hardening were not published; no security or compliance guarantee is claimed.

Verified: The repository includes a shared quality scope for the editor behavior.

Partial: Exact test totals, Lighthouse scores, and WCAG conformance require dated reproducible reports and are not claimed here.

Blocked: Production uptime, availability, and defect-free operation are not claimed; the project is a solo engineering proof of concept.

Partial: AI-generated diagram output quality depends on the model; all output is reviewed by the human owner before it is used.

Verified: The public repository link (github.com/danielxxomg/cyberpunk-mermaid-visualizer) and the MIT license are the approved artifacts for this case study.

Verified: The export formats PNG, JPG, SVG, and PDF are part of the public feature surface.

Partial: Media artifacts are synthetic placeholders; no real user data or internal storage is published.