feat: Auto browser language detection, remove LanguageSwitcher

- Update I18nContext to auto-detect browser language
- Default to English, switch to German if browser is German
- Remove LanguageSwitcher from guest and authenticated views
- Remove DramOfTheDay from header
- Cleaner, mobile-friendly header layout
This commit is contained in:
2026-01-19 23:26:55 +01:00
parent 883f76e488
commit 06fa208dd8
2 changed files with 13 additions and 18 deletions

View File

@@ -5,13 +5,12 @@ import { useRouter, useSearchParams } from 'next/navigation';
import { createClient } from '@/lib/supabase/client';
import BottleGrid from "@/components/BottleGrid";
import AuthForm from "@/components/AuthForm";
import LanguageSwitcher from "@/components/LanguageSwitcher";
import OfflineIndicator from "@/components/OfflineIndicator";
import { useI18n } from "@/i18n/I18nContext";
import { useAuth } from "@/context/AuthContext";
import { useSession } from "@/context/SessionContext";
import TastingHub from "@/components/TastingHub";
import { Sparkles, Loader2, Search, SlidersHorizontal, Settings, CircleUser } from "lucide-react";
import { Sparkles, Loader2, Search, SlidersHorizontal } from "lucide-react";
import { BottomNavigation } from '@/components/BottomNavigation';
import ScanAndTasteFlow from '@/components/ScanAndTasteFlow';
import UserStatusBadge from '@/components/UserStatusBadge';
@@ -19,7 +18,6 @@ import { getActiveSplits } from '@/services/split-actions';
import SplitCard from '@/components/SplitCard';
import HeroBanner from '@/components/HeroBanner';
import QuickActionsGrid from '@/components/QuickActionsGrid';
import DramOfTheDay from '@/components/DramOfTheDay';
import { checkIsAdmin } from '@/services/track-api-usage';
export default function Home() {
@@ -152,9 +150,6 @@ export default function Home() {
<p className="text-zinc-500 max-w-sm mx-auto font-bold tracking-wide">
{t('home.tagline')}
</p>
<div className="mt-8">
<LanguageSwitcher />
</div>
</div>
<AuthForm />
@@ -208,15 +203,9 @@ export default function Home() {
</div>
)}
</div>
<div className="flex items-center gap-1 sm:gap-2 flex-wrap justify-end">
<div className="flex items-center gap-2">
<UserStatusBadge />
<OfflineIndicator />
<div className="hidden sm:block">
<LanguageSwitcher />
</div>
<div className="hidden sm:block">
<DramOfTheDay bottles={bottles} />
</div>
<button
onClick={handleLogout}
className="text-[9px] font-bold uppercase tracking-widest text-zinc-600 hover:text-white transition-colors whitespace-nowrap"

View File

@@ -18,19 +18,25 @@ const translations: Record<Locale, TranslationKeys> = { de, en };
const I18nContext = createContext<I18nContextType | undefined>(undefined);
export const I18nProvider = ({ children }: { children: ReactNode }) => {
const [locale, setLocaleState] = useState<Locale>('de');
const [locale, setLocaleState] = useState<Locale>('en');
const [isInitialized, setIsInitialized] = useState(false);
useEffect(() => {
// Check for saved preference first
const savedLocale = localStorage.getItem('locale') as Locale;
if (savedLocale && (savedLocale === 'de' || savedLocale === 'en')) {
setLocaleState(savedLocale);
} else {
// Try to detect browser language
const browserLang = navigator.language.split('-')[0];
if (browserLang === 'en') {
setLocaleState('en');
// Auto-detect from browser: default to English, switch to German if detected
const browserLang = navigator.language.toLowerCase();
if (browserLang.startsWith('de')) {
setLocaleState('de');
localStorage.setItem('locale', 'de');
} else {
localStorage.setItem('locale', 'en');
}
}
setIsInitialized(true);
}, []);
const setLocale = (newLocale: Locale) => {