use prop-types and setState

Author: cesine

app/components/App/index.jsx

@@ -3,6 +3,7 @@ import { FieldDBObject } from 'fielddb/api/FieldDBObject'
 import Helmet from 'react-helmet'
 import Q from 'q'
 import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 
 FieldDBObject.todo = function () {}
 FieldDBObject.warn = function () {}
@@ -55,7 +56,7 @@ class App extends Component {
 }
 
 App.propTypes = {
-  children: React.PropTypes.object.isRequired
+  children: PropTypes.object.isRequired
 }
 
 function mapStateToProps () {

app/components/App/routes.js

@@ -7,7 +7,7 @@ import CorpusMaskContainer from '../CorpusMask'
 import UserMaskContainer from '../UserMask'
 import SearchContainer from '../Search'
 
-export default function (history) {
+export default function Routes(history) {
   return (
     <Router history={history}>
       <Route path='/' component={App}>

app/components/Corpora/Corpora.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { Link } from 'react-router'
 import { List } from 'immutable'
 
@@ -38,8 +39,8 @@ class Corpora extends Component {
 }
 
 Corpora.propTypes = {
-  corpora: React.PropTypes.instanceOf(List).isRequired,
-  className: React.PropTypes.string.isRequired
+  corpora: PropTypes.instanceOf(List).isRequired,
+  className: PropTypes.string.isRequired
 }
 
 export default Corpora

app/components/Corpora/index.jsx

@@ -1,5 +1,6 @@
 import { connect } from 'react-redux'
 import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import Helmet from 'react-helmet'
 
 import Corpora from './Corpora.jsx'
@@ -34,8 +35,8 @@ class CorpusMaskContainer extends Component {
 }
 
 CorpusMaskContainer.propTypes = {
-  loadCorpora: React.PropTypes.func.isRequired,
-  corpora: React.PropTypes.object.isRequired
+  loadCorpora: PropTypes.func.isRequired,
+  corpora: PropTypes.object.isRequired
 }
 
 function mapStateToProps (state) {

app/components/CorpusMask/index.jsx

@@ -3,6 +3,7 @@ import { connect } from 'react-redux'
 import Helmet from 'react-helmet'
 import Immutable from 'immutable'
 import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import { CorpusMask } from 'fielddb/api/corpus/CorpusMask'
 import { DatumFields } from 'fielddb/api/datum/DatumFields'
 import marked from 'marked'
@@ -220,6 +221,7 @@ class CorpusMaskContainer extends Component {
                       <dt>Rights</dt>
                       <dd>Resource creators, researchers and the speech communities who provide the primary data have different priorities over who has access to language resources.</dd>
                       <dt>Solution</dt>
+                      {/* eslint-disable-next-line react/jsx-no-target-blank */}
                       <dd>Terms of use should be well documented, and enforced if necessary with encryption or licensing. It is important however to limit the duration of <a target='_blank' href='http://emeld.org/school/classroom/ethics/access.html'>access restrictions</a>: A resource whose access is permanently restricted to one user is of no long-term value since it cannot be used once that user is gone.</dd>
                     </dl>
                   </li>
@@ -242,11 +244,11 @@ function mapStateToProps (state) {
 }
 
 CorpusMaskContainer.propTypes = {
-  children: React.PropTypes.object,
-  corpusMask: React.PropTypes.object.isRequired,
-  searchResults: React.PropTypes.object.isRequired,
-  params: React.PropTypes.object.isRequired,
-  loadCorpusMaskDetail: React.PropTypes.func.isRequired
+  children: PropTypes.object,
+  corpusMask: PropTypes.object.isRequired,
+  searchResults: PropTypes.object.isRequired,
+  params: PropTypes.object.isRequired,
+  loadCorpusMaskDetail: PropTypes.func.isRequired
 }
 
 export { CorpusMaskContainer }

app/components/DataList/index.jsx

@@ -1,5 +1,6 @@
 import marked from 'marked'
 import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 import SearchResult from '../Search/SearchResult.jsx'
 
 marked.setOptions({
@@ -74,9 +75,9 @@ class DataList extends Component {
 }
 
 DataList.propTypes = {
-  className: React.PropTypes.string.isRequired,
-  corpus: React.PropTypes.object.isRequired,
-  datalist: React.PropTypes.object.isRequired
+  className: PropTypes.string.isRequired,
+  corpus: PropTypes.object.isRequired,
+  datalist: PropTypes.object.isRequired
 }
 
 export default DataList

app/components/Datum/IGT.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 
 function isEmpty (value) {
   return value
@@ -22,8 +23,8 @@ class IGT extends Component {
 }
 
 IGT.propTypes = {
-  fields: React.PropTypes.object.isRequired,
-  igt: React.PropTypes.object.isRequired
+  fields: PropTypes.object.isRequired,
+  igt: PropTypes.object.isRequired
 }
 
 export default IGT

app/components/Datum/ParallelText.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 
 function isEmpty (value) {
   return value
@@ -20,7 +21,7 @@ class ParallelText extends Component {
 }
 
 ParallelText.propTypes = {
-  parallelText: React.PropTypes.object.isRequired
+  parallelText: PropTypes.object.isRequired
 }
 
 export default ParallelText

app/components/Media/index.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from 'react'
+import PropTypes from 'prop-types'
 
 const audioExtensions = [
   '.3gp',
@@ -72,21 +73,23 @@ class Media extends Component {
       )
     } else if ((media.type && media.type.includes('image')) || imageExtensions.indexOf(extension) > -1) {
       return (
+        // eslint-disable-next-line react/jsx-no-target-blank
         <a target='_blank' href={url}>
           <img title={media.description} src={url} />
         </a>
       )
     } else {
       return (
+        // eslint-disable-next-line react/jsx-no-target-blank
         <a target='_blank' title={'Open ' + media.filename + ' in a new tab'} href={url}>{media.filename}</a>
       )
     }
   }
 }
 
 Media.propTypes = {
-  corpus: React.PropTypes.object.isRequired,
-  media: React.PropTypes.object.isRequired
+  corpus: PropTypes.object.isRequired,
+  media: PropTypes.object.isRequired
 }
 
 export default Media

app/components/Search/Search.test.js

@@ -31,6 +31,11 @@ describe('Component::SearchContainer', function () {
     let element = doc.find('div')
 
     expect(element).to.exist
-    expect(element.length).to.equal(3)
+    expect(element.length).to.equal(1)
+
+    let inputs = doc.find('input')
+
+    expect(inputs).to.exist
+    expect(inputs.length).to.equal(1)
   })
 })