diff --git a/frontend/src/App.scss b/frontend/src/App.scss index 13ebca9..c4e2af9 100644 --- a/frontend/src/App.scss +++ b/frontend/src/App.scss @@ -40,6 +40,11 @@ color: #88c9db; } + +.error-message { + color: red; +} + footer { padding: 2rem; } diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 0cf9de7..41b9008 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -27,7 +27,10 @@ export default class App extends React.Component { componentDidMount() { this.setState({isLoaded: false}) this.mockService.getStats() - .then(data => this.setState({mock: data})); + .then(data => this.setState({ + data: data, + mock: data + })); this.apiService.getStats() .then(data => this.setState({ isLoaded: true, @@ -86,13 +89,14 @@ export default class App extends React.Component { return (

Humenius' TeamSpeak 3-Ranking

+ { this.state.error != null ?

Data could not be loaded. Please try again later!

: null} - - - - - + + + + + {this.renderTableData()} diff --git a/frontend/src/services/UserStatsService.ts b/frontend/src/services/UserStatsService.ts index fc6aba1..7002601 100644 --- a/frontend/src/services/UserStatsService.ts +++ b/frontend/src/services/UserStatsService.ts @@ -13,6 +13,14 @@ export default class UserStatsService { async getStats(): Promise { return fetch(this.apiURL, this.requestInit) .then(res => { console.log(res); return res; }) - .then(res => res.json()) + .then(res => this.checkResponse(res)) + .then(data => data.json()) + } + + private checkResponse(response: any): any { + if (!response.ok) { + throw Error(response.statusText); + } + return response; } }
PlacementNameOnline time
PlacementNameOnline time