Override upload file max size in mb

src/constants.js

@@ -1,3 +1,5 @@
+import { getConfig } from '@edx/frontend-platform';
+
 export const DATE_FORMAT = 'MM/dd/yyyy';
 export const TIME_FORMAT = 'HH:mm';
 export const DATE_TIME_FORMAT = 'YYYY-MM-DDTHH:mm:ss\\Z';
@@ -52,7 +54,16 @@ export const DECODED_ROUTES = {
   ],
 };
 
-export const UPLOAD_FILE_MAX_SIZE = 20 * 1024 * 1024; // 100mb
+// FilesUpload page - Default max size: 20MB else use env override if exists and valid number
+const DEFAULT_UPLOAD_FILE_MAX_SIZE = 20 * 1024 * 1024; // 20 MB
+
+export const getUploadFileMaxSize = () => {
+  const config = getConfig();
+  const overrideMaxFileSizeMB = parseInt(config.OVERRIDE_UPLOAD_FILE_MAX_SIZE_IN_MB, 10);
+  return !Number.isNaN(overrideMaxFileSizeMB) && overrideMaxFileSizeMB > 0
+    ? overrideMaxFileSizeMB * 1024 * 1024
+    : DEFAULT_UPLOAD_FILE_MAX_SIZE;
+};
 
 export const COURSE_BLOCK_NAMES = ({
   chapter: { id: 'chapter', name: 'Section' },

src/files-and-videos/files-page/FilesPage.jsx

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import { useDispatch, useSelector } from 'react-redux';
 import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n';
 import { CheckboxFilter, Container } from '@openedx/paragon';
+import { getUploadFileMaxSize } from '@src/constants';
 import Placeholder from '../../editors/Placeholder';
 
 import { RequestStatus } from '../../data/constants';
@@ -90,7 +91,7 @@ const FilesPage = ({
     usageErrorMessages: errorMessages.usageMetrics,
     fileType: 'file',
   };
-  const maxFileSize = 20 * 1048576;
+  const maxFileSize = getUploadFileMaxSize();
 
   const activeColumn = {
     id: 'activeStatus',

src/generic/modal-dropzone/ModalDropzone.jsx

@@ -13,9 +13,9 @@ import {
 } from '@openedx/paragon';
 import { FileUpload as FileUploadIcon } from '@openedx/paragon/icons';
 
+import { getUploadFileMaxSize } from '@src/constants';
 import useModalDropzone from './useModalDropzone';
 import messages from './messages';
-import { UPLOAD_FILE_MAX_SIZE } from '../../constants';
 
 const ModalDropzone = ({
   fileTypes,
@@ -30,7 +30,7 @@ const ModalDropzone = ({
   onChange,
   onSavingStatus,
   onSelectFile,
-  maxSize = UPLOAD_FILE_MAX_SIZE,
+  maxSize,
 }) => {
   const {
     intl,
@@ -48,7 +48,7 @@ const ModalDropzone = ({
 
   const invalidSizeMore = invalidFileSizeMore || intl.formatMessage(
     messages.uploadImageDropzoneInvalidSizeMore,
-    { maxSize: maxSize / (1000 * 1000) },
+    { maxSize: (maxSize || getUploadFileMaxSize()) / (1024 * 1024) },
   );
 
   const inputComponent = previewUrl ? (
@@ -129,7 +129,7 @@ ModalDropzone.defaultProps = {
   imageHelpText: '',
   previewComponent: null,
   imageDropzoneText: '',
-  maxSize: UPLOAD_FILE_MAX_SIZE,
+  maxSize: '',
   invalidFileSizeMore: '',
   onSelectFile: null,
 };

src/textbooks/textbook-form/TextbookForm.jsx

@@ -17,11 +17,11 @@ import {
   useToggle,
 } from '@openedx/paragon';
 
+import { getUploadFileMaxSize } from '@src/constants';
 import FormikControl from '../../generic/FormikControl';
 import PromptIfDirty from '../../generic/prompt-if-dirty/PromptIfDirty';
 import ModalDropzone from '../../generic/modal-dropzone/ModalDropzone';
 import { useModel } from '../../generic/model-store';
-import { UPLOAD_FILE_MAX_SIZE } from '../../constants';
 import textbookFormValidationSchema from './validations';
 import messages from './messages';
 
@@ -171,7 +171,7 @@ const TextbookForm = ({
               onSavingStatus={onSavingStatus}
               invalidFileSizeMore={intl.formatMessage(
                 messages.uploadModalFileInvalidSizeText,
-                { maxSize: UPLOAD_FILE_MAX_SIZE / (1000 * 1000) },
+                { maxSize: getUploadFileMaxSize() / (1024 * 1024) },
               )}
               onSelectFile={setSelectedFile}
               previewComponent={(
@@ -180,7 +180,7 @@ const TextbookForm = ({
                   <span className="modal-preview-text">{selectedFile}</span>
                 </div>
               )}
-              maxSize={UPLOAD_FILE_MAX_SIZE}
+              maxSize={getUploadFileMaxSize()}
             />
             <PromptIfDirty dirty={dirty} />
           </>