2017-10-16 09:10:30 +02:00
|
|
|
import React, { Component } from 'react';
|
|
|
|
|
import './App.css';
|
2017-10-16 20:21:19 +02:00
|
|
|
import PairsListComponent from './PairsListComponent.js';
|
2017-10-16 09:10:30 +02:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
class App extends Component {
|
|
|
|
|
constructor(props){
|
|
|
|
|
super(props);
|
|
|
|
|
|
2017-10-16 20:21:19 +02:00
|
|
|
this.state = {renderPairsList: false, pairs: []};
|
2017-10-16 09:10:30 +02:00
|
|
|
|
2017-10-16 20:21:19 +02:00
|
|
|
this.getPairsEventHandler = this.getPairsEventHandler.bind(this);
|
2017-10-16 09:10:30 +02:00
|
|
|
}
|
|
|
|
|
|
2017-10-16 20:21:19 +02:00
|
|
|
getPairsEventHandler(event){
|
|
|
|
|
console.log("Get Pairs");
|
|
|
|
|
this.setState({pairs: ['Bilal Rahima','A1 A2','B1 B2'],renderPairsList:true});
|
2017-10-16 09:10:30 +02:00
|
|
|
}
|
|
|
|
|
|
2017-10-16 20:21:19 +02:00
|
|
|
savePairsEventHandler(event){
|
|
|
|
|
|
2017-10-16 09:10:30 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
render() {
|
|
|
|
|
return (
|
|
|
|
|
<div className = "App">
|
|
|
|
|
<div>
|
|
|
|
|
<h2>Meetup app</h2>
|
|
|
|
|
</div>
|
2017-10-16 20:21:19 +02:00
|
|
|
|
2017-10-16 09:10:30 +02:00
|
|
|
<div className = "horizontalDiv">
|
2017-10-16 20:21:19 +02:00
|
|
|
<button onClick = {this.getPairsEventHandler}>Get pairs</button>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<h2> List of pairs : </h2>
|
2017-10-16 09:10:30 +02:00
|
|
|
</div>
|
|
|
|
|
{
|
2017-10-16 20:21:19 +02:00
|
|
|
this.state.renderPairsList &&
|
|
|
|
|
<PairsListComponent pairs = {this.state.pairs}/>
|
|
|
|
|
}
|
|
|
|
|
{
|
|
|
|
|
this.state.renderPairsList &&
|
|
|
|
|
<button onClick = {this.savePairsEventHandler}> Save pairs </button>
|
2017-10-16 09:10:30 +02:00
|
|
|
}
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export default App;
|