Merge pull request #1673 from blockchain/feat/bundle-locales-seperately

Tech Debt(Async loading of large assets)

Author: plondon

packages/blockchain-info-components/src/Gauges/PasswordGauge.js

@@ -53,7 +53,7 @@ const PasswordGauge = props => {
 }
 
 PasswordGauge.propTypes = {
-  score: PropTypes.oneOf([1, 2, 3, 4, 5]).isRequired
+  score: PropTypes.oneOf([0, 1, 2, 3, 4, 5]).isRequired
 }
 
 PasswordGauge.defaultProps = {

packages/blockchain-wallet-v4-frontend/src/components/DropdownLanguage/index.js

@@ -2,7 +2,7 @@ import React from 'react'
 import { connect } from 'react-redux'
 import { bindActionCreators } from 'redux'
 
-import * as languageService from 'services/LanguageService'
+import { languagesSortedByName } from 'services/LocalesService'
 import { SimpleDropdown } from 'blockchain-info-components/src/Dropdowns'
 import { actions, selectors } from 'data'
 
@@ -36,7 +36,7 @@ class DropdownLanguageContainer extends React.PureComponent {
 
 const mapStateToProps = state => ({
   currentLanguage: selectors.preferences.getLanguage(state),
-  languages: languageService.languagesSortedByName
+  languages: languagesSortedByName
 })
 
 const mapDispatchToProps = dispatch => ({

packages/blockchain-wallet-v4-frontend/src/components/Form/PasswordBox/PasswordScore/__snapshots__/index.spec.js.snap

@@ -1,7 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`PasswordScore renders correctly 1`] = `
-<password-gauge
-  score={1}
-/>
-`;
+exports[`PasswordScore renders correctly 1`] = `<password-gauge />`;

packages/blockchain-wallet-v4-frontend/src/components/Form/PasswordBox/PasswordScore/index.js

@@ -1,12 +1,9 @@
 import React from 'react'
-import zxcvbn from 'zxcvbn'
 
 import { PasswordGauge } from 'blockchain-info-components'
 
 const PasswordScore = props => {
-  const score = zxcvbn(props.value).score + 1
-
-  return <PasswordGauge score={score} />
+  return <PasswordGauge score={props.passwordScore} />
 }
 
 export default PasswordScore

packages/blockchain-wallet-v4-frontend/src/components/Form/PasswordBox/__snapshots__/index.spec.js.snap

@@ -5,6 +5,5 @@ exports[`PasswordBox renders correctly 1`] = `
   <mockConstructor
     errorState="initial"
   />
-  <div />
 </PasswordBox__Container>
 `;

packages/blockchain-wallet-v4-frontend/src/components/Form/PasswordBox/index.js

@@ -25,10 +25,18 @@ const getErrorState = ({ touched, invalid }) => {
 }
 
 const PasswordBox = field => {
-  const { meta, input, score, disabled, borderColor, noLastPass } = field
+  const {
+    meta,
+    input,
+    showPasswordScore,
+    disabled,
+    borderColor,
+    noLastPass,
+    passwordScore
+  } = field
   const { touched, error, active } = meta
   const errorState = getErrorState(meta)
-  const scoreVisible = score ? input.value.length > 0 : false
+  const scoreVisible = showPasswordScore ? input.value.length > 0 : false
 
   return (
     <Container>
@@ -41,7 +49,7 @@ const PasswordBox = field => {
         data-e2e={field['data-e2e']}
         noLastPass={noLastPass}
       />
-      {scoreVisible ? <PasswordScore value={input.value} /> : <div />}
+      {scoreVisible && <PasswordScore passwordScore={passwordScore} />}
       {touched && error && (
         <Error
           size='12px'

packages/blockchain-wallet-v4-frontend/src/components/Form/SelectBoxLanguages/index.js

@@ -1,11 +1,14 @@
 import React from 'react'
 import { connect } from 'react-redux'
-import { map } from 'ramda'
+import { assoc, curry, keys, map, reduce } from 'ramda'
 
 import { selectors } from 'data'
 import SelectBox from '../SelectBox'
-import { renameKeys } from 'services/RamdaCookingBook'
-import * as languageService from 'services/LanguageService'
+import { languagesSortedByName } from 'services/LocalesService'
+
+const renameKeys = curry((keysMap, obj) =>
+  reduce((acc, key) => assoc(keysMap[key] || key, obj[key], acc), {}, keys(obj))
+)
 
 class SelectBoxLanguages extends React.PureComponent {
   render () {
@@ -20,9 +23,9 @@ class SelectBoxLanguages extends React.PureComponent {
   }
 }
 
-const mapStateToProps = (state, ownProps) => ({
+const mapStateToProps = state => ({
   language: selectors.preferences.getLanguage(state),
-  languages: languageService.languagesSortedByName
+  languages: languagesSortedByName
 })
 
 export default connect(mapStateToProps)(SelectBoxLanguages)

packages/blockchain-wallet-v4-frontend/src/data/modules/settings/sagas.js

@@ -1,9 +1,9 @@
 import { put, call, select } from 'redux-saga/effects'
 import profileSagas from 'data/modules/profile/sagas'
-import * as actions from '../../actions.js'
-import * as selectors from '../../selectors.js'
+import * as actions from '../../actions'
+import * as selectors from '../../selectors'
 import * as C from 'services/AlertService'
-import { addLanguageToUrl } from 'services/LanguageService'
+import { addLanguageToUrl } from 'services/LocalesService'
 import {
   askSecondPasswordEnhancer,
   promptForSecondPassword

packages/blockchain-wallet-v4-frontend/src/data/preferences/sagas.js

@@ -1,7 +1,7 @@
 import { put } from 'redux-saga/effects'
 import * as actions from '../actions.js'
 import * as C from 'services/AlertService'
-import { addLanguageToUrl } from 'services/LanguageService'
+import { addLanguageToUrl } from 'services/LocalesService'
 
 export default () => {
   const logLocation = 'preferences/sagas'

packages/blockchain-wallet-v4-frontend/src/data/rootSaga.js

@@ -11,7 +11,7 @@ import preferences from './preferences/sagaRegister'
 import goals from './goals/sagaRegister'
 import router from './router/sagaRegister'
 import wallet from './wallet/sagaRegister'
-import { tryParseLanguageFromUrl } from 'services/LanguageService'
+import { tryParseLanguageFromUrl } from 'services/LocalesService'
 
 const logLocation = 'data/rootSaga'