Skip to content

feat: Report template editor with AI assistant #193

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
betterclever wants to merge 51 commits into
base: main
Choose a base branch
from
Open

feat: Report template editor with AI assistant #193

betterclever wants to merge 51 commits into from

Conversation

@betterclever
Copy link
Contributor

@betterclever betterclever commented Jan 1, 2026

Summary

Enhanced report template editor with AI-powered template generation and editing capabilities.

Features

  • Template Editor UI: Full-featured editor with live preview, schema/data panels
  • AI Assistant: Integrated AI chat for generating and modifying templates
  • Step-by-step Undo: AI changes push checkpoints to undo stack for granular restoration
  • Smart Save Button: Workflow-style save button with dirty state tracking and sync status
  • Layout: Schema/Data on left, Preview center, AI Assistant on right

Changes

  • frontend/src/pages/TemplateEditor.tsx: Main template editor with live preview
  • frontend/src/components/ai/TemplateChat.tsx: AI chat component with undo functionality
  • frontend/src/store/templateStore.ts: Added dirty state tracking
  • frontend/src/pages/TemplatesPage.tsx: Simplified template creation flow

Testing

  • Template creation and editing flows verified
  • Save button with dirty state working correctly
  • AI undo stack functioning as expected

Next Steps

  • Report generator component to consume these templates
  • Additional template customization options

@chatgpt-codex-connector
Copy link

chatgpt-codex-connector bot commented Jan 1, 2026

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.

@betterclever betterclever changed the base branch from main to structured-output January 1, 2026 16:05
@betterclever betterclever changed the base branch from structured-output to betterclever/subworkflow January 1, 2026 16:05
@betterclever betterclever force-pushed the betterclever/subworkflow branch from 5f030c1 to 43dc952 Compare January 1, 2026 16:33
@betterclever betterclever changed the base branch from betterclever/subworkflow to main January 1, 2026 16:39
@betterclever betterclever force-pushed the betterclever/report-generation branch from 966544a to a4495e7 Compare January 1, 2026 17:05
betterclever and others added 24 commits January 1, 2026 22:35
@betterclever @claude
spec(report-generation): add comprehensive report generation feature …
0946fbd 
…spec

Add detailed specification for the report generation feature including:
- Architecture overview with AI-assisted template creation
- 5-phase implementation plan
- Database schema for templates and generated reports
- Component contract for core.report.generator
- UI layouts for template list, editor, and workflow integration

This addresses issue #21 for implementing a drag-and-drop reporting component
that generates client-ready security reports from workflow outputs.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever @claude
feat(report-generation): add core.report.generator component (Phase 1)
61ef335 
Implement Phase 1 of the report generation feature:

- Add core.report.generator component with HTML/PDF output support
- Define finding, metadata, and scope schemas for security reports
- Include default ShipSec branding (header/footer)
- Generate severity-coded findings tables with CVSS/CVE support
- Add comprehensive test suite (19 passing, 1 minor mock issue)
- Export getDefaultReportHTML, SEVERITY_COLORS, SHIPSEC_BRANDING

The component generates HTML reports with:
- Executive summary with severity breakdown
- Detailed findings with color-coded severity badges
- Scope/targets table
- Methodology section

TODO:
- Integrate with Puppeteer component for PDF generation
- Add template database schema (Phase 2)
- Build template editor UI (Phase 3)
- Add Preact+HTM template rendering (Phase 4)

Resolves part of #21

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever @claude
feat(report-generation): complete Phases 1-4 with AI SDK integration
5d55f0f 
- Phase 1: core.report.generator component with custom template rendering
- Phase 2: Database schema (report_templates, generated_reports tables)
- Phase 3: Template editor UI with AI Elements chat integration
- Phase 4: Custom template renderer with 4 standard templates

AI SDK Integration:
- Added official Vercel AI Elements components via shadcn CLI
- useChat hook for streaming chat with thinking states
- AI template generation endpoints (streaming + structured)
- Full chat UI with message bubbles, reasoning, prompt input

Files:
- backend/: migrations, ORM schema, API endpoints, DTOs
- frontend/: TemplatesPage, TemplateEditor, TemplateChat, AI Elements
- worker/: renderer.ts, templates.ts, report-generator.ts

Co-authored-by: Claude <noreply@anthropic.com>
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(report-generation): fix OpenAPI spec generation
d040648 
- Fix duplicate /api/v1/ prefix in controller routes
- Add @ai-sdk/openai dependency to backend
- Fix z.record(z.unknown()) compatibility issue with nestjs-zod
- Regenerate openapi.json with correct template endpoints

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
docs(report-generation): update spec with OpenAPI completion
624860f 
- Mark OpenAPI spec generation as complete
- Update remaining work section
- Clean up completed items from todo list

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(workflow-call): correctly set dataType for dynamic and static ports
c4507ca 
- Fixed portUtils.ts to handle undefined dataType values with optional chaining
- Fixed workflow-call.ts to use port helpers directly instead of accessing non-existent .dataType property
- Cleaned up ParameterField.tsx to remove unnecessary any casts when accessing runtimeInputs

This fixes the 'unknown' type display for Call Workflow input/output ports.

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat(ai): upgrade to AI SDK 3.0 and fix typechecks
d1ef226 
- Upgrade @ai-sdk/react to 3.0.5
- Refactor TemplateChat to use DefaultChatTransport and UIMessage.parts
- Fix usage of .at() in prompt-input.tsx
- Add icon-sm button variant
- Update documentation

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix: sync templates api
8fd3a92 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat: move ai endpoints
7189cc3 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat(ai-templates): implement local preact+htm preview and tool inter…
02a7763 
…actions

- Frontend: Refactored TemplateEditor to use iframe srcDoc with Preact/HTM for zero-latency local previews.
- Frontend: Updated TemplateChat to handle tool streaming, reasoning parts, and correct tool result acknowledgement.
- Backend: Updated AI system prompt to generate compliant Preact+HTM code without imports/exports.
- Backend: Configured update_template tool with proper schema.
- Cleanup: Moved debug scripts to debug/ folder.

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat: switch to Vercel AI Gateway with multi-provider support and opt…
f703f14 
…imize Kafka startup

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(frontend): robust template loading using iframe sandbox fix and j…
ed581c8 
…son parsing

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat: Add RJSF with official shadcn theme for Template Editor
497b445 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
refactor: Template Editor layout - collapsible sidebar, compact header
365b9da 
- Sidebar collapsed by default (like Workflow Editor)
- Added toggle button to show/hide sidebar panel
- Moved template name, version, and save button to preview header
- Removed separate header row to save vertical space
- Compact preview controls with zoom and refresh buttons

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
refactor: Fix Template Editor layout with proper top bar
3eb1822 
- Added proper app title bar at the top (like Workflow Editor)
- Template name, version badge, and Save button in top bar
- Sidebar always visible for editing (no toggle)
- Preview area has simple header with zoom/refresh controls
- Clean layout structure matching the app patterns

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix: Template Editor layout matches Workflow Editor pattern
a51276d 
- AppLayout now auto-collapses main nav sidebar for template editor routes
- AppTopBar hidden for template editor (uses its own TopBar)
- Template Editor has proper top bar with back button, name, version, save
- Left sidebar (Sample Data/Schema + AI) always visible
- Right panel is Preview area
- Pattern matches Workflow Editor behavior

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix: Prevent whole-page overscroll in SPA
1d98da1 
- Added height: 100% and overflow: hidden to html, body, and #root
- Added margin: 0, padding: 0 to body for reset
- App now behaves like a proper SPA without page-level scrolling

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
refactor: Simplify AI chat tool result display
90fcd8b 
- Removed redundant code blocks showing template, schema, and sample data
- Now just shows a compact 'Updated template, schema, sample data' indicator
- The actual data is already visible in the sidebar tabs
- Removed unused CodeBlock imports

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
style: Make RJSF form compact (~70% of default size)
7ae1a18 
- Reduced font sizes: labels 0.65rem, inputs 0.7rem, buttons 0.65rem
- Smaller input heights and padding
- Reduced spacing between form groups
- Compact checkboxes, buttons, and icons
- Tighter fieldset/legend padding
- All elements scoped to .schematic-form-compact class

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat(frontend): Implement compact RJSF theme v1 with custom array ren…
cf1a27e 
…dering and visible controls

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat(frontend): Add compact SelectWidget and collapsible array items …
a6ab12b 
…to RJSF theme v1

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat(backend): update AI system prompt with ShipSec.ai branding and i…
4413840 
…nitial state generation instructions

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat(frontend): add animated 'Thinking' indicator for AI chat pending…
5fc506b 
… state

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat(frontend): refine AI loading indicator to switch between 'Thinki…
4829127 
…ng' and 'Working' based on progress

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(frontend): Correctly pass event object to RJSF array button handlers
492dc87 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(backend): update AI system prompt to prevent invalid nested schem…
f9919b7 
…a generation

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(frontend): ensure FieldTemplate consistently renders structure ev…
d3c1292 
…en when label is hidden

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
refactor(frontend): switch to 3-column studio layout (Chat - Preview …
322ffe4 
…- Config)

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(frontend): resolve SparklesIcon import and cleanup unused variables
e9c4e52 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(frontend): simplify chat scrolling and fix flexbox height constraint
4cf5aa7 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix(frontend): resolve overscroll in chat empty state by correcting f…
ee79589 
…lexbox structure

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat(frontend): switch to card layout for templates and fix new templ…
eec7ab6 
…ate render errors

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
style(frontend): refine template cards to be leaner and include usage…
b7b180d 
… stats

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
style(frontend): remove category icon and enhance version badge styli…
3968d49 
…ng on template cards

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat: Add workflow-style save button with dirty state tracking to tem…
8cbe184 
…plate editor

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
debug: Add logging to template editor save flow
249044e 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
debug: Add more logging to template editor component
acdb0e5 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
debug: Add logging to template store updateTemplate
570ce12 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix: Add race condition check in dirty state tracking
0878923 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
debug: Add more logging to template store isDirty changes
efbfccc 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix: Update originalValues before API call to prevent race condition
de10cce 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat: Create template immediately navigates to editor without dialog
555cb5c 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix: Clean up debug logging and ensure save button works correctly
002abb9 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
layout: Move schema panel to left and AI assistant to right
3fc46d0 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat: Add undo functionality for AI template changes with confirmatio…
3203bf8 
…n dialog

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix: Send current template data to AI and fix undo to restore base state
7c6a3fd 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat: Implement step-by-step undo stack for AI template changes
a2a7a8b 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
refactor: Simplify chat UI to flat message bubbles without personas
132172c 
Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
fix: remove core.report.generator component and fix missing startChil…
5d78665 
…d call

- Remove entire /worker/src/components/report/ directory
- Fix TypeScript errors by adding missing startChild call in workflows/index.ts
- Remove failing report generator tests (6 tests removed)
- Update component imports to exclude report generator

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
feat: remove AI generation e2e tests
9991f7f 
- Remove AI Generation E2E Tests section from report-templates.test.ts
- Keep report template CRUD tests intact
- Update file description to remove AI references
- AI functionality can be tested separately when implemented

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever
chore: remove report generation feature tracking files from .ai folder
4a265c6 
- Remove .ai/report-generation.md
- Remove .ai/report-generation-layout.txt
- Clean up feature documentation since component was removed

Signed-off-by: betterclever <paliwal.pranjal83@gmail.com>
@betterclever betterclever force-pushed the betterclever/report-generation branch from a4495e7 to 4a265c6 Compare January 1, 2026 17:05
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@betterclever