Converts FindBar into redux component

Resolves brave#9338

Auditors: @bsclifton @bridiver

Test Plan:

app/renderer/components/main/findbar.js

@@ -6,7 +6,7 @@ const React = require('react')
 const Immutable = require('immutable')
 
 // Components
-const ImmutableComponent = require('../immutableComponent')
+const ReduxComponent = require('../reduxComponent')
 const BrowserButton = require('../common/browserButton')
 const SwitchControl = require('../common/switchControl')
 
@@ -22,10 +22,13 @@ const windowStore = require('../../../../js/stores/windowStore')
 // Utils
 const contextMenus = require('../../../../js/contextMenus')
 const {getTextColorForBackground} = require('../../../../js/lib/color')
+const frameStateUtil = require('../../../../js/state/frameStateUtil')
 
+// Styles
 const globalStyles = require('../styles/global')
+var webviewActions = require('../../../../js/actions/webviewActions.js')
 
-class FindBar extends ImmutableComponent {
+class FindBar extends React.Component {
  constructor () {
  super()
  this.onBlur = this.onBlur.bind(this)
@@ -37,7 +40,6 @@ class FindBar extends ImmutableComponent {
  this.onFindPrev = this.onFindPrev.bind(this)
  this.onFindNext = this.onFindNext.bind(this)
  this.onCaseSensitivityChange = this.onCaseSensitivityChange.bind(this)
- this.didFrameChange = true
  }
 
  get frame () {
@@ -59,15 +61,15 @@ class FindBar extends ImmutableComponent {
  }
 
  onFindFirst () {
- this.props.onFind(this.searchString, this.isCaseSensitive, true, false)
+ this.onFind(this.searchString, this.isCaseSensitive, true, false)
  }
 
  onFindNext () {
- this.props.onFind(this.searchString, this.isCaseSensitive, true, this.props.findDetail.get('internalFindStatePresent'))
+ this.onFind(this.searchString, this.isCaseSensitive, true, this.props.findDetail.get('internalFindStatePresent'))
  }
 
  onFindPrev () {
- this.props.onFind(this.searchString, this.isCaseSensitive, false, this.props.findDetail.get('internalFindStatePresent'))
+ this.onFind(this.searchString, this.isCaseSensitive, false, this.props.findDetail.get('internalFindStatePresent'))
  }
 
  onContextMenu (e) {
@@ -123,7 +125,7 @@ class FindBar extends ImmutableComponent {
  switch (e.keyCode) {
  case keyCodes.ESC:
  e.preventDefault()
- this.props.onFindHide()
+ this.onFindHide()
  break
  case keyCodes.ENTER:
  e.preventDefault()
@@ -153,6 +155,21 @@ class FindBar extends ImmutableComponent {
  this.focus()
  }
 
+ onFindHide () {
+ const activeFrame = frameStateUtil.getActiveFrame(this.props.windowState)
+ frameStateUtil.onFindBarHide(activeFrame.get('key'))
+ }
+
+ onFind (searchString, caseSensitivity, forward, findNext) {
+ const activeFrame = frameStateUtil.getActiveFrame(this.props.windowState)
+ webviewActions.findInPage(searchString, caseSensitivity, forward, findNext)
+ if (!findNext) {
+ windowActions.setFindDetail(activeFrame.get('key'), Immutable.fromJS({
+ internalFindStatePresent: true
+ }))
+ }
+ }
+
  get numberOfMatches () {
  if (!this.props.findDetail || this.props.findDetail.get('numberOfMatches') === undefined) {
  return -1
@@ -189,6 +206,21 @@ class FindBar extends ImmutableComponent {
  return getTextColorForBackground(this.backgroundColor)
  }
 
+ mergeProps (state, ownProps) {
+ const props = {}
+
+ /*
+ paintTabs={getSetting(settings.PAINT_TABS)}
+ themeColor={activeFrame.get('themeColor')}
+ computedThemeColor={activeFrame.get('computedThemeColor')}
+ frameKey={activeFrame.get('key')}
+ selected={activeFrame.get('findbarSelected')}
+ findDetail={activeFrame.get('findDetail')}
+ */
+
+ return props
+ }
+
  render () {
  let findMatchText
  if (this.numberOfMatches !== -1 && this.activeMatchOrdinal !== -1 && this.searchString) {
@@ -260,9 +292,9 @@ class FindBar extends ImmutableComponent {
  </div>
  <span className='closeButton'
  style={findBarTextStyle}
- onClick={this.props.onFindHide}>+</span>
+ onClick={this.onFindHide}>+</span>
  </div>
  }
 }
 
-module.exports = FindBar
+module.exports = ReduxComponent.connect(FindBar)

app/renderer/components/main/main.js

@@ -625,21 +625,6 @@ class Main extends ImmutableComponent {
  windowActions.setUrlBarActive(false)
  }
 
- onFindHide () {
- const activeFrame = frameStateUtil.getActiveFrame(this.props.windowState)
- frameStateUtil.onFindBarHide(activeFrame.get('key'))
- }
-
- onFind (searchString, caseSensitivity, forward, findNext) {
- const activeFrame = frameStateUtil.getActiveFrame(this.props.windowState)
- webviewActions.findInPage(searchString, caseSensitivity, forward, findNext)
- if (!findNext) {
- windowActions.setFindDetail(activeFrame.get('key'), Immutable.fromJS({
- internalFindStatePresent: true
- }))
- }
- }
-
  onTabContextMenu (e) {
  const activeFrame = frameStateUtil.getActiveFrame(this.props.windowState)
  contextMenus.onTabsToolbarContextMenu(activeFrame.get('title'), activeFrame.get('location'), undefined, undefined, e)
@@ -865,15 +850,7 @@ class Main extends ImmutableComponent {
 
  {
  activeFrame && activeFrame.get('findbarShown') && !activeFrame.get('isFullScreen')
- ? <FindBar
- paintTabs={getSetting(settings.PAINT_TABS)}
- themeColor={activeFrame.get('themeColor')}
- computedThemeColor={activeFrame.get('computedThemeColor')}
- frameKey={activeFrame.get('key')}
- selected={activeFrame.get('findbarSelected')}
- findDetail={activeFrame.get('findDetail')}
- onFind={this.onFind}
- onFindHide={this.onFindHide} />
+ ? <FindBar />
  : null
  }
  </div>