schulze/hallbarUtvecklingVT7
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix some React errors and warnings

Browse Source
This commit is contained in:
André Wahlberg 2020-11-27 13:36:48 +01:00
parent fc29d7d327
commit b8322417a0
5 changed files with 20 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Header.js
View File

@ -6,7 +6,7 @@ class Header extends Component {
render() {
return (
<header>
<button id="navBtn"><img src={navIcon} /></button>
<button id="navBtn"><img src={navIcon} alt="" /></button>
<h1 id="pageTitle">{this.props.title}</h1>
</header>
);

4
src/components/MenuButton.js
View File

@ -6,13 +6,13 @@ class MenuButton extends Component {
return (
<button>
<span>{this.props.label}</span>
<img src={this.props.icon}/>
<img src={this.props.icon} alt="" />
</button>
);
} else {
return (
<button>
<img src={this.props.icon}/>
<img src={this.props.icon} alt="" />
<span>{this.props.label}</span>
</button>
);

24
src/components/TrafficEntry.js
View File

@ -8,28 +8,26 @@ import warningIcon from '../img/warning.svg';
class TrafficEntry extends Component {
render() {
let trafficInfo = this.props.departure.info;
let lineInterference = trafficInfo != "" && trafficInfo != null;
let infoElem = <></>;
if (trafficInfo != "" && trafficInfo != null)
infoElem = <p>{trafficInfo} <u>Visa mer</u></p>
let lineInterference = trafficInfo !== "" && trafficInfo !== null;
return (
<div class="trafficEntry">
<div className="trafficEntry">
<div>
<div class="timeColumn">
<div className="timeColumn">
<span>{this.props.departure.time}</span>
{lineInterference &&
<img src={warningIcon}></img>
<img src={warningIcon} alt=""></img>
}
</div>
<div class="lineColumn">
<div className="lineColumn">
<div>
<span class="lineName">{this.props.departure.lineName}</span>
<img src={busIcon}></img>
<span class="destination">{this.props.departure.destination}</span>
<span className="lineName">{this.props.departure.lineName}</span>
<img src={busIcon} alt=""></img>
<span className="destination">{this.props.departure.destination}</span>
</div>
{infoElem}
{lineInterference &&
<p>{trafficInfo} <u>Visa mer</u></p>
}
</div>
</div>

8
src/components/TrafficList.js
View File

@ -8,18 +8,20 @@ class TrafficList extends Component {
render() {
let entries = [];
let i = 0; // React requires elems in array to have associated unique key
this.props.departures.forEach(departure => {
entries.push(
<TrafficEntry departure={departure} />
<TrafficEntry key={i++} departure={departure} />
);
});
// Add separator between every element
const intersperse = (arr, sep) => arr.reduce((a,v)=>[...a,v,sep],[]).slice(0,-1);
entries = intersperse(entries, (<hr />));
entries = intersperse(entries, (<hr key={i++} />));
// Add separator after the last element
entries.push(<hr />);
entries.push(<hr key={i++} />);
return (
<div id="trafficList">

2
src/components/TripSelector.js
View File

@ -7,7 +7,7 @@ class TripSelector extends Component {
<label>Från:</label>
<input type="text" placeholder="Hållplats/Adress/Plats" />
<hr/>
<label for="lname">Till:</label>
<label>Till:</label>
<input type="text" placeholder="Hållplats/Adress/Plats" />
</form>
);