From 934bd85a08459b4b1770865e01546b899fd09dd6 Mon Sep 17 00:00:00 2001 From: Ryan McDermott Date: Wed, 15 Mar 2017 21:06:41 -0700 Subject: [PATCH] Fix various issues with local currency setting --- .eslintrc | 2 +- src/3-refactorable/bad/Inventory.js | 2 +- src/3-refactorable/good/actions/index.js | 5 +++++ src/3-refactorable/good/components/Cart.js | 1 - src/3-refactorable/good/components/Inventory.js | 16 ++++++++-------- src/3-refactorable/good/containers/Cart.js | 5 +++-- src/3-refactorable/good/containers/Inventory.js | 9 ++++++--- src/3-refactorable/good/index.js | 2 -- src/3-refactorable/good/reducers/index.js | 2 ++ src/3-refactorable/good/reducers/inventory.js | 4 ++-- .../good/reducers/localCurrency.js | 12 ++++++++++++ 11 files changed, 40 insertions(+), 20 deletions(-) create mode 100644 src/3-refactorable/good/reducers/localCurrency.js diff --git a/.eslintrc b/.eslintrc index 9b4c97a..5b18c48 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,7 +1,7 @@ { "env": { "browser": true, - "node": true + "node": false }, "extends": "airbnb" } diff --git a/src/3-refactorable/bad/Inventory.js b/src/3-refactorable/bad/Inventory.js index 7bafbdf..16c7c34 100644 --- a/src/3-refactorable/bad/Inventory.js +++ b/src/3-refactorable/bad/Inventory.js @@ -57,7 +57,7 @@ export default class Inventory extends Component { - Add to Cart + Cart diff --git a/src/3-refactorable/good/actions/index.js b/src/3-refactorable/good/actions/index.js index d268be5..d852899 100644 --- a/src/3-refactorable/good/actions/index.js +++ b/src/3-refactorable/good/actions/index.js @@ -4,3 +4,8 @@ export const addToCart = productId => ({ type: types.ADD_TO_CART, productId, }); + +export const changeCurrency = currency => ({ + type: types.CHANGE_CURRENCY, + currency, +}); diff --git a/src/3-refactorable/good/components/Cart.js b/src/3-refactorable/good/components/Cart.js index a98ed11..7cc4d37 100644 --- a/src/3-refactorable/good/components/Cart.js +++ b/src/3-refactorable/good/components/Cart.js @@ -10,7 +10,6 @@ export default class Cart extends Component { localCurrency: props.localCurrency, }; - console.warn(props); this.CurrencyConverter = props.currencyConverter; } diff --git a/src/3-refactorable/good/components/Inventory.js b/src/3-refactorable/good/components/Inventory.js index e9edbb1..2a5b24e 100644 --- a/src/3-refactorable/good/components/Inventory.js +++ b/src/3-refactorable/good/components/Inventory.js @@ -4,22 +4,18 @@ export default class Inventory extends Component { constructor(props) { super(); this.state = { - localCurrency: window.localCurrency, + localCurrency: props.localCurrency, inventory: props.inventory, }; - console.warn(props); - this.addToCart = props.addToCart; - + this.changeCurrency = props.changeCurrency; this.CurrencyConverter = props.currencyConverter; } onSelectCurrency(e) { - window.localCurrency = e.target.value; - this.setState({ - localCurrency: e.target.value, - }); + console.warn(e.target.value); + this.changeCurrency(e.target.value); } onAddToCart(itemId) { @@ -58,6 +54,10 @@ export default class Inventory extends Component { Price + + + Cart + {Object.keys(this.state.inventory).map(itemId => ( diff --git a/src/3-refactorable/good/containers/Cart.js b/src/3-refactorable/good/containers/Cart.js index c2e9afb..135f7ac 100644 --- a/src/3-refactorable/good/containers/Cart.js +++ b/src/3-refactorable/good/containers/Cart.js @@ -4,11 +4,11 @@ import { connect } from 'react-redux'; import CurrencyConverter from '../lib/CurrencyConverter'; import Cart from '../components/Cart'; -const CartContainer = ({ cart, inventory, currencies }) => ( +const CartContainer = ({ cart, inventory, currencies, localCurrency }) => ( ); @@ -17,6 +17,7 @@ const mapStateToProps = state => ({ cart: state.cart, inventory: state.inventory, currencies: state.currencies, + localCurrency: state.localCurrency, }); export default connect(mapStateToProps, {})(CartContainer); diff --git a/src/3-refactorable/good/containers/Inventory.js b/src/3-refactorable/good/containers/Inventory.js index 8e0477b..0d30848 100644 --- a/src/3-refactorable/good/containers/Inventory.js +++ b/src/3-refactorable/good/containers/Inventory.js @@ -1,14 +1,16 @@ import React from 'react'; import { connect } from 'react-redux'; -import { addToCart } from '../actions'; +import { addToCart, changeCurrency } from '../actions'; import CurrencyConverter from '../lib/CurrencyConverter'; import Inventory from '../components/Inventory'; -const InventoryContainer = ({ inventory, currencies, addToCart }) => ( +const InventoryContainer = ({ inventory, currencies, localCurrency, addToCart, changeCurrency }) => ( changeCurrency(currency)} addToCart={productId => addToCart(productId)} /> ); @@ -16,6 +18,7 @@ const InventoryContainer = ({ inventory, currencies, addToCart }) => ( const mapStateToProps = state => ({ inventory: state.inventory, currencies: state.currencies, + localCurrency: state.localCurrency, }); -export default connect(mapStateToProps, { addToCart })(InventoryContainer); +export default connect(mapStateToProps, { addToCart, changeCurrency })(InventoryContainer); diff --git a/src/3-refactorable/good/index.js b/src/3-refactorable/good/index.js index 3fc643c..b0a05ab 100644 --- a/src/3-refactorable/good/index.js +++ b/src/3-refactorable/good/index.js @@ -9,8 +9,6 @@ const store = createStore(reducer); export default class RefactorableGood extends Component { constructor(props) { super(); - - window.localCurrency = 'usd'; } render() { diff --git a/src/3-refactorable/good/reducers/index.js b/src/3-refactorable/good/reducers/index.js index f5d8b49..ddbeada 100644 --- a/src/3-refactorable/good/reducers/index.js +++ b/src/3-refactorable/good/reducers/index.js @@ -2,9 +2,11 @@ import { combineReducers } from 'redux'; import cart from './cart'; import inventory from './inventory'; import currencies from './currencies'; +import localCurrency from './localCurrency'; export default combineReducers({ cart, inventory, currencies, + localCurrency, }); diff --git a/src/3-refactorable/good/reducers/inventory.js b/src/3-refactorable/good/reducers/inventory.js index 8d1ae42..2775fc9 100644 --- a/src/3-refactorable/good/reducers/inventory.js +++ b/src/3-refactorable/good/reducers/inventory.js @@ -9,8 +9,8 @@ const initialState = { 2: { product: 'Tin can', img: '/tin_can.jpg', - desc: 'A ridiculously expensive tin can', - price: 42, + desc: 'Pretty much what you would expect from a tin can', + price: 32, currency: 'usd', }, 3: { diff --git a/src/3-refactorable/good/reducers/localCurrency.js b/src/3-refactorable/good/reducers/localCurrency.js new file mode 100644 index 0000000..8d0978d --- /dev/null +++ b/src/3-refactorable/good/reducers/localCurrency.js @@ -0,0 +1,12 @@ +import { CHANGE_CURRENCY } from '../constants/ActionTypes'; + +const initialState = 'usd'; + +export default (state = initialState, action) => { + switch (action.type) { + case 'CHANGE_CURRENCY': + return action.currency; + default: + return state; + } +};