fixed crashes on bad media data

diff --git a/src/app/molecules/media/Media.jsx b/src/app/molecules/media/Media.jsx
index 6bbdcfbbbe1beadebdbac595d5fa9bc0fac28eb2..6fc3851771e87eb1a1ff08af1c23e61cf09874bf 100644 (file)
--- a/src/app/molecules/media/Media.jsx
+++ b/src/app/molecules/media/Media.jsx
@@ -137,11 +137,12 @@ function File({
 }
 File.defaultProps = {
   file: null,
+  type: '',
 };
 File.propTypes = {
   name: PropTypes.string.isRequired,
   link: PropTypes.string.isRequired,
-  type: PropTypes.string.isRequired,
+  type: PropTypes.string,
   file: PropTypes.shape({}),
 };
 
@@ -176,6 +177,7 @@ Image.defaultProps = {
   file: null,
   width: null,
   height: null,
+  type: '',
 };
 Image.propTypes = {
   name: PropTypes.string.isRequired,
@@ -183,7 +185,7 @@ Image.propTypes = {
   height: PropTypes.number,
   link: PropTypes.string.isRequired,
   file: PropTypes.shape({}),
-  type: PropTypes.string.isRequired,
+  type: PropTypes.string,
 };
 
 function Audio({
@@ -220,11 +222,12 @@ function Audio({
 }
 Audio.defaultProps = {
   file: null,
+  type: '',
 };
 Audio.propTypes = {
   name: PropTypes.string.isRequired,
   link: PropTypes.string.isRequired,
-  type: PropTypes.string.isRequired,
+  type: PropTypes.string,
   file: PropTypes.shape({}),
 };
 
@@ -287,6 +290,7 @@ Video.defaultProps = {
   height: null,
   file: null,
   thumbnail: null,
+  type: '',
   thumbnailType: null,
   thumbnailFile: null,
 };
@@ -297,7 +301,7 @@ Video.propTypes = {
   width: PropTypes.number,
   height: PropTypes.number,
   file: PropTypes.shape({}),
-  type: PropTypes.string.isRequired,
+  type: PropTypes.string,
   thumbnailFile: PropTypes.shape({}),
   thumbnailType: PropTypes.string,
 };

diff --git a/src/app/organisms/channel/ChannelViewContent.jsx b/src/app/organisms/channel/ChannelViewContent.jsx
index e4eceb6937fb465ecbe3dea142b699730264a799..ad0586c39a8dea39d787438452c704ceb3b2c2ad 100644 (file)
--- a/src/app/organisms/channel/ChannelViewContent.jsx
+++ b/src/app/organisms/channel/ChannelViewContent.jsx
@@ -61,10 +61,15 @@ function isMedia(mE) {
 function genMediaContent(mE) {
   const mx = initMatrix.matrixClient;
   const mContent = mE.getContent();
-  let mediaMXC = mContent.url;
-  let thumbnailMXC = mContent?.info?.thumbnail_url;
+  if (!mContent || !mContent.body) return <span style={{ color: 'var(--bg-danger)' }}>Malformed event</span>;
+
+  let mediaMXC = mContent?.url;
   const isEncryptedFile = typeof mediaMXC === 'undefined';
-  if (isEncryptedFile) mediaMXC = mContent.file.url;
+  if (isEncryptedFile) mediaMXC = mContent?.file?.url;
+
+  let thumbnailMXC = mContent?.info?.thumbnail_url;
+
+  if (typeof mediaMXC === 'undefined' || mediaMXC === '') return <span style={{ color: 'var(--bg-danger)' }}>Malformed event</span>;
 
   switch (mE.getContent()?.msgtype) {
     case 'm.file':
@@ -72,19 +77,19 @@ function genMediaContent(mE) {
         <Media.File
           name={mContent.body}
           link={mx.mxcUrlToHttp(mediaMXC)}
-          file={mContent.file}
-          type={mContent.info.mimetype}
+          type={mContent.info?.mimetype}
+          file={mContent.file || null}
         />
       );
     case 'm.image':
       return (
         <Media.Image
           name={mContent.body}
-          width={mContent.info.w || null}
-          height={mContent.info.h || null}
+          width={typeof mContent.info?.w === 'number' ? mContent.info?.w : null}
+          height={typeof mContent.info?.h === 'number' ? mContent.info?.h : null}
           link={mx.mxcUrlToHttp(mediaMXC)}
           file={isEncryptedFile ? mContent.file : null}
-          type={mContent.info.mimetype}
+          type={mContent.info?.mimetype}
         />
       );
     case 'm.audio':
@@ -92,8 +97,8 @@ function genMediaContent(mE) {
         <Media.Audio
           name={mContent.body}
           link={mx.mxcUrlToHttp(mediaMXC)}
-          type={mContent.info.mimetype}
-          file={mContent.file}
+          type={mContent.info?.mimetype}
+          file={mContent.file || null}
         />
       );
     case 'm.video':
@@ -105,16 +110,16 @@ function genMediaContent(mE) {
           name={mContent.body}
           link={mx.mxcUrlToHttp(mediaMXC)}
           thumbnail={thumbnailMXC === null ? null : mx.mxcUrlToHttp(thumbnailMXC)}
-          thumbnailFile={isEncryptedFile ? mContent.info.thumbnail_file : null}
-          thumbnailType={mContent.info.thumbnail_info?.mimetype || null}
-          width={mContent.info.w || null}
-          height={mContent.info.h || null}
+          thumbnailFile={isEncryptedFile ? mContent.info?.thumbnail_file : null}
+          thumbnailType={mContent.info?.thumbnail_info?.mimetype || null}
+          width={typeof mContent.info?.w === 'number' ? mContent.info?.w : null}
+          height={typeof mContent.info?.h === 'number' ? mContent.info?.h : null}
           file={isEncryptedFile ? mContent.file : null}
-          type={mContent.info.mimetype}
+          type={mContent.info?.mimetype}
         />
       );
     default:
-      return 'Unable to attach media file!';
+      return <span style={{ color: 'var(--bg-danger)' }}>Malformed event</span>;
   }
 }