From 32f1554efc46238a8d523121931807ddc6e6db8f Mon Sep 17 00:00:00 2001
From: vladislavkeblysh <138868841+vladislavkeblysh@users.noreply.github.com>
Date: Tue, 20 Feb 2024 13:01:45 +0200
Subject: [PATCH] fix: [AXIMST-488-489] Textbooks: file size and upload
 connection alert (#174)

* fix: [AXIMST-488-489] file size and upload connection alert

* fix: [AXIMST-488-489] refactor after review
---
 src/constants.js                             | 2 ++
 src/generic/modal-dropzone/ModalDropzone.jsx | 4 ++++
 src/textbooks/Textbooks.scss                 | 4 ++++
 src/textbooks/hooks.jsx                      | 2 +-
 src/textbooks/textbook-form/TextbookForm.jsx | 2 ++
 5 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/constants.js b/src/constants.js
index 93c07d4c65..2cdd7433f0 100644
--- a/src/constants.js
+++ b/src/constants.js
@@ -56,3 +56,5 @@ export const COURSE_BLOCK_NAMES = /** @type {const} */ ({
   vertical: { id: 'vertical', name: 'Unit' },
   component: { id: 'component', name: 'Component' },
 });
+
+export const UPLOAD_FILE_MAX_SIZE = 100 * 1024 * 1024; // 100mb
diff --git a/src/generic/modal-dropzone/ModalDropzone.jsx b/src/generic/modal-dropzone/ModalDropzone.jsx
index c853c4a47b..02ee13ceff 100644
--- a/src/generic/modal-dropzone/ModalDropzone.jsx
+++ b/src/generic/modal-dropzone/ModalDropzone.jsx
@@ -27,6 +27,7 @@ const ModalDropzone = ({
   onCancel,
   onChange,
   onSavingStatus,
+  maxSize,
 }) => {
   const {
     intl,
@@ -94,6 +95,7 @@ const ModalDropzone = ({
                   inputComponent={inputComponent}
                   accept={accept}
                   validator={imageValidator}
+                  maxSize={maxSize}
                 />
               )}
             </Card.Body>
@@ -118,6 +120,7 @@ ModalDropzone.defaultProps = {
   imageHelpText: '',
   previewComponent: null,
   imageDropzoneText: '',
+  maxSize: Infinity,
 };
 
 ModalDropzone.propTypes = {
@@ -131,6 +134,7 @@ ModalDropzone.propTypes = {
   onCancel: PropTypes.func.isRequired,
   onChange: PropTypes.func.isRequired,
   onSavingStatus: PropTypes.func.isRequired,
+  maxSize: PropTypes.number,
 };
 
 export default ModalDropzone;
diff --git a/src/textbooks/Textbooks.scss b/src/textbooks/Textbooks.scss
index c26436126e..e8022dd28d 100644
--- a/src/textbooks/Textbooks.scss
+++ b/src/textbooks/Textbooks.scss
@@ -1,3 +1,7 @@
 @import "./empty-placeholder/EmptyPlaceholder";
 @import "./textbook-card/TextbookCard";
 @import "./textbook-form/TextbookForm";
+
+.alert-toast {
+  z-index: $zindex-tooltip !important;
+}
diff --git a/src/textbooks/hooks.jsx b/src/textbooks/hooks.jsx
index d9b96a9704..53a1b85b9e 100644
--- a/src/textbooks/hooks.jsx
+++ b/src/textbooks/hooks.jsx
@@ -4,7 +4,7 @@ import { AppContext } from '@edx/frontend-platform/react';
 import { useIntl } from '@edx/frontend-platform/i18n';
 import { useToggle } from '@edx/paragon';
 
-import { updateSavingStatus } from '../certificates/data/slice';
+import { updateSavingStatus } from './data/slice';
 import { RequestStatus } from '../data/constants';
 import {
   getTextbooksData,
diff --git a/src/textbooks/textbook-form/TextbookForm.jsx b/src/textbooks/textbook-form/TextbookForm.jsx
index 7162a199ca..3ba4f699cc 100644
--- a/src/textbooks/textbook-form/TextbookForm.jsx
+++ b/src/textbooks/textbook-form/TextbookForm.jsx
@@ -21,6 +21,7 @@ import FormikControl from '../../generic/FormikControl';
 import PromptIfDirty from '../../generic/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';
 
@@ -165,6 +166,7 @@ const TextbookForm = ({
               previewComponent={(
                 <Icon src={PdfIcon} className="modal-preview-icon" />
               )}
+              maxSize={UPLOAD_FILE_MAX_SIZE}
             />
             <PromptIfDirty dirty={dirty} />
           </>