feature(database-connection): Add routing for dynamic seasons

frontend/src/pages/MainPage/MainPage.scss

@@ -0,0 +1,3 @@
+.MainPage {
+  
+}

frontend/src/pages/MainPage/MainPage.tsx

@@ -0,0 +1,96 @@
+import React, {useEffect} from "react";
+import UserStatsService from "../../services/UserStatsService";
+import UserStatsMockService from "../../mock/UserStatsMockService";
+import {findDOMNode} from "react-dom";
+import Header from "../../components/Header/Header";
+import UserList from "../../components/UserList/UserList";
+import ErrorContainer from "../../components/ErrorContainer/ErrorContainer";
+import Footer from "../../components/Footer/Footer";
+import {RouteComponentProps} from "react-router/index";
+import UserStatsResponse from "../../models/UserStatsResponse";
+import {withRouter} from "react-router";
+
+class MainPage extends React.Component<IMainPageProps, IMainPageState> {
+
+    private apiService: UserStatsService = new UserStatsService();
+    private mockService = new UserStatsMockService();
+
+    constructor(props: IMainPageProps) {
+        super(props)
+
+        console.log("this.props.match.params.id = " + this.props.match.params.id)
+
+
+
+        let seasonId = !this.props.match.params.id ? "1" : this.props.match.params.id
+
+        console.log("seasonId = " + seasonId)
+
+        this.state = {
+            id: seasonId,
+            error: undefined,
+            loading: false,
+            users: this.mockService.getStatsWithoutPromise("1")
+        }
+    }
+
+    componentWillMount() {
+        this.fetchData();
+    }
+
+    componentDidUpdate(prevProps: Readonly<IMainPageProps>) {
+        const element = findDOMNode(this);
+        if (element != null) {
+            window.scrollTo(0, 0);
+        }
+
+        // if(prevProps.match.params.id !== this.props.match.params.id) {
+        //     this.setState({ id: this.props.match.params.id })
+        // }
+    }
+
+    private fetchData() {
+        this.setState({ loading: true })
+        // this.apiService.getStats(this.state.id)
+        //     .then(data => this.setState({
+        //         loading: false,
+        //         users: data
+        //     }))
+        this.mockService.getStats(this.state.id)
+            .then(data => this.setState({
+                loading: false,
+                users: data
+            }))
+    }
+
+    render() {
+        return (
+            <div className="MainPage">
+                <Header />
+                {
+                    this.state.error && <ErrorContainer message={this.state.error} />
+                }
+                {
+                    (this.state.loading)
+                    ? <UserList userStats={this.state.users} mocked={true}         />
+                    : <UserList userStats={this.state.users} mocked={!(!this.state.error)}    />
+                }
+                {/* { this.state.error != null ? <p className="error-message"> { this.state.error } Please try again later!</p> : null} */}
+                <Footer />
+            </div>
+        )
+    }
+}
+
+export interface IMainPageProps extends RouteComponentProps<{ id: string }> {
+
+}
+
+interface IMainPageState {
+    id: string;
+    error?: string;
+    loading: boolean;
+    users: UserStatsResponse;
+}
+
+export default withRouter(MainPage)