QR-master/src/hooks/useTranslation.ts

59 lines
1.3 KiB
TypeScript

'use client';
import { useState, useEffect } from 'react';
import en from '@/i18n/en.json';
import de from '@/i18n/de.json';
type Locale = 'en' | 'de';
const translations = {
en,
de,
};
export function useTranslation() {
const [locale, setLocale] = useState<Locale>('en');
useEffect(() => {
// Check localStorage for saved locale
const savedLocale = localStorage.getItem('locale') as Locale;
if (savedLocale && (savedLocale === 'en' || savedLocale === 'de')) {
setLocale(savedLocale);
}
}, []);
const changeLocale = (newLocale: Locale) => {
setLocale(newLocale);
localStorage.setItem('locale', newLocale);
};
const t = (key: string, options?: { returnObjects?: boolean }) => {
const keys = key.split('.');
let value: any = translations[locale];
for (const k of keys) {
if (value && typeof value === 'object' && k in value) {
value = value[k];
} else {
// Fallback to English if key not found
value = translations.en;
for (const k of keys) {
if (value && typeof value === 'object' && k in value) {
value = value[k];
} else {
return key; // Return key if not found
}
}
break;
}
}
return value;
};
return {
t,
locale,
setLocale: changeLocale,
};
}