humenius/ts-onlinetime-ranks
1
1
Fork 0
Code Issues 1 Pull Requests Releases 2 Wiki Activity

feature(database-connection): Refactor SeasonSwitch.tsx to functional components

Browse Source
This commit is contained in:
Humenius
2021-01-12 12:42:27 +01:00
parent 092534e437
commit a528118178
1 changed files with 13 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/components/SeasonSwitch/SeasonSwitch.tsx
View File

@@ -1,35 +1,33 @@
import React from 'react';
import { Link } from 'react-router-dom';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import {Link} from 'react-router-dom';
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import './SeasonSwitch.scss';
import SeasonDetail from '../SeasonDetail/SeasonDetail';
import {IUserListProperties} from "../UserList/UserList";
class SeasonSwitch extends React.Component<IUserListProperties> {
const SeasonSwitch: React.FC<IUserListProperties> = (props: IUserListProperties) => {
const seasonId = Number(props.userStats.seasonId)
const maxSeasonId = Number(props.userStats.maxSeasonId)
render() {
let seasonId = Number(this.props.userStats.seasonId)
let maxSeasonId = Number(this.props.userStats.maxSeasonId)
return(
return (
<div className="SeasonSwitch" data-testid="SeasonSwitch">
{
seasonId > 1
&& <Link to={"/season/" + (seasonId - 1)} onClick={() => this.props.onSeasonIdChange('' + (seasonId - 1))}>
<FontAwesomeIcon icon="arrow-circle-left" />
</Link>
&& <Link to={"/season/" + (seasonId - 1)} onClick={() => props.onSeasonIdChange('' + (seasonId - 1))}>
<FontAwesomeIcon icon="arrow-circle-left"/>
</Link>
}
<SeasonDetail {...this.props} />
<SeasonDetail {...props} />
{
seasonId !== maxSeasonId
&& <Link to={"/season/" + (seasonId + 1)} onClick={() => this.props.onSeasonIdChange('' + (seasonId + 1))}>
<FontAwesomeIcon icon="arrow-circle-right" />
</Link>
&& <Link to={"/season/" + (seasonId + 1)} onClick={() => props.onSeasonIdChange('' + (seasonId + 1))}>
<FontAwesomeIcon icon="arrow-circle-right"/>
</Link>
}
</div>
)
}
}
export default SeasonSwitch;