Merge pull request #178 from spellew/react-16-spellew

Update React to v16 and fix any bugs caused by the update. For example, changing React.PropTypes to PropTypes from the 'prop-types' npm package.
metabrainz · Jan 12, 2018 · 876e59a · 876e59a
2 parents 3ea871b + b644776
commit 876e59a
Show file tree

Hide file tree

Showing 13 changed files with 17 additions and 16 deletions.
diff --git a/package.json b/package.json
@@ -64,10 +64,10 @@
     "passport": "^0.4.0",
     "passport-musicbrainz-oauth2": "git+https://github.com/LordSputnik/passport-musicbrainz-oauth2.git",
     "prop-types": "^15.6.0",
-    "react": "^15.6.1",
+    "react": "^16.2.0",
     "react-addons-shallow-compare": "^15.6.0",
     "react-bootstrap": "^0.31.5",
-    "react-dom": "^15.6.1",
+    "react-dom": "^16.2.0",
     "react-fontawesome": "^1.5.0",
     "react-redux": "^5.0.2",
     "react-select": "^1.1.0",

diff --git a/src/client/containers/layout.js b/src/client/containers/layout.js
@@ -27,7 +27,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 
 
-const {Alert, MenuItem, Nav, Navbar, NavDropdown} = bootstrap;
+const {Alert, MenuItem, Nav, Navbar, NavItem, NavDropdown} = bootstrap;
 
 class Layout extends React.Component {
 	constructor(props) {
@@ -129,9 +129,9 @@ class Layout extends React.Component {
 						</NavDropdown>
 					</Nav> :
 					<Nav pullRight>
-						<MenuItem href="/auth">
+						<NavItem href="/auth">
 							<FontAwesome name="sign-in"/>{' Sign In / Register'}
-						</MenuItem>
+						</NavItem>
 					</Nav>
 				}
 				{!(homepage || hideSearch) &&

diff --git a/src/client/controllers/deletion.js b/src/client/controllers/deletion.js
@@ -32,4 +32,4 @@ const markup = (
 	</Layout>
 );
 
-ReactDOM.render(markup, document.getElementById('target'));
+ReactDOM.hydrate(markup, document.getElementById('target'));
diff --git a/src/client/controllers/editor/achievement.js b/src/client/controllers/editor/achievement.js
@@ -32,7 +32,7 @@ import ReactDOM from 'react-dom';
 const propsTarget = document.getElementById('props');
 const props = propsTarget ? JSON.parse(propsTarget.innerHTML) : {};
 
-ReactDOM.render(
+ReactDOM.hydrate(
 	<Layout {...extractLayoutProps(props)}>
 		<EditorContainer
 			{...extractEditorProps(props)}

diff --git a/src/client/controllers/editor/edit.js b/src/client/controllers/editor/edit.js
@@ -27,7 +27,7 @@ import {extractLayoutProps} from '../../helpers/props';
 const propsTarget = document.getElementById('props');
 const props = propsTarget ? JSON.parse(propsTarget.innerHTML) : {};
 
-ReactDOM.render(
+ReactDOM.hydrate(
 	<Layout {...extractLayoutProps(props)}>
 		<ProfileForm
 			editor={props.editor}

diff --git a/src/client/controllers/editor/editor.js b/src/client/controllers/editor/editor.js
@@ -60,4 +60,4 @@ const markup = (
 	</Layout>
 );
 
-ReactDOM.render(markup, document.getElementById('target'));
+ReactDOM.hydrate(markup, document.getElementById('target'));
diff --git a/src/client/controllers/entity/entity.js b/src/client/controllers/entity/entity.js
@@ -66,4 +66,4 @@ else {
 	);
 }
 
-ReactDOM.render(markup, document.getElementById('target'));
+ReactDOM.hydrate(markup, document.getElementById('target'));
diff --git a/src/client/controllers/index.js b/src/client/controllers/index.js
@@ -54,4 +54,4 @@ const markup = (
 	</Layout>
 );
 
-ReactDOM.render(markup, document.getElementById('target'));
+ReactDOM.hydrate(markup, document.getElementById('target'));
diff --git a/src/client/controllers/registrationDetails.js b/src/client/controllers/registrationDetails.js
@@ -37,4 +37,4 @@ const markup = (
 	</Layout>
 );
 
-ReactDOM.render(markup, document.getElementById('target'));
+ReactDOM.hydrate(markup, document.getElementById('target'));
diff --git a/src/client/controllers/revision.js b/src/client/controllers/revision.js
@@ -35,4 +35,4 @@ const markup = (
 	</Layout>
 );
 
-ReactDOM.render(markup, document.getElementById('target'));
+ReactDOM.hydrate(markup, document.getElementById('target'));
diff --git a/src/client/controllers/search.js b/src/client/controllers/search.js
@@ -32,4 +32,4 @@ const markup = (
 	</Layout>
 );
 
-ReactDOM.render(markup, document.getElementById('target'));
+ReactDOM.hydrate(markup, document.getElementById('target'));
diff --git a/src/client/entity-editor/controller.js b/src/client/entity-editor/controller.js
@@ -74,4 +74,4 @@ const markup = (
 	</Layout>
 );
 
-ReactDOM.render(markup, document.getElementById('target'));
+ReactDOM.hydrate(markup, document.getElementById('target'));
diff --git a/src/client/input.js b/src/client/input.js
@@ -1,6 +1,7 @@
 /* eslint-disable */
 
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
 import ReactDOM from 'react-dom';
 
 import cx from 'classnames';