Skip to main content

Compliance-First Document View

Each Markdown document's detail view should foreground compliance context.

Header Strip (Always Visible)​

Title and Status​

  • Document title
  • Version badge
  • Lifecycle state (Draft / In Review / Effective / Obsolete)

Classification Chip​

  • PHI indicator
  • Confidential marker
  • Internal only
  • Icons for patient/financial identifiers

Retention Label​

Examples:

  • "Retain 7 years after deactivation; SEC 17a-4 class X"
  • "HIPAA 6-year retention from effective date"
  • "Legal hold active"

Metadata Tab​

Regulatory Mapping​

FieldExample
HIPAA Section164.316 (Policies and Procedures)
FDA/EMA RuleGxP compliance
SEC Record Type17a-4 Category
Local BankingState/regional requirements

Dates​

FieldDescription
Effective DateWhen document became active
Expiry DateWhen document expires
Next Review DateRequired review deadline
Last ModifiedMost recent change

Linked Entities​

  • Product
  • Facility
  • Line of business
  • Department

Workflow Tab​

Review Chain​

Visual representation of approval workflow:

  • Author
  • SME Review
  • Compliance Review
  • Final Approver

Current Status​

  • Current assignee
  • Due dates
  • Blocking issues

Attestation History​

Table of sign-offs:

WhoWhenActionComment
Jane Doe2025-01-15ApprovedCompliant with updates
John Smith2025-01-10ReviewedMinor corrections needed

Audit Tab​

Read-Access Log​

For PHI access reporting:

  • Who accessed
  • When
  • From where
  • Action taken

Permission History​

  • Permission changes over time
  • Who made changes
  • Why changes were made

Component Structure​

// ComplianceDocumentView.tsx
interface ComplianceDocumentViewProps {
  document: Document;
  activeTab: 'content' | 'metadata' | 'workflow' | 'audit';
}

// ComplianceHeader.tsx
interface ComplianceHeaderProps {
  title: string;
  version: string;
  lifecycleState: LifecycleState;
  classification: ClassificationLevel;
  retentionLabel: string;
  legalHold: boolean;
}

// RegulatoryMappingPanel.tsx
interface RegulatoryMappingPanelProps {
  regulations: RegulationMapping[];
  jurisdiction: string[];
  linkedEntities: EntityLink[];
}

// WorkflowStatusPanel.tsx
interface WorkflowStatusPanelProps {
  reviewChain: ReviewStep[];
  currentAssignee: User;
  dueDate: Date;
  attestationHistory: Attestation[];
}

// AuditLogPanel.tsx
interface AuditLogPanelProps {
  accessLog: AccessLogEntry[];
  permissionHistory: PermissionChange[];
  timeRange: DateRange;
}

References​