ppt-tool/frontend
Vadym Samoilenko 587f5ef6e1 Add 3 sandbox features: diagrams, mermaid, and template code-gen
Feature 1 — PPTX from Template (Code-Gen):
- backend/services/template_codegen_service.py: analyze PPTX, strip slides,
  Gemini code-gen + subprocess exec (60s timeout, auto-retry on error)
- backend/api/v1/ppt/endpoints/template_codegen.py: POST /template-codegen/generate
  (multipart: presentation_id + template_file + custom_prompt, rate-limited 3/min)
- frontend/components/TemplateCodegenExport.tsx: drag-drop modal
- Header.tsx: "Export from Template" option in export dropdown

Feature 2 — Diagrams in Slides:
- backend/models/diagram_data.py: DiagramData / FlowStep / BarChartItem models
- generate_slide_content.py: optional __diagram__ + __mermaid__ fields in LLM schema
- DiagramRenderer.tsx: pure React flowchart / bar chart / pie chart (no deps)
- SlideRenderer.tsx: chart elements render DiagramRenderer/MermaidRenderer;
  floating overlay fallback when no chart element exists in JSON layout
- V1ContentRender.tsx: diagram/mermaid overlay on built-in template slides
- generate-pptx/route.ts: addDiagramToSlide() — bar/pie via pptxgenjs addChart(),
  flowchart via addShape()+addText(), mermaid via /api/mermaid-to-image

Feature 3 — Mermaid Diagrams:
- MermaidRenderer.tsx: dynamic import mermaid@11, useEffect render, error fallback
- frontend/app/api/mermaid-to-image/route.ts: Puppeteer renders Mermaid to PNG → base64

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-19 18:47:31 +00:00
..
app Add 3 sandbox features: diagrams, mermaid, and template code-gen 2026-03-19 18:47:31 +00:00
components Add missing Badge component 2026-02-27 20:17:19 +00:00
cypress Phase 7: Testing Suite — backend unit tests + Cypress E2E framework 2026-02-26 16:49:23 +00:00
i18n Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
lib Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
models Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
public Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
store Fix 5 post-Phase8 bugs: SSE crash, custom templates, ordering, persistence, JSON display 2026-03-01 20:25:28 +00:00
types Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
utils Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
components.json Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
cypress.config.ts Phase 7: Testing Suite — backend unit tests + Cypress E2E framework 2026-02-26 16:49:23 +00:00
Dockerfile Phase 5: Fix export, slide edit, static files; add README 2026-02-27 15:40:36 +00:00
next-env.d.ts Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
next.config.mjs Fix SSE routing: exclude text/event-stream requests from API rewrite 2026-03-01 21:27:38 +00:00
package-lock.json Replace PPTX export pipeline: Puppeteer/python-pptx → PptxGenJS 2026-03-01 21:04:31 +00:00
package.json Replace PPTX export pipeline: Puppeteer/python-pptx → PptxGenJS 2026-03-01 21:04:31 +00:00
postcss.config.mjs Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
README.md Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
tailwind.config.ts Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
tsconfig.json Phase 1-2: Foundation + Admin Panel & Client Management 2026-02-26 15:37:17 +00:00
tsconfig.tsbuildinfo Fix SSE 500: move API rewrites to afterFiles so route handlers take priority 2026-03-01 21:14:44 +00:00

This is a Next.js project bootstrapped with create-next-app.

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Geist, a new font family for Vercel.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.