diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js
index 945488a846c..6c5a37d6d6e 100644
--- a/js/views/conversation_view.js
+++ b/js/views/conversation_view.js
@@ -588,29 +588,44 @@
         WhisperMessageCollection,
       });
 
-      const loadMessages = Signal.Components.PropTypes.Message
+      const loadMessages = Signal.Components.Types.Message
         .loadWithObjectURL(Signal.Migrations.loadMessage);
       const media = await loadMessages(rawMedia);
 
-      const mediaGalleryProps = {
-        media,
-        documents,
-        onItemClick: ({ message }) => {
-          const lightboxProps = {
-            imageURL: message.objectURL,
-          };
-          this.lightboxView = new Whisper.ReactWrapperView({
-            Component: Signal.Components.Lightbox,
-            props: lightboxProps,
-            onClose: () => Signal.Backbone.Views.Lightbox.hide(),
-          });
-          Signal.Backbone.Views.Lightbox.show(this.lightboxView.el);
-        },
+      const onItemClick = async ({ message, type }) => {
+        switch (type) {
+          case 'documents': {
+            const loadedMessage = await Signal.Migrations.loadMessage(message);
+            const attachment = loadedMessage.attachments[0];
+            const timestamp = loadedMessage.received_at;
+            Signal.Types.AttachmentTS.save({ attachment, timestamp });
+            break;
+          }
+
+          case 'media': {
+            this.lightboxView = new Whisper.ReactWrapperView({
+              Component: Signal.Components.Lightbox,
+              props: {
+                imageURL: message.objectURL,
+              },
+              onClose: () => Signal.Backbone.Views.Lightbox.hide(),
+            });
+            Signal.Backbone.Views.Lightbox.show(this.lightboxView.el);
+            break;
+          }
+
+          default:
+            throw new TypeError(`Unknown attachment type: '${type}'`);
+        }
       };
 
       const view = new Whisper.ReactWrapperView({
         Component: Signal.Components.MediaGallery,
-        props: mediaGalleryProps,
+        props: {
+          documents,
+          media,
+          onItemClick,
+        },
         onClose: () => this.resetPanel(),
       });
 
diff --git a/preload.js b/preload.js
index 9316fe77805..d64af857368 100644
--- a/preload.js
+++ b/preload.js
@@ -169,14 +169,14 @@ const { MediaGallery } =
   require('./ts/components/conversation/media-gallery/MediaGallery');
 const { Quote } = require('./ts/components/conversation/Quote');
 
-const PropTypesMessage =
-  require('./ts/components/conversation/media-gallery/propTypes/Message');
+const MediaGalleryMessage =
+  require('./ts/components/conversation/media-gallery/types/Message');
 
 window.Signal.Components = {
   Lightbox,
   MediaGallery,
-  PropTypes: {
-    Message: PropTypesMessage,
+  Types: {
+    Message: MediaGalleryMessage,
   },
   Quote,
 };
diff --git a/ts/components/conversation/media-gallery/AttachmentSection.tsx b/ts/components/conversation/media-gallery/AttachmentSection.tsx
index d625692dbad..1f0ee74435c 100644
--- a/ts/components/conversation/media-gallery/AttachmentSection.tsx
+++ b/ts/components/conversation/media-gallery/AttachmentSection.tsx
@@ -3,10 +3,11 @@
  */
 import React from 'react';
 
+import { AttachmentType } from './types/AttachmentType';
 import { DocumentListItem } from './DocumentListItem';
-import { ItemClickEvent } from './events/ItemClickEvent';
+import { ItemClickEvent } from './types/ItemClickEvent';
 import { MediaGridItem } from './MediaGridItem';
-import { Message } from './propTypes/Message';
+import { Message } from './types/Message';
 import { missingCaseError } from '../../../util/missingCaseError';
 
 const styles = {
@@ -30,7 +31,7 @@ const styles = {
 interface Props {
   i18n: (value: string) => string;
   header?: string;
-  type: 'media' | 'documents';
+  type: AttachmentType;
   messages: Array<Message>;
   onItemClick?: (event: ItemClickEvent) => void;
 }
@@ -82,11 +83,11 @@ export class AttachmentSection extends React.Component<Props, {}> {
   }
 
   private createClickHandler = (message: Message) => () => {
-    const { onItemClick } = this.props;
+    const { onItemClick, type } = this.props;
     if (!onItemClick) {
       return;
     }
 
-    onItemClick({ message });
+    onItemClick({ type, message });
   };
 }
diff --git a/ts/components/conversation/media-gallery/MediaGallery.tsx b/ts/components/conversation/media-gallery/MediaGallery.tsx
index 17db10b0ecc..7a1a1b18c46 100644
--- a/ts/components/conversation/media-gallery/MediaGallery.tsx
+++ b/ts/components/conversation/media-gallery/MediaGallery.tsx
@@ -6,11 +6,10 @@ import React from 'react';
 import moment from 'moment';
 
 import { AttachmentSection } from './AttachmentSection';
+import { AttachmentType } from './types/AttachmentType';
 import { groupMessagesByDate } from './groupMessagesByDate';
-import { ItemClickEvent } from './events/ItemClickEvent';
-import { Message } from './propTypes/Message';
-
-type AttachmentType = 'media' | 'documents';
+import { ItemClickEvent } from './types/ItemClickEvent';
+import { Message } from './types/Message';
 
 interface Props {
   documents: Array<Message>;
diff --git a/ts/components/conversation/media-gallery/MediaGridItem.tsx b/ts/components/conversation/media-gallery/MediaGridItem.tsx
index 1dd5aeb394c..bbb5db27a90 100644
--- a/ts/components/conversation/media-gallery/MediaGridItem.tsx
+++ b/ts/components/conversation/media-gallery/MediaGridItem.tsx
@@ -3,7 +3,7 @@
  */
 import React from 'react';
 
-import { Message } from './propTypes/Message';
+import { Message } from './types/Message';
 
 interface Props {
   message: Message;
diff --git a/ts/components/conversation/media-gallery/events/ItemClickEvent.tsx b/ts/components/conversation/media-gallery/events/ItemClickEvent.tsx
deleted file mode 100644
index a53e0c2bb85..00000000000
--- a/ts/components/conversation/media-gallery/events/ItemClickEvent.tsx
+++ /dev/null
@@ -1,8 +0,0 @@
-/**
- * @prettier
- */
-import { Message } from '../propTypes/Message';
-
-export interface ItemClickEvent {
-  message: Message;
-}
diff --git a/ts/components/conversation/media-gallery/groupMessagesByDate.ts b/ts/components/conversation/media-gallery/groupMessagesByDate.ts
index 02fc6ea39aa..7b34d225010 100644
--- a/ts/components/conversation/media-gallery/groupMessagesByDate.ts
+++ b/ts/components/conversation/media-gallery/groupMessagesByDate.ts
@@ -4,7 +4,7 @@
 import moment from 'moment';
 import { compact, groupBy, sortBy } from 'lodash';
 
-import { Message } from './propTypes/Message';
+import { Message } from './types/Message';
 // import { missingCaseError } from '../../../util/missingCaseError';
 
 type StaticSectionType = 'today' | 'yesterday' | 'thisWeek' | 'thisMonth';
diff --git a/ts/components/conversation/media-gallery/types/AttachmentType.ts b/ts/components/conversation/media-gallery/types/AttachmentType.ts
new file mode 100644
index 00000000000..1bd5deba9c1
--- /dev/null
+++ b/ts/components/conversation/media-gallery/types/AttachmentType.ts
@@ -0,0 +1,4 @@
+/**
+ * @prettier
+ */
+export type AttachmentType = 'media' | 'documents';
diff --git a/ts/components/conversation/media-gallery/types/ItemClickEvent.tsx b/ts/components/conversation/media-gallery/types/ItemClickEvent.tsx
new file mode 100644
index 00000000000..1bb410aa959
--- /dev/null
+++ b/ts/components/conversation/media-gallery/types/ItemClickEvent.tsx
@@ -0,0 +1,10 @@
+/**
+ * @prettier
+ */
+import { AttachmentType } from './AttachmentType';
+import { Message } from './Message';
+
+export interface ItemClickEvent {
+  message: Message;
+  type: AttachmentType;
+}
diff --git a/ts/components/conversation/media-gallery/propTypes/Message.tsx b/ts/components/conversation/media-gallery/types/Message.tsx
similarity index 100%
rename from ts/components/conversation/media-gallery/propTypes/Message.tsx
rename to ts/components/conversation/media-gallery/types/Message.tsx
diff --git a/ts/test/components/media-gallery/groupMessagesByDate.ts b/ts/test/components/media-gallery/groupMessagesByDate.ts
index 050e915125c..85ed5e499eb 100644
--- a/ts/test/components/media-gallery/groupMessagesByDate.ts
+++ b/ts/test/components/media-gallery/groupMessagesByDate.ts
@@ -10,7 +10,7 @@ import {
   groupMessagesByDate,
   Section,
 } from '../../../components/conversation/media-gallery/groupMessagesByDate';
-import { Message } from '../../../components/conversation/media-gallery/propTypes/Message';
+import { Message } from '../../../components/conversation/media-gallery/types/Message';
 
 const toMessage = (date: Date): Message => ({
   id: date.toUTCString(),