diff --git a/app/components/file_attachment_list/file_attachment_document.js b/app/components/file_attachment_list/file_attachment_document.js
index eca1778a8..6911bfa2f 100644
--- a/app/components/file_attachment_list/file_attachment_document.js
+++ b/app/components/file_attachment_list/file_attachment_document.js
@@ -37,6 +37,8 @@ const TEXT_PREVIEW_FORMATS = [
'text/plain',
];
+const circularProgressWidth = 4;
+
export default class FileAttachmentDocument extends PureComponent {
static propTypes = {
canDownloadFiles: PropTypes.bool.isRequired,
@@ -280,18 +282,11 @@ export default class FileAttachmentDocument extends PureComponent {
};
renderProgress = () => {
- const {iconHeight, iconWidth, file, theme, wrapperWidth} = this.props;
+ const {wrapperWidth} = this.props;
return (
-
+ {this.renderFileAttachmentIcon()}
);
};
@@ -338,8 +333,23 @@ export default class FileAttachmentDocument extends PureComponent {
);
};
- render() {
+ renderFileAttachmentIcon = () => {
const {iconHeight, iconWidth, file, theme, wrapperHeight, wrapperWidth} = this.props;
+
+ return (
+
+ );
+ }
+
+ render() {
+ const {theme, wrapperHeight} = this.props;
const {downloading, progress} = this.state;
let fileAttachmentComponent;
@@ -348,7 +358,7 @@ export default class FileAttachmentDocument extends PureComponent {
);
} else {
- fileAttachmentComponent = (
-
- );
+ fileAttachmentComponent = this.renderFileAttachmentIcon();
}
return (
- {fileAttachmentComponent}
+
+ {fileAttachmentComponent}
+
);
}
@@ -382,8 +385,11 @@ const style = StyleSheet.create({
alignItems: 'center',
height: '100%',
justifyContent: 'center',
- left: 0,
+ left: -circularProgressWidth,
position: 'absolute',
top: 0,
},
+ whiteBackgroud: {
+ 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 95e6a7791..a84371c0f 100644
--- a/app/components/file_attachment_list/file_attachment_icon.js
+++ b/app/components/file_attachment_list/file_attachment_icon.js
@@ -88,7 +88,6 @@ const styles = StyleSheet.create({
fileIconWrapper: {
alignItems: 'center',
justifyContent: 'center',
- backgroundColor: '#fff',
borderTopLeftRadius: 2,
borderBottomLeftRadius: 2,
},