New: Plugin support

frontend/src/Settings/Profiles/Delay/DelayProfile.js

@@ -6,28 +6,11 @@ import Link from 'Components/Link/Link';
 import ConfirmModal from 'Components/Modal/ConfirmModal';
 import TagList from 'Components/TagList';
 import { icons, kinds } from 'Helpers/Props';
-import titleCase from 'Utilities/String/titleCase';
 import translate from 'Utilities/String/translate';
+import DelayProfileItem from './DelayProfileItem';
 import EditDelayProfileModalConnector from './EditDelayProfileModalConnector';
 import styles from './DelayProfile.css';
 
-function getDelay(enabled, delay) {
-  if (!enabled) {
-    return '-';
-  }
-
-  if (!delay) {
-    return 'No Delay';
-  }
-
-  if (delay === 1) {
-    return '1 Minute';
-  }
-
-  // TODO: use better units of time than just minutes
-  return `${delay} Minutes`;
-}
-
 class DelayProfile extends Component {
 
   //
@@ -74,25 +57,14 @@ class DelayProfile extends Component {
   render() {
     const {
       id,
-      enableUsenet,
-      enableTorrent,
-      preferredProtocol,
-      usenetDelay,
-      torrentDelay,
+      name,
+      items,
       tags,
       tagList,
       isDragging,
       connectDragSource
     } = this.props;
 
-    let preferred = titleCase(translate('PreferProtocol', { preferredProtocol }));
-
-    if (!enableUsenet) {
-      preferred = translate('OnlyTorrent');
-    } else if (!enableTorrent) {
-      preferred = translate('OnlyUsenet');
-    }
-
     return (
       <div
         className={classNames(
@@ -100,11 +72,26 @@ class DelayProfile extends Component {
           isDragging && styles.isDragging
         )}
       >
-        <div className={styles.column}>{preferred}</div>
-        <div className={styles.column}>{getDelay(enableUsenet, usenetDelay)}</div>
-        <div className={styles.column}>{getDelay(enableTorrent, torrentDelay)}</div>
+
+        <div className={styles.name}>{name}</div>
+
+        <div className={styles.fillcolumn}>
+          {
+            items.map((x) => {
+              return (
+                <DelayProfileItem
+                  key={x.protocol}
+                  name={x.name}
+                  allowed={x.allowed}
+                  delay={x.delay}
+                />
+              );
+            })
+          }
+        </div>
 
         <TagList
+          className={styles.fillcolumn}
           tags={tags}
           tagList={tagList}
         />
@@ -153,11 +140,8 @@ class DelayProfile extends Component {
 
 DelayProfile.propTypes = {
   id: PropTypes.number.isRequired,
-  enableUsenet: PropTypes.bool.isRequired,
-  enableTorrent: PropTypes.bool.isRequired,
-  preferredProtocol: PropTypes.string.isRequired,
-  usenetDelay: PropTypes.number.isRequired,
-  torrentDelay: PropTypes.number.isRequired,
+  name: PropTypes.string.isRequired,
+  items: PropTypes.arrayOf(PropTypes.object).isRequired,
   tags: PropTypes.arrayOf(PropTypes.number).isRequired,
   tagList: PropTypes.arrayOf(PropTypes.object).isRequired,
   isDragging: PropTypes.bool.isRequired,