diff --git a/ui/js/component/video/index.js b/ui/js/component/video/index.js
index 160816cef..3c80869dc 100644
--- a/ui/js/component/video/index.js
+++ b/ui/js/component/video/index.js
@@ -2,7 +2,7 @@ import React from "react";
 import { connect } from "react-redux";
 import { doChangeVolume } from "actions/app";
 import { selectVolume } from "selectors/app";
-import { doPlayUri } from "actions/content";
+import { doPlayUri, doSetPlayingUri } from "actions/content";
 import {
   makeSelectMetadataForUri,
   makeSelectContentTypeForUri,
@@ -31,6 +31,7 @@ const select = (state, props) => ({
 
 const perform = dispatch => ({
   play: uri => dispatch(doPlayUri(uri)),
+  cancelPlay: () => dispatch(doSetPlayingUri(null)),
   changeVolume: volume => dispatch(doChangeVolume(volume)),
 });
 
diff --git a/ui/js/component/video/view.jsx b/ui/js/component/video/view.jsx
index 0e6c35c6a..fb1bd3420 100644
--- a/ui/js/component/video/view.jsx
+++ b/ui/js/component/video/view.jsx
@@ -13,6 +13,10 @@ class Video extends React.PureComponent {
     };
   }
 
+  componentWillUnmount() {
+    this.props.cancelPlay();
+  }
+
   isMediaSame(nextProps) {
     return (
       this.props.fileInfo &&