From a8dff459f332c0b8240d6d61d43e268be3edfd8a Mon Sep 17 00:00:00 2001
From: Jeremy Kahn <me@jeremyckahn.com>
Date: Wed, 5 Jun 2024 08:10:27 -0500
Subject: [PATCH] feat(file-sharing): [closes #308] scale shared images to fit

---
 src/components/Message/InlineMedia.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/Message/InlineMedia.tsx b/src/components/Message/InlineMedia.tsx
index 54851b2..b41b270 100644
--- a/src/components/Message/InlineMedia.tsx
+++ b/src/components/Message/InlineMedia.tsx
@@ -1,5 +1,6 @@
 import { useContext, useEffect, useRef, useState } from 'react'
 import { TorrentFile } from 'webtorrent'
+import Box from '@mui/material/Box'
 import CircularProgress from '@mui/material/CircularProgress'
 import Typography from '@mui/material/Typography'
 
@@ -37,13 +38,13 @@ export const InlineFile = ({ file }: InlineFileProps) => {
   }, [file, containerRef, shellContext.roomId])
 
   return (
-    <div ref={containerRef}>
+    <Box ref={containerRef} sx={{ '& img': { maxWidth: '100%' } }}>
       {didRenderingMediaFail && (
         <Typography sx={{ fontStyle: 'italic' }}>
           Media failed to render
         </Typography>
       )}
-    </div>
+    </Box>
   )
 }