Folder restructure (#6304)

* Remove ui/app/keychains/

* Remove ui/app/img/ (unused images)

* Move conversion-util to helpers/utils/

* Move token-util to helpers/utils/

* Move /helpers/*.js inside /helpers/utils/

* Move util tests inside /helpers/utils/

* Renameand move confirm-transaction/util.js to helpers/utils/

* Move higher-order-components to helpers/higher-order-components/

* Move infura-conversion.json to helpers/constants/

* Move all utility functions to helpers/utils/

* Move pages directory to top-level

* Move all constants to helpers/constants/

* Move metametrics inside helpers/

* Move app and root inside pages/

* Move routes inside helpers/

* Re-organize ducks/

* Move reducers to ducks/

* Move selectors inside selectors/

* Move test out of test folder

* Move action, reducer, store inside store/

* Move ui components inside ui/

* Move UI components inside ui/

* Move connected components inside components/app/

* Move i18n-helper inside helpers/

* Fix unit tests

* Fix unit test

* Move pages components

* Rename routes component

* Move reducers to ducks/index

* Fix bad path in unit test

app/scripts/controllers/transactions/tx-gas-utils.js

@@ -7,7 +7,7 @@ const {
 const { addHexPrefix } = require('ethereumjs-util')
 const SIMPLE_GAS_COST = '0x5208' // Hex for 21000, cost of a simple send.
 
-import { TRANSACTION_NO_CONTRACT_ERROR_KEY } from '../../../../ui/app/constants/error-keys'
+import { TRANSACTION_NO_CONTRACT_ERROR_KEY } from '../../../../ui/app/helpers/constants/error-keys'
 
 /**
 tx-gas-utils are gas utility methods for Transaction manager

development/mock-dev.js

@@ -14,9 +14,9 @@
 
 const render = require('react-dom').render
 const h = require('react-hyperscript')
-const Root = require('../ui/app/root')
-const configureStore = require('../ui/app/store')
-const actions = require('../ui/app/actions')
+const Root = require('../ui/app/pages')
+const configureStore = require('../ui/app/store/store')
+const actions = require('../ui/app/store/actions')
 const states = require('./states')
 const backGroundConnectionModifiers = require('./backGroundConnectionModifiers')
 const Selector = require('./selector')

development/ui-dev.js

@@ -17,7 +17,7 @@
 
 const render = require('react-dom').render
 const h = require('react-hyperscript')
-const Root = require('../ui/app/root')
+const Root = require('../ui/app/pages')
 const configureStore = require('./uiStore')
 const states = require('./states')
 const Selector = require('./selector')

development/uiStore.js

@@ -2,7 +2,7 @@ const createStore = require('redux').createStore
 const applyMiddleware = require('redux').applyMiddleware
 const thunkMiddleware = require('redux-thunk').default
 const createLogger = require('redux-logger').createLogger
-const rootReducer = require('../ui/app/reducers')
+const rootReducer = require('../ui/app/ducks')
 
 module.exports = configureStore
 

docs/adding-new-networks.md

@@ -5,7 +5,7 @@ To add another network to our dropdown menu, make sure the following files are a
 ```
 app/scripts/config.js
 app/scripts/lib/buy-eth-url.js
-ui/app/app.js
+ui/app/index.js
 ui/app/components/buy-button-subview.js
 ui/app/components/drop-menu-item.js
 ui/app/components/network.js

mascara/src/app/buy-ether-widget/index.js

@@ -5,7 +5,7 @@ import {connect} from 'react-redux'
 import {qrcode} from 'qrcode-generator'
 import copyToClipboard from 'copy-to-clipboard'
 import ShapeShiftForm from '../shapeshift-form'
-import {buyEth, showAccountDetail} from '../../../../ui/app/actions'
+import {buyEth, showAccountDetail} from '../../../../ui/app/store/actions'
 
 const OPTION_VALUES = {
   COINBASE: 'coinbase',

mascara/src/app/shapeshift-form/index.js

@@ -3,8 +3,8 @@ import PropTypes from 'prop-types'
 import classnames from 'classnames'
 import qrcode from 'qrcode-generator'
 import {connect} from 'react-redux'
-import {shapeShiftSubview, pairUpdate, buyWithShapeShift} from '../../../../ui/app/actions'
-import {isValidAddress} from '../../../../ui/app/util'
+import {shapeShiftSubview, pairUpdate, buyWithShapeShift} from '../../../../ui/app/store/actions'
+import {isValidAddress} from '../../../../ui/app/helpers/utils/util'
 
 export class ShapeShiftForm extends Component {
   static propTypes = {

test/unit/actions/config_test.js

@@ -3,8 +3,8 @@ var assert = require('assert')
 var freeze = require('deep-freeze-strict')
 var path = require('path')
 
-var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'actions.js'))
-var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'reducers.js'))
+var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'store', 'actions.js'))
+var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'ducks', 'index.js'))
 
 describe('config view actions', function () {
   var initialState = {

test/unit/actions/set_account_label_test.js

@@ -2,8 +2,8 @@ const assert = require('assert')
 const freeze = require('deep-freeze-strict')
 const path = require('path')
 
-const actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'actions.js'))
-const reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'reducers.js'))
+const actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'store', 'actions.js'))
+const reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'ducks', 'index.js'))
 
 describe('SET_ACCOUNT_LABEL', function () {
   it('updates the state.metamask.identities[:i].name property of the state to the action.value.label', function () {

test/unit/actions/set_selected_account_test.js

@@ -3,8 +3,8 @@ var assert = require('assert')
 var freeze = require('deep-freeze-strict')
 var path = require('path')
 
-var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'actions.js'))
-var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'reducers.js'))
+var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'store', 'actions.js'))
+var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'ducks', 'index.js'))
 
 describe('SET_SELECTED_ACCOUNT', function () {
   it('sets the state.appState.activeAddress property of the state to the action.value', function () {

test/unit/actions/tx_test.js

@@ -4,7 +4,7 @@ var path = require('path')
 import configureMockStore from 'redux-mock-store'
 import thunk from 'redux-thunk'
 
-const actions = require(path.join(__dirname, '../../../ui/app/actions.js'))
+const actions = require(path.join(__dirname, '../../../ui/app/store/actions.js'))
 
 const middlewares = [thunk]
 const mockStore = configureMockStore(middlewares)

test/unit/actions/view_info_test.js

@@ -3,8 +3,8 @@ var assert = require('assert')
 var freeze = require('deep-freeze-strict')
 var path = require('path')
 
-var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'actions.js'))
-var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'reducers.js'))
+var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'store', 'actions.js'))
+var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'ducks', 'index.js'))
 
 describe('SHOW_INFO_PAGE', function () {
   it('sets the state.appState.currentView.name property to info', function () {

test/unit/actions/warning_test.js

@@ -3,8 +3,8 @@ var assert = require('assert')
 var freeze = require('deep-freeze-strict')
 var path = require('path')
 
-var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'actions.js'))
-var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'reducers.js'))
+var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'store', 'actions.js'))
+var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'ducks', 'index.js'))
 
 describe('action DISPLAY_WARNING', function () {
   it('sets appState.warning to provided value', function () {

test/unit/balance-formatter-test.js

@@ -1,6 +1,6 @@
 const assert = require('assert')
 const currencyFormatter = require('currency-formatter')
-const infuraConversion = require('../../ui/app/infura-conversion.json')
+const infuraConversion = require('../../ui/app/helpers/constants/infura-conversion.json')
 
 describe('currencyFormatting', function () {
   it('be able to format any infura currency', function (done) {

test/unit/reducers/unlock_vault_test.js

@@ -4,8 +4,8 @@ var assert = require('assert')
 var path = require('path')
 var sinon = require('sinon')
 
-var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'actions.js'))
-var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'reducers.js'))
+var actions = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'store', 'actions.js'))
+var reducers = require(path.join(__dirname, '..', '..', '..', 'ui', 'app', 'ducks', 'index.js'))
 
 describe('#unlockMetamask(selectedAccount)', function () {
   beforeEach(function () {

test/unit/responsive/components/dropdown-test.js

@@ -3,7 +3,7 @@ const assert = require('assert')
 const h = require('react-hyperscript')
 const sinon = require('sinon')
 const path = require('path')
-const Dropdown = require(path.join(__dirname, '..', '..', '..', '..', 'ui', 'app', 'components', 'dropdowns', 'index.js')).Dropdown
+const Dropdown = require(path.join(__dirname, '..', '..', '..', '..', 'ui', 'app', 'components', 'app', 'dropdowns', 'index.js')).Dropdown
 
 const { createMockStore } = require('redux-test-utils')
 const { mountWithStore } = require('../../../lib/render-helpers')

test/unit/ui/app/actions.spec.js

@@ -16,7 +16,7 @@ const { createTestProviderTools } = require('../../../stub/provider')
 const provider = createTestProviderTools({ scaffold: {}}).provider
 
 const enLocale = require('../../../../app/_locales/en/messages.json')
-const actions = require('../../../../ui/app/actions')
+const actions = require('../../../../ui/app/store/actions')
 const MetaMaskController = require('../../../../app/scripts/metamask-controller')
 
 const firstTimeState = require('../../../unit/localhostState')

test/unit/ui/app/components/token-cell.spec.js

@@ -5,8 +5,8 @@ import { Provider } from 'react-redux'
 import configureMockStore from 'redux-mock-store'
 import { mount } from 'enzyme'
 
-import TokenCell from '../../../../../ui/app/components/token-cell'
-import Identicon from '../../../../../ui/app/components/identicon'
+import TokenCell from '../../../../../ui/app/components/app/token-cell'
+import Identicon from '../../../../../ui/app/components/ui/identicon'
 
 describe('Token Cell', () => {
   let wrapper

test/unit/ui/app/reducers/app.spec.js

@@ -1,6 +1,6 @@
 import assert from 'assert'
-import reduceApp from '../../../../../ui/app/reducers/app'
-import * as actions from '../../../../../ui/app/actions'
+import reduceApp from '../../../../../ui/app/ducks/app/app'
+import * as actions from '../../../../../ui/app/store/actions'
 
 describe('App State', () => {
 

test/unit/ui/app/reducers/metamask.spec.js

@@ -1,6 +1,6 @@
 import assert from 'assert'
-import reduceMetamask from '../../../../../ui/app/reducers/metamask'
-import * as actions from '../../../../../ui/app/actions'
+import reduceMetamask from '../../../../../ui/app/ducks/metamask/metamask'
+import * as actions from '../../../../../ui/app/store/actions'
 
 describe('MetaMask Reducers', () => {
 

test/unit/ui/app/selectors.spec.js

@@ -1,5 +1,5 @@
 const assert = require('assert')
-const selectors = require('../../../../ui/app/selectors')
+const selectors = require('../../../../ui/app/selectors/selectors')
 const mockState = require('../../../data/mock-state.json')
 const Eth = require('ethjs')
 

test/unit/util_test.js

@@ -3,7 +3,7 @@ var sinon = require('sinon')
 const ethUtil = require('ethereumjs-util')
 
 var path = require('path')
-var util = require(path.join(__dirname, '..', '..', 'ui', 'app', 'util.js'))
+var util = require(path.join(__dirname, '..', '..', 'ui', 'app', 'helpers', 'utils', 'util.js'))
 
 describe('util', function () {
   var ethInWei = '1'

ui/app/components/account-dropdowns.js → ui/app/components/app/account-dropdowns.js

@@ -1,15 +1,15 @@
 const Component = require('react').Component
 const PropTypes = require('prop-types')
 const h = require('react-hyperscript')
-const actions = require('../actions')
+const actions = require('../../store/actions')
 const genAccountLink = require('etherscan-link').createAccountLink
 const connect = require('react-redux').connect
 const Dropdown = require('./dropdown').Dropdown
 const DropdownMenuItem = require('./dropdown').DropdownMenuItem
 const copyToClipboard = require('copy-to-clipboard')
-const { checksumAddress } = require('../util')
+const { checksumAddress } = require('../../helpers/utils/util')
 
-import Identicon from './identicon'
+import Identicon from '../ui/identicon'
 
 class AccountDropdowns extends Component {
   constructor (props) {