React Clock List with Add

gistfile1.txt

class Clock extends React.Component {
  constructor(props) {
    super(props);
    this.state = {date: new Date()};
  }
  
  componentDidMount() {
    this.timerID = setInterval(
    () => this.tick(),
    1000
    );
  }
  
  componentWillMount() {
    clearInterval(this.timerID)
  }
  
  tick() {
    this.setState({
      date: new Date()
    });
  }

  render() {
    return (
    <div>
      <h1>Hello, world!</h1>
      <h2>It is {this.state.date.toLocaleTimeString()}.</h2>
    </div>
  );
  }
}

function Button(props) {
  return (
    <button onClick={props.action}>
      {props.label}
    </button>
  );
}

class App extends React.Component {
  
  constructor(props) {
    super(props);
    this.state = { clocks: [<Clock />] }
    this.addClock = this.addClock.bind(this);
  }
  
  addClock(e) {
    this.setState((prevState, props) => ({
        clocks: prevState.clocks.concat([<Clock />])
	  }));  
  }
  
  render() {
      return (
      <div>
          <h1>List of Clocks</h1>
          <Button action={this.addClock} label="Add Clock"/>
          {this.state.clocks}
      </div>
    );
  }  
}

ReactDOM.render(
  <App />,
  document.getElementById('root')
);