From 65a15810574f4b36c1e29e6baf43518f12f5fe38 Mon Sep 17 00:00:00 2001
From: gismo2004 <reumuellermarkus@gmail.com>
Date: Sun, 9 Sep 2018 18:49:07 +0200
Subject: [PATCH] Fixed: Unclear UI on quality definitions (#483)

---
 .../src/Settings/Quality/Definition/QualityDefinitions.js   | 6 +++++-
 .../Quality/Definition/QualityDefinitionsConnector.js       | 4 +++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/frontend/src/Settings/Quality/Definition/QualityDefinitions.js b/frontend/src/Settings/Quality/Definition/QualityDefinitions.js
index 7b7d3e7ea..79a25f158 100644
--- a/frontend/src/Settings/Quality/Definition/QualityDefinitions.js
+++ b/frontend/src/Settings/Quality/Definition/QualityDefinitions.js
@@ -12,6 +12,7 @@ class QualityDefinitions extends Component {
 
   render() {
     const {
+      advancedSettings,
       items,
       ...otherProps
     } = this.props;
@@ -26,7 +27,9 @@ class QualityDefinitions extends Component {
             <div className={styles.quality}>Quality</div>
             <div className={styles.title}>Title</div>
             <div className={styles.sizeLimit}>Size Limit</div>
-            <div className={styles.kilobitsPerSecond}>Kilobits Per Second</div>
+            {advancedSettings &&
+              <div className={styles.kilobitsPerSecond}>Kilobits Per Second</div>
+            }
           </div>
 
           <div className={styles.definitions}>
@@ -54,6 +57,7 @@ class QualityDefinitions extends Component {
 }
 
 QualityDefinitions.propTypes = {
+  advancedSettings: PropTypes.bool.isRequired,
   isFetching: PropTypes.bool.isRequired,
   error: PropTypes.object,
   defaultProfile: PropTypes.object,
diff --git a/frontend/src/Settings/Quality/Definition/QualityDefinitionsConnector.js b/frontend/src/Settings/Quality/Definition/QualityDefinitionsConnector.js
index 9a3e0a90c..a0d9973b6 100644
--- a/frontend/src/Settings/Quality/Definition/QualityDefinitionsConnector.js
+++ b/frontend/src/Settings/Quality/Definition/QualityDefinitionsConnector.js
@@ -9,7 +9,8 @@ import QualityDefinitions from './QualityDefinitions';
 function createMapStateToProps() {
   return createSelector(
     (state) => state.settings.qualityDefinitions,
-    (qualityDefinitions) => {
+    (state) => state.settings.advancedSettings,
+    (qualityDefinitions, advancedSettings) => {
       const items = qualityDefinitions.items.map((item) => {
         const pendingChanges = qualityDefinitions.pendingChanges[item.id] || {};
 
@@ -17,6 +18,7 @@ function createMapStateToProps() {
       });
 
       return {
+        advancedSettings,
         ...qualityDefinitions,
         items,
         hasPendingChanges: !_.isEmpty(qualityDefinitions.pendingChanges)