alert fix

lib/components/modal/Preference/AppSettingTab.js

@@ -13,26 +13,29 @@ export default class AppSettingTab extends React.Component {
     let userName = props.user != null ? props.user.name : null
 
     this.state = {
-      toggleFinder: keymap.toggleFinder,
       user: {
         name: userName,
         alert: null
       },
-      alert: null
+      userAlert: null,
+      keymap: {
+        toggleFinder: keymap.toggleFinder
+      },
+      keymapAlert: null
     }
   }
 
   componentDidMount () {
     this.handleSettingDone = () => {
-      this.setState({alert: {
+      this.setState({keymapAlert: {
         type: 'success',
         message: 'Successfully done!'
       }})
     }
     this.handleSettingError = err => {
-      this.setState({alert: {
+      this.setState({keymapAlert: {
         type: 'error',
-        message: err.message
+        message: err.message != null ? err.message : 'Error occurs!'
       }})
     }
     ipc.addListener('APP_SETTING_DONE', this.handleSettingDone)
@@ -46,7 +49,7 @@ export default class AppSettingTab extends React.Component {
 
   submitHotKey () {
     ipc.send('hotkeyUpdated', {
-      toggleFinder: this.state.toggleFinder
+      toggleFinder: this.state.keymap.toggleFinder
     })
   }
 
@@ -64,13 +67,27 @@ export default class AppSettingTab extends React.Component {
     let { dispatch } = this.props
 
     dispatch(updateUser({name: this.state.user.name}))
+    this.setState({
+      userAlert: {
+        type: 'success',
+        message: 'Successfully done!'
+      }
+    })
   }
 
   render () {
-    let alert = this.state.alert
+    let keymapAlert = this.state.keymapAlert
-    let alertElement = alert != null ? (
+    let keymapAlertElement = keymapAlert != null
-        <p className={`alert ${alert.type}`}>
+      ? (
-          {alert.message}
+        <p className={`alert ${keymapAlert.type}`}>
+          {keymapAlert.message}
+        </p>
+      ) : null
+    let userAlert = this.state.userAlert
+    let userAlertElement = userAlert != null
+      ? (
+        <p className={`alert ${userAlert.type}`}>
+          {userAlert.message}
         </p>
       ) : null
 
@@ -84,18 +101,18 @@ export default class AppSettingTab extends React.Component {
           </div>
           <div className='sectionConfirm'>
             <button onClick={e => this.handleNameSaveButtonClick(e)}>Save</button>
-            {alertElement}
+            {userAlertElement}
           </div>
         </div>
         <div className='section'>
           <div className='sectionTitle'>Hotkey</div>
           <div className='sectionInput'>
             <label>Toggle Finder(popup)</label>
-            <input onKeyDown={e => this.handleKeyDown(e)} valueLink={this.linkState('toggleFinder')} type='text'/>
+            <input onKeyDown={e => this.handleKeyDown(e)} valueLink={this.linkState('keymap.toggleFinder')} type='text'/>
           </div>
           <div className='sectionConfirm'>
             <button onClick={e => this.handleSaveButtonClick(e)}>Save</button>
-            {alertElement}
+            {keymapAlertElement}
           </div>
           <div className='description'>
             <ul>