diff --git a/app/components/file_attachment_list/file_attachment_document.js b/app/components/file_attachment_list/file_attachment_document.js index 69d7d0b0b..398e837bb 100644 --- a/app/components/file_attachment_list/file_attachment_document.js +++ b/app/components/file_attachment_list/file_attachment_document.js @@ -30,17 +30,17 @@ import LocalConfig from 'assets/config'; import FileAttachmentIcon from './file_attachment_icon'; const {DOCUMENTS_PATH} = DeviceTypes; - +const DOWNLOADING_OFFSET = 28; const TEXT_PREVIEW_FORMATS = [ 'application/json', 'application/x-x509-ca-cert', 'text/plain', ]; - const circularProgressWidth = 4; export default class FileAttachmentDocument extends PureComponent { static propTypes = { + backgroundColor: PropTypes.string, canDownloadFiles: PropTypes.bool.isRequired, iconHeight: PropTypes.number, iconWidth: PropTypes.number, @@ -335,16 +335,25 @@ export default class FileAttachmentDocument extends PureComponent { }; renderFileAttachmentIcon = () => { - const {iconHeight, iconWidth, file, theme, wrapperHeight, wrapperWidth} = this.props; + const {backgroundColor, iconHeight, iconWidth, file, theme, wrapperHeight, wrapperWidth} = this.props; + const {downloading} = this.state; + let height = wrapperHeight; + let width = wrapperWidth; + + if (downloading) { + height -= DOWNLOADING_OFFSET; + width -= DOWNLOADING_OFFSET; + } return ( ); } @@ -376,9 +385,7 @@ export default class FileAttachmentDocument extends PureComponent { onPress={this.handlePreviewPress} onLongPress={onLongPress} > - - {fileAttachmentComponent} - + {fileAttachmentComponent} ); } @@ -393,7 +400,4 @@ const style = StyleSheet.create({ position: 'absolute', top: 0, }, - whiteBackground: { - backgroundColor: '#fff', - }, }); diff --git a/app/components/file_attachment_list/file_attachment_icon.js b/app/components/file_attachment_list/file_attachment_icon.js index ec2ea5393..0c84b0282 100644 --- a/app/components/file_attachment_list/file_attachment_icon.js +++ b/app/components/file_attachment_list/file_attachment_icon.js @@ -37,6 +37,7 @@ const ICON_PATH_FROM_FILE_TYPE = { export default class FileAttachmentIcon extends PureComponent { static propTypes = { + backgroundColor: PropTypes.string, file: PropTypes.object.isRequired, iconHeight: PropTypes.number, iconWidth: PropTypes.number, @@ -46,6 +47,7 @@ export default class FileAttachmentIcon extends PureComponent { }; static defaultProps = { + backgroundColor: '#fff', iconHeight: 60, iconWidth: 60, wrapperHeight: 80, @@ -66,13 +68,13 @@ export default class FileAttachmentIcon extends PureComponent { }; render() { - const {file, iconHeight, iconWidth, wrapperHeight, wrapperWidth} = this.props; + const {backgroundColor, file, iconHeight, iconWidth, wrapperHeight, wrapperWidth} = this.props; const source = this.getFileIconPath(file); return ( { this.documents[this.state.index] = ref; }} + backgroundColor='transparent' canDownloadFiles={canDownloadFiles} file={file} - theme={theme} + iconHeight={100} + iconWidth={100} navigator={navigator} - iconHeight={120} - iconWidth={120} + theme={theme} wrapperHeight={200} wrapperWidth={200} /> @@ -198,10 +199,11 @@ export default class ImagePreview extends PureComponent { return (