[CP-2086]The user can decline to upload files to the File Manager if …

…they select more files than they can add within the limit [Harmony] (#1390)

packages/app/src/__deprecated__/renderer/locales/default/en-US.json

@@ -420,8 +420,9 @@
   "module.filesManager.panelSearchPlaceholder": "Search music files",
   "module.filesManager.pendingUploadModalActionButton": "Ok",
   "module.filesManager.pendingUploadModalHeader": "Files uploading",
-  "module.filesManager.pendingUploadModalTextDetailsInfo": "The file limit has almost been reached. You can upload only {count} {count, plural, one {file}  other {files}}",
-  "module.filesManager.pendingUploadModalTextInfo": "Mudita Center cannot load all selected files.",
+  "module.filesManager.pendingUploadModalTextDetailsInfo": "The first {count, plural, one {file} other {# files}} will be uploaded to the device.",
+  "module.filesManager.pendingUploadModalTextInfo": "Mudita Center cannot load all files.\nThe number of selected files exceeds the limit.",
+  "module.filesManager.pendingUploadModalAbortButtonText": "Abort",
   "module.filesManager.pendingUploadModalTitle": "Upload files",
   "module.filesManager.selectionNumber": "{num, plural, =-1 {All Files} one {# File} other {# Files}} selected",
   "module.filesManager.tooManyFilesTooltipDescription": "The maximum number of files has been reached ({filesSlotsHarmonyMaxLimit} files)",

packages/app/src/files-manager/components/pending-upload-modal/pending-upload-modal.component.tsx

@@ -22,6 +22,7 @@ import styled from "styled-components"
 import { fontWeight } from "App/__deprecated__/renderer/styles/theming/theme-getters"
 import { PendingUploadModalProps } from "App/files-manager/components/pending-upload-modal/pending-upload-modal.interface"
 import { FunctionComponent } from "App/__deprecated__/renderer/types/function-component.interface"
+import { getModalButtonsSize } from "App/__deprecated__/renderer/components/core/modal/modal.helpers"
 
 const messages = defineMessages({
   pendingUploadModalTitle: {
@@ -39,11 +40,13 @@ const messages = defineMessages({
   pendingUploadModalActionButton: {
     id: "module.filesManager.pendingUploadModalActionButton",
   },
+  pendingUploadModalAbortButton: {
+    id: "module.filesManager.pendingUploadModalAbortButtonText",
+  },
 })
 
 const PendingUploadDetailText = styled(Text)`
   font-weight: ${fontWeight("default")};
-  width: 25rem;
 `
 
 const PendingUploadModal: FunctionComponent<PendingUploadModalProps> = ({
@@ -57,7 +60,7 @@ const PendingUploadModal: FunctionComponent<PendingUploadModalProps> = ({
       size={ModalSize.Small}
       title={intl.formatMessage(messages.pendingUploadModalTitle)}
       open
-      closeButton={false}
+      closeButton
       actionButtonLabel={intl.formatMessage(
         messages.pendingUploadModalActionButton
       )}
@@ -67,6 +70,13 @@ const PendingUploadModal: FunctionComponent<PendingUploadModalProps> = ({
       closeModal={() => {
         onClose()
       }}
+      onCloseButton={() => {
+        onClose()
+      }}
+      closeButtonLabel={intl.formatMessage(
+        messages.pendingUploadModalAbortButton
+      )}
+      actionButtonSize={getModalButtonsSize(ModalSize.Small)}
       {...props}
     >
       <ModalContent>

packages/app/src/ui/components/modal-dialog/get-modal-dialog-style.helper.ts

@@ -29,8 +29,8 @@ const getModalSize = (size: ModalProps["size"]) => {
       }
     case ModalSize.Small:
       return {
-        width: "38rem",
-        padding: "2.4rem 2.4rem 4rem 2.4rem",
+        width: "38.6rem",
+        padding: "2.4rem",
       }
     case ModalSize.Medium:
       return {