feat: initialize reactjs project using vite

src/i18n/index.tsx

@@ -0,0 +1,71 @@
+import { createContext, useContext, useState, useEffect, type ReactNode } from 'react';
+import { de, type Translations } from './de';
+import { en } from './en';
+
+type Language = 'de' | 'en';
+
+interface LanguageContextType {
+  language: Language;
+  setLanguage: (lang: Language) => void;
+  t: Translations;
+}
+
+const translations: Record<Language, Translations> = { de, en };
+
+const LanguageContext = createContext<LanguageContextType | undefined>(undefined);
+
+const STORAGE_KEY = 'ragusa-it-lang';
+
+function getInitialLanguage(): Language {
+  if (typeof window === 'undefined') return 'de';
+  
+  const stored = localStorage.getItem(STORAGE_KEY);
+  if (stored === 'de' || stored === 'en') return stored;
+  
+  const browserLang = navigator.language.split('-')[0];
+  return browserLang === 'en' ? 'en' : 'de';
+}
+
+export function LanguageProvider({ children }: { children: ReactNode }) {
+  const [language, setLanguageState] = useState<Language>('de');
+  const [isInitialized, setIsInitialized] = useState(false);
+
+  useEffect(() => {
+    setLanguageState(getInitialLanguage());
+    setIsInitialized(true);
+  }, []);
+
+  const setLanguage = (lang: Language) => {
+    setLanguageState(lang);
+    localStorage.setItem(STORAGE_KEY, lang);
+    document.documentElement.lang = lang;
+  };
+
+  useEffect(() => {
+    if (isInitialized) {
+      document.documentElement.lang = language;
+    }
+  }, [language, isInitialized]);
+
+  const value: LanguageContextType = {
+    language,
+    setLanguage,
+    t: translations[language],
+  };
+
+  return (
+    <LanguageContext.Provider value={value}>
+      {children}
+    </LanguageContext.Provider>
+  );
+}
+
+export function useTranslation() {
+  const context = useContext(LanguageContext);
+  if (!context) {
+    throw new Error('useTranslation must be used within a LanguageProvider');
+  }
+  return context;
+}
+
+export type { Language, Translations };