Added onRemoveMedia callback

src/components/ControlPane.js

@@ -10,7 +10,8 @@ export default class ControlPane extends React.Component {
       field: field,
       value: entry.getIn(['data', field.get('name')]),
       onChange: (value) => this.props.onChange(entry.setIn(['data', field.get('name')], value)),
-      onAddMedia: (mediaFile) => this.props.onAddMedia(mediaFile)
+      onAddMedia: (mediaFile) => this.props.onAddMedia(mediaFile),
+      onRemoveMedia: (mediaFile) => this.props.onRemoveMedia(mediaFile)
     });
   }
 

src/components/EntryEditor.js

@@ -12,6 +12,7 @@ export default class EntryEditor extends React.Component {
     };
     this.handleChange = this.handleChange.bind(this);
     this.handleAddMedia = this.handleAddMedia.bind(this);
+    this.handleRemoveMedia = this.handleRemoveMedia.bind(this);
     this.handleSave = this.handleSave.bind(this);
   }
 
@@ -23,6 +24,14 @@ export default class EntryEditor extends React.Component {
     this.setState({mediaFiles: this.state.mediaFiles.push(mediaFile)});
   }
 
+  handleRemoveMedia(mediaFile) {
+    const newState = this.state.mediaFiles.filterNot((item) => item === mediaFile);
+    this.state = {
+      entry: this.props.entry,
+      mediaFiles: Immutable.List(newState)
+    };
+  }
+
   handleSave() {
     this.props.onPersist(this.state.entry, this.state.mediaFiles);
   }
@@ -40,6 +49,7 @@ export default class EntryEditor extends React.Component {
               entry={this.state.entry}
               onChange={this.handleChange}
               onAddMedia={this.handleAddMedia}
+              onRemoveMedia={this.handleRemoveMedia}
           />
         </div>
         <div className="cms-preview-pane" style={styles.pane}>

src/components/Widgets/ImageControl.js

@@ -12,7 +12,7 @@ export default class ImageControl extends React.Component {
       }
     };
 
-    this.revokeCurrentObjectURL = this.revokeCurrentObjectURL.bind(this);
+    this.revokeCurrentImage = this.revokeCurrentImage.bind(this);
     this.handleChange = this.handleChange.bind(this);
     this.handleFileInputRef = this.handleFileInputRef.bind(this);
     this.handleClick = this.handleClick.bind(this);
@@ -22,11 +22,12 @@ export default class ImageControl extends React.Component {
   }
 
   componentWillUnmount() {
-    this.revokeCurrentObjectURL();
+    this.revokeCurrentImage();
   }
 
-  revokeCurrentObjectURL() {
+  revokeCurrentImage() {
     if (this.state.currentImage.file) {
+      this.props.onRemoveMedia(this.state.currentImage.file);
       window.URL.revokeObjectURL(this.state.currentImage.file);
     }
   }
@@ -52,7 +53,7 @@ export default class ImageControl extends React.Component {
   handleChange(e) {
     e.stopPropagation();
     e.preventDefault();
-    this.revokeCurrentObjectURL();
+    this.revokeCurrentImage();
     let imageRef = null;
     const fileList = e.dataTransfer ? e.dataTransfer.files : e.target.files;
     const files = [...fileList];