basic frontend implementation of new token system

src/pages/CategoryPage/CategoryPage.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import {Route, Switch} from 'react-router-dom';
+import {Route, Switch, useRouteMatch} from 'react-router-dom';
 import {CategoryViewWR} from './CategoryView';
 import TagView from './TagView';
 
@@ -7,19 +7,21 @@ import TagView from './TagView';
  * Component for Category Page
  * Contains a Tag Overview and loads specific Tag videos in VideoContainer
  */
-class CategoryPage extends React.Component {
-    render(): JSX.Element {
-        return (
-            <Switch>
-                <Route path='/categories/:id'>
-                    <CategoryViewWR />
-                </Route>
-                <Route path='/categories'>
-                    <TagView />
-                </Route>
-            </Switch>
-        );
-    }
-}
+const CategoryPage = (): JSX.Element => {
+    const match = useRouteMatch();
+
+    console.log(match.url);
+
+    return (
+        <Switch>
+            <Route exact path={`${match.url}/:id`}>
+                <CategoryViewWR />
+            </Route>
+            <Route exact path={`${match.url}/`}>
+                <TagView />
+            </Route>
+        </Switch>
+    );
+};
 
 export default CategoryPage;

src/pages/CategoryPage/CategoryView.tsx

@@ -119,9 +119,10 @@ export class CategoryView extends React.Component<CategoryViewProps, CategoryVie
                 this.videodata = result.Videos;
                 this.setState({loaded: true, TagName: result.TagName});
             },
-            (_) => {
+            (e) => {
+                console.log(e);
                 // if there is an load error redirect to home page
-                this.props.history.push('/');
+                // this.props.history.push('/');
             }
         );
     }

src/pages/CategoryPage/TagView.tsx

@@ -56,7 +56,7 @@ class TagView extends React.Component<Props, TagViewState> {
                 <DynamicContentContainer
                     data={this.state.loadedtags}
                     renderElement={(m): JSX.Element => (
-                        <Link to={'/categories/' + m.TagId} key={m.TagId}>
+                        <Link to={'/media/categories/' + m.TagId} key={m.TagId}>
                             <TagPreview name={m.TagName} />
                         </Link>
                     )}