Refactors PublisherToggle into redux component

Resolves brave#9323

Auditors: @bridiver @bscfliton

Test Plan:

app/common/lib/publisherUtil.js

@@ -0,0 +1,67 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const Immutable = require('immutable')
+
+// Constants
+const settings = require('../../../js/constants/settings')
+const siteSettingsState = require('../state/siteSettingsState')
+
+// Utils
+const {getSetting} = require('../../../js/settings')
+const {isHttpOrHttps} = require('../../../js/lib/urlutil')
+const {isSourceAboutUrl} = require('../../../js/lib/appUrlUtil')
+
+const visiblePublisher = (state, publisherId) => {
+  if (publisherId == null) {
+    return true
+  }
+
+  // ledgerPaymentsShown is undefined by default until
+  // user decide to permanently hide the publisher,
+  // so for icon to be shown it can be everything but false
+  const hostSettings = siteSettingsState.getSettingsByHost(state, publisherId)
+  const ledgerPaymentsShown = hostSettings && hostSettings.get('ledgerPaymentsShown')
+
+  return typeof ledgerPaymentsShown === 'boolean'
+    ? ledgerPaymentsShown
+    : true
+}
+
+const publisherState = {
+  enabledForPaymentsPublisher: (state, locationId) => {
+    const locationInfo = state.get('locationInfo', Immutable.Map())
+    const publisherId = locationInfo.getIn([locationId, 'publisher'])
+
+    const synopsis = state.getIn(['publisherInfo', 'synopsis'], Immutable.Map())
+    const hostSettings = siteSettingsState.getSettingsByHost(state, publisherId)
+
+    // All publishers will be enabled by default if AUTO_SUGGEST is ON,
+    // excluding publishers defined on ledger's exclusion list
+    const excluded = locationInfo.getIn([locationId, 'exclude'])
+    const autoSuggestSites = getSetting(settings.AUTO_SUGGEST_SITES)
+
+    // If session is clear then siteSettings is undefined and icon
+    // will never be shown, but synopsis may not be empty.
+    // In such cases let's check if synopsis matches current publisherId
+    const isValidPublisherSynopsis = !!synopsis.map(entry => entry.get('site'))
+      .includes(publisherId)
+
+    // hostSettings is undefined until user hit addFunds button.
+    // For such cases check autoSuggestSites for eligibility.
+    return hostSettings
+      ? hostSettings.get('ledgerPayments') !== false
+      : isValidPublisherSynopsis || (autoSuggestSites && !excluded)
+  },
+
+  shouldShowAddPublisherButton: (state, location, publisherId) => {
+    return location &&
+      !isSourceAboutUrl(location) &&
+      getSetting(settings.PAYMENTS_ENABLED) &&
+      isHttpOrHttps(location) &&
+      visiblePublisher(state, publisherId)
+  }
+}
+
+module.exports = publisherState

app/common/state/siteSettingsState.js

@@ -1,6 +1,18 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+const Immutable = require('immutable')
+
+// Constants
 const appConfig = require('../../../js/constants/appConfig')
+
+// State
 const siteSettings = require('../../../js/state/siteSettings')
 
+// Utils
+const {getHostPattern} = require('../../../js/lib/urlutil')
+
 const api = {
   getAllSiteSettings: (state, isPrivate) => {
     if (isPrivate) {
@@ -9,6 +21,13 @@ const api = {
     return state.get('siteSettings')
   },
 
+  getSettingsByHost: (state, url) => {
+    const siteSettings = state.get('siteSettings')
+    const hostPattern = getHostPattern(url)
+
+    return siteSettings ? siteSettings.get(hostPattern) : Immutable.Map()
+  },
+
   isNoScriptEnabled (state, settings) {
     return siteSettings.activeSettings(settings, state, appConfig).noScript === true
   }

app/renderer/components/navigation/navigationBar.js

@@ -24,14 +24,15 @@ const settings = require('../../../../js/constants/settings')
 
 // State
 const tabState = require('../../../common/state/tabState')
+const publisherState = require('../../../common/lib/publisherUtil')
 const frameStateUtil = require('../../../../js/state/frameStateUtil')
 
 // Store
 const windowStore = require('../../../../js/stores/windowStore')
 
 // Utils
 const cx = require('../../../../js/lib/classSet')
-const {isSourceAboutUrl} = require('../../../../js/lib/appUrlUtil')
+const {getBaseUrl} = require('../../../../js/lib/appUrlUtil')
 const siteUtil = require('../../../../js/state/siteUtil')
 const eventUtil = require('../../../../js/lib/eventUtil')
 const UrlUtil = require('../../../../js/lib/urlutil')
@@ -55,7 +56,7 @@ class NavigationBar extends React.Component {
   }
 
   onToggleBookmark () {
-    const editing = this.bookmarked
+    const editing = this.props.isBookmarked
     // show the AddEditBookmarkHanger control; saving/deleting takes place there
     let siteDetail = siteUtil.getDetailFromFrame(this.activeFrame, siteTags.BOOKMARK)
     const key = siteUtil.getSiteKey(siteDetail)
@@ -109,11 +110,6 @@ class NavigationBar extends React.Component {
     }
   }
 
-  get bookmarked () {
-    return this.props.activeFrameKey !== undefined &&
-      this.props.bookmarked
-  }
-
   componentDidMount () {
     ipc.on(messages.SHORTCUT_ACTIVE_FRAME_BOOKMARK, () => this.onToggleBookmark())
     ipc.on(messages.SHORTCUT_ACTIVE_FRAME_REMOVE_BOOKMARK, () => this.onToggleBookmark())
@@ -129,10 +125,12 @@ class NavigationBar extends React.Component {
     const activeTabShowingMessageBox = tabState.isShowingMessageBox(state, activeTabId)
     const bookmarkDetail = currentWindow.get('bookmarkDetail')
     const mouseInTitlebar = currentWindow.getIn(['ui', 'mouseInTitlebar'])
-    const title = activeFrame.get('title') || ''
+    const title = activeFrame.get('title', '')
     const loading = activeFrame.get('loading')
-    const location = activeFrame.get('location') || ''
-    const navbar = activeFrame.get('navbar') || Immutable.Map()
+    const location = activeFrame.get('location', '')
+    const locationId = getBaseUrl(location)
+    const publisherId = state.getIn(['locationInfo', locationId, 'publisher'])
+    const navbar = activeFrame.get('navbar', Immutable.Map())
 
     const hasTitle = title && location && title !== location.replace(/^https?:\/\//, '')
     const titleMode = activeTabShowingMessageBox ||
@@ -148,42 +146,36 @@ class NavigationBar extends React.Component {
       )
 
     const props = {}
-
-    props.navbar = navbar
-    props.sites = state.get('sites') // TODO(nejc) remove, primitives only
+    // used in renderer
     props.activeFrameKey = activeFrameKey
-    props.location = location
-    props.title = title
-    props.bookmarked = activeTab && activeTab.get('bookmarked')
-    props.partitionNumber = activeFrame.get('partitionNumber') || 0
-    props.isSecure = activeFrame.getIn(['security', 'isSecure'])
-    props.loading = loading
-    props.showBookmarkHanger = bookmarkDetail && bookmarkDetail.get('isBookmarkHanger')
-    props.mouseInTitlebar = mouseInTitlebar
-    props.settings = state.get('settings')
-    props.siteSettings = state.get('siteSettings')
-    props.synopsis = state.getIn(['publisherInfo', 'synopsis']) || new Immutable.Map()
-    props.activeTabShowingMessageBox = activeTabShowingMessageBox
-    props.locationInfo = state.get('locationInfo')
     props.titleMode = titleMode
-    props.isWideURLbarEnabled = getSetting(settings.WIDE_URL_BAR)
+    props.isBookmarked = props.activeFrameKey !== undefined &&
+      activeTab && activeTab.get('bookmarked')
+    props.isWideUrlBarEnabled = getSetting(settings.WIDE_URL_BAR)
+    props.showBookmarkHanger = bookmarkDetail && bookmarkDetail.get('isBookmarkHanger')
+    props.isLoading = loading
+    props.showPublisherToggle = publisherState.shouldShowAddPublisherButton(state, location, publisherId)
+    props.showHomeButton = !props.titleMode && getSetting(settings.SHOW_HOME_BUTTON)
+
+    // used in other functions
+    props.navbar = navbar // TODO(nejc) remove, primitives only
+    props.sites = state.get('sites') // TODO(nejc) remove, primitives only
     props.activeTabId = activeTabId
 
     return props
   }
 
   render () {
-    if (this.props.activeFrameKey === undefined ||
-        this.props.siteSettings === undefined) {
+    if (this.props.dontRender) {
       return null
     }
 
-    return <div id='navigator'
-      ref='navigator'
+    return <div
+      id='navigator'
       data-frame-key={this.props.activeFrameKey}
       className={cx({
         titleMode: this.props.titleMode,
-        [css(styles.navigator_wide)]: this.props.isWideURLbarEnabled
+        [css(styles.navigator_wide)]: this.props.isWideUrlBarEnabled
       })}>
       {
         this.props.showBookmarkHanger
@@ -193,7 +185,7 @@ class NavigationBar extends React.Component {
       {
         this.props.titleMode
         ? null
-        : this.props.loading
+        : this.props.isLoading
           ? <span className='navigationButtonContainer'>
             <button data-l10n-id='stopButton'
               className='normalizeButton navigationButton stopButton'
@@ -208,7 +200,7 @@ class NavigationBar extends React.Component {
           </span>
       }
       {
-        !this.props.titleMode && getSetting(settings.SHOW_HOME_BUTTON)
+        this.props.showHomeButton
         ? <span className='navigationButtonContainer'>
           <button
             data-test-id='homeButton'
@@ -222,11 +214,11 @@ class NavigationBar extends React.Component {
         {
           !this.props.titleMode
           ? <span className='bookmarkButtonContainer'>
-            <button data-l10n-id={this.bookmarked ? 'removeBookmarkButton' : 'addBookmarkButton'}
+            <button data-l10n-id={this.props.isBookmarked ? 'removeBookmarkButton' : 'addBookmarkButton'}
               className={cx({
                 navigationButton: true,
                 bookmarkButton: true,
-                removeBookmarkButton: this.bookmarked,
+                removeBookmarkButton: this.props.isBookmarked,
                 withHomeButton: getSetting(settings.SHOW_HOME_BUTTON),
                 normalizeButton: true
               })}
@@ -240,18 +232,11 @@ class NavigationBar extends React.Component {
         onStop={this.onStop}
         />
       {
-        isSourceAboutUrl(this.props.location)
-        ? null
-        : <div className='endButtons'>
-          {
-            <PublisherToggle
-              location={this.props.location}
-              locationInfo={this.props.locationInfo}
-              siteSettings={this.props.siteSettings}
-              synopsis={this.props.synopsis}
-            />
-          }
+        this.props.showPublisherToggle
+        ? <div className='endButtons'>
+          <PublisherToggle />
         </div>
+        : null
       }
     </div>
   }

app/renderer/components/navigation/navigator.js

@@ -152,6 +152,7 @@ class Navigator extends React.Component {
   mergeProps (state, ownProps) {
     const currentWindow = state.get('currentWindow')
     const activeFrame = frameStateUtil.getActiveFrame(currentWindow) || Immutable.Map()
+    const activeFrameKey = activeFrame.get('key')
     const activeTabId = activeFrame.get('tabId') || tabState.TAB_ID_NONE
     const activeTab = tabState.getByTabId(state, activeTabId)
     const activeTabShowingMessageBox = !!(activeTab && tabState.isShowingMessageBox(state, activeTabId))
@@ -186,6 +187,8 @@ class Navigator extends React.Component {
       props.totalBlocks &&
       props.shieldEnabled
     props.isWideURLbarEnabled = getSetting(settings.WIDE_URL_BAR)
+    props.showNavigationBar = activeFrameKey !== undefined &&
+      state.get('siteSettings') !== undefined
 
     // used in other functions
     props.isNavigable = activeFrame && isNavigatableAboutPage(getBaseUrl(activeFrame.get('location')))
@@ -256,7 +259,11 @@ class Navigator extends React.Component {
               />
             </div>
           </div>
-          <NavigationBar />
+          {
+            this.props.showNavigationBar
+            ? <NavigationBar />
+            : null
+          }
           <div className={cx({
             topLevelEndButtons: true,
             [css(styles.navigatorWrapper__topLevelEndButtons_isWideURLbarEnabled)]: this.props.isWideURLbarEnabled