React lifecycle hooks

// related: https://twitter.com/andrestaltz/status/939257877600104448

import React from 'react';
import ReactDOM from 'react-dom';

class Foobar extends React.Component {
  componentDidMount() {
    console.log('Did mount');
  }
  shouldComponentUpdate(newProps) {
    return false;
  }
  render() {
    return <h1>{`${new Date()}`}</h1>;
  }
}

function withPeriodicRefresh(cls) {
  function NewClass () {}
  let interval;
  
  NewClass.prototype = Object.create(cls.prototype);
  
  NewClass.prototype.componentDidMount = function() {
    interval = setInterval(() => this.forceUpdate(), 1e3);
    typeof cls.prototype.componentDidMount == 'function'
      && cls.prototype.componentDidMount.call(this);
  }
  
  NewClass.prototype.componentWillUnmount = function() {
    clearInterval(interval);
    typeof cls.prototype.componentWillUnmount === 'function'
      && cls.prototype.componentWillUnmount.call(this);
  }

  return NewClass;
}

const Foobar2 = withPeriodicRefresh(Foobar);

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