diff --git a/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.css b/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.css index 030da96fb..7c0dbc2aa 100644 --- a/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.css +++ b/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.css @@ -30,3 +30,9 @@ .importButtonIcon { margin-right: 8px; } + +.addErrorAlert { + composes: alert from '~Components/Alert.css'; + + margin: 20px 0; +} diff --git a/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.js b/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.js index 1bde064fb..665f0d9f4 100644 --- a/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.js +++ b/frontend/src/AddMovie/ImportMovie/SelectFolder/ImportMovieSelectFolder.js @@ -1,5 +1,6 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import Alert from 'Components/Alert'; import FieldSet from 'Components/FieldSet'; import FileBrowserModal from 'Components/FileBrowser/FileBrowserModal'; import Icon from 'Components/Icon'; @@ -72,23 +73,29 @@ class ImportMovieSelectFolder extends Component { isWindows, isFetching, isPopulated, + isSaving, error, + saveError, items } = this.props; + const hasRootFolders = items.length > 0; + return ( { - isFetching && !isPopulated && - + isFetching && !isPopulated ? + : + null } { - !isFetching && !!error && + !isFetching && error ?
{translate('UnableToLoadRootFolders')} -
+ : + null } { @@ -108,7 +115,7 @@ class ImportMovieSelectFolder extends Component { { - items.length > 0 ? + hasRootFolders ?
- -
: - -
- -
+ null } + { + !isSaving && saveError ? + + {translate('UnableToAddRootFolder')} + +
    + { + saveError.responseJSON.map((e, index) => { + return ( +
  • + {e.errorMessage} +
  • + ); + }) + } +
+
: + null + } + +
+ +
+