MQA Dev Docs

English

Deutsch

English

Deutsch

Appearance

AI Content Editing System — Architecture ​

Executive Overview — all summaries for decision-makers.

Goal ​

An AI-powered content editing system that:

  • ✅ Revises content based on user instructions
  • ✅ Automatically detects dependencies and impact
  • ✅ Suggests and applies follow-up changes
  • ✅ Provides full rollback capability
  • ✅ Is extremely easy to use

Architecture Principles ​

1. Modularity ​

  • Small, maintainable files (max. 200 lines)
  • Clear responsibilities
  • Reusable components

2. Versioning ​

  • Every change is versioned
  • Complete change history
  • Rollback to any version possible

3. User Experience ​

  • One-click AI editing
  • Clear preview before changes
  • Transparent impact analysis
  • Simple rollback

Backend Architecture ​

Database Schema: Change History ​

prisma
// backend/prisma/schema/change-history.prisma

model ChangeHistory {
  id            String   @id @default(cuid())
  
  // What was changed
  entityType    String   // "Policy", "Risk", "Control", "SOP", etc.
  entityId      String   // ID of the changed entity
  
  // Change details
  changeType    String   // "AI_EDIT", "MANUAL_EDIT", "AI_CASCADE"
  fieldName     String?  // Which field was changed (optional)
  
  // Versions
  previousValue Json     // Old value (full object or field)
  newValue      Json     // New value (full object or field)
  
  // AI Context
  aiInstruction String?  @db.Text // User's instruction to AI
  aiReasoning   String?  @db.Text // AI's reasoning for the change
  
  // Impact tracking
  relatedChanges String[] // IDs of related ChangeHistory entries
  
  // Metadata
  userId        String
  user          User     @relation(fields: [userId], references: [id])
  createdAt     DateTime @default(now())
  
  // Rollback tracking
  rolledBackAt  DateTime?
  rolledBackBy  String?
  
  @@index([entityType, entityId])
  @@index([userId])
  @@index([createdAt])
}

Service Layer (Backend) ​

backend/src/services/ai-editing/
├── ai-content-editor.ts       # Core AI editing logic
├── ai-impact-analyzer.ts      # Dependency & impact analysis
├── change-history-manager.ts  # Version management
├── rollback-service.ts        # Rollback orchestration
└── types.ts                   # Shared types

Frontend Architecture ​

Component Structure ​

src/components/ai-editing/
├── ai-edit-button.tsx         # Button for AI editing
├── ai-edit-dialog.tsx         # Dialog for instructions
├── ai-preview-panel.tsx       # Preview of changes
├── impact-analysis-panel.tsx  # Shows affected areas
├── change-history-panel.tsx   # Change history
├── rollback-dialog.tsx        # Rollback confirmation
└── types.ts                   # Shared types

API Layer ​

src/api/ai-editing.ts          # API calls for AI editing

User Flow ​

1. Start AI editing ​

User on policy detail page
  → Clicks "Edit with AI" button
  → Dialog opens
  → User enters instruction: "Add section about GDPR"

2. AI processes instruction ​

Frontend sends request
  → Backend: AI Content Editor analyzes content
  → AI generates new version
  → Impact Analyzer checks dependencies
  → Finds: Control XYZ, Risk ABC affected

3. Preview & confirmation ​

User sees:
  ✓ Preview of changed policy
  ✓ List of affected areas
  ✓ Suggested follow-up changes
  
User can:
  → Accept changes
  → Select follow-up changes
  → Cancel

4. Apply changes ​

User confirms
  → Change History entry created
  → Policy updated
  → Optional: follow-up changes applied
  → Success message

5. Rollback (if needed) ​

User opens Change History
  → Sees all changes
  → Clicks "Undo"
  → Confirms rollback
  → Previous version restored

Next Steps ​

  1. ✅ Extend Prisma schema (ChangeHistory)
  2. ✅ Implement backend services
  3. ✅ Create frontend components
  4. ✅ Integrate into existing pages
  5. ✅ Testing & documentation