New: Advanced settings toggle in indexer edit/add modal

(cherry picked from commit a570fd2a8f138fb89c5b0ae43ddb7919f6bf26e3)

frontend/src/Settings/AdvancedSettingsButton.js

@@ -4,18 +4,20 @@ import React from 'react';
 import Icon from 'Components/Icon';
 import Link from 'Components/Link/Link';
 import { icons } from 'Helpers/Props';
+import translate from 'Utilities/String/translate';
 import styles from './AdvancedSettingsButton.css';
 
 function AdvancedSettingsButton(props) {
   const {
     advancedSettings,
-    onAdvancedSettingsPress
+    onAdvancedSettingsPress,
+    showLabel
   } = props;
 
   return (
     <Link
       className={styles.button}
-      title={advancedSettings ? 'Shown, click to hide' : 'Hidden, click to show'}
+      title={advancedSettings ? translate('ShownClickToHide') : translate('HiddenClickToShow')}
       onPress={onAdvancedSettingsPress}
     >
       <Icon
@@ -42,18 +44,27 @@ function AdvancedSettingsButton(props) {
         />
       </span>
 
+      {
+        showLabel ?
           <div className={styles.labelContainer}>
             <div className={styles.label}>
-          {advancedSettings ? 'Hide Advanced' : 'Show Advanced'}
-        </div>
+              {advancedSettings ? translate('HideAdvanced') : translate('ShowAdvanced')}
             </div>
+          </div> :
+          null
+      }
     </Link>
   );
 }
 
 AdvancedSettingsButton.propTypes = {
   advancedSettings: PropTypes.bool.isRequired,
-  onAdvancedSettingsPress: PropTypes.func.isRequired
+  onAdvancedSettingsPress: PropTypes.func.isRequired,
+  showLabel: PropTypes.bool.isRequired
+};
+
+AdvancedSettingsButton.defaultProps = {
+  showLabel: true
 };
 
 export default AdvancedSettingsButton;

frontend/src/Settings/Indexers/Indexers/EditIndexerModalContent.js

@@ -13,6 +13,7 @@ import ModalContent from 'Components/Modal/ModalContent';
 import ModalFooter from 'Components/Modal/ModalFooter';
 import ModalHeader from 'Components/Modal/ModalHeader';
 import { inputTypes, kinds } from 'Helpers/Props';
+import AdvancedSettingsButton from 'Settings/AdvancedSettingsButton';
 import styles from './EditIndexerModalContent.css';
 
 function EditIndexerModalContent(props) {
@@ -30,6 +31,7 @@ function EditIndexerModalContent(props) {
     onSavePress,
     onTestPress,
     onDeleteIndexerPress,
+    onAdvancedSettingsPress,
     ...otherProps
   } = props;
 
@@ -215,6 +217,12 @@ function EditIndexerModalContent(props) {
             </Button>
         }
 
+        <AdvancedSettingsButton
+          advancedSettings={advancedSettings}
+          onAdvancedSettingsPress={onAdvancedSettingsPress}
+          showLabel={false}
+        />
+
         <SpinnerErrorButton
           isSpinning={isTesting}
           error={saveError}
@@ -254,6 +262,7 @@ EditIndexerModalContent.propTypes = {
   onModalClose: PropTypes.func.isRequired,
   onSavePress: PropTypes.func.isRequired,
   onTestPress: PropTypes.func.isRequired,
+  onAdvancedSettingsPress: PropTypes.func.isRequired,
   onDeleteIndexerPress: PropTypes.func
 };
 

frontend/src/Settings/Indexers/Indexers/EditIndexerModalContentConnector.js

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
-import { saveIndexer, setIndexerFieldValue, setIndexerValue, testIndexer } from 'Store/Actions/settingsActions';
+import { saveIndexer, setIndexerFieldValue, setIndexerValue, testIndexer, toggleAdvancedSettings } from 'Store/Actions/settingsActions';
 import createProviderSettingsSelector from 'Store/Selectors/createProviderSettingsSelector';
 import EditIndexerModalContent from './EditIndexerModalContent';
 
@@ -23,7 +23,8 @@ const mapDispatchToProps = {
   setIndexerValue,
   setIndexerFieldValue,
   saveIndexer,
-  testIndexer
+  testIndexer,
+  toggleAdvancedSettings
 };
 
 class EditIndexerModalContentConnector extends Component {
@@ -56,6 +57,10 @@ class EditIndexerModalContentConnector extends Component {
     this.props.testIndexer({ id: this.props.id });
   };
 
+  onAdvancedSettingsPress = () => {
+    this.props.toggleAdvancedSettings();
+  };
+
   //
   // Render
 
@@ -65,6 +70,7 @@ class EditIndexerModalContentConnector extends Component {
         {...this.props}
         onSavePress={this.onSavePress}
         onTestPress={this.onTestPress}
+        onAdvancedSettingsPress={this.onAdvancedSettingsPress}
         onInputChange={this.onInputChange}
         onFieldChange={this.onFieldChange}
       />
@@ -80,6 +86,7 @@ EditIndexerModalContentConnector.propTypes = {
   item: PropTypes.object.isRequired,
   setIndexerValue: PropTypes.func.isRequired,
   setIndexerFieldValue: PropTypes.func.isRequired,
+  toggleAdvancedSettings: PropTypes.func.isRequired,
   saveIndexer: PropTypes.func.isRequired,
   testIndexer: PropTypes.func.isRequired,
   onModalClose: PropTypes.func.isRequired

src/NzbDrone.Core/Localization/Core/en.json

@@ -1,6 +1,10 @@
 {
+  "Browser Reload Required": "Browser Reload Required",
+  "HiddenClickToShow": "Hidden, click to show",
+  "HideAdvanced": "Hide Advanced",
   "Language": "Language",
-  "UI Language": "UI Language",
   "Language that Sonarr will use for UI": "Language that Sonarr will use for UI",
-  "Browser Reload Required": "Browser Reload Required"
+  "ShowAdvanced": "Show Advanced",
+  "ShownClickToHide": "Shown, click to hide",
+  "UI Language": "UI Language"
 }