diff --git a/website/src/app/[lang]/[region]/(survey-tool)/survey/[recipient]/[survey]/layout.tsx b/website/src/app/[lang]/[region]/(survey-tool)/survey/[recipient]/[survey]/layout.tsx
index 9108b04dd..8f82e604f 100644
--- a/website/src/app/[lang]/[region]/(survey-tool)/survey/[recipient]/[survey]/layout.tsx
+++ b/website/src/app/[lang]/[region]/(survey-tool)/survey/[recipient]/[survey]/layout.tsx
@@ -1,10 +1,9 @@
-import { CURRENCY_COOKIE, DefaultParams } from '@/app/[lang]/[region]';
+import { DefaultParams } from '@/app/[lang]/[region]';
 import { I18nDialog } from '@/components/i18n-dialog';
 import { SILogo } from '@/components/logos/si-logo';
 import { GlobeEuropeAfricaIcon, LanguageIcon } from '@heroicons/react/24/solid';
 import { Translator } from '@socialincome/shared/src/utils/i18n';
 import { BaseContainer, Button } from '@socialincome/ui';
-import { cookies } from 'next/headers';
 import { PropsWithChildren } from 'react';
 
 export interface SurveyPageProps {
@@ -14,7 +13,7 @@ export interface SurveyPageProps {
 	} & DefaultParams;
 }
 
-export default async function Layout({ children, params: { lang, region } }: PropsWithChildren<SurveyPageProps>) {
+export default async function Layout({ children, params: { lang } }: PropsWithChildren<SurveyPageProps>) {
 	const translator = await Translator.getInstance({
 		language: lang,
 		namespaces: ['common', 'website-common', 'website-me'],
@@ -34,11 +33,8 @@ export default async function Layout({ children, params: { lang, region } }: Pro
 						currencies={[]}
 						translations={{
 							language: translator.t('language'),
-							currentLanguage: translator.t(`languages.${lang}`),
 							region: translator.t('region'),
-							currentRegion: translator.t(`regions.${region}`),
 							currency: translator.t('currency'),
-							currentCurrency: translator.t(`currencies.${cookies().get(CURRENCY_COOKIE)}`),
 						}}
 					>
 						<Button variant="ghost" className="flex max-w-md space-x-2">
diff --git a/website/src/app/[lang]/[region]/(website)/login/page.tsx b/website/src/app/[lang]/[region]/(website)/login/page.tsx
index e5c03f06c..7acfe4e1c 100644
--- a/website/src/app/[lang]/[region]/(website)/login/page.tsx
+++ b/website/src/app/[lang]/[region]/(website)/login/page.tsx
@@ -15,7 +15,6 @@ export default async function Page(props: DefaultPageProps) {
 				requiredField: translator.t('login.required-field'),
 				invalidEmail: translator.t('login.invalid-email'),
 				submitButton: translator.t('login.submit-button'),
-
 				unknownUser: translator.t('login.unknown-user'),
 				wrongPassword: translator.t('login.wrong-password'),
 			}}
diff --git a/website/src/app/[lang]/[region]/(website)/transparency/finances/[currency]/currency-redirect.tsx b/website/src/app/[lang]/[region]/(website)/transparency/finances/[currency]/currency-redirect.tsx
index 94a6fe227..303c6f5c7 100644
--- a/website/src/app/[lang]/[region]/(website)/transparency/finances/[currency]/currency-redirect.tsx
+++ b/website/src/app/[lang]/[region]/(website)/transparency/finances/[currency]/currency-redirect.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { useI18n } from '@/app/providers/i18n-provider-client';
+import { useI18n } from '@/app/context-providers';
 import { WebsiteCurrency } from '@/i18n';
 import { redirect } from 'next/navigation';
 import { useEffect } from 'react';
diff --git a/website/src/app/[lang]/[region]/(website)/transparency/finances/page.tsx b/website/src/app/[lang]/[region]/(website)/transparency/finances/page.tsx
index a8a9540ea..c56d9fa8a 100644
--- a/website/src/app/[lang]/[region]/(website)/transparency/finances/page.tsx
+++ b/website/src/app/[lang]/[region]/(website)/transparency/finances/page.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { useI18n } from '@/app/providers/i18n-provider-client';
+import { useI18n } from '@/app/context-providers';
 import { redirect } from 'next/navigation';
 import { useEffect } from 'react';
 
diff --git a/website/src/app/providers/providers-client.tsx b/website/src/app/context-providers.tsx
similarity index 68%
rename from website/src/app/providers/providers-client.tsx
rename to website/src/app/context-providers.tsx
index 4f5295a66..33034814a 100644
--- a/website/src/app/providers/providers-client.tsx
+++ b/website/src/app/context-providers.tsx
@@ -1,5 +1,8 @@
 'use client';
 
+import { CURRENCY_COOKIE, LANGUAGE_COOKIE, REGION_COOKIE } from '@/app/[lang]/[region]';
+import { useCookieState } from '@/hooks/useCookieState';
+import { WebsiteCurrency, WebsiteLanguage, WebsiteRegion } from '@/i18n';
 import { DEFAULT_REGION } from '@socialincome/shared/src/firebase';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { Analytics, getAnalytics, isSupported as isAnalyticsSupported } from 'firebase/analytics';
@@ -7,8 +10,8 @@ import { connectAuthEmulator, getAuth } from 'firebase/auth';
 import { connectFirestoreEmulator, getFirestore } from 'firebase/firestore';
 import { connectFunctionsEmulator, getFunctions } from 'firebase/functions';
 import { connectStorageEmulator, getStorage } from 'firebase/storage';
-import { usePathname } from 'next/navigation';
-import { PropsWithChildren, useEffect, useState } from 'react';
+import { usePathname, useRouter } from 'next/navigation';
+import { PropsWithChildren, createContext, useContext, useEffect, useState } from 'react';
 import { Toaster } from 'react-hot-toast';
 import {
 	AnalyticsProvider,
@@ -95,7 +98,7 @@ function FirebaseSDKProviders({ children }: PropsWithChildren) {
 	);
 }
 
-export function ThemeProvider({ children }: PropsWithChildren) {
+function ThemeProvider({ children }: PropsWithChildren) {
 	const pathname = usePathname();
 	const baseSegment = pathname?.split('/')[3];
 
@@ -111,7 +114,58 @@ export function ThemeProvider({ children }: PropsWithChildren) {
 	return <body className={theme}>{children}</body>;
 }
 
-export function ProvidersClient({ children }: PropsWithChildren) {
+type I18nContextType = {
+	language: WebsiteLanguage | undefined;
+	setLanguage: (language: WebsiteLanguage) => void;
+	region: WebsiteRegion | undefined;
+	setRegion: (country: WebsiteRegion) => void;
+	currency: WebsiteCurrency | undefined;
+	setCurrency: (currency: WebsiteCurrency) => void;
+};
+
+const I18nContext = createContext<I18nContextType>(undefined!);
+export const useI18n = () => useContext(I18nContext);
+
+function I18nProvider({ children }: PropsWithChildren) {
+	const router = useRouter();
+
+	const { value: language, setCookie: setLanguage } = useCookieState<WebsiteLanguage>(LANGUAGE_COOKIE);
+	const { value: region, setCookie: setRegion } = useCookieState<WebsiteRegion>(REGION_COOKIE);
+	const { value: currency, setCookie: setCurrency } = useCookieState<WebsiteCurrency>(CURRENCY_COOKIE);
+
+	useEffect(() => {
+		const pathSegments = window.location.pathname.split('/');
+		if (language && pathSegments[1] !== language) {
+			pathSegments[1] = language;
+			router.push(pathSegments.join('/'));
+		}
+	}, [language, router]);
+
+	useEffect(() => {
+		const pathSegments = window.location.pathname.split('/');
+		if (region && pathSegments[2] !== region) {
+			pathSegments[2] = region;
+			router.push(pathSegments.join('/'));
+		}
+	}, [region, router]);
+
+	return (
+		<I18nContext.Provider
+			value={{
+				language: language,
+				setLanguage: (language) => setLanguage(language, { expires: 365 }),
+				region: region,
+				setRegion: (country) => setRegion(country, { expires: 365 }),
+				currency: currency,
+				setCurrency: (currency) => setCurrency(currency, { expires: 365 }),
+			}}
+		>
+			{children}
+		</I18nContext.Provider>
+	);
+}
+
+export function ContextProviders({ children }: PropsWithChildren) {
 	const firebaseConfig = {
 		apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
 		appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID,
@@ -128,8 +182,10 @@ export function ProvidersClient({ children }: PropsWithChildren) {
 			<FirebaseSDKProviders>
 				<QueryClientProvider client={queryClient}>
 					<ThemeProvider>
-						<Toaster />
-						{children}
+						<I18nProvider>
+							<Toaster />
+							{children}
+						</I18nProvider>
 					</ThemeProvider>
 				</QueryClientProvider>
 			</FirebaseSDKProviders>
diff --git a/website/src/app/layout.tsx b/website/src/app/layout.tsx
index 62349b05f..d345a4efc 100644
--- a/website/src/app/layout.tsx
+++ b/website/src/app/layout.tsx
@@ -1,5 +1,4 @@
-import { I18nProvider } from '@/app/providers/i18n-provider';
-import { ProvidersClient } from '@/app/providers/providers-client';
+import { ContextProviders } from '@/app/context-providers';
 import { PropsWithChildren } from 'react';
 import './globals.css';
 
@@ -11,9 +10,7 @@ export const metadata = {
 export default function RootLayout({ children }: PropsWithChildren) {
 	return (
 		<html suppressHydrationWarning={true}>
-			<I18nProvider>
-				<ProvidersClient>{children}</ProvidersClient>
-			</I18nProvider>
+			<ContextProviders>{children}</ContextProviders>
 		</html>
 	);
 }
diff --git a/website/src/app/providers/i18n-provider-client.tsx b/website/src/app/providers/i18n-provider-client.tsx
deleted file mode 100644
index e49fc575d..000000000
--- a/website/src/app/providers/i18n-provider-client.tsx
+++ /dev/null
@@ -1,68 +0,0 @@
-'use client';
-
-import { CURRENCY_COOKIE, LANGUAGE_COOKIE, REGION_COOKIE } from '@/app/[lang]/[region]';
-import { useCookieState } from '@/hooks/useCookieState';
-import { WebsiteCurrency, WebsiteLanguage, WebsiteRegion } from '@/i18n';
-import { useRouter, useSearchParams } from 'next/navigation';
-import { PropsWithChildren, createContext, useContext, useEffect } from 'react';
-
-type I18nContextType = {
-	language: WebsiteLanguage | undefined;
-	setLanguage: (language: WebsiteLanguage) => void;
-	region: WebsiteRegion | undefined;
-	setRegion: (country: WebsiteRegion) => void;
-	currency: WebsiteCurrency | undefined;
-	setCurrency: (currency: WebsiteCurrency) => void;
-};
-
-const I18nContext = createContext<I18nContextType>(undefined!);
-export const useI18n = () => useContext(I18nContext);
-
-type I18nProviderClientProps = {
-	cookies: Map<string, string>;
-};
-
-export function I18nProviderClient({ cookies, children }: PropsWithChildren<I18nProviderClientProps>) {
-	const { value: language, setCookie: setLanguage } = useCookieState<WebsiteLanguage>(LANGUAGE_COOKIE);
-	const { value: region, setCookie: setRegion } = useCookieState<WebsiteRegion>(REGION_COOKIE);
-	const { value: currency, setCookie: setCurrency } = useCookieState<WebsiteCurrency>(
-		CURRENCY_COOKIE,
-		cookies.get(CURRENCY_COOKIE) as WebsiteCurrency,
-	);
-
-	const router = useRouter();
-	const searchParams = useSearchParams();
-
-	useEffect(() => {
-		const pathSegments = window.location.pathname.split('/');
-		if (language && pathSegments[1] !== language) {
-			pathSegments[1] = language;
-			const current = new URLSearchParams(Array.from(searchParams.entries()));
-			router.push(pathSegments.join('/') + '?' + current.toString());
-		}
-	}, [language, router, searchParams]);
-
-	useEffect(() => {
-		const pathSegments = window.location.pathname.split('/');
-		if (region && pathSegments[2] !== region) {
-			pathSegments[2] = region;
-			const current = new URLSearchParams(Array.from(searchParams.entries()));
-			router.push(pathSegments.join('/') + '?' + current.toString());
-		}
-	}, [region, router, searchParams]);
-
-	return (
-		<I18nContext.Provider
-			value={{
-				language: language,
-				setLanguage: (language) => setLanguage(language, { expires: 365 }),
-				region: region,
-				setRegion: (country) => setRegion(country, { expires: 365 }),
-				currency: currency,
-				setCurrency: (currency) => setCurrency(currency, { expires: 365 }),
-			}}
-		>
-			{children}
-		</I18nContext.Provider>
-	);
-}
diff --git a/website/src/app/providers/i18n-provider.tsx b/website/src/app/providers/i18n-provider.tsx
deleted file mode 100644
index 7863bd45b..000000000
--- a/website/src/app/providers/i18n-provider.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { I18nProviderClient } from '@/app/providers/i18n-provider-client';
-import { cookies } from 'next/headers';
-import { PropsWithChildren } from 'react';
-
-export function I18nProvider({ children }: PropsWithChildren) {
-	/**
-	 * The I18nProviderClient is wrapped into this component so that the values of the cookies are also available on SSR.
-	 * Without this, the HTML rendered on the client can be different from the HTML rendered on the server, which causes
-	 * hydration issues.
-	 */
-	const cookiesMap = new Map(
-		cookies()
-			.getAll()
-			.map((obj) => [obj.name, obj.value]),
-	);
-	return <I18nProviderClient cookies={cookiesMap}>{children}</I18nProviderClient>;
-}
diff --git a/website/src/components/country-flags.tsx b/website/src/components/country-flags.tsx
index fcd81e91b..697c0b057 100644
--- a/website/src/components/country-flags.tsx
+++ b/website/src/components/country-flags.tsx
@@ -1,7 +1,6 @@
 import { WebsiteCurrency } from '@/i18n';
 import { CH, EU } from 'country-flag-icons/react/1x1';
 import { SL, US } from 'country-flag-icons/react/3x2';
-import { Component } from 'react';
 
 export function getFlagComponentByCurrency(currency: WebsiteCurrency | undefined) {
 	switch (currency) {
@@ -13,7 +12,7 @@ export function getFlagComponentByCurrency(currency: WebsiteCurrency | undefined
 			return EU;
 		case 'SLE':
 			return SL;
-		case undefined:
-			return Component;
+		default:
+			return undefined;
 	}
 }
diff --git a/website/src/components/footer/footer-client.tsx b/website/src/components/footer/footer-client.tsx
index c619e5990..266e957d7 100644
--- a/website/src/components/footer/footer-client.tsx
+++ b/website/src/components/footer/footer-client.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import { DefaultParams } from '@/app/[lang]/[region]';
-import { useI18n } from '@/app/providers/i18n-provider-client';
+import { useI18n } from '@/app/context-providers';
 import { WebsiteLanguage, WebsiteRegion } from '@/i18n';
 import { GlobeAltIcon, LanguageIcon } from '@heroicons/react/24/solid';
 import {
diff --git a/website/src/components/i18n-dialog.tsx b/website/src/components/i18n-dialog.tsx
index 9ffaff46e..8538d5785 100644
--- a/website/src/components/i18n-dialog.tsx
+++ b/website/src/components/i18n-dialog.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { useI18n } from '@/app/providers/i18n-provider-client';
+import { useI18n } from '@/app/context-providers';
 import { WebsiteCurrency, WebsiteLanguage, WebsiteRegion } from '@/i18n';
 import { CurrencyDollarIcon } from '@heroicons/react/24/outline';
 import { GlobeEuropeAfricaIcon, LanguageIcon } from '@heroicons/react/24/solid';
@@ -36,11 +36,8 @@ type I18nDialogProps = {
 	}[];
 	translations: {
 		language: string;
-		currentLanguage: string;
 		region: string;
-		currentRegion: string;
 		currency: string;
-		currentCurrency: string;
 	};
 };
 
@@ -58,7 +55,7 @@ export function I18nDialog(
 					<Select value={language} onValueChange={(l: WebsiteLanguage) => setLanguage(l)}>
 						<SelectTrigger className="space-x-2">
 							<LanguageIcon className="h-4 w-4" />
-							<SelectValue placeholder={translations.currentLanguage} />
+							<SelectValue />
 						</SelectTrigger>
 						<SelectContent>
 							<SelectGroup>
@@ -77,7 +74,7 @@ export function I18nDialog(
 					<Select value={region} onValueChange={(c: WebsiteRegion) => setRegion(c)}>
 						<SelectTrigger className="space-x-2">
 							<GlobeEuropeAfricaIcon className="h-4 w-4" />
-							<SelectValue placeholder={translations.currentRegion} />
+							<SelectValue />
 						</SelectTrigger>
 						<SelectContent>
 							<SelectGroup>
@@ -102,7 +99,7 @@ export function I18nDialog(
 					>
 						<SelectTrigger className="space-x-2">
 							<CurrencyDollarIcon className="h-4 w-4" />
-							<SelectValue placeholder={translations.currentCurrency} />
+							<SelectValue />
 						</SelectTrigger>
 						<SelectContent>
 							<SelectGroup>
diff --git a/website/src/components/navbar/navbar-client.tsx b/website/src/components/navbar/navbar-client.tsx
index 0870e4793..51b33f754 100644
--- a/website/src/components/navbar/navbar-client.tsx
+++ b/website/src/components/navbar/navbar-client.tsx
@@ -1,5 +1,6 @@
 'use client';
 
+import { DefaultParams } from '@/app/[lang]/[region]';
 import { I18nDialog } from '@/components/i18n-dialog';
 import { SILogo } from '@/components/logos/si-logo';
 import { WebsiteCurrency } from '@/i18n';
@@ -23,7 +24,6 @@ import {
 import _ from 'lodash';
 import Link from 'next/link';
 import { useState } from 'react';
-import { DefaultParams } from '../../app/[lang]/[region]';
 
 type NavbarSection = {
 	title: string;
@@ -40,11 +40,8 @@ type NavbarProps = {
 	sections: NavbarSection[];
 	translations: {
 		language: string;
-		currentLanguage: string;
 		region: string;
-		currentRegion: string;
 		currency: string;
-		currentCurrency: string;
 		myProfile: string;
 		contactDetails: string;
 		payments: string;
@@ -76,11 +73,8 @@ export function NavbarClient(
 			currencies={currencies}
 			translations={{
 				language: translations.language,
-				currentLanguage: translations.currentLanguage,
 				region: translations.region,
-				currentRegion: translations.currentRegion,
 				currency: translations.currency,
-				currentCurrency: translations.currentCurrency,
 			}}
 		>
 			<Button variant="ghost" className="flex max-w-md space-x-2">
diff --git a/website/src/components/navbar/navbar.tsx b/website/src/components/navbar/navbar.tsx
index 769e01514..3539dfa6d 100644
--- a/website/src/components/navbar/navbar.tsx
+++ b/website/src/components/navbar/navbar.tsx
@@ -1,8 +1,7 @@
-import { CURRENCY_COOKIE, DefaultParams } from '@/app/[lang]/[region]';
+import { DefaultParams } from '@/app/[lang]/[region]';
 import { NavbarClient } from '@/components/navbar/navbar-client';
 import { WebsiteLanguage, websiteCurrencies, websiteRegions } from '@/i18n';
 import { Translator } from '@socialincome/shared/src/utils/i18n';
-import { cookies } from 'next/headers';
 
 export default async function Navbar({ lang, region }: DefaultParams) {
 	const translator = await Translator.getInstance({
@@ -10,7 +9,6 @@ export default async function Navbar({ lang, region }: DefaultParams) {
 		namespaces: ['common', 'website-common', 'website-me'],
 	});
 	const supportedLanguages: WebsiteLanguage[] = ['en', 'de'];
-	const currency = cookies().get(CURRENCY_COOKIE)?.value.toLowerCase();
 
 	return (
 		<NavbarClient
@@ -18,11 +16,8 @@ export default async function Navbar({ lang, region }: DefaultParams) {
 			region={region}
 			translations={{
 				language: translator.t('language'),
-				currentLanguage: translator.t(`languages.${lang}`),
 				region: translator.t('region'),
-				currentRegion: translator.t(`regions.${region}`),
 				currency: translator.t('currency'),
-				currentCurrency: translator.t(`currencies.${cookies().get(CURRENCY_COOKIE)}`),
 				myProfile: translator.t('navigation.my-profile'),
 				contactDetails: translator.t('tabs.contact-details'),
 				payments: translator.t('tabs.contributions'),
@@ -54,7 +49,7 @@ export default async function Navbar({ lang, region }: DefaultParams) {
 					links: [
 						{
 							title: translator.t('navigation.finances'),
-							href: `/${lang}/${region}/transparency/finances/${currency}`,
+							href: `/${lang}/${region}/transparency/finances`,
 							description: translator.t('navigation.finances-description'),
 						},
 						{
diff --git a/website/src/components/ui/currency-selector.tsx b/website/src/components/ui/currency-selector.tsx
index fa6886830..5b6d826c9 100644
--- a/website/src/components/ui/currency-selector.tsx
+++ b/website/src/components/ui/currency-selector.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { useI18n } from '@/app/providers/i18n-provider-client';
+import { useI18n } from '@/app/context-providers';
 import { getFlagComponentByCurrency } from '@/components/country-flags';
 import { WebsiteCurrency } from '@/i18n';
 import {
@@ -22,14 +22,14 @@ type CurrencySelectorProps = {
 
 const CurrencySelector = React.forwardRef<HTMLDivElement, CurrencySelectorProps>(
 	({ currencies, fontSize = 'md', ...props }: CurrencySelectorProps, ref) => {
-		const { currency, setCurrency } = useI18n();
+		let { currency, setCurrency } = useI18n();
 		const Flag = getFlagComponentByCurrency(currency);
 
 		return (
 			<div ref={ref} {...props}>
 				<Select value={currency} onValueChange={(currency: WebsiteCurrency) => setCurrency(currency)}>
 					<SelectTrigger className="h-full">
-						<Flag className="h-5 w-5" />
+						{Flag && <Flag className="h-5 w-5" />}
 						<SelectValue>
 							<Typography size={fontSize}>{currency}</Typography>
 						</SelectValue>
diff --git a/website/src/hooks/useCookieState.ts b/website/src/hooks/useCookieState.ts
index e83f40519..eb1e06a1a 100644
--- a/website/src/hooks/useCookieState.ts
+++ b/website/src/hooks/useCookieState.ts
@@ -1,20 +1,23 @@
 'use client';
 
 import Cookies, { CookieAttributes } from 'js-cookie';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 
 export const useCookieState = <T extends string>(key: string, initialValue?: T, options?: CookieAttributes) => {
-	const [value, setValue] = useState<T | undefined>(() => {
+	const [value, setValue] = useState<T | undefined>(undefined);
+
+	useEffect(() => {
+		// Setting the initial value for a cookie is intentionally done in useEffect and not in useState, so that the
+		// initial state value is always undefined. This is required so that statically rendered pages are always the
+		// same as the initial state of the client side rendered page.
 		let value = Cookies.get(key) as T;
 		if (value) {
-			return value;
+			setValue(value);
 		} else if (initialValue) {
 			Cookies.set(key, initialValue, options);
-			return initialValue;
-		} else {
-			return undefined;
+			setValue(initialValue);
 		}
-	});
+	}, []);
 
 	const setCookie = (val: T, options?: CookieAttributes) => {
 		Cookies.set(key, val, options);