Skip to content

Add multi-language support with English and French translations#1

Merged
joris-decombe merged 1 commit intomainfrom
feature/multi-language-support
Dec 23, 2025
Merged

Add multi-language support with English and French translations#1
joris-decombe merged 1 commit intomainfrom
feature/multi-language-support

Conversation

@joris-decombe
Copy link
Owner

Summary

Implements internationalization (i18n) using react-i18next to support multiple languages. Initial release includes English and French translations.

Features

  • 🌐 Language selector component in all views (Landing, Facilitator, Player)
  • 🇬🇧 Full English translations
  • 🇫🇷 Full French translations ("La simulation de gestion d'incidents cyber")
  • 💾 Language preference persists in localStorage
  • 📝 All UI elements, scenarios, and difficulty tables translated
  • 🏷️ Maintains "ROLLS & RESPONDERS" brand name across all languages

Technical Implementation

New Files

  • src/i18n.js - i18next configuration with language persistence
  • src/locales/en.json - Complete English translations
  • src/locales/fr.json - Complete French translations

Modified Files

  • src/App.jsx - Added LanguageSelector component and translation hooks
  • src/scenarios.js - Refactored to use dynamic getScenarioData(t) function
  • CONTRIBUTING.md - Added comprehensive i18n documentation
  • package.json - Added i18next dependencies
  • scripts/take-screenshots.mjs - Fixed baseURL to match vite dev server

Translation Coverage

All 3 NCSC NZ scenarios fully translated:

  • ✅ DDoS Attack (Code 4452)
  • ✅ Ransomware (Code 1456)
  • ✅ Cloud Infrastructure Compromise (Code 6244)

Testing

  • npm run lint - Passed with no errors
  • npm run build - Production build successful
  • ✅ Screenshots generated showing language selector in all views
  • ✅ Maintains atomic state update pattern (no bugs introduced)

Documentation

  • Updated CONTRIBUTING.md with:
    • Translation workflow for adding new languages
    • Scenario translation structure
    • Language selector integration guide
    • Note about preserving "ROLLS & RESPONDERS" brand name

Screenshots

Language selector visible in all views:

  • Landing page (top-right corner)
  • Facilitator console (header)
  • Player display (header)

All UI text, scenario content, and game mechanics properly translated.

Breaking Changes

None - fully backward compatible.

Next Steps

After merge, this enables:

  • Community contributions for additional languages (German, Spanish, etc.)
  • Localized scenario content for regional exercises
  • Broader international adoption of NCSC NZ Rolls & Responders framework

Implements i18next-based internationalization to support multiple languages.
Initial languages: English (en) and French (fr).

Features:
- Language selector component in all views (Landing, Facilitator, Player)
- Translation files organized by component/view
- Language preference persists in localStorage
- All UI elements, scenarios, and difficulty tables translated
- Maintains "ROLLS & RESPONDERS" brand name across languages

Technical changes:
- Added i18next and react-i18next dependencies
- Created src/i18n.js configuration
- Created src/locales/ with en.json and fr.json
- Refactored src/scenarios.js to use translation functions
- Updated src/App.jsx with LanguageSelector and translation hooks
- Updated CONTRIBUTING.md with i18n documentation
- Fixed screenshot script baseURL to match vite config

All 3 scenarios fully translated (DDoS Attack, Ransomware, Cloud Compromise).
Follows atomic state update pattern. Linting and build verified.
@joris-decombe joris-decombe merged commit 562abce into main Dec 23, 2025
1 check passed
joris-decombe added a commit that referenced this pull request Dec 23, 2025
Add multi-language support with English and French translations
joris-decombe added a commit that referenced this pull request Dec 23, 2025
Add multi-language support with English and French translations
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant