Allow the media modal to be closed by pressing back (#7934)

1 files changed, 16 insertions, 0 deletions

diff --git a/app/javascript/mastodon/features/ui/components/media_modal.js b/app/javascript/mastodon/features/ui/components/media_modal.js
index f4d6b5c4e..c154da89a 100644
--- a/app/javascript/mastodon/features/ui/components/media_modal.js
+++ b/app/javascript/mastodon/features/ui/components/media_modal.js
@@ -16,6 +16,8 @@ const messages = defineMessages({
   next: { id: 'lightbox.next', defaultMessage: 'Next' },
 });
 
+const previewState = 'previewMediaModal';
+
 @injectIntl
 export default class MediaModal extends ImmutablePureComponent {
 
@@ -26,6 +28,10 @@ export default class MediaModal extends ImmutablePureComponent {
     intl: PropTypes.object.isRequired,
   };
 
+  static contextTypes = {
+    router: PropTypes.object,
+  };
+
   state = {
     index: null,
     navigationHidden: false,
@@ -61,10 +67,20 @@ export default class MediaModal extends ImmutablePureComponent {
 
   componentDidMount () {
     window.addEventListener('keyup', this.handleKeyUp, false);
+    const history = this.context.router.history;
+    history.push(history.location.pathname, previewState);
+    this.unlistenHistory = history.listen(() => {
+      this.props.onClose();
+    });
   }
 
   componentWillUnmount () {
     window.removeEventListener('keyup', this.handleKeyUp);
+    this.unlistenHistory();
+
+    if (this.context.router.history.location.state === previewState) {
+      this.context.router.history.goBack();
+    }
   }
 
   getIndex () {