+
Currency Exchange
-
- {exchageRates.map((row) => (
-
- ))}
+
+
+
+ {isLoading ? (
+
Loading Rates
+ ) : (
+ exchangeRates.map((row, index) => (
+
+ ))
+ )}
+
+
+
+
+
+
+
+
+
handleQuantitySub()}
+ className={left__arrow}
+ >
+ «
+
+
+ {quantity}
+
+
handleQuantityAdd()}
+ className={right__arrow}
+ >
+ »
+
+
+
handleButtonClick()} buttonPrimary>
+ Exchange
+
+
);
-}
+};
+
+const mapStateToProps = createStructuredSelector({
+ isLoading: selectIsFetchingExchangeRates,
+ exchangeRates: selectCurrencyExchangeRates,
+ currencies: selectBankCurrencies,
+ currentUser: selectCurrentUser,
+});
+const mapDispatchToProps = (dispatch) => ({
+ getRatesStartAsysnc: () => dispatch(getCurrencyExchangeRatesStartAsync()),
+ getUserStartAsync: () => dispatch(getCurrentUserStartAsync()),
+});
+export default connect(mapStateToProps, mapDispatchToProps)(CurrencyExchange);
diff --git a/redux/bank/bank.action.types.js b/redux/bank/bank.action.types.js
new file mode 100644
index 0000000..823254f
--- /dev/null
+++ b/redux/bank/bank.action.types.js
@@ -0,0 +1,7 @@
+export const BankActionTypes = {
+ SET_CURRENCY_EXCHANGE_RATES: 'SET_CURRENCY_EXCHANGE_RATES',
+ SET_BANK_CURRENCIES: 'SET_BANK_CURRENCIES',
+ GET_CURRENCY_EXCHANGE_RATES_START: 'GET_CURRENCY_EXCHANGE_RATES_START',
+ GET_CURRENCY_EXCHANGE_RATES_SUCCESS: 'GET_CURRENCY_EXCHANGE_RATES_SUCCESS',
+ GET_CURRENCY_EXCHANGE_RATES_FALIURE: 'GET_CURRENCY_EXCHANGE_RATES_FALIURE',
+};
diff --git a/redux/bank/bank.actions.js b/redux/bank/bank.actions.js
new file mode 100644
index 0000000..9d8dcd4
--- /dev/null
+++ b/redux/bank/bank.actions.js
@@ -0,0 +1,39 @@
+import { BankActionTypes } from './bank.action.types';
+import fetchData from 'utils/fetchData';
+export const setCurrencyExchangeRtaes = (rates) => ({
+ type: BankActionTypes.SET_CURRENCY_EXCHANGE_RATES,
+ payload: rates,
+});
+
+export const setBankCurrencies = (currencies) => ({
+ type: BankActionTypes.SET_BANK_CURRENCIES,
+ payload: currencies,
+});
+
+export const getCurrencyExchangeRatesStart = () => ({
+ type: BankActionTypes.GET_CURRENCY_EXCHANGE_RATES_START,
+});
+
+export const getCurrencyExchangeRatesSuccess = (rates) => ({
+ type: BankActionTypes.GET_CURRENCY_EXCHANGE_RATES_SUCCESS,
+ payload: rates,
+});
+
+export const getCurrencyExchangeRatesFaliure = (message) => ({
+ type: BankActionTypes.GET_CURRENCY_EXCHANGE_RATES_FALIURE,
+ payload: message,
+});
+
+export const getCurrencyExchangeRatesStartAsync = () => {
+ return async (dispatch) => {
+ const BASE_API_URL = process.env.NEXT_PUBLIC_BASE_API_URL;
+ const EXCHANGE_RATES_URL = `${BASE_API_URL}/rates`;
+ dispatch(getCurrencyExchangeRatesStart());
+ try {
+ const { data } = await fetchData(`${EXCHANGE_RATES_URL}`);
+ dispatch(getCurrencyExchangeRatesSuccess(data ? data : []));
+ } catch (error) {
+ dispatch(getCurrencyExchangeRatesFaliure(error.message));
+ }
+ };
+};
diff --git a/redux/bank/bank.reducer.js b/redux/bank/bank.reducer.js
new file mode 100644
index 0000000..bc05bf7
--- /dev/null
+++ b/redux/bank/bank.reducer.js
@@ -0,0 +1,38 @@
+import { BankActionTypes } from './bank.action.types';
+import exchangeRates from 'mock/exchange-rates';
+import currencies from 'mock/currency';
+const INITIAL_STATE = {
+ exchangeRates,
+ bankCurrencies: currencies,
+ isFetchingExchangeRates: false,
+ exchangeRatesFaliureMessage: '',
+};
+const bankReducer = (state = INITIAL_STATE, action) => {
+ switch (action.type) {
+ case BankActionTypes.GET_CURRENCY_EXCHANGE_RATES_START:
+ return {
+ ...state,
+ isFetchingExchangeRates: true,
+ };
+ case BankActionTypes.GET_CURRENCY_EXCHANGE_RATES_SUCCESS:
+ return {
+ ...state,
+ exchangeRates: action.payload,
+ isFetchingExchangeRates: false,
+ };
+ case BankActionTypes.GET_CURRENCY_EXCHANGE_RATES_FALIURE:
+ return {
+ ...state,
+ isFetchingExchangeRates: false,
+ exchangeRatesFaliureMessage: action.payload,
+ };
+ case BankActionTypes.SET_BANK_CURRENCIES:
+ return {
+ ...state,
+ bankCurrencies: action.payload,
+ };
+ default:
+ return state;
+ }
+};
+export default bankReducer;
diff --git a/redux/bank/bank.selectors.js b/redux/bank/bank.selectors.js
new file mode 100644
index 0000000..18c9966
--- /dev/null
+++ b/redux/bank/bank.selectors.js
@@ -0,0 +1,21 @@
+import { createSelector } from 'reselect';
+
+const selectBank = (state) => state.bank;
+export const selectCurrencyExchangeRates = createSelector(
+ [selectBank],
+ (bank) => bank.exchangeRates
+);
+
+export const selectBankCurrencies = createSelector(
+ [selectBank],
+ (bank) => bank.bankCurrencies
+);
+export const selectIsFetchingExchangeRates = createSelector(
+ [selectBank],
+ (bank) => bank.isFetchingExchangeRates
+);
+
+export const selectExchangeRatesFaliureMessage = createSelector(
+ [selectBank],
+ (bank) => bank.exchangeRatesFaliureMessage
+);
diff --git a/redux/reducers/index.js b/redux/reducers/index.js
index 12ae9db..e63dc0a 100644
--- a/redux/reducers/index.js
+++ b/redux/reducers/index.js
@@ -2,9 +2,12 @@ import { combineReducers } from 'redux';
import cartDetails from './cartdetails';
import getShopListDetails from './shoplist';
import getSaveForLaterDetails from './savelater';
-
+import bankReducer from '../bank/bank.reducer';
+import userReducer from '../user/user.reducers';
export default combineReducers({
cartDetails,
getShopListDetails,
getSaveForLaterDetails,
+ bank: bankReducer,
+ user: userReducer,
});
diff --git a/redux/store.js b/redux/store.js
index ca335a2..dd9fe51 100644
--- a/redux/store.js
+++ b/redux/store.js
@@ -1,7 +1,13 @@
-import { createStore } from 'redux';
+import { createStore, applyMiddleware } from 'redux';
import { createWrapper } from 'next-redux-wrapper';
import rootReducer from './reducers';
-
-const makeStore = () => createStore(rootReducer);
+import thunk from 'redux-thunk';
+import logger from 'redux-logger';
+const middlewares = [thunk];
+if (process.env.NODE_ENV === 'development') {
+ middlewares.push(logger);
+}
+const makeStore = () =>
+ createStore(rootReducer, applyMiddleware(...middlewares));
export const wrapper = createWrapper(makeStore, { debug: true });
diff --git a/redux/user/user.actions.js b/redux/user/user.actions.js
new file mode 100644
index 0000000..f7ef36f
--- /dev/null
+++ b/redux/user/user.actions.js
@@ -0,0 +1,27 @@
+import { UserActionsTypes } from './user.actions.types';
+import fetchSelfDetails from 'utils/fetchSelfDetails';
+export const getCurrentUserStart = () => ({
+ type: UserActionsTypes.GET_CURRENT_USER_START,
+});
+
+export const getCurrentUserSuccess = (rates) => ({
+ type: UserActionsTypes.GET_CURRENT_USER_SUCCESS,
+ payload: rates,
+});
+
+export const getCurrentUserFaliure = (message) => ({
+ type: UserActionsTypes.GET_CURRENT_USER_FALIURE,
+ payload: message,
+});
+
+export const getCurrentUserStartAsync = () => {
+ return async (dispatch) => {
+ dispatch(getCurrentUserStart());
+ try {
+ const data = await fetchSelfDetails();
+ dispatch(getCurrentUserSuccess(data));
+ } catch (error) {
+ dispatch(getCurrentUserFaliure(error.message));
+ }
+ };
+};
diff --git a/redux/user/user.actions.types.js b/redux/user/user.actions.types.js
new file mode 100644
index 0000000..fc65f13
--- /dev/null
+++ b/redux/user/user.actions.types.js
@@ -0,0 +1,5 @@
+export const UserActionsTypes = {
+ GET_CURRENT_USER_START: 'GET_CURRENT_USER_START',
+ GET_CURRENT_USER_SUCCESS: 'GET_CURRENT_USER_SUCCESS',
+ GET_CURRENT_USER_FALIURE: 'GET_CURRENT_USER_FALIURE',
+};
diff --git a/redux/user/user.reducers.js b/redux/user/user.reducers.js
new file mode 100644
index 0000000..80a5103
--- /dev/null
+++ b/redux/user/user.reducers.js
@@ -0,0 +1,30 @@
+import { UserActionsTypes } from './user.actions.types';
+const INITIAL_STATE = {
+ currentUser: null,
+ isFetchingUser: false,
+ currentUserFaliureMessage: '',
+};
+const userReducer = (state = INITIAL_STATE, action) => {
+ switch (action.type) {
+ case UserActionsTypes.GET_CURRENT_USER_START:
+ return {
+ ...state,
+ isFetchingUser: true,
+ };
+ case UserActionsTypes.GET_CURRENT_USER_SUCCESS:
+ return {
+ ...state,
+ currentUser: action.payload,
+ isFetchingUser: false,
+ };
+ case UserActionsTypes.GET_CURRENT_USER_FALIURE:
+ return {
+ ...state,
+ isFetchingUser: false,
+ currentUserFaliureMessage: action.payload,
+ };
+ default:
+ return state;
+ }
+};
+export default userReducer;
diff --git a/redux/user/user.selectors.js b/redux/user/user.selectors.js
new file mode 100644
index 0000000..287c0d5
--- /dev/null
+++ b/redux/user/user.selectors.js
@@ -0,0 +1,18 @@
+import { createSelector } from 'reselect';
+
+const selectUser = (state) => state.user;
+
+export const selectCurrentUser = createSelector(
+ [selectUser],
+ (user) => user.currentUser
+);
+
+export const selectIsFetchingUser = createSelector(
+ [selectUser],
+ (user) => user.isFetchingUser
+);
+
+export const selectCurrentUserFaliureMessage = createSelector(
+ [selectUser],
+ (user) => user.currentUserFaliureMessage
+);
+ 
+