From 260272cb6751cc8b9bf4edf77a8369746cb81df2 Mon Sep 17 00:00:00 2001
From: NejcZdovc <nejc.zdovc@3zsistemi.si>
Date: Thu, 15 Jun 2017 17:12:33 +0200
Subject: [PATCH] Converts CheckDefaultBrowserDialog into redux component

Resolves #9449

Auditors: @bsclifton @bridiver

Test Plan:
---
 .../main/checkDefaultBrowserDialog.js         | 59 ++++++++++++++-----
 app/renderer/components/main/main.js          | 13 +---
 2 files changed, 44 insertions(+), 28 deletions(-)

diff --git a/app/renderer/components/main/checkDefaultBrowserDialog.js b/app/renderer/components/main/checkDefaultBrowserDialog.js
index 41b4a83f327..e5d252e1903 100644
--- a/app/renderer/components/main/checkDefaultBrowserDialog.js
+++ b/app/renderer/components/main/checkDefaultBrowserDialog.js
@@ -6,10 +6,15 @@ const React = require('react')
 const {StyleSheet, css} = require('aphrodite/no-important')
 
 // Components
-const ImmutableComponent = require('../immutableComponent')
+const ReduxComponent = require('../reduxComponent')
 const Dialog = require('../common/dialog')
 const BrowserButton = require('../common/browserButton')
 const SwitchControl = require('../common/switchControl')
+const {
+  CommonFormMedium,
+  CommonFormSection,
+  CommonFormButtonWrapper
+} = require('../common/commonForm')
 
 // Actions
 const appActions = require('../../../../js/actions/appActions')
@@ -18,51 +23,73 @@ const windowActions = require('../../../../js/actions/windowActions')
 // Constants
 const settings = require('../../../../js/constants/settings')
 
+// Utils
+const {getSetting} = require('../../../../js/settings')
+
 // Styles
 const globalStyles = require('../styles/global')
 const braveAbout = require('../../../extensions/brave/img/braveAbout.png')
 
-const {
-  CommonFormMedium,
-  CommonFormSection,
-  CommonFormButtonWrapper
-} = require('../common/commonForm')
-
-class CheckDefaultBrowserDialog extends ImmutableComponent {
+class CheckDefaultBrowserDialog extends React.Component {
   constructor () {
     super()
     this.onCheckDefaultOnStartup = this.onCheckDefaultOnStartup.bind(this)
     this.onNotNow = this.onNotNow.bind(this)
+    this.onClick = this.onClick.bind(this)
     this.onUseBrave = this.onUseBrave.bind(this)
   }
 
   onCheckDefaultOnStartup (e) {
-    windowActions.setModalDialogDetail('checkDefaultBrowserDialog', {checkDefaultOnStartup: e.target.value})
+    windowActions.setModalDialogDetail('checkDefaultBrowserDialog', {
+      checkDefaultOnStartup: e.target.value
+    })
   }
   onNotNow () {
     appActions.defaultBrowserUpdated(false)
     appActions.defaultBrowserCheckComplete()
     appActions.changeSetting(settings.CHECK_DEFAULT_ON_STARTUP, this.props.checkDefaultOnStartup)
-    this.props.onHide()
+    this.onHide()
   }
   onUseBrave () {
     appActions.defaultBrowserUpdated(true)
     appActions.defaultBrowserCheckComplete()
     appActions.changeSetting(settings.CHECK_DEFAULT_ON_STARTUP, this.props.checkDefaultOnStartup)
-    this.props.onHide()
+    this.onHide()
   }
+
+  onHide () {
+    windowActions.setModalDialogDetail('checkDefaultBrowserDialog')
+  }
+
+  onClick (e) {
+    e.stopPropagation()
+  }
+
+  mergeProps (state, ownProps) {
+    const currentWindow = state.get('currentWindow')
+
+    const props = {}
+    props.checkDefaultOnStartup = currentWindow.getIn(['modalDialogDetail', 'checkDefaultBrowserDialog']) === undefined
+      ? getSetting(settings.CHECK_DEFAULT_ON_STARTUP)
+      : currentWindow.getIn(['modalDialogDetail', 'checkDefaultBrowserDialog', 'checkDefaultOnStartup'])
+
+    return props
+  }
+
   render () {
     return <Dialog className='checkDefaultBrowserDialog'>
-      <CommonFormMedium onClick={(e) => e.stopPropagation()}>
+      <CommonFormMedium onClick={this.onClick}>
         <CommonFormSection>
           <div className={css(styles.flexAlignCenter)}>
             <div className={css(styles.section__braveIcon)} />
             <div>
               <div className={css(styles.section__title)} data-l10n-id='makeBraveDefault' />
-              <SwitchControl className={css(styles.section__switchControl)}
+              <SwitchControl
+                className={css(styles.section__switchControl)}
                 rightl10nId='checkDefaultOnStartup'
                 checkedOn={this.props.checkDefaultOnStartup}
-                onClick={this.onCheckDefaultOnStartup} />
+                onClick={this.onCheckDefaultOnStartup}
+              />
             </div>
           </div>
         </CommonFormSection>
@@ -83,6 +110,8 @@ class CheckDefaultBrowserDialog extends ImmutableComponent {
   }
 }
 
+module.exports = ReduxComponent.connect(CheckDefaultBrowserDialog)
+
 const styles = StyleSheet.create({
   flexAlignCenter: {
     display: 'flex',
@@ -105,5 +134,3 @@ const styles = StyleSheet.create({
     marginTop: `calc(${globalStyles.spacing.dialogInsideMargin} / 2)`
   }
 })
-
-module.exports = CheckDefaultBrowserDialog
diff --git a/app/renderer/components/main/main.js b/app/renderer/components/main/main.js
index fe99991f648..d0af3abeb58 100644
--- a/app/renderer/components/main/main.js
+++ b/app/renderer/components/main/main.js
@@ -84,7 +84,6 @@ class Main extends ImmutableComponent {
     this.onHideAutofillCreditCardPanel = this.onHideAutofillCreditCardPanel.bind(this)
     this.onHideNoScript = this.onHideNoScript.bind(this)
     this.onHideReleaseNotes = this.onHideReleaseNotes.bind(this)
-    this.onHideCheckDefaultBrowserDialog = this.onHideCheckDefaultBrowserDialog.bind(this)
     this.onTabContextMenu = this.onTabContextMenu.bind(this)
     this.onFind = this.onFind.bind(this)
     this.onFindHide = this.onFindHide.bind(this)
@@ -568,10 +567,6 @@ class Main extends ImmutableComponent {
     windowActions.setReleaseNotesVisible(false)
   }
 
-  onHideCheckDefaultBrowserDialog () {
-    windowActions.setModalDialogDetail('checkDefaultBrowserDialog')
-  }
-
   onMouseDown (e) {
     // TODO(bsclifton): update this to use eventUtil.eventElHasAncestorWithClasses
     let node = e.target
@@ -799,13 +794,7 @@ class Main extends ImmutableComponent {
         }
         {
           checkDefaultBrowserDialogIsVisible
-            ? <CheckDefaultBrowserDialog
-              checkDefaultOnStartup={
-                this.props.windowState.getIn(['modalDialogDetail', 'checkDefaultBrowserDialog']) === undefined
-                ? getSetting(settings.CHECK_DEFAULT_ON_STARTUP)
-                : this.props.windowState.getIn(['modalDialogDetail', 'checkDefaultBrowserDialog', 'checkDefaultOnStartup'])
-              }
-              onHide={this.onHideCheckDefaultBrowserDialog} />
+            ? <CheckDefaultBrowserDialog />
             : null
         }