From: Daniel Karbach <daniel.karbach@localhorst.tv>
Date: Fri, 10 Feb 2023 15:48:51 +0000 (+0100)
Subject: add language references to tech pages
X-Git-Url: https://git.localhorst.tv/?a=commitdiff_plain;h=52424eef6a48c5019d48cea8e38daa8375660b29;p=alttp.git

add language references to tech pages
---

diff --git a/resources/js/components/App.js b/resources/js/components/App.js
index 9656da2..44c19bd 100644
--- a/resources/js/components/App.js
+++ b/resources/js/components/App.js
@@ -15,6 +15,7 @@ import Tournament from './pages/Tournament';
 import User from './pages/User';
 import AlttpBaseRomProvider from '../helpers/AlttpBaseRomContext';
 import UserContext from '../helpers/UserContext';
+import i18n from '../i18n';
 
 const App = () => {
 	const [user, setUser] = useState(null);
@@ -62,6 +63,7 @@ const App = () => {
 		<AlttpBaseRomProvider>
 			<UserContext.Provider value={user}>
 				<Helmet>
+					<html lang={i18n.language} />
 					<title>{t('general.appName')}</title>
 					<meta name="description" content={t('general.appDescription')} />
 				</Helmet>
diff --git a/resources/js/components/common/LanguageSwitcher.js b/resources/js/components/common/LanguageSwitcher.js
index ff8b197..c6ae66a 100644
--- a/resources/js/components/common/LanguageSwitcher.js
+++ b/resources/js/components/common/LanguageSwitcher.js
@@ -17,7 +17,8 @@ const setLanguage = (user, language) => {
 
 const LanguageSwitcher = ({ user }) =>
 <Button
-	onClick={() => { setLanguage(user, i18n.language === 'de' ? 'en' : 'de'); }}
+	href={`?lng=${i18n.language === 'de' ? 'en' : 'de'}`}
+	onClick={e => { setLanguage(user, i18n.language === 'de' ? 'en' : 'de'); e.preventDefault(); }}
 	title={i18n.language === 'de' ? 'Switch to english' : 'Auf deutsch wechseln'}
 	variant="outline-secondary"
 >
diff --git a/resources/js/components/pages/Technique.js b/resources/js/components/pages/Technique.js
index e380611..aabb8d0 100644
--- a/resources/js/components/pages/Technique.js
+++ b/resources/js/components/pages/Technique.js
@@ -9,7 +9,7 @@ import ErrorMessage from '../common/ErrorMessage';
 import Loading from '../common/Loading';
 import NotFound from '../pages/NotFound';
 import Detail from '../techniques/Detail';
-import { getTranslation } from '../../helpers/Technique';
+import { getLanguages, getTranslation } from '../../helpers/Technique';
 import i18n from '../../i18n';
 
 const Technique = () => {
@@ -56,6 +56,19 @@ const Technique = () => {
 		<Helmet>
 			<title>{getTranslation(technique, 'title', i18n.language)}</title>
 			<meta name="description" content={getTranslation(technique, 'short', i18n.language)} />
+			<link
+				href={`https://alttp.localhorst.tv/tech/${technique.name}`}
+				hrefLang="x-default"
+				rel="alternate"
+			/>
+			{getLanguages(technique).map(l =>
+				<link
+					key={l}
+					href={`https://alttp.localhorst.tv/tech/${technique.name}?lng=${l}`}
+					hrefLang={l}
+					rel="alternate"
+				/>
+			)}
 		</Helmet>
 		<Detail technique={technique} />
 	</ErrorBoundary>;
diff --git a/resources/js/helpers/Technique.js b/resources/js/helpers/Technique.js
index 1a8f4fc..c1375bb 100644
--- a/resources/js/helpers/Technique.js
+++ b/resources/js/helpers/Technique.js
@@ -17,6 +17,8 @@ export const getRelations = (tech, type) => {
 
 export const hasRelations = (tech, type) => getRelations(tech, type).length > 0;
 
+export const getLanguages = tech => ['en', ...tech.translations.map(t => t.locale)];
+
 export const getTranslation = (tech, prop, lang) => {
 	const direct = tech.translations.find(t => t.locale === lang);
 	if (direct) {
@@ -36,6 +38,7 @@ export const sorted = (techs) => [...techs].sort(compareTranslation('title', i18
 
 export default {
 	compareTranslation,
+	getLanguages,
 	getRelations,
 	getTranslation,
 	hasRelations,
