Merge pull request #776 from transloadit/more-react-prop-types

Update React component PropTypes

src/react/Dashboard.js

@@ -1,7 +1,6 @@
 const React = require('react')
-const PropTypes = require('prop-types')
-const UppyCore = require('../core/Core').Uppy
 const DashboardPlugin = require('../plugins/Dashboard')
+const basePropTypes = require('./propTypes').dashboard
 
 const h = React.createElement
 
@@ -14,7 +13,7 @@ class Dashboard extends React.Component {
   componentDidMount () {
     const uppy = this.props.uppy
     const options = Object.assign(
-      {},
+      { id: 'react:Dashboard' },
       this.props,
       { target: this.container }
     )
@@ -39,18 +38,8 @@ class Dashboard extends React.Component {
   }
 }
 
-Dashboard.propTypes = {
-  uppy: PropTypes.instanceOf(UppyCore).isRequired,
-  plugins: PropTypes.arrayOf(PropTypes.string),
-  inline: PropTypes.bool,
-  width: PropTypes.number,
-  height: PropTypes.number,
-  semiTransparent: PropTypes.bool,
-  showProgressDetails: PropTypes.bool,
-  hideUploadButton: PropTypes.bool,
-  note: PropTypes.string,
-  locale: PropTypes.object
-}
+Dashboard.propTypes = basePropTypes
+
 Dashboard.defaultProps = {
   inline: true
 }

src/react/DashboardModal.js

@@ -1,7 +1,7 @@
 const React = require('react')
 const PropTypes = require('prop-types')
-const UppyCore = require('../core/Core').Uppy
 const DashboardPlugin = require('../plugins/Dashboard')
+const basePropTypes = require('./propTypes').dashboard
 
 const h = React.createElement
 
@@ -14,7 +14,7 @@ class DashboardModal extends React.Component {
   componentDidMount () {
     const uppy = this.props.uppy
     const options = Object.assign(
-      {},
+      { id: 'react:DashboardModal' },
       this.props,
       {
         onRequestCloseModal: this.props.onRequestClose
@@ -57,20 +57,14 @@ class DashboardModal extends React.Component {
   }
 }
 
-DashboardModal.propTypes = {
-  uppy: PropTypes.instanceOf(UppyCore).isRequired,
+DashboardModal.propTypes = Object.assign({
   // Only check this prop type in the browser.
   target: typeof window !== 'undefined' ? PropTypes.instanceOf(window.HTMLElement) : PropTypes.any,
   open: PropTypes.bool,
   onRequestClose: PropTypes.func,
-  plugins: PropTypes.arrayOf(PropTypes.string),
-  width: PropTypes.number,
-  height: PropTypes.number,
-  showProgressDetails: PropTypes.bool,
-  hideUploadButton: PropTypes.bool,
-  note: PropTypes.string,
-  locale: PropTypes.object
-}
+  closeModalOnClickOutside: PropTypes.bool,
+  disablePageScrollWhenModalOpen: PropTypes.bool
+}, basePropTypes)
 
 DashboardModal.defaultProps = {
 }

src/react/DragDrop.js

@@ -1,7 +1,6 @@
 const React = require('react')
-const PropTypes = require('prop-types')
-const UppyCore = require('../core').Uppy
 const DragDropPlugin = require('../plugins/DragDrop')
+const propTypes = require('./propTypes')
 
 const h = React.createElement
 
@@ -14,7 +13,7 @@ class DragDrop extends React.Component {
   componentDidMount () {
     const uppy = this.props.uppy
     const options = Object.assign(
-      {},
+      { id: 'react:DragDrop' },
       this.props,
       { target: this.container }
     )
@@ -41,8 +40,8 @@ class DragDrop extends React.Component {
 }
 
 DragDrop.propTypes = {
-  uppy: PropTypes.instanceOf(UppyCore).isRequired,
-  locale: PropTypes.object
+  uppy: propTypes.uppy,
+  locale: propTypes.locale
 }
 DragDrop.defaultProps = {
 }

src/react/ProgressBar.js

@@ -1,7 +1,7 @@
 const React = require('react')
 const PropTypes = require('prop-types')
-const UppyCore = require('../core').Uppy
 const ProgressBarPlugin = require('../plugins/ProgressBar')
+const uppyPropType = require('./propTypes').uppy
 
 const h = React.createElement
 
@@ -13,7 +13,7 @@ class ProgressBar extends React.Component {
   componentDidMount () {
     const uppy = this.props.uppy
     const options = Object.assign(
-      {},
+      { id: 'react:ProgressBar' },
       this.props,
       { target: this.container }
     )
@@ -40,8 +40,9 @@ class ProgressBar extends React.Component {
 }
 
 ProgressBar.propTypes = {
-  uppy: PropTypes.instanceOf(UppyCore).isRequired,
-  fixed: PropTypes.bool
+  uppy: uppyPropType,
+  fixed: PropTypes.bool,
+  hideAfterFinish: PropTypes.bool
 }
 ProgressBar.defaultProps = {
 }

src/react/StatusBar.js

@@ -1,7 +1,7 @@
 const React = require('react')
 const PropTypes = require('prop-types')
-const UppyCore = require('../core').Uppy
 const StatusBarPlugin = require('../plugins/StatusBar')
+const uppyPropType = require('./propTypes').uppy
 
 const h = React.createElement
 
@@ -14,7 +14,7 @@ class StatusBar extends React.Component {
   componentDidMount () {
     const uppy = this.props.uppy
     const options = Object.assign(
-      {},
+      { id: 'react:StatusBar' },
       this.props,
       { target: this.container }
     )
@@ -41,7 +41,9 @@ class StatusBar extends React.Component {
 }
 
 StatusBar.propTypes = {
-  uppy: PropTypes.instanceOf(UppyCore).isRequired
+  uppy: uppyPropType,
+  hideAfterFinish: PropTypes.bool,
+  showProgressDetails: PropTypes.bool
 }
 StatusBar.defaultProps = {
 }

src/react/Wrapper.js

@@ -1,6 +1,6 @@
 const React = require('react')
 const PropTypes = require('prop-types')
-const UppyCore = require('../core').Uppy
+const uppyPropType = require('./propTypes').uppy
 
 const h = React.createElement
 
@@ -35,7 +35,7 @@ class UppyWrapper extends React.Component {
 }
 
 UppyWrapper.propTypes = {
-  uppy: PropTypes.instanceOf(UppyCore).isRequired,
+  uppy: uppyPropType,
   plugin: PropTypes.string.isRequired
 }
 

src/react/propTypes.js

@@ -0,0 +1,47 @@
+const PropTypes = require('prop-types')
+const UppyCore = require('../core').Uppy
+
+// The `uppy` prop receives the Uppy core instance.
+const uppy = PropTypes.instanceOf(UppyCore).isRequired
+
+// A list of plugins to mount inside this component.
+const plugins = PropTypes.arrayOf(PropTypes.string)
+
+// Language strings for this component.
+const locale = PropTypes.shape({
+  strings: PropTypes.object,
+  pluralize: PropTypes.func
+})
+
+// List of meta fields for the editor in the Dashboard.
+const metaField = PropTypes.shape({
+  id: PropTypes.string.isRequired,
+  name: PropTypes.string.isRequired,
+  placeholder: PropTypes.string
+})
+const metaFields = PropTypes.arrayOf(metaField)
+
+// Common props for dashboardy components (Dashboard and DashboardModal).
+const dashboard = {
+  uppy,
+  inline: PropTypes.bool,
+  plugins,
+  width: PropTypes.number,
+  height: PropTypes.number,
+  showProgressDetails: PropTypes.bool,
+  hideUploadButton: PropTypes.bool,
+  hideProgressAfterFinish: PropTypes.bool,
+  note: PropTypes.string,
+  metaFields,
+  proudlyDisplayPoweredByUppy: PropTypes.bool,
+  disableStatusBar: PropTypes.bool,
+  disableInformer: PropTypes.bool,
+  disableThumbnailGenerator: PropTypes.bool,
+  locale
+}
+
+module.exports = {
+  uppy,
+  locale,
+  dashboard
+}