From 0411b5fd4b0c3f1cc366c1a9b60b074710e78fad Mon Sep 17 00:00:00 2001
From: Oskar Michalkiewicz
 <32848134+OskarMichalkiewicz@users.noreply.github.com>
Date: Wed, 20 Sep 2023 07:19:11 +0000
Subject: [PATCH] [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)

---
 .../renderer/locales/default/en-US.json            |  5 +++--
 .../pending-upload-modal.component.tsx             | 14 ++++++++++++--
 .../modal-dialog/get-modal-dialog-style.helper.ts  |  4 ++--
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/packages/app/src/__deprecated__/renderer/locales/default/en-US.json b/packages/app/src/__deprecated__/renderer/locales/default/en-US.json
index 03a9de28f2..ed79cbbb0e 100644
--- a/packages/app/src/__deprecated__/renderer/locales/default/en-US.json
+++ b/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)",
diff --git a/packages/app/src/files-manager/components/pending-upload-modal/pending-upload-modal.component.tsx b/packages/app/src/files-manager/components/pending-upload-modal/pending-upload-modal.component.tsx
index 5c45a0f9b3..8e29678e8f 100644
--- a/packages/app/src/files-manager/components/pending-upload-modal/pending-upload-modal.component.tsx
+++ b/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>
diff --git a/packages/app/src/ui/components/modal-dialog/get-modal-dialog-style.helper.ts b/packages/app/src/ui/components/modal-dialog/get-modal-dialog-style.helper.ts
index 20dd2c14d4..8f68c2b2ec 100644
--- a/packages/app/src/ui/components/modal-dialog/get-modal-dialog-style.helper.ts
+++ b/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 {