feat(i18n-mobile): add bilingual support (Català / Castellano) for React Native app
Run Tests on Branches / Detect Changes (push) Successful in 13s
Run Tests on Branches / Backend Tests (push) Has been skipped
Run Tests on Branches / Frontend Tests (push) Successful in 1m40s
Run Tests on Branches / Frontend Mobile Tests (push) Successful in 1m37s
Run Tests on Branches / Parapharmacy API Tests (push) Has been skipped
Run Tests on Branches / PIP Platform Tests (push) Has been skipped
Run Tests on Branches / Detect Changes (push) Successful in 13s
Run Tests on Branches / Backend Tests (push) Has been skipped
Run Tests on Branches / Frontend Tests (push) Successful in 1m40s
Run Tests on Branches / Frontend Mobile Tests (push) Successful in 1m37s
Run Tests on Branches / Parapharmacy API Tests (push) Has been skipped
Run Tests on Branches / PIP Platform Tests (push) Has been skipped
Add lightweight i18n system matching the web app architecture.
Language persisted in AsyncStorage('ff-lang').
New files:
- src/i18n/locales/ca.js (~190 translation keys)
- src/i18n/locales/es.js (~190 translation keys)
- src/i18n/LanguageContext.jsx (Provider + AsyncStorage)
- src/i18n/useTranslation.js (hook)
- src/i18n/index.js (barrel export)
Modified 16 files:
- app/_layout.tsx: wrap with LanguageProvider, translate stack titles
- app/(tabs)/_layout.tsx: translate tab bar labels
- app/(tabs)/index.tsx: translate home screen
- app/(tabs)/search.tsx: translate search screen
- app/(tabs)/alerts.tsx: translate alerts screen
- app/(tabs)/profile.tsx: translate profile + add language selector (CA/ES)
- app/(tabs)/scan.tsx: translate scanner screen
- app/auth/login.tsx: translate login/register
- app/medicine/[id].tsx: translate medicine detail
- app/pharmacy/[id].tsx: translate pharmacy detail
- app/product/[source]/[id].tsx: translate product detail
- 5 components: MedicineCard, StockBadge, SearchBar, LoadingSpinner, BarcodeScanner
Language selector in Profile screen (globe icon + CA/ES toggle).
No routes changed. No API calls affected.
This commit is contained in:
@@ -4,6 +4,7 @@ import { CameraView, useCameraPermissions } from 'expo-camera';
|
||||
import { Ionicons } from '@expo/vector-icons';
|
||||
import { useThemeContext } from './ThemeProvider';
|
||||
import { spacing, borderRadius } from '../constants/theme';
|
||||
import { useTranslation } from '../src/i18n';
|
||||
|
||||
interface BarcodeScannerProps {
|
||||
onBarcodeScanned: (barcode: string) => void;
|
||||
@@ -14,6 +15,7 @@ export function BarcodeScanner({ onBarcodeScanned, onClose }: BarcodeScannerProp
|
||||
const [permission, requestPermission] = useCameraPermissions();
|
||||
const [scanned, setScanned] = useState(false);
|
||||
const { colors } = useThemeContext();
|
||||
const { t } = useTranslation();
|
||||
|
||||
if (!permission) {
|
||||
return <View style={styles.container} />;
|
||||
@@ -23,15 +25,15 @@ export function BarcodeScanner({ onBarcodeScanned, onClose }: BarcodeScannerProp
|
||||
return (
|
||||
<View style={[styles.permissionContainer, { backgroundColor: colors.background }]}>
|
||||
<Ionicons name="camera" size={64} color={colors.textSecondary} />
|
||||
<Text style={[styles.permissionTitle, { color: colors.text }]}>Permiso de cámara requerido</Text>
|
||||
<Text style={[styles.permissionTitle, { color: colors.text }]}>{t('barcodeScanner.permissionRequired')}</Text>
|
||||
<Text style={[styles.permissionText, { color: colors.textSecondary }]}>
|
||||
Necesitamos acceso a la cámara para escanear códigos de barras
|
||||
{t('barcodeScanner.permissionDesc')}
|
||||
</Text>
|
||||
<TouchableOpacity style={[styles.permissionButton, { backgroundColor: colors.primary }]} onPress={requestPermission}>
|
||||
<Text style={styles.permissionButtonText}>Conceder permiso</Text>
|
||||
<Text style={styles.permissionButtonText}>{t('barcodeScanner.grantPermission')}</Text>
|
||||
</TouchableOpacity>
|
||||
<TouchableOpacity style={styles.cancelButton} onPress={onClose}>
|
||||
<Text style={[styles.cancelButtonText, { color: colors.textSecondary }]}>Cancelar</Text>
|
||||
<Text style={[styles.cancelButtonText, { color: colors.textSecondary }]}>{t('barcodeScanner.cancel')}</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
);
|
||||
@@ -63,7 +65,7 @@ export function BarcodeScanner({ onBarcodeScanned, onClose }: BarcodeScannerProp
|
||||
</View>
|
||||
|
||||
<Text style={styles.instruction}>
|
||||
Apunta la cámara al código de barras del medicamento
|
||||
{t('barcodeScanner.scanningHint')}
|
||||
</Text>
|
||||
|
||||
<TouchableOpacity style={styles.closeButton} onPress={onClose}>
|
||||
@@ -77,7 +79,7 @@ export function BarcodeScanner({ onBarcodeScanned, onClose }: BarcodeScannerProp
|
||||
style={[styles.scanAgainButton, { backgroundColor: colors.primary }]}
|
||||
onPress={() => setScanned(false)}
|
||||
>
|
||||
<Text style={styles.scanAgainText}>Escanear de nuevo</Text>
|
||||
<Text style={styles.scanAgainText}>{t('barcodeScanner.scanAgain')}</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user