From 09acc17e0b127c0463a594c851bfc0ecdca830f9 Mon Sep 17 00:00:00 2001
From: NejcZdovc <nejc.zdovc@3zsistemi.si>
Date: Tue, 13 Jun 2017 17:59:24 +0200
Subject: [PATCH] Converts FindBar into redux component

Resolves #9338

Auditors: @bsclifton @bridiver

Test Plan:
---
 app/renderer/components/main/findbar.js | 50 ++++++++++++++++++++-----
 app/renderer/components/main/main.js    | 25 +------------
 2 files changed, 42 insertions(+), 33 deletions(-)

diff --git a/app/renderer/components/main/findbar.js b/app/renderer/components/main/findbar.js
index 95e5ee1f02b..3947b8671a3 100644
--- a/app/renderer/components/main/findbar.js
+++ b/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)
diff --git a/app/renderer/components/main/main.js b/app/renderer/components/main/main.js
index 350c4accb90..b9c544290df 100644
--- a/app/renderer/components/main/main.js
+++ b/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>