[ ADD ] react configuration

react/src/store/Feature1/FeatureAction.js

@@ -0,0 +1,11 @@
+import * as types from "./FeatureTypes";
+
+//Replace action name and update action types
+export const actionRequest = () => ({
+  type: types.GET_DATA_REQUEST
+});
+
+export const actionReceive = payload => ({
+  type: types.GET_DATA_REQUEST,
+  payload
+});

react/src/store/Feature1/FeatureApis.js

@@ -0,0 +1,11 @@
+import {axiosInstance} from '../../network/apis';
+const handlerEnabled = false;
+
+// Replace endpoint and change api name
+const apiExampleRequest = async () => {
+  return await axiosInstance.get(`ENDPOINT`, { handlerEnabled });
+};
+
+export default {
+  apiExampleRequest
+};

react/src/store/Feature1/FeatureReducer.js

@@ -0,0 +1,16 @@
+import * as types from "./FeatureTypes";
+
+const INITIAL_STATE = {};
+
+// Replace with you own reducer
+export default (state = INITIAL_STATE, action) => {
+  switch (action.type) {
+    case types.GET_DATA_RECEIVE:
+      return {
+        ...state,
+        ...action.payload
+      };
+    default:
+      return state;
+  }
+};

react/src/store/Feature1/FeatureSagas.js

@@ -0,0 +1,21 @@
+import { call, put } from "redux-saga/effects";
+import API from "./FeatureApis";
+import * as ACTIONS from "./FeatureAction";
+import { dispatchSnackbarError } from "../../utils/Shared";
+import { takeLatest } from "redux-saga/effects";
+import * as TYPES from "./FeatureTypes";
+
+// Replace with your sagas
+export function* sagasRequestExample() {
+  try {
+    const response = yield call(API.apiExampleRequest);
+    yield put(ACTIONS.actionReceive(response.data));
+  } catch (err) {
+    dispatchSnackbarError(err.response.data);
+  }
+}
+
+
+export function* FeatureSaga1() {
+  yield takeLatest(TYPES.GET_DATA_REQUEST, sagasRequestExample);
+}

react/src/store/Feature1/FeatureTypes.js

@@ -0,0 +1,3 @@
+// Replace with your request types
+export const GET_DATA_REQUEST = 'GET_DATA_REQUEST';
+export const GET_DATA_RECEIVE = 'GET_DATA_RECEIVE';

react/src/store/Lang/LangAction.js

@@ -0,0 +1,10 @@
+import * as types from './LangTypes';
+
+export const setCurrentLang = payload  => {
+  localStorage.setItem('lang', payload);
+  return { type: types.SET_LANG, payload };
+}
+
+export const getCurrentLang = () => {
+  return { type: types.GET_LANG };
+};

react/src/store/Lang/LangReducer.js

@@ -0,0 +1,14 @@
+import * as types from "./LangTypes";
+
+const INITIAL_STATE = localStorage.getItem("lang") || "en";
+
+export default function locale(state = INITIAL_STATE, action) {
+  switch (action.type) {
+    case types.SET_LANG:
+      return action.payload;
+    case types.GET_LANG:
+      return action.payload;
+    default:
+      return state;
+  }
+}

react/src/store/Lang/LangTypes.js

@@ -0,0 +1,2 @@
+export const SET_LANG = 'SET_LANG';
+export const GET_LANG = 'GET_LANG';

react/src/store/Loader/LoaderAction.js

@@ -0,0 +1,13 @@
+import * as types from "./LoaderTypes";
+
+export const loader = isLoading => {
+  return isLoading
+    ? {
+        type: types.SHOW_LOADER,
+        data: isLoading
+      }
+    : {
+        type: types.HIDE_LOADER,
+        data: isLoading
+      };
+};

react/src/store/Loader/LoaderReducer.js

@@ -0,0 +1,14 @@
+import * as types from "./LoaderTypes";
+
+const INITIAL_STATE = false;
+
+export default (state = INITIAL_STATE, action) => {
+  switch (action.type) {
+    case types.SHOW_LOADER:
+      return action.data;
+    case types.HIDE_LOADER:
+      return action.data;
+    default:
+      return state;
+  }
+};

react/src/store/Loader/LoaderTypes.js

@@ -0,0 +1,2 @@
+export const SHOW_LOADER = 'SHOW_LOADER';
+export const HIDE_LOADER = 'HIDE_LOADER';

react/src/store/Snackbar/SnackbarAction.js

@@ -0,0 +1,15 @@
+import * as types from './SnackbarTypes';
+
+export const showSnackbarAction = (message , snacknarType) => {
+  return {
+  type: types.SHOW_SNACKBAR, 
+  message ,
+  snacknarType  
+  };
+};
+
+export const hideSnackbarAction = () => {
+  return {
+   type: types.HIDE_SNACKBAR 
+  };
+};

react/src/store/Snackbar/SnackbarReducer.js

@@ -0,0 +1,21 @@
+import * as types from "./SnackbarTypes";
+
+export default (state = {}, action) => {
+  switch (action.type) {
+    case types.SHOW_SNACKBAR:
+      return {
+        ...state,
+        isOpen: true,
+        message: action.message,
+        type: action.snacknarType
+      };
+    case types.HIDE_SNACKBAR:
+      return {
+        ...state,
+        isOpen: false
+      };
+    default:
+      return state;
+  }
+};
+

react/src/store/Snackbar/SnackbarTypes.js

@@ -0,0 +1,2 @@
+export const SHOW_SNACKBAR = 'SHOW_SNACKBAR';
+export const HIDE_SNACKBAR = 'HIDE_SNACKBAR';

react/src/store/index.js

@@ -0,0 +1,17 @@
+import { createStore, applyMiddleware, compose } from "redux";
+import reducers from "./reducers";
+import createSagaMiddleware from "redux-saga";
+import { watchSagas } from "./sagas";
+const saga = createSagaMiddleware();
+//redux dev tool
+const composeEnhancers =
+  typeof window === "object" && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
+    ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({})
+    : compose;
+const enhancer = composeEnhancers(applyMiddleware(saga));
+
+const store = createStore(reducers, enhancer);
+
+saga.run(watchSagas);
+
+export default store;

react/src/store/reducers/index.js

@@ -0,0 +1,12 @@
+import { combineReducers } from "redux";
+import lang from "../Lang/LangReducer";
+import loader from "../Loader/LoaderReducer";
+import snackbar from "../Snackbar/SnackbarReducer";
+import Feature1 from "../Feature1/FeatureReducer";
+
+export default combineReducers({
+  lang,
+  loader,
+  snackbar,
+  Feature1
+});

react/src/store/sagas/index.js

@@ -0,0 +1,9 @@
+import { FeatureSaga1 } from '../Feature1/FeatureSagas';
+import { fork, all } from "redux-saga/effects";
+
+export function* watchSagas() {
+  //Combine sagas with 
+  yield all([FeatureSaga1()]);
+  // OR
+  // yield all([fork(FeatureSaga1)]);
+}