Merge pull request #2172 from getsentry/react-0.14

Upgrade to react 0.14

Author: benvinegar

package.json

@@ -25,12 +25,14 @@
     "node-libs-browser": "^0.5.2",
     "query-string": "^2.4.0",
     "raven-js": "^1.1.20",
-    "react": "^0.13.3",
-    "react-bootstrap": "^0.26.4",
+    "react": "0.14.0",
+    "react-addons-pure-render-mixin": "^0.14.0",
+    "react-bootstrap": "^0.27.0",
     "react-document-title": "^1.0.2",
-    "react-lazy-load": "^1.0.4",
-    "react-router": "^0.13.3",
-    "react-sticky": "^2.5.2",
+    "react-dom": "^0.14.0",
+    "react-lazy-load": "benvinegar/react-lazy-load#64fd716d9fb243e43b1b8040f7fba52f2191f2cb",
+    "react-router": "benvinegar/react-router#46998d030de3802ace768a673b07272586f7bf99",
+    "react-sticky": "^3.0.0",
     "reflux": "^0.3.0",
     "select2": "^3.5.1",
     "style-loader": "^0.12.4",

src/sentry/static/sentry/app/components/alertMessage.jsx

@@ -1,6 +1,6 @@
 import React from "react";
 import AlertActions from '../actions/alertActions';
-var PureRenderMixin = require('react/addons').addons.PureRenderMixin;
+import PureRenderMixin from 'react-addons-pure-render-mixin';
 
 var AlertMessage = React.createClass({
   mixins: [PureRenderMixin],

src/sentry/static/sentry/app/components/alerts.jsx

@@ -1,6 +1,6 @@
 import React from "react";
 import Reflux from "reflux";
-var PureRenderMixin = require('react/addons').addons.PureRenderMixin;
+import PureRenderMixin from 'react-addons-pure-render-mixin';
 
 import AlertStore from '../stores/alertStore';
 import AlertMessage from './alertMessage';

src/sentry/static/sentry/app/components/assigneeSelector.jsx

@@ -1,4 +1,5 @@
 import React from "react";
+import ReactDOM from "react-dom";
 import Reflux from "reflux";
 import classNames from "classnames";
 import api from "../api";
@@ -87,7 +88,7 @@ var AssigneeSelector = React.createClass({
   },
 
   onDropdownOpen() {
-    this.refs.filter.getDOMNode().focus();
+    ReactDOM.findDOMNode(this.refs.filter).focus();
   },
 
   onDropdownClose() {
@@ -118,7 +119,7 @@ var AssigneeSelector = React.createClass({
 
   componentDidUpdate(prevProps, prevState) {
     // XXX(dcramer): fix odd dedraw issue as of Chrome 45.0.2454.15 dev (64-bit)
-    var node = jQuery(this.refs.container.getDOMNode());
+    var node = jQuery(ReactDOM.findDOMNode(this.refs.container));
     node.hide().show(0);
   },
 

src/sentry/static/sentry/app/components/autoSelectText.jsx

@@ -1,19 +1,20 @@
-import jQuery from "jquery";
 import React from "react";
+import jQuery from "jquery";
+import ReactDOM from "react-dom";
 
 const AutoSelectText = React.createClass({
   componentDidMount() {
-    let ref = this.refs.element.getDOMNode();
+    let ref = ReactDOM.findDOMNode(this.refs.element);
     jQuery(ref).bind('click', this.selectText);
   },
 
   componentWillUnmount() {
-    let ref = this.refs.element.getDOMNode();
+    let ref = ReactDOM.findDOMNode(this.refs.element);
     jQuery(ref).unbind('click', this.selectText);
   },
 
   selectText() {
-    var node = this.refs.element.getDOMNode().firstChild;
+    var node = ReactDOM.findDOMNode(this.refs.element).firstChild;
     if (document.selection) {
       let range = document.body.createTextRange();
       range.moveToElementText(node);

src/sentry/static/sentry/app/components/clippedBox.jsx

@@ -1,4 +1,5 @@
 import React from "react";
+import ReactDOM from "react-dom";
 
 var ClippedBox = React.createClass({
   propTypes: {
@@ -20,7 +21,7 @@ var ClippedBox = React.createClass({
   },
 
   componentDidMount() {
-    var renderedHeight = this.getDOMNode().offsetHeight;
+    var renderedHeight = ReactDOM.findDOMNode(this).offsetHeight;
 
     if (renderedHeight > this.props.clipHeight ) {
       /*eslint react/no-did-mount-set-state:0*/

src/sentry/static/sentry/app/components/dropdownLink.jsx

@@ -1,6 +1,6 @@
-import joinClasses from "react/lib/joinClasses";
-import classNames from "classnames";
 import React from "react";
+import ReactDOM from "react-dom";
+import classNames from "classnames";
 
 require("bootstrap/js/dropdown");
 
@@ -21,11 +21,11 @@ var DropdownLink = React.createClass({
   },
 
   isOpen() {
-    return this.getDOMNode().classList.contains("open");
+    return ReactDOM.findDOMNode(this).classList.contains("open");
   },
 
   close() {
-    this.getDOMNode().classList.remove("open");
+    ReactDOM.findDOMNode(this).classList.remove("open");
   },
 
   onToggle(e) {
@@ -51,14 +51,14 @@ var DropdownLink = React.createClass({
     });
 
     return (
-      <span className={joinClasses(this.props.topLevelClasses, topLevelClasses)}>
-        <a className={joinClasses(this.props.className, className)} data-toggle="dropdown" onClick={this.onToggle}>
+      <span className={classNames(this.props.topLevelClasses, topLevelClasses)}>
+        <a className={classNames(this.props.className, className)} data-toggle="dropdown" onClick={this.onToggle}>
           {this.props.title}
           {this.props.caret &&
             <i className="icon-arrow-down" />
           }
         </a>
-        <ul className={joinClasses(this.props.menuClasses, "dropdown-menu")}>
+        <ul className={classNames(this.props.menuClasses, "dropdown-menu")}>
           {this.props.children}
         </ul>
       </span>

src/sentry/static/sentry/app/components/flotChart.jsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import ReactDOM from 'react-dom';
 import jQuery from 'jquery';
 import moment from 'moment';
 
@@ -113,7 +114,7 @@ var FlotChart = React.createClass({
       lines: { show: false }
     };
 
-    var chart = this.refs.chartNode.getDOMNode();
+    var chart = ReactDOM.findDOMNode(this.refs.chartNode);
     jQuery.plot(chart, series, plotOptions);
   },
 

src/sentry/static/sentry/app/components/group/chart.jsx

@@ -1,7 +1,7 @@
 import React from "react";
 import BarChart from "../../components/barChart";
 import PropTypes from "../../proptypes";
-var PureRenderMixin = require('react/addons').addons.PureRenderMixin;
+import PureRenderMixin from 'react-addons-pure-render-mixin';
 
 var GroupChart = React.createClass({
   mixins: [PureRenderMixin],

src/sentry/static/sentry/app/components/linkWithConfirmation.jsx

@@ -1,6 +1,6 @@
 import React from "react";
 import Modal from "react-bootstrap/lib/Modal";
-var PureRenderMixin = require('react/addons').addons.PureRenderMixin;
+import PureRenderMixin from 'react-addons-pure-render-mixin';
 
 var LinkWithConfirmation = React.createClass({
   mixins: [PureRenderMixin],