New: Custom Formats

Co-Authored-By: ta264 <ta264@users.noreply.github.com>

frontend/src/Settings/Profiles/Quality/EditQualityProfileModalContent.js

@@ -15,11 +15,23 @@ import ModalHeader from 'Components/Modal/ModalHeader';
 import { inputTypes, kinds, sizes } from 'Helpers/Props';
 import dimensions from 'Styles/Variables/dimensions';
 import translate from 'Utilities/String/translate';
+import QualityProfileFormatItems from './QualityProfileFormatItems';
 import QualityProfileItems from './QualityProfileItems';
 import styles from './EditQualityProfileModalContent.css';
 
 const MODAL_BODY_PADDING = parseInt(dimensions.modalBodyPadding);
 
+function getCustomFormatRender(formatItems, otherProps) {
+  return (
+    <QualityProfileFormatItems
+      profileFormatItems={formatItems.value}
+      errors={formatItems.errors}
+      warnings={formatItems.warnings}
+      {...otherProps}
+    />
+  );
+}
+
 class EditQualityProfileModalContent extends Component {
 
   //
@@ -93,6 +105,7 @@ class EditQualityProfileModalContent extends Component {
       isSaving,
       saveError,
       qualities,
+      customFormats,
       item,
       isInUse,
       onInputChange,
@@ -108,7 +121,10 @@ class EditQualityProfileModalContent extends Component {
       name,
       upgradeAllowed,
       cutoff,
-      items
+      minFormatScore,
+      cutoffFormatScore,
+      items,
+      formatItems
     } = item;
 
     return (
@@ -157,7 +173,7 @@ class EditQualityProfileModalContent extends Component {
 
                       <FormGroup size={sizes.EXTRA_SMALL}>
                         <FormLabel size={sizes.SMALL}>
-                          Upgrades Allowed
+                          {translate('UpgradesAllowed')}
                         </FormLabel>
 
                         <FormInputGroup
@@ -186,6 +202,44 @@ class EditQualityProfileModalContent extends Component {
                             />
                           </FormGroup>
                       }
+
+                      {
+                        formatItems.value.length > 0 &&
+                          <FormGroup size={sizes.EXTRA_SMALL}>
+                            <FormLabel size={sizes.SMALL}>
+                              Minimum Custom Format Score
+                            </FormLabel>
+
+                            <FormInputGroup
+                              type={inputTypes.NUMBER}
+                              name="minFormatScore"
+                              {...minFormatScore}
+                              helpText="Minimum custom format score allowed to download"
+                              onChange={onInputChange}
+                            />
+                          </FormGroup>
+                      }
+
+                      {
+                        upgradeAllowed.value && formatItems.value.length > 0 &&
+                          <FormGroup size={sizes.EXTRA_SMALL}>
+                            <FormLabel size={sizes.SMALL}>
+                              Upgrade Until Custom Format Score
+                            </FormLabel>
+
+                            <FormInputGroup
+                              type={inputTypes.NUMBER}
+                              name="cutoffFormatScore"
+                              {...cutoffFormatScore}
+                              helpText="Once this custom format score is reached Readarr will no longer grab book releases"
+                              onChange={onInputChange}
+                            />
+                          </FormGroup>
+                      }
+
+                      <div className={styles.formatItemLarge}>
+                        {getCustomFormatRender(formatItems, ...otherProps)}
+                      </div>
                     </div>
 
                     <div className={styles.formGroupWrapper}>
@@ -197,9 +251,12 @@ class EditQualityProfileModalContent extends Component {
                         {...otherProps}
                       />
                     </div>
+
+                    <div className={styles.formatItemSmall}>
+                      {getCustomFormatRender(formatItems, otherProps)}
+                    </div>
                   </div>
                 </Form>
-
             }
           </Measure>
         </ModalBody>
@@ -209,7 +266,7 @@ class EditQualityProfileModalContent extends Component {
         >
           <ModalFooter>
             {
-              id &&
+              id ?
                 <div
                   className={styles.deleteButtonContainer}
                   title={isInUse ? translate('IsInUseCantDeleteAQualityProfileThatIsAttachedToAnAuthorOrImportList') : undefined}
@@ -221,7 +278,8 @@ class EditQualityProfileModalContent extends Component {
                   >
                     Delete
                   </Button>
-                </div>
+                </div> :
+                null
             }
 
             <Button
@@ -251,6 +309,7 @@ EditQualityProfileModalContent.propTypes = {
   isSaving: PropTypes.bool.isRequired,
   saveError: PropTypes.object,
   qualities: PropTypes.arrayOf(PropTypes.object).isRequired,
+  customFormats: PropTypes.arrayOf(PropTypes.object).isRequired,
   item: PropTypes.object.isRequired,
   isInUse: PropTypes.bool.isRequired,
   onInputChange: PropTypes.func.isRequired,