<commit_before>// @flow
import React, { Component } from 'react'
import { map, reject } from 'lodash'
import fs from 'fs'
import storage from 'electron-json-storage'

import { recoverWallet } from '../../modules/generateWallet'

import Button from '../../components/Button'
import { EXPLORERS, MODAL_TYPES, CURRENCIES } from '../../core/constants'

import Delete from 'react-icons/lib/md/delete'

const { dialog } = require('electron').remote

type Props = {
  setAccounts: (Array<Object>) => any,
  setBlockExplorer: string => any,
  explorer: string,
  setCurrency: string => any,
  currency: string,
  accounts: any,
  showModal: Function,
  showSuccessNotification: Object => any,
  showErrorNotification: Object => any
}

type State = {
  explorer: string
}

export default class Settings extends Component<Props, State> {
  state = {
    explorer: this.props.explorer,
    currency: this.props.currency
  }

  saveWalletRecovery = () => {
    const { showSuccessNotification, showErrorNotification } = this.props

    storage.get('userWallet', (errorReading, data) => {
      if (errorReading) {
        showErrorNotification({
          message: `An error occurred reading wallet file: ${
            errorReading.message
          }`
        })
        return
      }
      const content = JSON.stringify(data)
      dialog.showSaveDialog(
        {
          filters: [
            {
              name: 'JSON',
              extensions: ['json']
            }
          ]
        },
        fileName => {
          if (fileName === undefined) {
            return
          }
          // fileName is a string that contains the path and filename created in the save file dialog.
          fs.writeFile(fileName, content, errorWriting => {
            if (errorWriting) {
              showErrorNotification({
                message: `An error occurred creating the file: ${
                  errorWriting.message
                }`
              })
            } else {
              showSuccessNotification({
                message: 'The file has been succesfully saved'
              })
            }
          })
        }
      )
    })
  }

  loadWalletRecovery = () => {
    const {
      showSuccessNotification,
      showErrorNotification,
      setAccounts
    } = this.props

    dialog.showOpenDialog(fileNames => {
      // fileNames is an array that contains all the selected
      if (fileNames === undefined) {
        return
      }
      const filepath = fileNames[0]
      fs.readFile(filepath, 'utf-8', (err, data) => {
        if (err) {
          showErrorNotification({
            message: `An error occurred reading the file: ${err.message}`
          })
          return
        }
        const walletData = JSON.parse(data)

        recoverWallet(walletData)
          .then(data => {
            showSuccessNotification({ message: 'Recovery was successful.' })
            setAccounts(data.accounts)
          })
          .catch(e => {
            showErrorNotification({
              message: `An error occurred recovering wallet: ${e.message}`
            })
          })
      })
    })
  }

  updateExplorerSettings = (e: Object) => {
    const { setBlockExplorer } = this.props
    setBlockExplorer(e.target.value)
  }

  updateCurrencySettings = (e: Object) => {
    const { setCurrency } = this.props
    setCurrency(e.target.value)
  }

  deleteWalletAccount = (label: string, key: string) => {
    const {
      showSuccessNotification,
      showErrorNotification,
      setAccounts,
      showModal
    } = this.props

    showModal(MODAL_TYPES.CONFIRM, {
      title: 'Confirm Delete',
      text: `Please confirm deleting saved wallet - ${label}`,
      onClick: () => {
        storage.get('userWallet', (readError, data) => {
          if (readError) {
            showErrorNotification({ message: `An error occurred reading previously stored wallet: ${readError.message}` })
          }

          data.accounts = reject(data.accounts, { key })

          storage.set('userWallet', data, saveError => {
            if (saveError) {
              showErrorNotification({
                message: `An error occurred updating the wallet: ${
                  saveError.message
                }`
              })
            } else {
              showSuccessNotification({
                message: 'Account deletion was successful.'
              })
              setAccounts(data.accounts)
            }
          })
        })
      }
    })
  }

  openTokenModal = () => {
    this.props.showModal(MODAL_TYPES.TOKEN)
  }

  render () {
    const { accounts, explorer, currency } = this.props

    return (
      <div id="settings">
        <div className="description">
          Manage your Neon wallet accounts and settings
        </div>
        <div className="settingsForm">
          <div className="settingsItem">
            <div className="itemTitle">Tokens</div>
            <Button onClick={this.openTokenModal}>Manage Tokens</Button>
          </div>
          <div className="settingsItem">
            <div className="itemTitle">Block Explorer</div>
            <select value={explorer} onChange={this.updateExplorerSettings}>
              {Object.keys(EXPLORERS).map((explorer: ExplorerType) => (
                <option key={explorer} value={EXPLORERS[explorer]}>
                  {EXPLORERS[explorer]}
                </option>
              ))}
            </select>
          </div>
          <div className="settingsItem">
            <div className="itemTitle">Currency</div>
            <select value={currency} onChange={this.updateCurrencySettings}>
              {Object.keys(CURRENCIES).map((currencyCode: string) => (
                <option value={currencyCode} key={currencyCode}>
                  {currencyCode.toUpperCase()}
                </option>
              ))}
            </select>
          </div>
          <div className="settingsItem">
            <div className="itemTitle">Saved Wallet Accounts</div>
            {map(accounts, account => {
              return (
                <div className="walletList" key={`wallet${account.key}`}>
                  <div className="walletItem">
                    <div className="walletName">{account.key.slice(0, 20)}</div>
                    <div className="walletKey">{account.label}</div>
                    <div
                      className="deleteWallet"
                      onClick={() =>
                        this.deleteWalletAccount(account.label, account.key)
                      }
                    >
                      <Delete />
                    </div>
                  </div>
                </div>
              )
            })}
          </div>
          <Button onClick={() => this.saveWalletRecovery()}>
            Export wallet recovery file
          </Button>
          <Button onClick={this.loadWalletRecovery}>
            Load wallet recovery file
          </Button><commit_msg>Cleaned up settings component syntax<commit_after>// @flow
import React, { Component } from 'react'
import { map, reject } from 'lodash'
import fs from 'fs'
import storage from 'electron-json-storage'

import { recoverWallet } from '../../modules/generateWallet'

import Button from '../../components/Button'
import { EXPLORERS, MODAL_TYPES, CURRENCIES } from '../../core/constants'

import Delete from 'react-icons/lib/md/delete'

const { dialog } = require('electron').remote

type Props = {
  setAccounts: (Array<Object>) => any,
  setBlockExplorer: string => any,
  explorer: string,
  setCurrency: string => any,
  currency: string,
  accounts: any,
  showModal: Function,
  showSuccessNotification: Object => any,
  showErrorNotification: Object => any
}

type State = {
  explorer: string
}

export default class Settings extends Component<Props, State> {
  state = {
    explorer: this.props.explorer,
    currency: this.props.currency
  }

  saveWalletRecovery = () => {
    const { showSuccessNotification, showErrorNotification } = this.props

    storage.get('userWallet', (errorReading, data) => {
      if (errorReading) {
        showErrorNotification({ message: `An error occurred reading wallet file: ${errorReading.message}` })
        return
      }
      const content = JSON.stringify(data)
      dialog.showSaveDialog({
        filters: [{ name: 'JSON', extensions: ['json'] }]
      }, (fileName) => {
        if (fileName === undefined) {
          return
        }
        // fileName is a string that contains the path and filename created in the save file dialog.
        fs.writeFile(fileName, content, (errorWriting) => {
          if (errorWriting) {
            showErrorNotification({ message: `An error occurred creating the file: ${errorWriting.message}` })
          } else {
            showSuccessNotification({ message: 'The file has been succesfully saved' })
          }
        })
      })
    })
  }

  loadWalletRecovery = () => {
    const {
      showSuccessNotification,
      showErrorNotification,
      setAccounts
    } = this.props

    dialog.showOpenDialog(fileNames => {
      // fileNames is an array that contains all the selected
      if (!fileNames) {
        return
      }
      const filepath = fileNames[0]
      fs.readFile(filepath, 'utf-8', (err, data) => {
        if (err) {
          showErrorNotification({ message: `An error occurred reading the file: ${err.message}` })
          return
        }
        const walletData = JSON.parse(data)

        recoverWallet(walletData)
          .then((data) => {
            showSuccessNotification({ message: 'Recovery was successful.' })
            setAccounts(data.accounts)
          })
          .catch((err) => {
            showErrorNotification({ message: `An error occurred recovering wallet: ${err.message}` })
          })
      })
    })
  }

  updateExplorerSettings = (e: Object) => {
    const { setBlockExplorer } = this.props
    setBlockExplorer(e.target.value)
  }

  updateCurrencySettings = (e: Object) => {
    const { setCurrency } = this.props
    setCurrency(e.target.value)
  }

  deleteWalletAccount = (label: string, key: string) => {
    const {
      showSuccessNotification,
      showErrorNotification,
      setAccounts,
      showModal
    } = this.props

    showModal(MODAL_TYPES.CONFIRM, {
      title: 'Confirm Delete',
      text: `Please confirm deleting saved wallet - ${label}`,
      onClick: () => {
        storage.get('userWallet', (readError, data) => {
          if (readError) {
            showErrorNotification({ message: `An error occurred reading previously stored wallet: ${readError.message}` })
            return
          }

          data.accounts = reject(data.accounts, { key })

          storage.set('userWallet', data, saveError => {
            if (saveError) {
              showErrorNotification({ message: `An error occurred updating the wallet: ${saveError.message}` })
            } else {
              showSuccessNotification({ message: 'Account deletion was successful.' })
              setAccounts(data.accounts)
            }
          })
        })
      }
    })
  }

  openTokenModal = () => {
    this.props.showModal(MODAL_TYPES.TOKEN)
  }

  render () {
    const { accounts, explorer, currency } = this.props

    return (
      <div id="settings">
        <div className="description">
          Manage your Neon wallet accounts and settings
        </div>
        <div className="settingsForm">
          <div className="settingsItem">
            <div className="itemTitle">Tokens</div>
            <Button onClick={this.openTokenModal}>Manage Tokens</Button>
          </div>
          <div className="settingsItem">
            <div className="itemTitle">Block Explorer</div>
            <select value={explorer} onChange={this.updateExplorerSettings}>
              {Object.keys(EXPLORERS).map((explorer: ExplorerType) => (
                <option key={explorer} value={EXPLORERS[explorer]}>
                  {EXPLORERS[explorer]}
                </option>
              ))}
            </select>
          </div>
          <div className="settingsItem">
            <div className="itemTitle">Currency</div>
            <select value={currency} onChange={this.updateCurrencySettings}>
              {Object.keys(CURRENCIES).map((currencyCode: string) => (
                <option value={currencyCode} key={currencyCode}>
                  {currencyCode.toUpperCase()}
                </option>
              ))}
            </select>
          </div>
          <div className="settingsItem">
            <div className="itemTitle">Saved Wallet Accounts</div>
            {map(accounts, (account) => (
              <div className="walletList" key={`wallet${account.key}`}>
                <div className="walletItem">
                  <div className="walletName">{account.key.slice(0, 20)}</div>
                  <div className="walletKey">{account.label}</div>
                  <div
                    className="deleteWallet"
                    onClick={() => this.deleteWalletAccount(account.label, account.key)}
                  >
                    <Delete />
                  </div>
                </div>
              </div>
            ))}
          </div>
          <Button onClick={() => this.saveWalletRecovery()}>
            Export wallet recovery file
          </Button>
          <Button onClick={this.loadWalletRecovery}>
            Load wallet recovery file
          </Button>
{'fraction_non_alphanumeric': 0.11924360400444939, 'fraction_numerical': 0.0007415647015202076, 'mean_word_length': 1.9014629948364887, 'pattern_counts': {'":': 0, '<': 97, '<?xml version=': 0, '>': 149, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2746894', 'n_tokens_mistral': 3558, 'n_tokens_neox': 3541, 'n_words': 800}