import React, { Component } from 'react';
import { Label } from 'react-bootstrap';
import moment from 'moment';

class Clock extends Component {

  state = {
    time: moment().format('H:mm:ss'),
    intervalID: null
  }

  componentDidMount() {
    const intervalID = setInterval(() => {
      const time = moment().format('H:mm:ss');
      this.setState({ time });
    }, 1000);

    this.setState({ intervalID });
  }

  componentWillUnmount() {
    clearInterval(this.state.intervalID);
  }

  render() {
    return (
      <Label bsStyle="info">{ this.state.time }</Label>
    );
  }
}

export default Clock