feat: Add comprehensive internationalization (i18n) support

- Add multi-language support with i18next and react-i18next
- Implement user-selectable date format preferences (5 formats)
- Add time format preferences (12-hour/24-hour)
- Implement RTL (right-to-left) support for Arabic, Hebrew, Persian, Urdu
- Add first day of week preference
- Create LocalizationContext for managing i18n settings
- Add LocalizationSettings component to Settings page
- Include sample translations: English, Spanish, Arabic
- Configure 10 languages: en, es, fr, de, ar, he, zh, ja, pt, ru
- Add translation management documentation and Crowdin config
- Create date formatting utilities that respect user preferences
- Add RTL CSS styles for proper layout mirroring
- Update Settings and ThemeToggle components to use translations
- Add comprehensive documentation (implementation guide, quick reference, translation guide)

All user preferences are persisted to localStorage and apply throughout the app.
This commit is contained in:
Mo Tarbin
2026-03-08 15:57:57 +00:00
parent 21e0b08716
commit 6d6185dc5e
26 changed files with 2234 additions and 20 deletions

View File

@@ -0,0 +1,14 @@
{
"title": "المهام",
"myChores": "مهامي",
"allChores": "جميع المهام",
"addChore": "إضافة مهمة",
"editChore": "تعديل مهمة",
"deleteChore": "حذف مهمة",
"completeChore": "إكمال مهمة",
"dueDate": "تاريخ الاستحقاق",
"assignedTo": "مُسند إلى",
"priority": "الأولوية",
"status": "الحالة",
"description": "الوصف"
}

View File

@@ -0,0 +1,18 @@
{
"save": "حفظ",
"cancel": "إلغاء",
"delete": "حذف",
"edit": "تعديل",
"close": "إغلاق",
"confirm": "تأكيد",
"loading": "جارٍ التحميل...",
"error": "خطأ",
"success": "نجح",
"warning": "تحذير",
"refresh": "تحديث",
"copy": "نسخ",
"copied": "تم النسخ!",
"settings": "الإعدادات",
"yes": "نعم",
"no": "لا"
}

View File

@@ -0,0 +1,34 @@
{
"title": "الإعدادات",
"localization": {
"title": "التوطين",
"description": "تخصيص اللغة وتنسيق التاريخ والتفضيلات الإقليمية لحسابك.",
"language": "اللغة",
"languageDescription": "اختر لغتك المفضلة",
"dateFormat": "تنسيق التاريخ",
"dateFormatDescription": "اختر كيفية عرض التواريخ في التطبيق",
"timeFormat": "تنسيق الوقت",
"timeFormatDescription": "اختر تنسيق 12 أو 24 ساعة",
"12hour": "12 ساعة (ص/م)",
"24hour": "24 ساعة",
"firstDayOfWeek": "أول يوم في الأسبوع",
"firstDayOfWeekDescription": "اختر اليوم الذي يبدأ به أسبوعك",
"sunday": "الأحد",
"monday": "الاثنين",
"formats": {
"mdy": "MM/DD/YYYY (الولايات المتحدة)",
"dmy": "DD/MM/YYYY (أوروبا)",
"ymd": "YYYY-MM-DD (ISO)",
"long": "تنسيق طويل (مثل 1 يناير 2024)",
"short": "تنسيق قصير (مثل 1 يناير 2024)"
}
},
"theme": {
"title": "تفضيلات المظهر",
"description": "اختر كيف يبدو الموقع لك. حدد مظهرًا واحدًا أو قم بالمزامنة مع نظامك والتبديل تلقائيًا بين مظاهر النهار والليل.",
"themeMode": "وضع المظهر",
"light": "فاتح",
"dark": "داكن",
"system": "النظام"
}
}

View File

@@ -0,0 +1,14 @@
{
"title": "Chores",
"myChores": "My Chores",
"allChores": "All Chores",
"addChore": "Add Chore",
"editChore": "Edit Chore",
"deleteChore": "Delete Chore",
"completeChore": "Complete Chore",
"dueDate": "Due Date",
"assignedTo": "Assigned To",
"priority": "Priority",
"status": "Status",
"description": "Description"
}

View File

@@ -0,0 +1,18 @@
{
"save": "Save",
"cancel": "Cancel",
"delete": "Delete",
"edit": "Edit",
"close": "Close",
"confirm": "Confirm",
"loading": "Loading...",
"error": "Error",
"success": "Success",
"warning": "Warning",
"refresh": "Refresh",
"copy": "Copy",
"copied": "Copied!",
"settings": "Settings",
"yes": "Yes",
"no": "No"
}

View File

@@ -0,0 +1,85 @@
{
"title": "Settings",
"circleSettings": {
"title": "Circle settings",
"description": "Your account is automatically connected to a Circle when you create or join one. Easily invite friends by sharing the unique Circle code or link below. You'll receive a notification below when someone requests to join your Circle. If you'd like to leave, simply hit the 'Leave Circle' button.",
"circleCode": "Circle Code",
"copyCode": "Copy Code",
"copyLink": "Copy Link",
"codeCopied": "Circle code copied!",
"linkCopied": "Circle link copied!",
"joinCircle": "Join a Circle",
"joinCirclePlaceholder": "Enter Circle Code",
"join": "Join",
"leave": "Leave Circle",
"leaveConfirmTitle": "Leave Circle",
"leaveConfirmMessage": "Are you sure you want to leave this circle?",
"circleMembers": "Circle Members",
"circleMemberRequests": "Circle Member Requests",
"admin": "Admin",
"member": "Member",
"pending": "Pending",
"accept": "Accept",
"reject": "Reject",
"makeAdmin": "Make Admin",
"makeMember": "Make Member",
"remove": "Remove",
"webhookURL": "Webhook URL",
"webhookDescription": "Enter a webhook URL to receive notifications for circle events",
"webhookPlaceholder": "https://your-webhook-url.com"
},
"accountSettings": {
"title": "Account Settings",
"subscription": "Subscription",
"subscriptionStatus": "Current Plan",
"free": "Free",
"plus": "Plus",
"upgrade": "Upgrade",
"cancel": "Cancel",
"changePassword": "Change Password",
"password": "Password",
"dangerZone": "Danger Zone",
"dangerZoneDescription": "Once you delete your account, there is no going back. Please be certain.",
"deleteAccount": "Delete Account"
},
"localization": {
"title": "Localization",
"description": "Customize language, date format, and regional preferences for your account.",
"language": "Language",
"languageDescription": "Select your preferred language",
"dateFormat": "Date Format",
"dateFormatDescription": "Choose how dates should be displayed throughout the application",
"timeFormat": "Time Format",
"timeFormatDescription": "Select 12-hour or 24-hour time format",
"12hour": "12-hour (AM/PM)",
"24hour": "24-hour",
"firstDayOfWeek": "First Day of Week",
"firstDayOfWeekDescription": "Select which day starts your week",
"sunday": "Sunday",
"monday": "Monday",
"formats": {
"mdy": "MM/DD/YYYY (US)",
"dmy": "DD/MM/YYYY (Europe)",
"ymd": "YYYY-MM-DD (ISO)",
"long": "Long format (e.g., January 1, 2024)",
"short": "Short format (e.g., Jan 1, 2024)"
}
},
"sidepanel": {
"title": "Sidepanel Customization",
"description": "Customize the layout and visibility of cards in the sidepanel. This section is only available on large screen devices such as tablets and desktops."
},
"theme": {
"title": "Theme preferences",
"description": "Choose how the site looks to you. Select a single theme, or sync with your system and automatically switch between day and night themes.",
"themeMode": "Theme mode",
"light": "Light",
"dark": "Dark",
"system": "System"
},
"notifications": {
"settingsSaved": "Settings saved successfully",
"settingsSaveFailed": "Failed to save settings",
"invalidWebhook": "Invalid webhook URL"
}
}

View File

@@ -0,0 +1,14 @@
{
"title": "Tareas",
"myChores": "Mis Tareas",
"allChores": "Todas las Tareas",
"addChore": "Agregar Tarea",
"editChore": "Editar Tarea",
"deleteChore": "Eliminar Tarea",
"completeChore": "Completar Tarea",
"dueDate": "Fecha de Vencimiento",
"assignedTo": "Asignado a",
"priority": "Prioridad",
"status": "Estado",
"description": "Descripción"
}

View File

@@ -0,0 +1,18 @@
{
"save": "Guardar",
"cancel": "Cancelar",
"delete": "Eliminar",
"edit": "Editar",
"close": "Cerrar",
"confirm": "Confirmar",
"loading": "Cargando...",
"error": "Error",
"success": "Éxito",
"warning": "Advertencia",
"refresh": "Actualizar",
"copy": "Copiar",
"copied": "¡Copiado!",
"settings": "Configuración",
"yes": "Sí",
"no": "No"
}

View File

@@ -0,0 +1,85 @@
{
"title": "Configuración",
"circleSettings": {
"title": "Configuración del círculo",
"description": "Tu cuenta se conecta automáticamente a un Círculo cuando creas o te unes a uno. Invita fácilmente a amigos compartiendo el código único del Círculo o el enlace a continuación.",
"circleCode": "Código del Círculo",
"copyCode": "Copiar Código",
"copyLink": "Copiar Enlace",
"codeCopied": "¡Código del círculo copiado!",
"linkCopied": "¡Enlace copiado!",
"joinCircle": "Unirse a un Círculo",
"joinCirclePlaceholder": "Ingresa el Código del Círculo",
"join": "Unirse",
"leave": "Salir del Círculo",
"leaveConfirmTitle": "Salir del Círculo",
"leaveConfirmMessage": "¿Estás seguro de que quieres salir de este círculo?",
"circleMembers": "Miembros del Círculo",
"circleMemberRequests": "Solicitudes de Miembros del Círculo",
"admin": "Administrador",
"member": "Miembro",
"pending": "Pendiente",
"accept": "Aceptar",
"reject": "Rechazar",
"makeAdmin": "Hacer Administrador",
"makeMember": "Hacer Miembro",
"remove": "Eliminar",
"webhookURL": "URL del Webhook",
"webhookDescription": "Ingresa una URL de webhook para recibir notificaciones de eventos del círculo",
"webhookPlaceholder": "https://tu-url-webhook.com"
},
"accountSettings": {
"title": "Configuración de la Cuenta",
"subscription": "Suscripción",
"subscriptionStatus": "Plan Actual",
"free": "Gratis",
"plus": "Plus",
"upgrade": "Actualizar",
"cancel": "Cancelar",
"changePassword": "Cambiar Contraseña",
"password": "Contraseña",
"dangerZone": "Zona de Peligro",
"dangerZoneDescription": "Una vez que elimines tu cuenta, no hay vuelta atrás. Por favor, está seguro.",
"deleteAccount": "Eliminar Cuenta"
},
"localization": {
"title": "Localización",
"description": "Personaliza el idioma, formato de fecha y preferencias regionales para tu cuenta.",
"language": "Idioma",
"languageDescription": "Selecciona tu idioma preferido",
"dateFormat": "Formato de Fecha",
"dateFormatDescription": "Elige cómo se deben mostrar las fechas en toda la aplicación",
"timeFormat": "Formato de Hora",
"timeFormatDescription": "Selecciona formato de 12 o 24 horas",
"12hour": "12 horas (AM/PM)",
"24hour": "24 horas",
"firstDayOfWeek": "Primer Día de la Semana",
"firstDayOfWeekDescription": "Selecciona qué día comienza tu semana",
"sunday": "Domingo",
"monday": "Lunes",
"formats": {
"mdy": "MM/DD/AAAA (EE.UU.)",
"dmy": "DD/MM/AAAA (Europa)",
"ymd": "AAAA-MM-DD (ISO)",
"long": "Formato largo (ej., 1 de enero de 2024)",
"short": "Formato corto (ej., 1 ene 2024)"
}
},
"sidepanel": {
"title": "Personalización del Panel Lateral",
"description": "Personaliza el diseño y la visibilidad de las tarjetas en el panel lateral. Esta sección solo está disponible en dispositivos de pantalla grande como tabletas y computadoras de escritorio."
},
"theme": {
"title": "Preferencias de tema",
"description": "Elige cómo se ve el sitio para ti. Selecciona un solo tema o sincronízalo con tu sistema y cambia automáticamente entre temas de día y noche.",
"themeMode": "Modo de tema",
"light": "Claro",
"dark": "Oscuro",
"system": "Sistema"
},
"notifications": {
"settingsSaved": "Configuración guardada con éxito",
"settingsSaveFailed": "Error al guardar la configuración",
"invalidWebhook": "URL de webhook no válida"
}
}