Merge branch 'fix-chat-attachments' into 'develop'

Normalize chat attachments

See merge request soapbox-pub/soapbox!1824

app/soapbox/components/media_gallery.tsx

@@ -263,14 +263,13 @@ const Item: React.FC<IItem> = ({
 interface IMediaGallery {
   sensitive?: boolean,
   media: ImmutableList<Attachment>,
-  size: number,
   height: number,
   onOpenMedia: (media: ImmutableList<Attachment>, index: number) => void,
-  defaultWidth: number,
-  cacheWidth: (width: number) => void,
+  defaultWidth?: number,
+  cacheWidth?: (width: number) => void,
   visible?: boolean,
   onToggleVisibility?: () => void,
-  displayMedia: string,
+  displayMedia?: string,
   compact: boolean,
 }
 
@@ -278,7 +277,7 @@ const MediaGallery: React.FC<IMediaGallery> = (props) => {
   const {
     media,
     sensitive = false,
-    defaultWidth,
+    defaultWidth = 0,
     onToggleVisibility,
     onOpenMedia,
     cacheWidth,

app/soapbox/features/chats/components/chat-message-list.tsx

@@ -178,6 +178,7 @@ const ChatMessageList: React.FC<IChatMessageList> = ({ chatId, chatMessageIds, a
               media={ImmutableList([attachment])}
               height={120}
               onOpenMedia={onOpenMedia}
+              visible
             />
           )}
         </Bundle>

app/soapbox/normalizers/chat_message.ts

@@ -5,6 +5,8 @@ import {
   fromJS,
 } from 'immutable';
 
+import { normalizeAttachment } from 'soapbox/normalizers/attachment';
+
 import type { Attachment, Card, Emoji } from 'soapbox/types/entities';
 
 export const ChatMessageRecord = ImmutableRecord({
@@ -22,8 +24,14 @@ export const ChatMessageRecord = ImmutableRecord({
   pending: false,
 });
 
+const normalizeMedia = (status: ImmutableMap<string, any>) => {
+  return status.update('attachment', null, normalizeAttachment);
+};
+
 export const normalizeChatMessage = (chatMessage: Record<string, any>) => {
   return ChatMessageRecord(
-    ImmutableMap(fromJS(chatMessage)),
+    ImmutableMap(fromJS(chatMessage)).withMutations(chatMessage => {
+      normalizeMedia(chatMessage);
+    }),
   );
 };