X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Ftechniques%2FDetail.js;h=488205b2e6d68ffdd374ae93d78a5b0cfe704b6b;hb=0586e04204885088f31ac9861446eb0759cc8d2f;hp=303921c4c919245ed5c66da8e1a7f4357d976705;hpb=6b75ddb40eedcdf1b27e82b94b6f0fa7a4af0547;p=alttp.git

diff --git a/resources/js/components/techniques/Detail.js b/resources/js/components/techniques/Detail.js
index 303921c..488205b 100644
--- a/resources/js/components/techniques/Detail.js
+++ b/resources/js/components/techniques/Detail.js
@@ -3,9 +3,15 @@ import React from 'react';
 import { Container } from 'react-bootstrap';
 import { withTranslation } from 'react-i18next';
 
+import List from './List';
 import Outline from './Outline';
 import RawHTML from '../common/RawHTML';
-import { getTranslation } from '../../helpers/Technique';
+import {
+	getRelations,
+	getTranslation,
+	hasRelations,
+	sorted,
+} from '../../helpers/Technique';
 import i18n from '../../i18n';
 
 const Detail = ({ technique }) => <Container as="article">
@@ -24,6 +30,10 @@ const Detail = ({ technique }) => <Container as="article">
 			<RawHTML html={getTranslation(chapter, 'description', i18n.language)} />
 		</section>
 	) : null}
+	{hasRelations(technique, 'related') ? <>
+		<h2 className="mt-5">{i18n.t('techniques.seeAlso')}</h2>
+		<List techniques={sorted(getRelations(technique, 'related'))} />
+	</> : null}
 </Container>;
 
 Detail.propTypes = {