react: Allow changing instance in `uppy` prop

packages/@uppy/react/src/Dashboard.js

@@ -11,6 +11,17 @@ const h = React.createElement
 
 class Dashboard extends React.Component {
   componentDidMount () {
+    this.installPlugin()
+  }
+
+  componentDidUpdate (prevProps) {
+    if (prevProps.uppy !== this.props.uppy) {
+      this.uninstallPlugin(prevProps)
+      this.installPlugin()
+    }
+  }
+
+  installPlugin () {
     const uppy = this.props.uppy
     const options = Object.assign(
       { id: 'react:Dashboard' },
@@ -23,8 +34,8 @@ class Dashboard extends React.Component {
     this.plugin = uppy.getPlugin(options.id)
   }
 
-  componentWillUnmount () {
-    const uppy = this.props.uppy
+  uninstallPlugin (props = this.props) {
+    const uppy = props.uppy
 
     uppy.removePlugin(this.plugin)
   }

packages/@uppy/react/src/DashboardModal.js

@@ -12,6 +12,17 @@ const h = React.createElement
 
 class DashboardModal extends React.Component {
   componentDidMount () {
+    this.installPlugin()
+  }
+
+  componentDidUpdate (prevProps) {
+    if (prevProps.uppy !== this.props.uppy) {
+      this.uninstallPlugin(prevProps)
+      this.installPlugin()
+    }
+  }
+
+  installPlugin () {
     const uppy = this.props.uppy
     const options = Object.assign(
       { id: 'react:DashboardModal' },
@@ -34,8 +45,8 @@ class DashboardModal extends React.Component {
     }
   }
 
-  componentWillUnmount () {
-    const uppy = this.props.uppy
+  uninstallPlugin (props = this.props) {
+    const uppy = props.uppy
 
     uppy.removePlugin(this.plugin)
   }

packages/@uppy/react/src/DragDrop.js

@@ -11,6 +11,17 @@ const h = React.createElement
 
 class DragDrop extends React.Component {
   componentDidMount () {
+    this.installPlugin()
+  }
+
+  componentDidUpdate (prevProps) {
+    if (prevProps.uppy !== this.props.uppy) {
+      this.uninstallPlugin(prevProps)
+      this.installPlugin()
+    }
+  }
+
+  installPlugin () {
     const uppy = this.props.uppy
     const options = Object.assign(
       { id: 'react:DragDrop' },
@@ -24,8 +35,8 @@ class DragDrop extends React.Component {
     this.plugin = uppy.getPlugin(options.id)
   }
 
-  componentWillUnmount () {
-    const uppy = this.props.uppy
+  uninstallPlugin (props = this.props) {
+    const uppy = props.uppy
 
     uppy.removePlugin(this.plugin)
   }

packages/@uppy/react/src/ProgressBar.js

@@ -11,6 +11,17 @@ const h = React.createElement
 
 class ProgressBar extends React.Component {
   componentDidMount () {
+    this.installPlugin()
+  }
+
+  componentDidUpdate (prevProps) {
+    if (prevProps.uppy !== this.props.uppy) {
+      this.uninstallPlugin(prevProps)
+      this.installPlugin()
+    }
+  }
+
+  installPlugin () {
     const uppy = this.props.uppy
     const options = Object.assign(
       { id: 'react:ProgressBar' },
@@ -24,8 +35,8 @@ class ProgressBar extends React.Component {
     this.plugin = uppy.getPlugin(options.id)
   }
 
-  componentWillUnmount () {
-    const uppy = this.props.uppy
+  uninstallPlugin (props = this.props) {
+    const uppy = props.uppy
 
     uppy.removePlugin(this.plugin)
   }

packages/@uppy/react/src/StatusBar.js

@@ -12,6 +12,17 @@ const h = React.createElement
 
 class StatusBar extends React.Component {
   componentDidMount () {
+    this.installPlugin()
+  }
+
+  componentDidUpdate (prevProps) {
+    if (prevProps.uppy !== this.props.uppy) {
+      this.uninstallPlugin(prevProps)
+      this.installPlugin()
+    }
+  }
+
+  installPlugin () {
     const uppy = this.props.uppy
     const options = Object.assign(
       { id: 'react:StatusBar' },
@@ -25,8 +36,8 @@ class StatusBar extends React.Component {
     this.plugin = uppy.getPlugin(options.id)
   }
 
-  componentWillUnmount () {
-    const uppy = this.props.uppy
+  uninstallPlugin (props = this.props) {
+    const uppy = props.uppy
 
     uppy.removePlugin(this.plugin)
   }

packages/@uppy/react/src/Wrapper.js

@@ -12,14 +12,25 @@ class UppyWrapper extends React.Component {
   }
 
   componentDidMount () {
+    this.installPlugin()
+  }
+
+  componentDidUpdate (prevProps) {
+    if (prevProps.uppy !== this.props.uppy) {
+      this.uninstallPlugin(prevProps)
+      this.installPlugin()
+    }
+  }
+
+  installPlugin () {
     const plugin = this.props.uppy
       .getPlugin(this.props.plugin)
 
     plugin.mount(this.container, plugin)
   }
 
-  componentWillUnmount () {
-    const plugin = this.props.uppy
+  uninstallPlugin (props = this.props) {
+    const plugin = props.uppy
       .getPlugin(this.props.plugin)
 
     plugin.unmount()