Adds default include for pinnned publishers

brave · Mar 11, 2017 · 819f9fd · 819f9fd
1 parent 4490b2a
commit 819f9fd
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 7 deletions.
diff --git a/app/renderer/components/preferences/payment/ledgerTable.js b/app/renderer/components/preferences/payment/ledgerTable.js
@@ -8,6 +8,7 @@ const {StyleSheet, css} = require('aphrodite')
 // components
 const ImmutableComponent = require('../../../../../js/components/immutableComponent')
 const SortableTable = require('../../../../../js/components/sortableTable')
+const SwitchControl = require('../../../../../js/components/switchControl')
 
 // style
 const globalStyles = require('../../styles/global')
@@ -90,6 +91,7 @@ class LedgerTable extends ImmutableComponent {
   togglePinSite (hostPattern, pinned) {
     if (pinned) {
       aboutActions.changeSiteSetting(hostPattern, 'ledgerPinPercentage', 1)
+      aboutActions.changeSiteSetting(hostPattern, 'ledgerPayments', 1)
     } else {
       aboutActions.changeSiteSetting(hostPattern, 'ledgerPinPercentage', 0)
     }
@@ -152,12 +154,21 @@ class LedgerTable extends ImmutableComponent {
         value: site
       },
       {
-        html: <SiteSettingCheckbox small
-          hostPattern={this.getHostPattern(synopsis)}
-          defaultValue={defaultSiteSetting}
-          prefKey='ledgerPayments'
-          siteSettings={this.props.siteSettings}
-          checked={this.enabledForSite(synopsis)} />,
+        html: pinned
+          ? <SwitchControl
+            className={css(styles.noPointer)}
+            backgroundClassName={css(styles.pinnedToggle)}
+            small
+            checkedOn
+            onClick={() => {}}
+          />
+          : <SiteSettingCheckbox small
+            hostPattern={this.getHostPattern(synopsis)}
+            defaultValue={defaultSiteSetting}
+            prefKey='ledgerPayments'
+            siteSettings={this.props.siteSettings}
+            checked={this.enabledForSite(synopsis)}
+          />,
         value: this.enabledForSite(synopsis) ? 1 : 0
       },
       views,
@@ -283,6 +294,10 @@ const styles = StyleSheet.create({
     }
   },
 
+  noPointer: {
+    cursor: 'default'
+  },
+
   tableClass: {
     width: '100%',
     textAlign: 'left',
@@ -418,6 +433,12 @@ const styles = StyleSheet.create({
       backgroundColor: '#fff',
       borderColor: globalStyles.color.highlightBlue
     }
+  },
+
+  pinnedToggle: {
+    backgroundColor: '#f5f4f4',
+    cursor: 'default',
+    boxShadow: 'inset 0 1px 4px rgba(0, 0, 0, 0.20)'
   }
 })
 

diff --git a/js/components/switchControl.js b/js/components/switchControl.js
@@ -45,7 +45,8 @@ class SwitchControl extends ImmutableComponent {
         }
         <div className={cx({
           switchBackground: true,
-          switchedOn: this.props.checkedOn
+          switchedOn: this.props.checkedOn,
+          [this.props.backgroundClassName]: !!this.props.backgroundClassName
         })} onClick={this.onClick}>
           <div className='switchIndicator' />
         </div>