feat: Qualifications Redux Store

src/App.js

@@ -13,7 +13,8 @@ import {IndeterminateProgressOverlay} from './components';
 
 const App = () => {
   const dispatch = useDispatch();
-  const appStore = useSelector(state => state.app);
+  const appStore = useSelector(state => state);
+  console.log(appStore)
   const [translationTokens, setTranslationTokens] = useState();
 
   useEffect(

src/constants/index.js

@@ -1,5 +1,5 @@
 export default {
-  API_HOST: 'localhost:4010',
+  API_HOST: 'localhost:3000/v1/',
   MAX_TABLE_SIZE: 10,
   HEADER_HEIGHT: 64, // Needed to be used to calculate max height for body components
   THEME: {

src/mocks/co-benefits.json

@@ -0,0 +1,17 @@
+[[
+    {
+      "cobenifet": "TEST_COBENIFET_1"
+    },
+    {
+      "cobenifet": "TEST_COBENIFET_2"
+    },
+    {
+      "cobenifet": "TEST_COBENIFET_3"
+    },
+    {
+      "cobenifet": "TEST_COBENIFET_4"
+    },
+    {
+      "cobenifet": "TEST_COBENIFET_5"
+    }
+  ]]

src/mocks/index.js

@@ -1 +1,4 @@
 export * as mockedRetiredTokenResponse from './retired-tokens.json';
+export * as projectRatingResponseStub from './project-ratings.json';
+export * as coBenefitResponseStub from './co-benefits.json';
+export * as qualificationsResponseStub from './qualifications.json';

src/mocks/qualifications.json

@@ -0,0 +1 @@
+[]

src/navigation/AppNavigator.js

@@ -1,13 +1,13 @@
-import React, {Suspense} from 'react';
-import {useSelector} from 'react-redux';
-import {BrowserRouter as Router, Route} from 'react-router-dom';
-import {IndeterminateProgressOverlay} from '../components/';
+import React, { Suspense } from 'react';
+import { useSelector } from 'react-redux';
+import { BrowserRouter as Router, Route } from 'react-router-dom';
+import { IndeterminateProgressOverlay } from '../components/';
 import * as Pages from '../pages';
 
-import {AppContainer, AppHeader} from '../components';
+import { AppContainer, AppHeader } from '../components';
 
 const AppNavigator = () => {
-  const {showProgressOverlay} = useSelector(store => store.app);
+  const { showProgressOverlay } = useSelector(store => store.app);
   return (
     <AppContainer>
       <AppHeader />
@@ -23,4 +23,4 @@ const AppNavigator = () => {
   );
 };
 
-export {AppNavigator};
+export { AppNavigator };

src/start-react.js

@@ -1,7 +1,7 @@
 const net = require('net');
 const childProcess = require('child_process');
 
-const port = process.env.PORT ? process.env.PORT - 100 : 3000;
+const port = process.env.PORT ? process.env.PORT - 100 : 3001;
 
 process.env.ELECTRON_START_URL = `http://localhost:${port}`;
 

src/store/actions/climateWarehouseActions.js

@@ -0,0 +1,138 @@
+import _ from 'lodash';
+import { keyMirror } from '../store-functions';
+import constants from '../../constants';
+
+import { coBenefitResponseStub, projectRatingResponseStub, qualificationsResponseStub } from '../../mocks';
+
+import {
+  activateProgressIndicator,
+  deactivateProgressIndicator,
+  setGlobalErrorMessage,
+} from './app';
+
+export const actions = keyMirror('GET_RATINGS', 'GET_COBENEFITS', 'QUALIFICATIONS');
+
+export const mockedRatingsResponse = {
+  type: actions.GET_RATINGS,
+  // Different envs import this differently
+  payload: _.get(
+    projectRatingResponseStub,
+    'default',
+    projectRatingResponseStub,
+  ),
+};
+
+export const getRatings = ({
+  useMockedResponse = false,
+  useApiMock = false,
+}) => {
+  return async dispatch => {
+    dispatch(activateProgressIndicator);
+
+    try {
+      if (useMockedResponse) {
+        dispatch(mockedRatingsResponse);
+      } else {
+        let url = `${constants.API_HOST}/ratings`;
+        if (useApiMock) url = `${url}?useMock=true`;
+        const response = fetch(url);
+
+        if (response.ok) {
+          const results = await response.json();
+          dispatch({
+            type: actions.GET_RATINGS,
+            payload: results,
+          });
+        }
+      }
+    } catch {
+      dispatch(setGlobalErrorMessage('Something went wrong...'));
+    } finally {
+      dispatch(deactivateProgressIndicator);
+    }
+  };
+};
+
+const mockedCoBenefitResponse = {
+  type: actions.GET_COBENEFITS,
+  // Different envs import this differently
+  payload: _.get(coBenefitResponseStub, 'default', coBenefitResponseStub),
+};
+
+export const getCoBenefits = ({
+  useMockedResponse = false,
+  useApiMock = false,
+}) => {
+  return async dispatch => {
+    try {
+      dispatch(activateProgressIndicator);
+
+      if (useMockedResponse) {
+        dispatch(mockedCoBenefitResponse);
+      } else {
+        let url = `${constants.API_HOST}/co-benefits`;
+        if (useApiMock) {
+          url = `${url}?useMock=true`;
+        }
+
+        const response = fetch(url);
+
+        if (response.ok) {
+          const results = await response.json();
+          dispatch({
+            type: actions.GET_COBENEFITS,
+            payload: results,
+          });
+        }
+      }
+    } catch {
+      dispatch(setGlobalErrorMessage('Something went wrong...'));
+    } finally {
+      dispatch(deactivateProgressIndicator);
+    }
+  };
+};
+
+export const mockQualificationsResponse = {
+  type: actions.QUALIFICATIONS,
+  // Different envs import this differently
+  payload: _.get(
+    qualificationsResponseStub,
+    'default',
+    qualificationsResponseStub,
+  ),
+};
+
+export const getQualifications = ({
+  useMockedResponse = false,
+  useApiMock = false,
+}) => {
+  return async dispatch => {
+    try {
+      dispatch(activateProgressIndicator);
+
+      if (useMockedResponse) {
+        dispatch(mockQualificationsResponse);
+      } else {
+        let url = `${constants.API_HOST}/qualifications`;
+        if (useApiMock) {
+          url = `${url}?useMock=true`;
+        }
+
+        const response = fetch(url);
+
+        if (response.ok) {
+          const results = await response.json();
+          dispatch({
+            type: actions.QUALIFICATIONS,
+            payload: results,
+          });
+        }
+      }
+    } catch {
+      dispatch(setGlobalErrorMessage('Something went wrong...'));
+    } finally {
+      dispatch(deactivateProgressIndicator);
+    }
+  };
+};

src/store/index.js

@@ -1,11 +1,11 @@
-import {createStore, combineReducers, applyMiddleware} from 'redux';
+import { createStore, combineReducers, applyMiddleware } from 'redux';
 import ReduxThunk from 'redux-thunk';
 
-import {appReducer, tokenReducer} from './reducers';
+import { appReducer, climateWarehouseReducer } from './reducers';
 
 const rootReducer = combineReducers({
   app: appReducer,
-  tokens: tokenReducer,
+  climateWarehouse: climateWarehouseReducer,
 });
 
 export default createStore(rootReducer, applyMiddleware(ReduxThunk));

src/store/reducers/appReducer.js

@@ -1,39 +1,39 @@
 import u from 'updeep';
 
-import {actions as appActions} from '../actions/app';
+import { actions as appActions } from '../actions/app';
 import constants from '../../constants';
 
 const initialState = {
   placeholderValue: 'THIS STRING WAS LOADED FROM THE STORE!',
   showProgressOverlay: false,
-  theme: constants.THEME.DARK,
+  theme: constants.THEME.LIGHT,
   errorMessage: null,
   locale: null,
 };
 
 const appReducer = (state = initialState, action) => {
   switch (action.type) {
     case appActions.ACTIVATE_PROGRESS_INDICATOR:
-      return u({showProgressOverlay: true}, state);
+      return u({ showProgressOverlay: true }, state);
 
     case appActions.DEACTIVATE_PROGRESS_INDICATOR:
-      return u({showProgressOverlay: false}, state);
+      return u({ showProgressOverlay: false }, state);
 
     case appActions.SET_GLOBAL_ERROR_MESSAGE:
-      return u({errorMessage: action.payload}, state);
+      return u({ errorMessage: action.payload }, state);
 
     case appActions.CLEAR_GLOBAL_ERROR_MESSAGE:
-      return u({errorMessage: null}, state);
+      return u({ errorMessage: null }, state);
 
     case appActions.SET_LOCALE:
-      return u({locale: action.payload}, state);
+      return u({ locale: action.payload }, state);
 
     case appActions.SET_THEME:
       if (
         action.payload === constants.THEME.LIGHT ||
         action.payload === constants.THEME.DARK
       ) {
-        return u({theme: action.payload}, state);
+        return u({ theme: action.payload }, state);
       }
       return state;
 
@@ -44,10 +44,10 @@ const appReducer = (state = initialState, action) => {
           ? constants.THEME.LIGHT
           : constants.THEME.DARK;
       localStorage.setItem('theme', theme);
-      return u({theme}, state);
+      return u({ theme }, state);
     default:
       return state;
   }
 };
 
-export {appReducer};
+export { appReducer };

src/store/reducers/climateWarehouseReducer.js

@@ -0,0 +1,27 @@
+import u from 'updeep';
+
+import { actions as climateWarehouseActions } from '../actions/climateWarehouseActions';
+
+const initialState = {
+  ratings: null,
+  coBenefits: null,
+  qualifications: null
+};
+
+const climateWarehouseReducer = (state = initialState, action) => {
+  switch (action.type) {
+    case climateWarehouseActions.GET_RATINGS:
+      return u({ ratings: action.payload }, state);
+
+    case climateWarehouseActions.GET_COBENEFITS:
+      return u({ coBenefits: action.payload }, state);
+
+    case climateWarehouseActions.QUALIFICATIONS:
+      return u({ qualifications: action.payload }, state);
+
+    default:
+      return state;
+  }
+};
+
+export { climateWarehouseReducer };

src/store/reducers/index.js

@@ -1,2 +1,3 @@
 export * from './appReducer';
-export * from './tokenReducer';
+export * from './climateWarehouseReducer';
+export * from './'