Merge pull request #4269 from rushatgabhane/prevent-large-attachment

Expensify · Jul 29, 2021 · 470d9de · 470d9de
2 parents b08f80f + 6a629da
commit 470d9de
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 0 deletions.
diff --git a/src/CONST.js b/src/CONST.js
diff --git a/src/components/AttachmentModal.js b/src/components/AttachmentModal.js
@@ -2,6 +2,7 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import {View} from 'react-native';
 import Str from 'expensify-common/lib/str';
+import lodashGet from 'lodash/get';
 import CONST from '../CONST';
 import Modal from './Modal';
 import AttachmentView from './AttachmentView';
@@ -14,6 +15,7 @@ import Button from './Button';
 import HeaderWithCloseButton from './HeaderWithCloseButton';
 import fileDownload from '../libs/fileDownload';
 import withLocalize, {withLocalizePropTypes} from './withLocalize';
+import ConfirmModal from './ConfirmModal';
 
 /**
  * Modal render prop component that exposes modal launching triggers that can be used
@@ -58,11 +60,14 @@ class AttachmentModal extends PureComponent {
 
         this.state = {
             isModalOpen: false,
+            isConfirmModalOpen: false,
             file: null,
             sourceURL: props.sourceURL,
         };
 
         this.submitAndClose = this.submitAndClose.bind(this);
+        this.closeConfirmModal = this.closeConfirmModal.bind(this);
+        this.isValidSize = this.isValidSize.bind(this);
     }
 
     /**
@@ -81,6 +86,22 @@ class AttachmentModal extends PureComponent {
         this.setState({isModalOpen: false});
     }
 
+    /**
+     * Close the confirm modal.
+     */
+    closeConfirmModal() {
+        this.setState({isConfirmModalOpen: false});
+    }
+
+    /**
+     * Check if the attachment size is less than the API size limit.
+     * @param {Object} file
+     * @returns {Boolean}
+     */
+    isValidSize(file) {
+        return !file || lodashGet(file, 'size', 0) < CONST.API_MAX_ATTACHMENT_SIZE;
+    }
+
     render() {
         const sourceURL = this.props.isAuthTokenRequired
             ? addEncryptedAuthTokenToURL(this.state.sourceURL)
@@ -134,8 +155,20 @@ class AttachmentModal extends PureComponent {
                         />
                     )}
                 </Modal>
+                <ConfirmModal
+                    title={this.props.translate('attachmentPicker.attachmentTooLarge')}
+                    onConfirm={this.closeConfirmModal}
+                    isVisible={this.state.isConfirmModalOpen}
+                    prompt={this.props.translate('attachmentPicker.sizeExceeded')}
+                    confirmText={this.props.translate('common.close')}
+                    shouldShowCancelButton={false}
+                />
                 {this.props.children({
                     displayFileInModal: ({file}) => {
+                        if (!this.isValidSize(file)) {
+                            this.setState({isConfirmModalOpen: true});
+                            return;
+                        }
                         if (file instanceof File) {
                             const source = URL.createObjectURL(file);
                             this.setState({isModalOpen: true, sourceURL: source, file});

diff --git a/src/languages/en.js b/src/languages/en.js
@@ -70,6 +70,8 @@ export default {
         takePhoto: 'Take Photo',
         chooseFromGallery: 'Choose from Gallery',
         chooseDocument: 'Choose Document',
+        attachmentTooLarge: 'Attachment too large',
+        sizeExceeded: 'Attachment size is larger than 50 MB limit.',
     },
     textInputFocusable: {
         noExtentionFoundForMimeType: 'No extension found for mime type',

diff --git a/src/languages/es.js b/src/languages/es.js
@@ -65,6 +65,8 @@ export default {
         takePhoto: 'Hacer una Foto',
         chooseFromGallery: 'Elegir de la galería',
         chooseDocument: 'Elegir Documento',
+        attachmentTooLarge: 'Archivo adjunto demasiado grande',
+        sizeExceeded: 'El archivo adjunto supera el límite de 50 MB.',
     },
     textInputFocusable: {
         noExtentionFoundForMimeType: 'No se encontró una extension para este tipo de contenido',