diff --git a/web/media/multimedia.react.js b/web/media/multimedia.react.js
index a3f35c0ed..fbe17be72 100644
--- a/web/media/multimedia.react.js
+++ b/web/media/multimedia.react.js
@@ -1,124 +1,125 @@
 // @flow
 
 import classNames from 'classnames';
 import invariant from 'invariant';
 import * as React from 'react';
 import { CircularProgressbar } from 'react-circular-progressbar';
 import 'react-circular-progressbar/dist/styles.css';
 import {
   XCircle as XCircleIcon,
   AlertCircle as AlertCircleIcon,
 } from 'react-feather';
 
 import { type PendingMultimediaUpload } from '../input/input-state';
 import { useModalContext } from '../modals/modal-provider.react';
 import css from './media.css';
 import MultimediaModal from './multimedia-modal.react';
 
 type BaseProps = {
   +uri: string,
   +pendingUpload?: ?PendingMultimediaUpload,
   +remove?: (uploadID: string) => void,
   +multimediaCSSClass: string,
   +multimediaImageCSSClass: string,
 };
 type Props = {
   ...BaseProps,
   +pushModal: (modal: React.Node) => void,
 };
 
 class Multimedia extends React.PureComponent<Props> {
   componentDidUpdate(prevProps: Props) {
     const { uri, pendingUpload } = this.props;
     if (uri === prevProps.uri) {
       return;
     }
     if (
       (!pendingUpload || pendingUpload.uriIsReal) &&
       (!prevProps.pendingUpload || !prevProps.pendingUpload.uriIsReal)
     ) {
       URL.revokeObjectURL(prevProps.uri);
     }
   }
 
   render(): React.Node {
     let progressIndicator, errorIndicator, removeButton;
 
     const { pendingUpload, remove } = this.props;
     if (pendingUpload) {
       const { progressPercent, failed } = pendingUpload;
 
       if (progressPercent !== 0 && progressPercent !== 1) {
         const outOfHundred = Math.floor(progressPercent * 100);
         const text = `${outOfHundred}%`;
         progressIndicator = (
           <CircularProgressbar
             value={outOfHundred}
             text={text}
             background
             backgroundPadding={6}
             className={css.progressIndicator}
           />
         );
       }
 
       if (failed) {
         errorIndicator = (
           <AlertCircleIcon className={css.uploadError} size={36} />
         );
       }
 
       if (remove) {
         removeButton = (
           <XCircleIcon onClick={this.remove} className={css.removeUpload} />
         );
       }
     }
 
     const imageContainerClasses = [
       css.multimediaImage,
       this.props.multimediaImageCSSClass,
     ];
     imageContainerClasses.push(css.clickable);
 
     const containerClasses = [css.multimedia, this.props.multimediaCSSClass];
     return (
       <span className={classNames(containerClasses)}>
         <span
           className={classNames(imageContainerClasses)}
           onClick={this.onClick}
         >
           <img src={this.props.uri} />
           {removeButton}
         </span>
         {progressIndicator}
         {errorIndicator}
       </span>
     );
   }
 
-  remove: () => void = () => {
+  remove: (event: SyntheticEvent<HTMLElement>) => void = event => {
+    event.stopPropagation();
     const { remove, pendingUpload } = this.props;
     invariant(
       remove && pendingUpload,
       'Multimedia cannot be removed as either remove or pendingUpload ' +
         'are unspecified',
     );
     remove(pendingUpload.localID);
   };
 
   onClick: (event: SyntheticEvent<HTMLSpanElement>) => void = event => {
     event.stopPropagation();
 
     const { pushModal, uri } = this.props;
     pushModal(<MultimediaModal uri={uri} />);
   };
 }
 
 function ConnectedMultimediaContainer(props: BaseProps): React.Node {
   const modalContext = useModalContext();
 
   return <Multimedia {...props} pushModal={modalContext.pushModal} />;
 }
 
 export default ConnectedMultimediaContainer;