more content variety

[alttp.git] / resources / js / components / pages / Techniques.js

diff --git a/resources/js/components/pages/Techniques.js b/resources/js/components/pages/Techniques.js
index c206a31b6fbb9bd33252054e977369b008667a15..4bc0066baefd69654ac06f4ed678fc24230f89f8 100644 (file)
--- a/resources/js/components/pages/Techniques.js
+++ b/resources/js/components/pages/Techniques.js
@@ -1,4 +1,5 @@
 import axios from 'axios';
+import PropTypes from 'prop-types';
 import React from 'react';
 import { withTranslation } from 'react-i18next';
 
@@ -10,7 +11,7 @@ import Overview from '../techniques/Overview';
 import { compareTranslation } from '../../helpers/Technique';
 import i18n from '../../i18n';
 
-const Techniques = () => {
+const Techniques = ({ namespace, type }) => {
        const [error, setError] = React.useState(null);
        const [loading, setLoading] = React.useState(true);
        const [techniques, setTechniques] = React.useState([]);
@@ -18,11 +19,11 @@ const Techniques = () => {
        React.useEffect(() => {
                const ctrl = new AbortController();
                setLoading(true);
-               window.document.title = i18n.t('techniques.heading');
+               window.document.title = i18n.t(`${namespace}.heading`);
                axios
-                       .get(`/api/tech`, {
+                       .get(`/api/content`, {
                                params: {
-                                       type: 'tech',
+                                       type,
                                },
                                signal: ctrl.signal
                        })
@@ -39,12 +40,12 @@ const Techniques = () => {
                return () => {
                        ctrl.abort();
                };
-       }, []);
+       }, [namespace, type]);
 
        React.useEffect(() => {
-               window.document.title = i18n.t('techniques.heading');
+               window.document.title = i18n.t(`${namespace}.heading`);
                setTechniques(t => [...t].sort(compareTranslation('title', i18n.language)));
-       }, [i18n.language]);
+       }, [namespace, i18n.language]);
 
        if (loading) {
                return <Loading />;
@@ -59,8 +60,13 @@ const Techniques = () => {
        }
 
        return <ErrorBoundary>
-               <Overview techniques={techniques} />
+               <Overview namespace={namespace} techniques={techniques} />
        </ErrorBoundary>;
 };
 
+Techniques.propTypes = {
+       namespace: PropTypes.string,
+       type: PropTypes.string,
+};
+
 export default withTranslation()(Techniques);