Merge pull request #4118 from brave/feature/delete-synopsis

add right-click to delete ledger entry, add Bravery site settings page

app/extensions/brave/locales/en-US/menu.properties

@@ -97,6 +97,7 @@ editBookmark=Edit Bookmark…
 deleteFolder=Delete Folder
 deleteBookmark=Delete Bookmark
 deleteHistoryEntry=Delete History Entry
+deleteLedgerEntry=Never include this site
 stop=Stop
 clone=Clone
 reloadTab=Reload

app/extensions/brave/locales/en-US/preferences.properties

@@ -128,6 +128,7 @@ enableFlashSubtext=Flash support is experimental and requires Pepper Flash to be
 enableFlashSubtextLinux=Flash support is experimental and requires the pepperflashplugin-nonfree package.
 managePasswords=Manage passwords…
 sitePermissions=Saved Site Permissions
+sitePermissionsExceptions=Saved Site Exceptions
 selectedLanguage=Language:
 bookmarkToolbarSettings=Bookmarks Bar Settings
 bookmarkToolbar=Always show the bookmarks bar
@@ -188,6 +189,8 @@ pointerLockPermission=Disable your mouse cursor
 fullscreenPermission=Fullscreen access
 openExternalPermission=Open external applications
 protocolRegistrationPermission=Protocol registration
+shieldsUp=All Brave Shields
+ledgerPaymentsShown=Brave Payments
 flash=Run Adobe Flash Player
 flashAllowOnce=Allow once
 flashAllowAlways=Allow until {{time}}

app/ledger.js

@@ -105,12 +105,34 @@ let notificationTimeout = null
 
 // TODO(bridiver) - create a better way to get setting changes
 const doAction = (action) => {
+  var i, publisher
+
   switch (action.actionType) {
     case appConstants.APP_CHANGE_SETTING:
       if (action.key === settings.PAYMENTS_ENABLED) return initialize(action.value)
       if (action.key === settings.PAYMENTS_CONTRIBUTION_AMOUNT) return setPaymentInfo(action.value)
       break
 
+    case appConstants.APP_CHANGE_SITE_SETTING:
+      if (action.key === 'ledgerPaymentsShown') {
+        if (action.value === false) {
+          i = action.hostPattern.indexOf('://')
+          if (i !== -1) {
+            publisher = action.hostPattern.substr(i + 3)
+            delete synopsis.publishers[publisher]
+            delete publishers[publisher]
+            updatePublisherInfo()
+          }
+        }
+      }
+      break
+
+    case appConstants.APP_REMOVE_SITE_SETTING:
+      if (action.key === 'ledgerPaymentsShown') {
+        // TODO
+      }
+      break
+
     case appConstants.APP_NETWORK_CONNECTED:
       setTimeout(networkConnected, 1 * msecs.second)
       break
@@ -263,14 +285,18 @@ eventStore.addChangeListener(() => {
   if ((!synopsis) || (!util.isArray(info))) return
 
   info.forEach((page) => {
-    var entry, faviconURL, publisher
+    var entry, faviconURL, publisher, siteSetting
     var location = page.url
 
     if ((location.match(/^about/)) || ((locations[location]) && (locations[location].publisher))) return
 
     if (!page.publisher) {
       try {
         publisher = ledgerPublisher.getPublisher(location)
+        if (publisher) {
+          siteSetting = appStore.getState().get('siteSettings').get(`https?://${publisher}`)
+          if ((siteSetting) && (siteSetting.get('ledgerPaymentsShown') === false)) publisher = null
+        }
         if (publisher) page.publisher = publisher
       } catch (ex) {
         console.log('getPublisher error for ' + location + ': ' + ex.toString())
@@ -967,7 +993,9 @@ var run = (delayTime) => {
       var result
       var siteSetting = siteSettings.get(`https?://${winner}`)
 
-      if ((siteSetting) && (siteSetting.get('ledgerPayments') === false)) return
+      if ((siteSetting) &&
+          (siteSetting.get('ledgerPayments') === false ||
+           siteSetting.get('ledgerPaymentsShown') === false)) return
 
       result = client.vote(winner)
       if (result) state = result

app/locale.js

@@ -51,6 +51,7 @@ var rendererIdentifiers = function () {
     'deleteFolder',
     'deleteBookmark',
     'deleteHistoryEntry',
+    'deleteLedgerEntry',
     'editFolder',
     'editBookmark',
     'unmuteTabs',

docs/state.md

@@ -72,6 +72,7 @@ AppStore
       fingerprintingProtection: boolean,
       flash: (number|boolean), // approval expiration time if allowed, false if never allow
       ledgerPayments: boolean, // False if site should not be paid by the ledger. Defaults to true.
+      ledgerPaymentsShown: boolean, // False if site should not be paid by the ledger and should not be shown in the UI. Defaults to true.
       runInsecureContent: boolean // Allow active mixed content
     }
   },

js/about/preferences.js

@@ -58,6 +58,17 @@ const permissionNames = {
   'flash': ['boolean', 'number']
 }
 
+const braveryPermissionNames = {
+  'ledgerPaymentsShown': ['boolean', 'number'],
+  'shieldsUp': ['boolean'],
+  'adControl': ['string'],
+  'cookieControl': ['string'],
+  'safeBrowsing': ['boolean'],
+  'httpsEverywhere': ['boolean'],
+  'fingerprintingProtection': ['boolean'],
+  'noScript': ['boolean']
+}
+
 const changeSetting = (cb, key, e) => {
   if (e.target.type === 'checkbox') {
     cb(key, e.target.value)
@@ -197,8 +208,19 @@ class LedgerTable extends ImmutableComponent {
     return true
   }
 
+  shouldShow (synopsis) {
+    const hostSettings = this.props.siteSettings.get(this.getHostPattern(synopsis))
+    if (hostSettings) {
+      const result = hostSettings.get('ledgerPaymentsShown')
+      if (typeof result === 'boolean') {
+        return result
+      }
+    }
+    return true
+  }
+
   getRow (synopsis) {
-    if (!synopsis || !synopsis.get) {
+    if (!synopsis || !synopsis.get || !this.shouldShow(synopsis)) {
       return []
     }
     const faviconURL = synopsis.get('faviconURL') || appConfig.defaultFavicon
@@ -244,6 +266,13 @@ class LedgerTable extends ImmutableComponent {
             this.enabledForSite(item) ? '' : 'paymentsDisabled').toJS()
         }
         onContextMenu={aboutActions.contextMenu}
+        contextMenuName='synopsis'
+        rowObjects={this.synopsis.map((entry) => {
+          return {
+            hostPattern: this.getHostPattern(entry),
+            location: entry.get('publisherURL')
+          }
+        }).toJS()}
         rows={this.synopsis.map((synopsis) => this.getRow(synopsis)).toJS()} />
     </div>
   }
@@ -934,16 +963,16 @@ class SyncTab extends ImmutableComponent {
 class SitePermissionsPage extends React.Component {
   hasEntryForPermission (name) {
     return this.props.siteSettings.some((value) => {
-      return value.get && permissionNames[name] ? permissionNames[name].includes(typeof value.get(name)) : false
+      return value.get && this.props.names[name] ? this.props.names[name].includes(typeof value.get(name)) : false
     })
   }
 
   isPermissionsNonEmpty () {
     // Check whether there is at least one permission set
     return this.props.siteSettings.some((value) => {
       if (value && value.get) {
-        for (let name in permissionNames) {
-          if (permissionNames[name].includes(typeof value.get(name))) {
+        for (let name in this.props.names) {
+          if (this.props.names[name].includes(typeof value.get(name))) {
             return true
           }
         }
@@ -959,10 +988,11 @@ class SitePermissionsPage extends React.Component {
   render () {
     return this.isPermissionsNonEmpty()
     ? <div id='sitePermissionsPage'>
-      <div className='sectionTitle' data-l10n-id='sitePermissions' />
+      <div className='sectionTitle'
+        data-l10n-id={this.props.defaults ? 'sitePermissionsExceptions' : 'sitePermissions'} />
       <ul className='sitePermissions'>
         {
-          Object.keys(permissionNames).map((name) =>
+          Object.keys(this.props.names).map((name) =>
             this.hasEntryForPermission(name)
             ? <li>
               <div data-l10n-id={name} className='permissionName' />
@@ -973,9 +1003,14 @@ class SitePermissionsPage extends React.Component {
                     return null
                   }
                   const granted = value.get(name)
-                  if (permissionNames[name].includes(typeof granted)) {
-                    let statusText
-                    let statusArgs
+                  if (this.props.defaults &&
+                      this.props.defaults.get(name) === granted &&
+                      granted !== undefined) {
+                    return null
+                  }
+                  let statusText = ''
+                  let statusArgs
+                  if (this.props.names[name].includes(typeof granted)) {
                     if (name === 'flash') {
                       if (granted === 1) {
                         // Flash is allowed just one time
@@ -990,8 +1025,12 @@ class SitePermissionsPage extends React.Component {
                           time: new Date(granted).toLocaleString()
                         }
                       }
-                    } else {
+                    } else if (typeof granted === 'string') {
+                      statusText = granted
+                    } else if (!this.props.defaults) {
                       statusText = granted ? 'alwaysAllow' : 'alwaysDeny'
+                    } else {
+                      statusText = granted ? 'on' : 'off'
                     }
                     return <div className='permissionItem'>
                       <span className='fa fa-times permissionAction'
@@ -1066,6 +1105,11 @@ class ShieldsTab extends ImmutableComponent {
         <SettingCheckbox checked={this.props.braveryDefaults.get('noScript')} dataL10nId='noScript' onChange={this.onToggleNoScript} />
         <SettingCheckbox dataL10nId='blockCanvasFingerprinting' prefKey={settings.BLOCK_CANVAS_FINGERPRINTING} settings={this.props.settings} onChangeSetting={this.props.onChangeSetting} />
       </SettingsList>
+      <SitePermissionsPage siteSettings={this.props.siteSettings}
+        names={braveryPermissionNames}
+        defaults={this.props.braveryDefaults.merge({
+          ledgerPaymentsShown: true, shieldsUp: true})
+        } />
     </div>
   }
 }
@@ -1151,7 +1195,7 @@ class SecurityTab extends ImmutableComponent {
         }
         </span>
       </SettingsList>
-      <SitePermissionsPage siteSettings={this.props.siteSettings} />
+      <SitePermissionsPage siteSettings={this.props.siteSettings} names={permissionNames} />
     </div>
   }
 }

js/components/sortableTable.js

@@ -97,10 +97,12 @@ class SortableTable extends ImmutableComponent {
               </td>
             })
             const rowAttributes = this.getRowAttributes(row, i)
-            return <tr {...rowAttributes}
-              data-context-menu-disable={rowAttributes.onContextMenu ? true : undefined}
-              className={this.hasRowClassNames ? this.props.rowClassNames[i] + ' ' + rowAttributes.className
-                : rowAttributes.className}>{entry}</tr>
+            return row.length
+              ? <tr {...rowAttributes}
+                data-context-menu-disable={rowAttributes.onContextMenu ? true : undefined}
+                className={this.hasRowClassNames ? this.props.rowClassNames[i] + ' ' + rowAttributes.className
+                  : rowAttributes.className}>{entry}</tr>
+             : null
           })
         }
       </tbody>

js/contextMenus.js

@@ -1021,6 +1021,8 @@ function onMainContextMenu (nodeProps, frame, contextMenuType) {
     onSiteDetailContextMenu(Immutable.fromJS(nodeProps), activeFrame)
   } else if (contextMenuType === 'history') {
     onSiteDetailContextMenu(Immutable.fromJS(nodeProps))
+  } else if (contextMenuType === 'synopsis') {
+    onLedgerContextMenu(nodeProps.location, nodeProps.hostPattern)
   } else if (contextMenuType === 'download') {
     onDownloadsToolbarContextMenu(nodeProps.downloadId, Immutable.fromJS(nodeProps))
   } else {
@@ -1076,6 +1078,22 @@ function onSiteDetailContextMenu (siteDetail, activeFrame, e) {
   menu.destroy()
 }
 
+function onLedgerContextMenu (location, hostPattern) {
+  const template = [openInNewTabMenuItem(location),
+    openInNewPrivateTabMenuItem(location),
+    openInNewSessionTabMenuItem(location),
+    copyAddressMenuItem('copyLinkAddress', location),
+    CommonMenu.separatorMenuItem,
+    {
+      label: locale.translation('deleteLedgerEntry'),
+      click: () => appActions.changeSiteSetting(hostPattern, 'ledgerPaymentsShown', false)
+    }
+  ]
+  const menu = Menu.buildFromTemplate(template)
+  menu.popup(currentWindow)
+  menu.destroy()
+}
+
 function onShowBookmarkFolderMenu (bookmarks, bookmark, activeFrame, e) {
   if (e && e.stopPropagation) {
     e.stopPropagation()

test/components/ledgerPanelTest.js

@@ -1,21 +1,21 @@
-/* global describe, it, beforeEach */
+/* global describe, it, beforeEach, before */
 
 const Brave = require('../lib/brave')
-const {urlInput, addFundsButton, paymentsStatus, paymentsWelcomePage, paymentsTab, walletSwitch} = require('../lib/selectors')
+const {urlInput, addFundsButton, paymentsStatus, paymentsWelcomePage, paymentsTab, walletSwitch, ledgerTable} = require('../lib/selectors')
 const assert = require('assert')
 
 const prefsUrl = 'about:preferences'
 
-describe('Payments Panel', function () {
-  function * setup (client) {
-    yield client
-      .waitUntilWindowLoaded()
-      .waitForUrl(Brave.newTabUrl)
-      .waitForBrowserWindow()
-      .waitForVisible('#window')
-      .waitForVisible(urlInput)
-  }
+function * setup (client) {
+  yield client
+    .waitUntilWindowLoaded()
+    .waitForUrl(Brave.newTabUrl)
+    .waitForBrowserWindow()
+    .waitForVisible('#window')
+    .waitForVisible(urlInput)
+}
 
+describe('Payments Panel', function () {
   describe('can setup payments', function () {
     Brave.beforeEach(this)
     beforeEach(function * () {
@@ -95,3 +95,62 @@ describe('Payments Panel', function () {
     })
   })
 })
+
+describe('synopsis', function () {
+  function * newFrame (client, frameKey = 2) {
+    yield client
+      .ipcSend('shortcut-new-frame')
+      // wait for correct urlInput based on frameKey
+      .waitUntil(function () {
+        return this.getTabCount().then((count) => {
+          return count === frameKey
+        })
+      })
+      .windowByUrl(Brave.browserWindowUrl)
+      .waitForVisible('div[id="navigator"][data-frame-key="' + frameKey + '"] ' + urlInput)
+      .waitForElementFocus(urlInput)
+  }
+
+  Brave.beforeAll(this)
+
+  before(function * () {
+    yield setup(this.app.client)
+    yield this.app.client
+      .tabByIndex(0)
+      .loadUrl(prefsUrl)
+      .waitForVisible(paymentsTab)
+      .click(paymentsTab)
+      .waitForVisible(paymentsWelcomePage)
+      .click(walletSwitch)
+      .waitUntil(function () {
+        return this.getText(paymentsStatus).then((val) => val.includes('Creating'))
+      })
+      .waitUntil(function () {
+        return this.getText(addFundsButton).then((val) => val.includes('Add funds'))
+      })
+  })
+
+  it('no table if empty synopsis', function * () {
+    yield this.app.client
+      .isExisting(ledgerTable).then((isExisting) => isExisting === false)
+  })
+
+  it.skip('creates synopsis table after visiting a site', function * () {
+    // TODO (mrose17): re-enable this test once ledger properly ignores the 8
+    // second pageview limit during tests
+    yield this.app.client
+      .url('http://web.mit.edu/zyan/Public/wait.html')
+      .waitUntil(function () {
+        return this.getText('div').then((val) => val === 'done')
+      })
+      .windowByUrl(Brave.browserWindowUrl)
+    yield newFrame(this.app.client)
+    yield this.app.client
+      .tabByUrl(Brave.newTabUrl)
+      .loadUrl(prefsUrl)
+      .waitForVisible(paymentsTab)
+      .click(paymentsTab)
+      .waitForExist(ledgerTable)
+      .then((isExisting) => isExisting === true)
+  })
+})