feat: Implement comprehensive i18n support using LanguageContext

[roncodes]

Overview

This PR implements comprehensive internationalization (i18n) support for the Navigator app using the existing LanguageContext and useLanguage() hook system. All user-facing strings have been extracted to a centralized translation file and replaced with t() function calls throughout the codebase.

Changes Summary

📊 Statistics

• Files Modified: 48 files (787 insertions, 341 deletions)
• Total Strings Extracted: 230 user-facing strings
• Namespaces Created: 49 (including common)
• Components Updated: 25 files
• Screens Updated: 20 files
• Navigation Updated: 2 files
• Utilities Updated: 1 file

🎯 What Was Done

1. Created Translation File

• Location: src/locales/en.js
• Structure: File-based namespaces with camelCase keys
• Format: JavaScript module with default export
• Organization: One namespace per file + shared common namespace

2. Updated All Source Files

Every modified file now:

• Imports useLanguage from LanguageContext
• Initializes the t() function via const { t } = useLanguage();
• Replaces all hardcoded user-facing strings with t('Namespace.key') calls
• Uses common namespace for frequently used strings (Save, Cancel, Delete, etc.)

3. Updated Localization Utility

• Modified src/utils/localize.js to import from src/locales/en.js instead of translations/en.json

📝 Translation Structure

export default {
  common: {
    save: 'Save',
    cancel: 'Cancel',
    delete: 'Delete',
    // ... other common strings
  },
  CreateAccountScreen: {
    createAccount: 'Create Account',
    enterYourName: 'Enter your name',
    // ... other screen-specific strings
  },
  // ... 47 more namespaces
};

🔍 Example Changes

Before:

<Text>Create Account</Text>
<Input placeholder="Enter your name" />
toast.error('Invalid phone number provided.');

After:

import { useLanguage } from '../contexts/LanguageContext';

const { t } = useLanguage();

<Text>{t('CreateAccountScreen.createAccount')}</Text>
<Input placeholder={t('CreateAccountScreen.enterYourName')} />
toast.error(t('CreateAccountScreen.invalidPhoneNumberProvided'));

📦 Files Modified

Components (25 files)

AdhocOrderCard, Buttons, CameraCapture, ChatKeyboard, ChatParticipants, Comment, CommentThread, CurrentDestinationSelect, DestinationChangedAlert, FuelReportForm, InstanceLinkHandler, IssueForm, LocationPicker, MoneyInput, MultipleCustomerAvatars, OrderActivitySelect, OrderCard, OrderCustomerCard, OrderDocumentFiles, OrderPayloadEntities, OrderProofOfDelivery, PastOrderCard, PhoneInput, QrCodeScanner, UnitInput

Screens (20 files)

ChatHomeScreen, ChatParticipantsScreen, CreateAccountScreen, CreateAccountVerifyScreen, CreateChatChannelScreen, DriverDashboardScreen, DriverFleetScreen, DriverReportScreen, EditAccountPropertyScreen, EditLocationCoordScreen, EditLocationScreen, EntityScreen, FleetScreen, FuelReportScreen, InstanceLinkScreen, IssueScreen, PhoneLoginScreen, PhoneLoginVerifyScreen, TestScreen, VehicleScreen

Navigation (2 files)

DriverNavigator, CoreStack

Utilities (1 file)

localize.js

✅ Benefits

• Centralized Translations: All user-facing text in one place
• Easy Localization: Add new languages by creating new locale files (e.g., mn.js, es.js)
• Consistent Naming: File-based namespaces prevent key conflicts
• Maintainable: Changes to text only require updating the locale file
• Type-Safe Ready: Structure supports adding TypeScript types for translation keys
• Backward Compatible: Uses existing LanguageContext without breaking changes

🚀 Next Steps

1. Test the application to ensure all strings display correctly
2. Add additional languages by creating new locale files
3. Consider adding TypeScript types for translation keys
4. Implement pluralization if needed

🔒 What Was NOT Extracted

The following were intentionally left as hardcoded strings:

• Route/screen names used for navigation
• API endpoints and URLs
• Configuration keys and values
• Storage keys
• Developer console logs
• Internal identifiers and enum values

🧪 Testing Recommendations

• Verify app launches without errors
• Navigate through all screens
• Test form inputs and placeholders
• Trigger validation errors
• Test toast notifications
• Test alert dialogs

---

This implementation provides a solid foundation for internationalization and makes it easy to add support for additional languages in the future.