fix(interactive-diagram): add fallback data to prevent race condition with i18n

- Added loadFallbackData() method with English defaults
- Check if i18n translations loaded before using them
- Falls back to English if window.i18nTranslations not ready yet
- Fixes 'Failed to load SVG after 20 retries' error caused by empty serviceData
This commit is contained in:
TheFlow 2025-10-26 13:24:04 +13:00
parent 4895c4c3e2
commit 06ce4744e9

View file

@ -18,6 +18,14 @@ class InteractiveDiagram {
const i18n = window.i18nTranslations || {};
const diagram = i18n.diagram_services || {};
// If no translations available, use English fallback
const hasTranslations = diagram && Object.keys(diagram).length > 0;
if (!hasTranslations) {
console.warn('[InteractiveDiagram] No translations loaded, using English fallback');
this.loadFallbackData();
return;
}
// Define static properties (icons and colors)
const staticProps = {
overview: { color: '#0ea5e9', icon: '⚙️' },
@ -57,6 +65,114 @@ class InteractiveDiagram {
console.log('[InteractiveDiagram] Loaded translations for', Object.keys(this.serviceData).length, 'services');
}
loadFallbackData() {
// English fallback data when i18n not ready
this.serviceData = {
overview: {
name: 'Tractatus Governance Layer',
shortName: 'Overview',
color: '#0ea5e9',
icon: '⚙️',
description: 'Six external governance services working together to enforce AI safety boundaries outside the AI runtime.',
details: [
'All services operate externally to the AI—making manipulation harder',
'Instruction storage and validation work together to prevent directive fade',
'Boundary enforcement and deliberation coordinate on values decisions',
'Pressure monitoring adjusts verification requirements dynamically',
'Metacognitive gates ensure AI pauses before high-risk operations',
'Each service addresses a different failure mode in AI safety'
],
promise: 'External architectural enforcement that is structurally more difficult to bypass than behavioral training alone.'
},
boundary: {
name: 'BoundaryEnforcer',
shortName: 'Boundary',
color: '#10b981',
icon: '🔒',
description: 'Blocks AI from making values decisions (privacy, ethics, strategic direction). Requires human approval.',
details: [
'Enforces Tractatus 12.1-12.7 boundaries',
'Values decisions architecturally require humans',
'Prevents AI autonomous decision-making on ethical questions',
'External enforcement - harder to bypass via prompting'
],
promise: 'Values boundaries enforced externally—harder to manipulate through prompting.'
},
instruction: {
name: 'InstructionPersistenceClassifier',
shortName: 'Instruction',
color: '#6366f1',
icon: '📋',
description: 'Stores instructions externally with persistence levels (HIGH/MEDIUM/LOW). Aims to reduce directive fade.',
details: [
'Quadrant-based classification (STR/OPS/TAC/SYS/STO)',
'Time-persistence metadata tagging',
'Temporal horizon modeling (STRATEGIC, OPERATIONAL, TACTICAL)',
'External storage independent of AI runtime'
],
promise: 'Instructions stored outside AI—more resistant to context manipulation.'
},
validator: {
name: 'CrossReferenceValidator',
shortName: 'Validator',
color: '#8b5cf6',
icon: '✓',
description: 'Validates AI actions against instruction history. Aims to prevent pattern bias overriding explicit directives.',
details: [
'Cross-references AI claims with external instruction history',
'Detects pattern-based overrides of explicit user directives',
'Independent verification layer',
'Helps prevent instruction drift'
],
promise: 'Independent verification—AI claims checked against external source.'
},
pressure: {
name: 'ContextPressureMonitor',
shortName: 'Pressure',
color: '#f59e0b',
icon: '⚡',
description: 'Monitors AI performance degradation. Escalates when context pressure threatens quality.',
details: [
'Tracks token usage, complexity, error rates',
'Detects degraded operating conditions',
'Adjusts verification requirements under pressure',
'Objective metrics for quality monitoring'
],
promise: 'Objective metrics may detect manipulation attempts early.'
},
metacognitive: {
name: 'MetacognitiveVerifier',
shortName: 'Metacognitive',
color: '#ec4899',
icon: '💡',
description: 'Requires AI to pause and verify complex operations before execution. Structural safety check.',
details: [
'AI self-checks alignment, coherence, safety before execution',
'Structural pause-and-verify gates',
'Selective verification (not constant)',
'Architectural enforcement of reflection steps'
],
promise: 'Architectural gates aim to enforce verification steps.'
},
deliberation: {
name: 'PluralisticDeliberationOrchestrator',
shortName: 'Deliberation',
color: '#14b8a6',
icon: '👥',
description: 'Facilitates multi-stakeholder deliberation for values conflicts where no single "correct" answer exists.',
details: [
'Non-hierarchical coordination for values conflicts',
'Stakeholder perspective representation',
'Consensus-building for ethical trade-offs',
'Addresses values pluralism in AI safety'
],
promise: 'Facilitates deliberation across stakeholder perspectives for values conflicts.'
}
};
console.log('[InteractiveDiagram] Loaded English fallback data for', Object.keys(this.serviceData).length, 'services');
}
handleLanguageChange() {
console.log('[InteractiveDiagram] Language changed, reloading translations');
this.loadTranslations();