Fixed: UI and Command manager updates

Co-Authored-By: Mark McDowall <markus101@users.noreply.github.com>

frontend/src/InteractiveImport/Interactive/InteractiveImportModalContent.css

@@ -6,7 +6,6 @@
 
 .filterText {
   margin-left: 5px;
-  font-size: $largeFontSize;
 }
 
 .footer {

frontend/src/InteractiveImport/Interactive/InteractiveImportModalContent.js

@@ -169,7 +169,9 @@ class InteractiveImportModalContent extends Component {
   render() {
     const {
       downloadId,
+      allowArtistChange,
       showFilterExistingFiles,
+      showImportMode,
       filterExistingFiles,
       title,
       folder,
@@ -211,17 +213,7 @@ class InteractiveImportModalContent extends Component {
 
         <ModalBody>
           {
-            isFetching &&
-              <LoadingIndicator />
-          }
-
-          {
-            error &&
-              <div>{errorMessage}</div>
-          }
-
-          {
-            isPopulated && showFilterExistingFiles && !isFetching &&
+            showFilterExistingFiles &&
             <div className={styles.filterContainer}>
               <Menu alignMenu={align.RIGHT}>
                 <MenuButton>
@@ -258,6 +250,16 @@ class InteractiveImportModalContent extends Component {
             </div>
           }
 
+          {
+            isFetching &&
+              <LoadingIndicator />
+          }
+
+          {
+            error &&
+              <div>{errorMessage}</div>
+          }
+
           {
             isPopulated && !!items.length && !isFetching && !isFetching &&
               <Table
@@ -278,6 +280,7 @@ class InteractiveImportModalContent extends Component {
                           key={item.id}
                           isSelected={selectedState[item.id]}
                           {...item}
+                          allowArtistChange={allowArtistChange}
                           onSelectedChange={this.onSelectedChange}
                           onValidRowChange={this.onValidRowChange}
                         />
@@ -295,9 +298,9 @@ class InteractiveImportModalContent extends Component {
         </ModalBody>
 
         <ModalFooter className={styles.footer}>
-          {
-            !downloadId &&
-              <div className={styles.leftButtons}>
+          <div className={styles.leftButtons}>
+            {
+              !downloadId && showImportMode &&
                 <SelectInput
                   className={styles.importMode}
                   name="importMode"
@@ -305,13 +308,16 @@ class InteractiveImportModalContent extends Component {
                   values={importModeOptions}
                   onChange={this.onImportModeChange}
                 />
-              </div>
-          }
+            }
+          </div>
 
-          <div className={downloadId ? styles.leftButtons : styles.centerButtons}>
-            <Button onPress={this.onSelectArtistPress}>
-              Select Artist
-            </Button>
+          <div className={styles.centerButtons}>
+            {
+              allowArtistChange &&
+                <Button onPress={this.onSelectArtistPress}>
+                  Select Artist
+                </Button>
+            }
 
             <Button onPress={this.onSelectAlbumPress}>
               Select Album
@@ -357,6 +363,8 @@ class InteractiveImportModalContent extends Component {
 
 InteractiveImportModalContent.propTypes = {
   downloadId: PropTypes.string,
+  allowArtistChange: PropTypes.bool.isRequired,
+  showImportMode: PropTypes.bool.isRequired,
   showFilterExistingFiles: PropTypes.bool.isRequired,
   filterExistingFiles: PropTypes.bool.isRequired,
   importMode: PropTypes.string.isRequired,
@@ -377,7 +385,9 @@ InteractiveImportModalContent.propTypes = {
 };
 
 InteractiveImportModalContent.defaultProps = {
+  allowArtistChange: true,
   showFilterExistingFiles: false,
+  showImportMode: true,
   importMode: 'move'
 };
 

frontend/src/InteractiveImport/Interactive/InteractiveImportRow.js

@@ -163,6 +163,7 @@ class InteractiveImportRow extends Component {
   render() {
     const {
       id,
+      allowArtistChange,
       relativePath,
       artist,
       album,
@@ -210,6 +211,7 @@ class InteractiveImportRow extends Component {
         </TableRowCell>
 
         <TableRowCellButton
+          isDisabled={!allowArtistChange}
           onPress={this.onSelectArtistPress}
         >
           {
@@ -348,6 +350,7 @@ class InteractiveImportRow extends Component {
 
 InteractiveImportRow.propTypes = {
   id: PropTypes.number.isRequired,
+  allowArtistChange: PropTypes.bool.isRequired,
   relativePath: PropTypes.string.isRequired,
   artist: PropTypes.object,
   album: PropTypes.object,