Support componenDidUpdate()

[hiddentao]

• This enables support of componentDidUpdate() using the official Disqus AJAX reset technique (https://help.disqus.com/customer/portal/articles/472107).
• I've also removed the camel-casing as that was unnecessarily confusing and causing problems.
• Also, it never unloads the Disqus scripts - there's technically no need to since we can keep track of whether they're already loaded, even across multiple component instances.

[mzabriskie]

Uh-oh, I found a place where this change breaks things.

constructor(props) {
  super(props);

  this.state = {
    commentsVisible: false
  };
}

handleCommentsClick() {
  this.setState({
    commentsVisible: !this.state.commentsVisible
  });
}

render() {
  var className = this.state.commentsVisible ? '' : 'hidden';
  var message = this.state.commentsVisible ? 'Hide Comments' : 'View Comments';

  return (
    <div>
      <a href="#" onClick={this.handleCommentsClick}>
        {message}
      </a>
      <DisqusThread
        className={className}
        shortname="myshortname"
        identifier="example"
        title="Foo"
      />
    </div>
  ); 
}

In this scenario the comments will always be hidden.

[hiddentao]

@mzabriskie Not sure I understand. How will the comments always be hidden?

[mzabriskie]

@hiddentao because of addition of shouldComponentUpdate.

shouldComponentUpdate: function(newProps) {
  return (newProps.id !== this.props.id || newProps.url !== this.props.url);
}

In my previous example the only prop that changes is className so shouldComponentUpdate will tell React that no update is necessary, as it's only interested in id and url props.