X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Ftechniques%2FOverview.js;h=f82a8777ab3e4725c6fe2b58fbd1575188ab2d89;hb=cf210ddda8ff5336feee10f733b022a72d906238;hp=8c7cd4db3e8b8725452779105d9454b7f29b537a;hpb=6c51a1601e74bc822ccafe984d525d0e9a35ca28;p=alttp.git

diff --git a/resources/js/components/techniques/Overview.js b/resources/js/components/techniques/Overview.js
index 8c7cd4d..f82a877 100644
--- a/resources/js/components/techniques/Overview.js
+++ b/resources/js/components/techniques/Overview.js
@@ -4,16 +4,32 @@ import { Container } from 'react-bootstrap';
 import { withTranslation } from 'react-i18next';
 
 import List from './List';
+import TechFilter from './TechFilter';
 import i18n from '../../i18n';
 
-const Overview = ({ techniques }) => <Container>
-	<h1>{i18n.t('techniques.heading')}</h1>
+const Overview = ({
+	filter,
+	namespace,
+	setFilter,
+	techniques,
+	type,
+}) => <Container>
+	<div className="d-flex align-items-center justify-content-between">
+		<h1>{i18n.t(`${namespace}.heading`)}</h1>
+		{type === 'tech' ?
+			<TechFilter filter={filter} setFilter={setFilter} />
+		: null}
+	</div>
 	<List techniques={techniques} />
 </Container>;
 
 Overview.propTypes = {
+	filter: PropTypes.shape({}),
+	namespace: PropTypes.string,
+	setFilter: PropTypes.func,
 	techniques: PropTypes.arrayOf(PropTypes.shape({
 	})),
+	type: PropTypes.string,
 };
 
 export default withTranslation()(Overview);