From 16d60a6586aeb458601214258da021ee154e5b6e Mon Sep 17 00:00:00 2001
From: Bogdan <mynameisbogdan@users.noreply.github.com>
Date: Sun, 31 Dec 2023 02:07:06 +0200
Subject: [PATCH] Fixed: Show errors when adding Root Folder

---
 .../SelectFolder/ImportSeriesSelectFolder.js  |  2 +-
 frontend/src/RootFolder/RootFolders.tsx       |  2 +-
 .../RootFolder/AddRootFolder.tsx              | 60 +++++++++++++------
 src/NzbDrone.Core/Localization/Core/en.json   |  3 +-
 4 files changed, 44 insertions(+), 23 deletions(-)

diff --git a/frontend/src/AddSeries/ImportSeries/SelectFolder/ImportSeriesSelectFolder.js b/frontend/src/AddSeries/ImportSeries/SelectFolder/ImportSeriesSelectFolder.js
index 939da79d2..24fcff3dc 100644
--- a/frontend/src/AddSeries/ImportSeries/SelectFolder/ImportSeriesSelectFolder.js
+++ b/frontend/src/AddSeries/ImportSeries/SelectFolder/ImportSeriesSelectFolder.js
@@ -118,7 +118,7 @@ class ImportSeriesSelectFolder extends Component {
                       className={styles.addErrorAlert}
                       kind={kinds.DANGER}
                     >
-                      {translate('RootFolderLoadError')}
+                      {translate('AddRootFolderError')}
 
                       <ul>
                         {
diff --git a/frontend/src/RootFolder/RootFolders.tsx b/frontend/src/RootFolder/RootFolders.tsx
index d887b5b56..3e21845a7 100644
--- a/frontend/src/RootFolder/RootFolders.tsx
+++ b/frontend/src/RootFolder/RootFolders.tsx
@@ -49,7 +49,7 @@ function RootFolders() {
 
   if (!isFetching && !!error) {
     return (
-      <Alert kind={kinds.DANGER}>{translate('UnableToLoadRootFolders')}</Alert>
+      <Alert kind={kinds.DANGER}>{translate('RootFoldersLoadError')}</Alert>
     );
   }
 
diff --git a/frontend/src/Settings/MediaManagement/RootFolder/AddRootFolder.tsx b/frontend/src/Settings/MediaManagement/RootFolder/AddRootFolder.tsx
index 54a35e5bf..dee012cc3 100644
--- a/frontend/src/Settings/MediaManagement/RootFolder/AddRootFolder.tsx
+++ b/frontend/src/Settings/MediaManagement/RootFolder/AddRootFolder.tsx
@@ -1,14 +1,18 @@
 import React, { useCallback, useState } from 'react';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
+import Alert from 'Components/Alert';
 import FileBrowserModal from 'Components/FileBrowser/FileBrowserModal';
 import Icon from 'Components/Icon';
 import Button from 'Components/Link/Button';
 import { icons, kinds, sizes } from 'Helpers/Props';
 import { addRootFolder } from 'Store/Actions/rootFolderActions';
+import createRootFoldersSelector from 'Store/Selectors/createRootFoldersSelector';
 import translate from 'Utilities/String/translate';
 import styles from './AddRootFolder.css';
 
 function AddRootFolder() {
+  const { isSaving, saveError } = useSelector(createRootFoldersSelector());
+
   const dispatch = useDispatch();
 
   const [isAddNewRootFolderModalOpen, setIsAddNewRootFolderModalOpen] =
@@ -30,24 +34,42 @@ function AddRootFolder() {
   }, [setIsAddNewRootFolderModalOpen]);
 
   return (
-    <div className={styles.addRootFolderButtonContainer}>
-      <Button
-        kind={kinds.PRIMARY}
-        size={sizes.LARGE}
-        onPress={onAddNewRootFolderPress}
-      >
-        <Icon className={styles.importButtonIcon} name={icons.DRIVE} />
-        {translate('AddRootFolder')}
-      </Button>
-
-      <FileBrowserModal
-        isOpen={isAddNewRootFolderModalOpen}
-        name="rootFolderPath"
-        value=""
-        onChange={onNewRootFolderSelect}
-        onModalClose={onAddRootFolderModalClose}
-      />
-    </div>
+    <>
+      {!isSaving && saveError ? (
+        <Alert kind={kinds.DANGER}>
+          {translate('AddRootFolderError')}
+
+          <ul>
+            {Array.isArray(saveError.responseJSON) ? (
+              saveError.responseJSON.map((e, index) => {
+                return <li key={index}>{e.errorMessage}</li>;
+              })
+            ) : (
+              <li>{JSON.stringify(saveError.responseJSON)}</li>
+            )}
+          </ul>
+        </Alert>
+      ) : null}
+
+      <div className={styles.addRootFolderButtonContainer}>
+        <Button
+          kind={kinds.PRIMARY}
+          size={sizes.LARGE}
+          onPress={onAddNewRootFolderPress}
+        >
+          <Icon className={styles.importButtonIcon} name={icons.DRIVE} />
+          {translate('AddRootFolder')}
+        </Button>
+
+        <FileBrowserModal
+          isOpen={isAddNewRootFolderModalOpen}
+          name="rootFolderPath"
+          value=""
+          onChange={onNewRootFolderSelect}
+          onModalClose={onAddRootFolderModalClose}
+        />
+      </div>
+    </>
   );
 }
 
diff --git a/src/NzbDrone.Core/Localization/Core/en.json b/src/NzbDrone.Core/Localization/Core/en.json
index ef384145d..7424dd391 100644
--- a/src/NzbDrone.Core/Localization/Core/en.json
+++ b/src/NzbDrone.Core/Localization/Core/en.json
@@ -49,6 +49,7 @@
   "AddRemotePathMapping": "Add Remote Path Mapping",
   "AddRemotePathMappingError": "Unable to add a new remote path mapping, please try again.",
   "AddRootFolder": "Add Root Folder",
+  "AddRootFolderError": "Unable to add root folder",
   "AddSeriesWithTitle": "Add {title}",
   "AddToDownloadQueue": "Add to download queue",
   "Added": "Added",
@@ -1348,7 +1349,6 @@
   "RetentionHelpText": "Usenet only: Set to zero to set for unlimited retention",
   "RetryingDownloadOn": "Retrying download on {date} at {time}",
   "RootFolder": "Root Folder",
-  "RootFolderLoadError": "Unable to add root folder",
   "RootFolderMissingHealthCheckMessage": "Missing root folder: {rootFolderPath}",
   "RootFolderMultipleMissingHealthCheckMessage": "Multiple root folders are missing: {rootFolderPaths}",
   "RootFolderPath": "Root Folder Path",
@@ -1620,7 +1620,6 @@
   "Umask777Description": "{octal} - Everyone write",
   "UnableToLoadAutoTagging": "Unable to load auto tagging",
   "UnableToLoadBackups": "Unable to load backups",
-  "UnableToLoadRootFolders": "Unable to load root folders",
   "UnableToUpdateSonarrDirectly": "Unable to update {appName} directly,",
   "Unavailable": "Unavailable",
   "Underscore": "Underscore",