fix some tests

fix merge issues

src/pages/ActorPage/ActorPage.js

@@ -1,51 +0,0 @@
-import React from 'react';
-import PageTitle from '../../elements/PageTitle/PageTitle';
-import SideBar, {SideBarTitle} from '../../elements/SideBar/SideBar';
-import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
-import {faUser} from '@fortawesome/free-solid-svg-icons';
-import style from './ActorPage.module.css';
-import VideoContainer from '../../elements/VideoContainer/VideoContainer';
-import {callAPI} from '../../utils/Api';
-
-class ActorPage extends React.Component {
-    constructor(props) {
-        super(props);
-
-        this.state = {data: undefined};
-    }
-
-    render() {
-        return (
-            <>
-                <PageTitle title={this.props.actor.name} subtitle={this.state.data ? this.state.data.length + ' videos' : null}/>
-                <SideBar>
-                    <div className={style.pic}>
-                        <FontAwesomeIcon style={{color: 'white'}} icon={faUser} size='10x'/>
-                    </div>
-                    <SideBarTitle>Attention: This is an early preview!</SideBarTitle>
-                </SideBar>
-                {this.state.data ?
-                    <VideoContainer
-                        data={this.state.data}/> :
-                    <div>No Data found!</div>}
-            </>
-        );
-    }
-
-    componentDidMount() {
-        this.getActorInfo();
-    }
-
-    /**
-     * request more actor info from backend
-     */
-    getActorInfo() {
-        // todo 2020-12-4: fetch to db
-        callAPI('actor.php', {action: 'getActorInfo', actorid: this.props.actor.actor_id}, result => {
-            console.log(result);
-            this.setState({data: result.videos ? result.videos : []});
-        });
-    }
-}
-
-export default ActorPage;

src/pages/ActorPage/ActorPage.module.css

@@ -1,4 +1,9 @@
 .pic {
-    text-align: center;
     margin-bottom: 25px;
+    text-align: center;
+}
+
+.overviewbutton {
+    float: right;
+    margin-top: 25px;
 }

src/pages/ActorPage/ActorPage.test.js

@@ -1,12 +1,27 @@
 import {shallow} from 'enzyme';
 import React from 'react';
-import ActorPage from './ActorPage';
+import {ActorPage} from './ActorPage';
 
 describe('<ActorPage/>', function () {
     it('renders without crashing ', function () {
-        const wrapper = shallow(<ActorPage actor={{id: 5, name: 'usr1'}}/>);
+        const wrapper = shallow(<ActorPage match={{params: {id: 10}}}/>);
         wrapper.unmount();
     });
 
+    it('fetch infos', function () {
+        callAPIMock({
+            videos: [{
+                movie_id: 0,
+                movie_name: 'test'
+            }], info: {
+                thumbnail: '',
+                name: '',
+                actor_id: 0
+            }
+        });
 
+        const wrapper = shallow(<ActorPage match={{params: {id: 10}}}/>);
+
+        expect(wrapper.find('VideoContainer')).toHaveLength(1);
+    });
 });

src/pages/ActorPage/ActorPage.tsx

@@ -0,0 +1,87 @@
+import React from 'react';
+import PageTitle from '../../elements/PageTitle/PageTitle';
+import SideBar, {SideBarTitle} from '../../elements/SideBar/SideBar';
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {faUser} from '@fortawesome/free-solid-svg-icons';
+import style from './ActorPage.module.css';
+import VideoContainer from '../../elements/VideoContainer/VideoContainer';
+import {callAPI} from '../../utils/Api';
+import {ActorType, VideoUnloadedType} from '../../api/VideoTypes';
+import {Link, withRouter} from 'react-router-dom';
+import {RouteComponentProps} from 'react-router';
+import {Button} from '../../elements/GPElements/Button';
+
+interface state {
+    data: VideoUnloadedType[],
+    actor: ActorType
+}
+
+/**
+ * empty default props with id in url
+ */
+interface props extends RouteComponentProps<{ id: string }> {
+}
+
+/**
+ * result of actor fetch
+ */
+interface videofetchresult {
+    videos: VideoUnloadedType[];
+    info: ActorType;
+}
+
+/**
+ * info page about a specific actor and a list of all its videos
+ */
+export class ActorPage extends React.Component<props, state> {
+    constructor(props: props) {
+        super(props);
+
+        this.state = {data: [], actor: {actor_id: 0, name: '', thumbnail: ''}};
+    }
+
+    render(): JSX.Element {
+        return (
+            <>
+                <PageTitle title={this.state.actor.name} subtitle={this.state.data ? this.state.data.length + ' videos' : null}>
+                    <span className={style.overviewbutton}>
+                        <Link to='/actors'>
+                            <Button onClick={(): void => {}} title='Go to Actor overview'/>
+                        </Link>
+                    </span>
+                </PageTitle>
+                <SideBar>
+                    <div className={style.pic}>
+                        <FontAwesomeIcon style={{color: 'white'}} icon={faUser} size='10x'/>
+                    </div>
+                    <SideBarTitle>Attention: This is an early preview!</SideBarTitle>
+                </SideBar>
+                {this.state.data.length !== 0 ?
+                    <VideoContainer
+                        data={this.state.data}/> :
+                    <div>No Data found!</div>}
+            </>
+        );
+    }
+
+    componentDidMount(): void {
+        this.getActorInfo();
+    }
+
+    /**
+     * request more actor info from backend
+     */
+    getActorInfo(): void {
+        callAPI('actor.php', {
+            action: 'getActorInfo',
+            actorid: this.props.match.params.id
+        }, (result: videofetchresult) => {
+            this.setState({
+                data: result.videos ? result.videos : [],
+                actor: result.info
+            });
+        });
+    }
+}
+
+export default withRouter(ActorPage);