Fix backdrop library

src/components/target-pane/target-pane.jsx

@@ -4,7 +4,7 @@ import React from 'react';
 import VM from 'scratch-vm';
 
 import SpriteLibrary from '../../containers/sprite-library.jsx';
-
+import BackdropLibrary from '../../containers/backdrop-library.jsx';
 import SpriteSelectorComponent from '../sprite-selector/sprite-selector.jsx';
 import StageSelector from '../../containers/stage-selector.jsx';
 
@@ -17,6 +17,7 @@ import styles from './target-pane.css';
  * @returns {React.Component} rendered component
  */
 const TargetPane = ({
+    backdropLibraryVisible,
     editingTarget,
     spriteLibraryVisible,
     onChangeSpriteDirection,
@@ -29,6 +30,7 @@ const TargetPane = ({
     onDuplicateSprite,
     onNewSpriteClick,
     onRequestCloseSpriteLibrary,
+    onRequestCloseBackdropLibrary,
     onSelectSprite,
     stage,
     sprites,
@@ -72,6 +74,12 @@ const TargetPane = ({
                         onRequestClose={onRequestCloseSpriteLibrary}
                     />
                 ) : null}
+                {backdropLibraryVisible ? (
+                    <BackdropLibrary
+                        vm={vm}
+                        onRequestClose={onRequestCloseBackdropLibrary}
+                    />
+                ) : null}
             </div>
         </div>
     </div>
@@ -96,6 +104,7 @@ const spriteShape = PropTypes.shape({
 });
 
 TargetPane.propTypes = {
+    backdropLibraryVisible: PropTypes.bool,
     editingTarget: PropTypes.string,
     extensionLibraryVisible: PropTypes.bool,
     onChangeSpriteDirection: PropTypes.func,
@@ -107,6 +116,7 @@ TargetPane.propTypes = {
     onDeleteSprite: PropTypes.func,
     onDuplicateSprite: PropTypes.func,
     onNewSpriteClick: PropTypes.func,
+    onRequestCloseBackdropLibrary: PropTypes.func,
     onRequestCloseExtensionLibrary: PropTypes.func,
     onRequestCloseSpriteLibrary: PropTypes.func,
     onSelectSprite: PropTypes.func,

src/containers/backdrop-library.jsx

@@ -23,7 +23,9 @@ class BackdropLibrary extends React.Component {
             skinId: null
         };
         this.props.vm.addBackdrop(item.md5, vmBackdrop).then(() => {
-            this.props.onNewBackdrop();
+            if (this.props.onNewBackdrop) {
+                this.props.onNewBackdrop();
+            }
         });
     }
     render () {
@@ -39,7 +41,7 @@ class BackdropLibrary extends React.Component {
 }
 
 BackdropLibrary.propTypes = {
-    onNewBackdrop: PropTypes.func.isRequired,
+    onNewBackdrop: PropTypes.func,
     onRequestClose: PropTypes.func,
     vm: PropTypes.instanceOf(VM).isRequired
 };

src/containers/target-pane.jsx

@@ -5,6 +5,7 @@ import {connect} from 'react-redux';
 
 import {
     openSpriteLibrary,
+    closeBackdropLibrary,
     closeSpriteLibrary
 } from '../reducers/modals';
 
@@ -90,7 +91,8 @@ const mapStateToProps = state => ({
         return sprites;
     }, {}),
     stage: state.targets.stage,
-    spriteLibraryVisible: state.modals.spriteLibrary
+    spriteLibraryVisible: state.modals.spriteLibrary,
+    backdropLibraryVisible: state.modals.backdropLibrary
 });
 const mapDispatchToProps = dispatch => ({
     onNewSpriteClick: e => {
@@ -99,6 +101,9 @@ const mapDispatchToProps = dispatch => ({
     },
     onRequestCloseSpriteLibrary: () => {
         dispatch(closeSpriteLibrary());
+    },
+    onRequestCloseBackdropLibrary: () => {
+        dispatch(closeBackdropLibrary());
     }
 });