From 94443ed952a3c4c756b0b09c5729f49629b26ac0 Mon Sep 17 00:00:00 2001
From: rosethorn999 <24700793+rosethorn999@users.noreply.github.com>
Date: Fri, 27 Oct 2023 10:07:01 -0700
Subject: [PATCH] feat: Stay on current page when changing lang

---
 .../[lng]/components/{FooterBar.js => FooterBar.tsx}   |  6 ++----
 src/app/[lng]/components/HeaderBar/HeaderBase.js       | 10 ++++++++--
 2 files changed, 10 insertions(+), 6 deletions(-)
 rename src/app/[lng]/components/{FooterBar.js => FooterBar.tsx} (97%)

diff --git a/src/app/[lng]/components/FooterBar.js b/src/app/[lng]/components/FooterBar.tsx
similarity index 97%
rename from src/app/[lng]/components/FooterBar.js
rename to src/app/[lng]/components/FooterBar.tsx
index 18ddb50..5b6567b 100644
--- a/src/app/[lng]/components/FooterBar.js
+++ b/src/app/[lng]/components/FooterBar.tsx
@@ -1,7 +1,7 @@
 import Link from 'next/link';
 import { useTranslation } from '../../i18n';
 
-const FooterBar = async ({ lng }) => {
+export default async function FooterBar({ lng }: { lng: string }) {
 	// eslint-disable-next-line react-hooks/rules-of-hooks
 	const { t } = await useTranslation(lng, 'footer');
 	return (
@@ -80,6 +80,4 @@ const FooterBar = async ({ lng }) => {
 			</div>
 		</footer>
 	);
-};
-
-export default FooterBar;
+}
diff --git a/src/app/[lng]/components/HeaderBar/HeaderBase.js b/src/app/[lng]/components/HeaderBar/HeaderBase.js
index 826ff2c..b2ae37c 100644
--- a/src/app/[lng]/components/HeaderBar/HeaderBase.js
+++ b/src/app/[lng]/components/HeaderBar/HeaderBase.js
@@ -6,7 +6,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faMagnifyingGlass, faLanguage } from '@fortawesome/free-solid-svg-icons';
 import Cookies from 'js-cookie';
 import { languages } from '../../../i18n/settings';
-import { useRouter } from 'next/navigation';
+import { useRouter, useSelectedLayoutSegments, useSearchParams } from 'next/navigation';
 import gymPoolLogo from '../../../../../public/gymPoolLogo.svg';
 
 export const HeaderBase = ({ t, lng }) => {
@@ -15,6 +15,8 @@ export const HeaderBase = ({ t, lng }) => {
 	const [isLoggedIn, setIsLoggedIn] = useState();
 	const token = Cookies.get('token');
 	const router = useRouter();
+	const SearchParams = useSearchParams();
+	const SelectedLayoutSegments = useSelectedLayoutSegments();
 
 	useEffect(() => {
 		setIsLoggedIn(!!token);
@@ -28,7 +30,11 @@ export const HeaderBase = ({ t, lng }) => {
 	}
 	function clickLangSwitcher() {
 		const switchToLang = languages[(languages.indexOf(lng) + 1) % languages.length];
-		router.push(`/${switchToLang}/`);
+		const segments = SelectedLayoutSegments.join('/');
+		const queries = new URLSearchParams(SearchParams).toString();
+
+		const newUrl = `/${switchToLang}/${segments}?${queries}`;
+		router.push(newUrl);
 	}
 	function triggerMobileMenu(toStatus = false) {
 		toStatus = !isMobileMenuOpened;