diff --git a/src/components/views/messages/MAudioBody.tsx b/src/components/views/messages/MAudioBody.tsx index 26982f242f9..3444c2a3d03 100644 --- a/src/components/views/messages/MAudioBody.tsx +++ b/src/components/views/messages/MAudioBody.tsx @@ -97,7 +97,7 @@ export default class MAudioBody extends React.PureComponent return ( - {/**/} + { this.props.tileShape && } ); } diff --git a/src/components/views/messages/MFileBody.tsx b/src/components/views/messages/MFileBody.tsx index e0a1119b621..6f81e4ae109 100644 --- a/src/components/views/messages/MFileBody.tsx +++ b/src/components/views/messages/MFileBody.tsx @@ -15,18 +15,15 @@ limitations under the License. */ import React, { createRef } from 'react'; -import PropTypes from 'prop-types'; import filesize from 'filesize'; import { _t } from '../../../languageHandler'; -import { decryptFile } from '../../../utils/DecryptFile'; import Modal from '../../../Modal'; import AccessibleButton from "../elements/AccessibleButton"; import { replaceableComponent } from "../../../utils/replaceableComponent"; import { mediaFromContent } from "../../../customisations/Media"; import ErrorDialog from "../dialogs/ErrorDialog"; import { TileShape } from "../rooms/EventTile"; -import { IContent, MatrixEvent } from "matrix-js-sdk/src"; -import { MediaEventHelper } from "../../../utils/MediaEventHelper"; +import { IContent } from "matrix-js-sdk/src"; import { IMediaEventContent } from "../../../customisations/models/IMediaEventContent"; import { IBodyProps } from "./IBodyProps"; @@ -181,6 +178,8 @@ export default class MFileBody extends React.Component { ); } + const showDownloadLink = this.props.tileShape || !this.props.showGenericPlaceholder; + if (isEncrypted) { if (!this.state.decryptedBlob) { // Need to decrypt the attachment @@ -205,12 +204,12 @@ export default class MFileBody extends React.Component { // but it is not guaranteed between various browsers' settings. return ( - {placeholder} -
+ { placeholder } + { showDownloadLink &&
{ _t("Decrypt %(text)s", { text: text }) } -
+
}
); } @@ -237,8 +236,8 @@ export default class MFileBody extends React.Component { // If the attachment is encrypted then put the link inside an iframe. return ( - {placeholder} -
+ { placeholder } + { showDownloadLink &&
{ /* * Add dummy copy of the "a" tag @@ -252,7 +251,7 @@ export default class MFileBody extends React.Component { onLoad={onIframeLoad} ref={this.iframe} sandbox="allow-scripts allow-downloads allow-downloads-without-user-activation" /> -
+
} ); } else if (contentUrl) { @@ -300,40 +299,24 @@ export default class MFileBody extends React.Component { downloadProps["download"] = fileName; } - // If the attachment is not encrypted then we check whether we - // are being displayed in the room timeline or in a list of - // files in the right hand side of the screen. - if (this.props.tileShape === TileShape.FileGrid) { - return ( - - {placeholder} -
- - { fileName } - -
- { content.info && content.info.size ? filesize(content.info.size) : "" } -
-
-
- ); - } else { - return ( - - {placeholder} - - - ); - } + return ( + + { placeholder } + { showDownloadLink &&
+ + + { _t("Download %(text)s", { text: text }) } + + { this.props.tileShape === TileShape.FileGrid &&
+ { content.info && content.info.size ? filesize(content.info.size) : "" } +
} +
} +
+ ); } else { const extra = text ? (': ' + text) : ''; return - {placeholder} + { placeholder } { _t("Invalid file%(extra)s", { extra: extra }) } ; } diff --git a/src/components/views/messages/MImageBody.tsx b/src/components/views/messages/MImageBody.tsx index a6e9816e355..bb1ddd6dc60 100644 --- a/src/components/views/messages/MImageBody.tsx +++ b/src/components/views/messages/MImageBody.tsx @@ -415,7 +415,10 @@ export default class MImageBody extends React.Component { // Overidden by MStickerBody protected getFileBody(): JSX.Element { - return ; + // We only ever need the download bar if we're appearing outside of the timeline + if (this.props.tileShape) { + return ; + } } render() { diff --git a/src/components/views/messages/MVideoBody.tsx b/src/components/views/messages/MVideoBody.tsx index e58e3ef3c03..6121a237526 100644 --- a/src/components/views/messages/MVideoBody.tsx +++ b/src/components/views/messages/MVideoBody.tsx @@ -25,6 +25,7 @@ import { mediaFromContent } from "../../../customisations/Media"; import { BLURHASH_FIELD } from "../../../ContentMessages"; import { IMediaEventContent } from "../../../customisations/models/IMediaEventContent"; import { IBodyProps } from "./IBodyProps"; +import MFileBody from "./MFileBody"; interface IState { decryptedUrl?: string; @@ -268,7 +269,7 @@ export default class MVideoBody extends React.PureComponent onPlay={this.videoOnPlay} > - {/**/} + { this.props.tileShape && } ); } diff --git a/src/components/views/messages/MVoiceMessageBody.tsx b/src/components/views/messages/MVoiceMessageBody.tsx index 65426cdad22..cfa4d145dc4 100644 --- a/src/components/views/messages/MVoiceMessageBody.tsx +++ b/src/components/views/messages/MVoiceMessageBody.tsx @@ -20,6 +20,7 @@ import InlineSpinner from '../elements/InlineSpinner'; import { _t } from "../../../languageHandler"; import RecordingPlayback from "../audio_messages/RecordingPlayback"; import MAudioBody from "./MAudioBody"; +import MFileBody from "./MFileBody"; @replaceableComponent("views.messages.MVoiceMessageBody") export default class MVoiceMessageBody extends MAudioBody { @@ -50,7 +51,7 @@ export default class MVoiceMessageBody extends MAudioBody { return ( - {/**/} + { this.props.tileShape && } ); }