Added station name on modal

This commit is contained in:
dbroqua 2020-03-06 15:52:33 +01:00
parent e516184104
commit f336fd67ed
2 changed files with 27 additions and 12 deletions

View file

@ -105,8 +105,8 @@ class Application extends React.Component {
<GasStation <GasStation
showModal={showModal} showModal={showModal}
hideModal={this.hideModal} hideModal={this.hideModal}
selectedGasStation={selectedGasStation} station={selectedGasStation}
selectedGasType={selectedGasType} gasType={selectedGasType}
/> />
<About <About
showModal={showAboutModal} showModal={showAboutModal}

View file

@ -24,19 +24,19 @@ class GasStation extends React.Component {
/** /**
* Méthode permettant de générer la liste des prix * Méthode permettant de générer la liste des prix
* return {string} * @return {string}
*/ */
renderPrices = () => { renderPrices = () => {
const { const {
selectedGasType, gasType,
selectedGasStation, station,
} = this.props; } = this.props;
return ( return (
<ListGroup variant="flush"> <ListGroup variant="flush">
{selectedGasStation.prices ? selectedGasStation.prices.map(price => { {station.prices ? station.prices.map(price => {
return ( return (
<ListGroup.Item key={price._id} className={selectedGasType === price.gasType ? "selected-gasType" : ""}> <ListGroup.Item key={price._id} className={gasType === price.gasType ? "selected-gasType" : ""}>
{`${this.renderGasType(price.gasType)} : ${price.price}`} {`${this.renderGasType(price.gasType)} : ${price.price}`}
</ListGroup.Item> </ListGroup.Item>
); );
@ -45,11 +45,25 @@ class GasStation extends React.Component {
) )
} }
/**
* Méthode permettant de formater le titre de la modale en fonction des infos reçues
* @return {string}
*/
renderFormatTitle = () => {
const {
station,
} = this.props;
if ( station.name ) {
return station.name;
}
return `${lowerCaseString(station.address)} - ${capitalizeFirstLetter(station.city)}`;
}
render () { render () {
const { const {
showModal, showModal,
hideModal, hideModal,
selectedGasStation,
} = this.props; } = this.props;
return ( return (
@ -62,7 +76,7 @@ class GasStation extends React.Component {
> >
<Modal.Header closeButton> <Modal.Header closeButton>
<Modal.Title> <Modal.Title>
{`${lowerCaseString(selectedGasStation.address)} - ${capitalizeFirstLetter(selectedGasStation.city)}`} {this.renderFormatTitle()}
</Modal.Title> </Modal.Title>
</Modal.Header> </Modal.Header>
<Modal.Body> <Modal.Body>
@ -79,7 +93,7 @@ class GasStation extends React.Component {
} }
GasStation.defaultProps = { GasStation.defaultProps = {
selectedGasStation: { station: {
address: null, address: null,
city: null, city: null,
prices: [] prices: []
@ -87,10 +101,11 @@ GasStation.defaultProps = {
}; };
GasStation.propTypes = { GasStation.propTypes = {
selectedGasType: PropTypes.string.isRequired, gasType: PropTypes.string.isRequired,
showModal: PropTypes.bool.isRequired, showModal: PropTypes.bool.isRequired,
hideModal: PropTypes.func.isRequired, hideModal: PropTypes.func.isRequired,
selectedGasStation: PropTypes.shape({ station: PropTypes.shape({
name: PropTypes.string,
address: PropTypes.string, address: PropTypes.string,
city: PropTypes.string, city: PropTypes.string,
prices: PropTypes.array prices: PropTypes.array