remboursement nano credit OK

android/app/src/main/res/raw/utils_i18n_en.json

@@ -167,6 +167,7 @@
   "SAVE_MONEY": "Save money",
   "SAVE_MONEY_TYPE": "Savings type",
   "CAUTION_CREDIT": "Caution credit demand",
+  "CAUTIONNEMENT_DONE": "Caution done",
   "ID_DEMAND": "Demand ID",
   "DATE": "Date",
   "PAIEMENT_EAU_ELECTRICITY": "Water/electricity bill",

android/app/src/main/res/raw/utils_i18n_fr.json

@@ -174,6 +174,7 @@
   "SAVE_MONEY_TYPE": "Type d'épargne",
   "REFUND_DONE": "Remboursement effectué",
   "CAUTION_CREDIT": "Cautionner une demande de crédit",
+  "CAUTIONNEMENT_DONE": "Cautionnement effectué",
   "ID_DEMAND": "Identifiant de la demande",
   "PAIEMENT_EAU_ELECTRICITY": "Paiement eau/électricité",
   "PAIEMENT_ECOLE": "Paiement école",

redux/actions/NanoCreditAction.js

@@ -1,353 +1,412 @@
 import {
-     CREATE_GROUP_PENDING,
-     CREATE_GROUP_SUCCESS,
-     CREATE_GROUP_ERROR,
-     CREATE_GROUP_RESET,
-     GET_DEMAND_GROUP_PENDING,
-     GET_DEMAND_GROUP_SUCCESS,
-     GET_DEMAND_GROUP_ERROR,
-     GET_DEMAND_GROUP_RESET,
-     GET_UNIQUE_DEMAND_GROUP_PENDING,
-     GET_UNIQUE_DEMAND_GROUP_RESET,
-     GET_UNIQUE_DEMAND_GROUP_ERROR,
-     GET_UNIQUE_DEMAND_GROUP_SUCCESS,
-     TREAT_DEMAND_GROUP_PENDING,
-     TREAT_DEMAND_GROUP_SUCCESS,
-     TREAT_DEMAND_GROUP_ERROR,
-     TREAT_DEMAND_GROUP_RESET,
-     JOIN_GROUP_PENDING,
-     JOIN_GROUP_SUCCESS,
-     JOIN_GROUP_RESET,
-     JOIN_GROUP_ERROR,
-     GET_USER_GROUP_DETAIL_PENDING,
-     GET_USER_GROUP_DETAIL_SUCCESS,
-     GET_USER_GROUP_DETAIL_RESET,
-     GET_USER_GROUP_DETAIL_ERROR,
-     GET_NOTIFICATIONS_ERROR,
-     GET_NOTIFICATIONS_RESET,
-     GET_NOTIFICATIONS_PENDING,
-     GET_NOTIFICATIONS_SUCCESS, ASK_NANO_CREDIT_PENDING, ASK_NANO_CREDIT_SUCCESS, ASK_NANO_CREDIT_ERROR, ASK_NANO_CREDIT_RESET,
-     GET_NANO_CREDIT_DEMAND_DURATION_PENDING,
-     GET_NANO_CREDIT_DEMAND_DURATION_SUCCESS,
-     GET_NANO_CREDIT_DEMAND_DURATION_ERROR,
-     GET_NANO_CREDIT_DEMAND_DURATION_RESET,
-     REFUND_CREDIT_DEMAND_USER_PENDING,
-     REFUND_CREDIT_DEMAND_USER_RESET,
-     REFUND_CREDIT_DEMAND_USER_ERROR,
-     CAUTION_CREDIT_DEMAND_AGENT_PENDING,
-     CAUTION_CREDIT_DEMAND_AGENT_RESET,
-     CAUTION_CREDIT_DEMAND_AGENT_ERROR,
-     GET_NANO_CREDIT_DEMAND_DETAIL_PENDING,
-     GET_NANO_CREDIT_DEMAND_DETAIL_SUCCESS,
-     GET_NANO_CREDIT_DEMAND_DETAIL_ERROR,
-     GET_NANO_CREDIT_DEMAND_DETAIL_RESET,
-     CAUTION_CREDIT_DEMAND_AGENT_SUCCESS,
-     EPARGNER_ARGENT_USER_PENDING,
-     EPARGNER_ARGENT_USER_SUCCESS,
-     EPARGNER_ARGENT_USER_ERROR,
-     EPARGNER_ARGENT_USER_RESET,
-     CASSER_EPARGNE_USER_PENDING,
-     CASSER_EPARGNE_USER_SUCCESS,
-     CASSER_EPARGNE_USER_ERROR,
-     CASSER_EPARGNE_USER_RESET, GET_NANO_CREDIT_ACCOUNT_USER_PENDING, GET_NANO_CREDIT_ACCOUNT_USER_SUCCESS, GET_NANO_CREDIT_ACCOUNT_USER_ERROR, GET_NANO_CREDIT_ACCOUNT_USER_RESET, GET_NANO_CREDIT_HISTORY_USER_PENDING, GET_NANO_CREDIT_HISTORY_USER_SUCCESS, GET_NANO_CREDIT_HISTORY_USER_RESET, GET_NANO_CREDIT_HISTORY_USER_ERROR
+    ASK_NANO_CREDIT_ERROR,
+    ASK_NANO_CREDIT_PENDING,
+    ASK_NANO_CREDIT_RESET,
+    ASK_NANO_CREDIT_SUCCESS,
+    CASSER_EPARGNE_USER_ERROR,
+    CASSER_EPARGNE_USER_PENDING,
+    CASSER_EPARGNE_USER_RESET,
+    CASSER_EPARGNE_USER_SUCCESS,
+    CAUTION_CREDIT_DEMAND_AGENT_ERROR,
+    CAUTION_CREDIT_DEMAND_AGENT_PENDING,
+    CAUTION_CREDIT_DEMAND_AGENT_RESET,
+    CAUTION_CREDIT_DEMAND_AGENT_SUCCESS,
+    CREATE_GROUP_ERROR,
+    CREATE_GROUP_PENDING,
+    CREATE_GROUP_RESET,
+    CREATE_GROUP_SUCCESS,
+    EPARGNER_ARGENT_USER_ERROR,
+    EPARGNER_ARGENT_USER_PENDING,
+    EPARGNER_ARGENT_USER_RESET,
+    EPARGNER_ARGENT_USER_SUCCESS,
+    GET_DEMAND_GROUP_ERROR,
+    GET_DEMAND_GROUP_PENDING,
+    GET_DEMAND_GROUP_RESET,
+    GET_DEMAND_GROUP_SUCCESS,
+    GET_EPARGNE_HISTORY_PENDING_USER_ERROR,
+    GET_EPARGNE_HISTORY_PENDING_USER_PENDING,
+    GET_EPARGNE_HISTORY_PENDING_USER_RESET,
+    GET_EPARGNE_HISTORY_PENDING_USER_SUCCESS,
+    GET_NANO_CREDIT_ACCOUNT_USER_ERROR,
+    GET_NANO_CREDIT_ACCOUNT_USER_PENDING,
+    GET_NANO_CREDIT_ACCOUNT_USER_RESET,
+    GET_NANO_CREDIT_ACCOUNT_USER_SUCCESS,
+    GET_NANO_CREDIT_DEMAND_DETAIL_ERROR,
+    GET_NANO_CREDIT_DEMAND_DETAIL_PENDING,
+    GET_NANO_CREDIT_DEMAND_DETAIL_RESET,
+    GET_NANO_CREDIT_DEMAND_DETAIL_SUCCESS,
+    GET_NANO_CREDIT_DEMAND_DURATION_ERROR,
+    GET_NANO_CREDIT_DEMAND_DURATION_PENDING,
+    GET_NANO_CREDIT_DEMAND_DURATION_RESET,
+    GET_NANO_CREDIT_DEMAND_DURATION_SUCCESS,
+    GET_NANO_CREDIT_HISTORY_PENDING_USER_ERROR,
+    GET_NANO_CREDIT_HISTORY_PENDING_USER_PENDING,
+    GET_NANO_CREDIT_HISTORY_PENDING_USER_RESET,
+    GET_NANO_CREDIT_HISTORY_PENDING_USER_SUCCESS,
+    GET_NANO_CREDIT_HISTORY_USER_ERROR,
+    GET_NANO_CREDIT_HISTORY_USER_PENDING,
+    GET_NANO_CREDIT_HISTORY_USER_RESET,
+    GET_NANO_CREDIT_HISTORY_USER_SUCCESS,
+    GET_NOTIFICATIONS_ERROR,
+    GET_NOTIFICATIONS_PENDING,
+    GET_NOTIFICATIONS_RESET,
+    GET_NOTIFICATIONS_SUCCESS,
+    GET_UNIQUE_DEMAND_GROUP_ERROR,
+    GET_UNIQUE_DEMAND_GROUP_PENDING,
+    GET_UNIQUE_DEMAND_GROUP_RESET,
+    GET_UNIQUE_DEMAND_GROUP_SUCCESS,
+    GET_USER_GROUP_DETAIL_ERROR,
+    GET_USER_GROUP_DETAIL_PENDING,
+    GET_USER_GROUP_DETAIL_RESET,
+    GET_USER_GROUP_DETAIL_SUCCESS,
+    JOIN_GROUP_ERROR,
+    JOIN_GROUP_PENDING,
+    JOIN_GROUP_RESET,
+    JOIN_GROUP_SUCCESS,
+    REFUND_CREDIT_DEMAND_USER_ERROR,
+    REFUND_CREDIT_DEMAND_USER_PENDING,
+    REFUND_CREDIT_DEMAND_USER_RESET,
+    REFUND_CREDIT_DEMAND_USER_SUCCESS,
+    TREAT_DEMAND_GROUP_ERROR,
+    TREAT_DEMAND_GROUP_PENDING,
+    TREAT_DEMAND_GROUP_RESET,
+    TREAT_DEMAND_GROUP_SUCCESS
 } from "../types/NanoCreditType";
 
 export const fetchCreateGroupPending = () => ({
-     type: CREATE_GROUP_PENDING
+    type: CREATE_GROUP_PENDING
 });
 
 export const fetchCreateGroupSuccess = (res) => ({
-     type: CREATE_GROUP_SUCCESS,
-     result: res,
+    type: CREATE_GROUP_SUCCESS,
+    result: res,
 });
 
 export const fetchCreateGroupError = (error) => ({
-     type: CREATE_GROUP_ERROR,
-     result: error
+    type: CREATE_GROUP_ERROR,
+    result: error
 });
 
 export const fetchCreateGroupReset = () => ({
-     type: CREATE_GROUP_RESET
+    type: CREATE_GROUP_RESET
 });
 
 export const fetchGetDemandsGroupPending = () => ({
-     type: GET_DEMAND_GROUP_PENDING
+    type: GET_DEMAND_GROUP_PENDING
 });
 
 export const fetchGetDemandsGroupSuccess = (res) => ({
-     type: GET_DEMAND_GROUP_SUCCESS,
-     result: res,
+    type: GET_DEMAND_GROUP_SUCCESS,
+    result: res,
 });
 
 export const fetchGetDemandsGroupError = (error) => ({
-     type: GET_DEMAND_GROUP_ERROR,
-     result: error
+    type: GET_DEMAND_GROUP_ERROR,
+    result: error
 });
 
 export const fetchGetDemandsGroupReset = () => ({
-     type: GET_DEMAND_GROUP_RESET
+    type: GET_DEMAND_GROUP_RESET
 });
 
 export const fetchGetUniqueDemandsGroupPending = () => ({
-     type: GET_UNIQUE_DEMAND_GROUP_PENDING
+    type: GET_UNIQUE_DEMAND_GROUP_PENDING
 });
 
 export const fetchGetUniqueDemandsGroupSuccess = (res) => ({
-     type: GET_UNIQUE_DEMAND_GROUP_SUCCESS,
-     result: res,
+    type: GET_UNIQUE_DEMAND_GROUP_SUCCESS,
+    result: res,
 });
 
 export const fetchGetUniqueDemandsGroupError = (error) => ({
-     type: GET_UNIQUE_DEMAND_GROUP_ERROR,
-     result: error
+    type: GET_UNIQUE_DEMAND_GROUP_ERROR,
+    result: error
 });
 
 export const fetchGetUniqueDemandsGroupReset = () => ({
-     type: GET_UNIQUE_DEMAND_GROUP_RESET
+    type: GET_UNIQUE_DEMAND_GROUP_RESET
 });
 
 export const fetchTreatDemandsGroupPending = () => ({
-     type: TREAT_DEMAND_GROUP_PENDING
+    type: TREAT_DEMAND_GROUP_PENDING
 });
 
 export const fetchTreatDemandsGroupSuccess = (res) => ({
-     type: TREAT_DEMAND_GROUP_SUCCESS,
-     result: res,
+    type: TREAT_DEMAND_GROUP_SUCCESS,
+    result: res,
 });
 
 export const fetchTreatDemandsGroupError = (error) => ({
-     type: TREAT_DEMAND_GROUP_ERROR,
-     result: error
+    type: TREAT_DEMAND_GROUP_ERROR,
+    result: error
 });
 
 export const fetchTreatDemandsGroupReset = () => ({
-     type: TREAT_DEMAND_GROUP_RESET
+    type: TREAT_DEMAND_GROUP_RESET
 });
 
 
 export const fetchJoinGroupPending = () => ({
-     type: JOIN_GROUP_PENDING
+    type: JOIN_GROUP_PENDING
 });
 
 export const fetchJoinGroupSuccess = (res) => ({
-     type: JOIN_GROUP_SUCCESS,
-     result: res,
+    type: JOIN_GROUP_SUCCESS,
+    result: res,
 });
 
 export const fetchJoinGroupError = (error) => ({
-     type: JOIN_GROUP_ERROR,
-     result: error
+    type: JOIN_GROUP_ERROR,
+    result: error
 });
 
 export const fetchJoinGroupReset = () => ({
-     type: JOIN_GROUP_RESET
+    type: JOIN_GROUP_RESET
 });
 
 
 export const fetchGetUserGroupDetailPending = () => ({
-     type: GET_USER_GROUP_DETAIL_PENDING
+    type: GET_USER_GROUP_DETAIL_PENDING
 });
 
 export const fetchGetUserGroupDetailSuccess = (res) => ({
-     type: GET_USER_GROUP_DETAIL_SUCCESS,
-     result: res,
+    type: GET_USER_GROUP_DETAIL_SUCCESS,
+    result: res,
 });
 
 export const fetchGetUserGroupDetailError = (error) => ({
-     type: GET_USER_GROUP_DETAIL_ERROR,
-     result: error
+    type: GET_USER_GROUP_DETAIL_ERROR,
+    result: error
 });
 
 export const fetchGetUserGroupDetailReset = () => ({
-     type: GET_USER_GROUP_DETAIL_RESET
+    type: GET_USER_GROUP_DETAIL_RESET
 });
 
 
 export const fetchGetNotificationPending = () => ({
-     type: GET_NOTIFICATIONS_PENDING
+    type: GET_NOTIFICATIONS_PENDING
 });
 
 export const fetchGetNotificationSuccess = (res) => ({
-     type: GET_NOTIFICATIONS_SUCCESS,
-     result: res,
+    type: GET_NOTIFICATIONS_SUCCESS,
+    result: res,
 });
 
 export const fetchGetNotificationError = (error) => ({
-     type: GET_NOTIFICATIONS_ERROR,
-     result: error
+    type: GET_NOTIFICATIONS_ERROR,
+    result: error
 });
 
 export const fetchGetNotificationReset = () => ({
-     type: GET_NOTIFICATIONS_RESET
+    type: GET_NOTIFICATIONS_RESET
 });
 
 
 export const fetchAskNanoCreditPending = () => ({
-     type: ASK_NANO_CREDIT_PENDING
+    type: ASK_NANO_CREDIT_PENDING
 });
 
 export const fetchAskNanoCreditSuccess = (res) => ({
-     type: ASK_NANO_CREDIT_SUCCESS,
-     result: res,
+    type: ASK_NANO_CREDIT_SUCCESS,
+    result: res,
 });
 
 export const fetchAskNanoCreditError = (error) => ({
-     type: ASK_NANO_CREDIT_ERROR,
-     result: error
+    type: ASK_NANO_CREDIT_ERROR,
+    result: error
 });
 
 export const fetchAskNanoCreditReset = () => ({
-     type: ASK_NANO_CREDIT_RESET
+    type: ASK_NANO_CREDIT_RESET
 });
 
 
 export const fetchGetNanoCreditDemandDurationPending = () => ({
-     type: GET_NANO_CREDIT_DEMAND_DURATION_PENDING
+    type: GET_NANO_CREDIT_DEMAND_DURATION_PENDING
 });
 
 export const fetchGetNanoCreditDemandDurationSuccess = (res) => ({
-     type: GET_NANO_CREDIT_DEMAND_DURATION_SUCCESS,
-     result: res,
+    type: GET_NANO_CREDIT_DEMAND_DURATION_SUCCESS,
+    result: res,
 });
 
 export const fetchGetNanoCreditDemandDurationError = (error) => ({
-     type: GET_NANO_CREDIT_DEMAND_DURATION_ERROR,
-     result: error
+    type: GET_NANO_CREDIT_DEMAND_DURATION_ERROR,
+    result: error
 });
 
 export const fetchGetNanoCreditDemandDurationReset = () => ({
-     type: GET_NANO_CREDIT_DEMAND_DURATION_RESET
+    type: GET_NANO_CREDIT_DEMAND_DURATION_RESET
 });
 
 
 export const fetchCautionCreditDemandUserPending = () => ({
-     type: REFUND_CREDIT_DEMAND_USER_PENDING
+    type: REFUND_CREDIT_DEMAND_USER_PENDING
 });
 
 export const fetchCautionCreditDemandUserSuccess = (res) => ({
-     type: REFUND_CREDIT_DEMAND_USER_RESET,
-     result: res,
+    type: REFUND_CREDIT_DEMAND_USER_SUCCESS,
+    result: res,
 });
 
 export const fetchCautionCreditDemandUserError = (error) => ({
-     type: REFUND_CREDIT_DEMAND_USER_ERROR,
-     result: error
+    type: REFUND_CREDIT_DEMAND_USER_ERROR,
+    result: error
 });
 
 export const fetchCautionCreditDemandUserReset = () => ({
-     type: REFUND_CREDIT_DEMAND_USER_RESET
+    type: REFUND_CREDIT_DEMAND_USER_RESET
 });
 
 
 export const fetchCautionCreditDemandAgentPending = () => ({
-     type: CAUTION_CREDIT_DEMAND_AGENT_PENDING
+    type: CAUTION_CREDIT_DEMAND_AGENT_PENDING
 });
 
 export const fetchCautionCreditDemandAgentSuccess = (res) => ({
-     type: CAUTION_CREDIT_DEMAND_AGENT_SUCCESS,
-     result: res,
+    type: CAUTION_CREDIT_DEMAND_AGENT_SUCCESS,
+    result: res,
 });
 
 export const fetchCautionCreditDemandAgentError = (error) => ({
-     type: CAUTION_CREDIT_DEMAND_AGENT_ERROR,
-     result: error
+    type: CAUTION_CREDIT_DEMAND_AGENT_ERROR,
+    result: error
 });
 
 export const fetchCautionCreditDemandAgentReset = () => ({
-     type: CAUTION_CREDIT_DEMAND_AGENT_RESET
+    type: CAUTION_CREDIT_DEMAND_AGENT_RESET
 });
 
 
 export const fetchGetNanoCreditDemandDetailPending = () => ({
-     type: GET_NANO_CREDIT_DEMAND_DETAIL_PENDING
+    type: GET_NANO_CREDIT_DEMAND_DETAIL_PENDING
 });
 
 export const fetchGetNanoCreditDemandDetailSuccess = (res) => ({
-     type: GET_NANO_CREDIT_DEMAND_DETAIL_SUCCESS,
-     result: res,
+    type: GET_NANO_CREDIT_DEMAND_DETAIL_SUCCESS,
+    result: res,
 });
 
 export const fetchGetNanoCreditDemandDetailError = (error) => ({
-     type: GET_NANO_CREDIT_DEMAND_DETAIL_ERROR,
-     result: error
+    type: GET_NANO_CREDIT_DEMAND_DETAIL_ERROR,
+    result: error
 });
 
 export const fetchGetNanoCreditDemandDetailReset = () => ({
-     type: GET_NANO_CREDIT_DEMAND_DETAIL_RESET
+    type: GET_NANO_CREDIT_DEMAND_DETAIL_RESET
 });
 
 
 export const fetchEpargnerArgentUserPending = () => ({
-     type: EPARGNER_ARGENT_USER_PENDING
+    type: EPARGNER_ARGENT_USER_PENDING
 });
 
 export const fetchEpargnerArgentUserSuccess = (res) => ({
-     type: EPARGNER_ARGENT_USER_SUCCESS,
-     result: res,
+    type: EPARGNER_ARGENT_USER_SUCCESS,
+    result: res,
 });
 
 export const fetchEpargnerArgentUserError = (error) => ({
-     type: EPARGNER_ARGENT_USER_ERROR,
-     result: error
+    type: EPARGNER_ARGENT_USER_ERROR,
+    result: error
 });
 
 export const fetchEpargnerArgentUserReset = () => ({
-     type: EPARGNER_ARGENT_USER_RESET
+    type: EPARGNER_ARGENT_USER_RESET
 });
 
 
 export const fetchCasserEpargneUserPending = () => ({
-     type: CASSER_EPARGNE_USER_PENDING
+    type: CASSER_EPARGNE_USER_PENDING
 });
 
 export const fetchCasserEpargneUserSuccess = (res) => ({
-     type: CASSER_EPARGNE_USER_SUCCESS,
-     result: res,
+    type: CASSER_EPARGNE_USER_SUCCESS,
+    result: res,
 });
 
 export const fetchCasserEpargneUserError = (error) => ({
-     type: CASSER_EPARGNE_USER_ERROR,
-     result: error
+    type: CASSER_EPARGNE_USER_ERROR,
+    result: error
 });
 
 export const fetchCasserEpargneUserReset = () => ({
-     type: CASSER_EPARGNE_USER_RESET
+    type: CASSER_EPARGNE_USER_RESET
 });
 
 
 export const fetchGetNanoCreditUserAccountPending = () => ({
-     type: GET_NANO_CREDIT_ACCOUNT_USER_PENDING
+    type: GET_NANO_CREDIT_ACCOUNT_USER_PENDING
 });
 
 export const fetchGetNanoCreditUserAccountSuccess = (res) => ({
-     type: GET_NANO_CREDIT_ACCOUNT_USER_SUCCESS,
-     result: res,
+    type: GET_NANO_CREDIT_ACCOUNT_USER_SUCCESS,
+    result: res,
 });
 
 export const fetchGetNanoCreditUserAccountError = (error) => ({
-     type: GET_NANO_CREDIT_ACCOUNT_USER_ERROR,
-     result: error
+    type: GET_NANO_CREDIT_ACCOUNT_USER_ERROR,
+    result: error
 });
 
 export const fetchGetNanoCreditUserAccountReset = () => ({
-     type: GET_NANO_CREDIT_ACCOUNT_USER_RESET
+    type: GET_NANO_CREDIT_ACCOUNT_USER_RESET
 });
 
 
 export const fetchGetNanoCreditUserHistoryPending = () => ({
-     type: GET_NANO_CREDIT_HISTORY_USER_PENDING
+    type: GET_NANO_CREDIT_HISTORY_USER_PENDING
 });
 
 export const fetchGetNanoCreditUserHistorySuccess = (res) => ({
-     type: GET_NANO_CREDIT_HISTORY_USER_SUCCESS,
-     result: res,
+    type: GET_NANO_CREDIT_HISTORY_USER_SUCCESS,
+    result: res,
 });
 
 export const fetchGetNanoCreditUserHistoryError = (error) => ({
-     type: GET_NANO_CREDIT_HISTORY_USER_ERROR,
-     result: error
+    type: GET_NANO_CREDIT_HISTORY_USER_ERROR,
+    result: error
 });
 
 export const fetchGetNanoCreditUserHistoryReset = () => ({
-     type: GET_NANO_CREDIT_HISTORY_USER_RESET
+    type: GET_NANO_CREDIT_HISTORY_USER_RESET
+});
+
+
+export const fetchGetNanoCreditUserHistoryInProgressPending = () => ({
+    type: GET_NANO_CREDIT_HISTORY_PENDING_USER_PENDING
+});
+
+export const fetchGetNanoCreditUserHistoryInProgressSuccess = (res) => ({
+    type: GET_NANO_CREDIT_HISTORY_PENDING_USER_SUCCESS,
+    result: res,
+});
+
+export const fetchGetNanoCreditUserHistoryInProgressError = (error) => ({
+    type: GET_NANO_CREDIT_HISTORY_PENDING_USER_ERROR,
+    result: error
+});
+
+export const fetchGetNanoCreditUserHistoryInProgressReset = () => ({
+    type: GET_NANO_CREDIT_HISTORY_PENDING_USER_RESET
+});
+
+
+export const fetchGetEpargneInProgressPending = () => ({
+    type: GET_EPARGNE_HISTORY_PENDING_USER_PENDING
+});
+
+export const fetchGetEpargneInProgressSuccess = (res) => ({
+    type: GET_EPARGNE_HISTORY_PENDING_USER_SUCCESS,
+    result: res,
+});
+
+export const fetchGetEpargneInProgressError = (error) => ({
+    type: GET_EPARGNE_HISTORY_PENDING_USER_ERROR,
+    result: error
+});
+
+export const fetchGetEpargneInProgressReset = () => ({
+    type: GET_EPARGNE_HISTORY_PENDING_USER_RESET
 });

redux/reducers/GetDemandsGroupReducer.js

@@ -1,33 +1,42 @@
-import { GET_DEMAND_GROUP_ERROR, GET_DEMAND_GROUP_PENDING, GET_DEMAND_GROUP_RESET, GET_DEMAND_GROUP_SUCCESS } from "../types/NanoCreditType";
+import {
+    GET_DEMAND_GROUP_ERROR,
+    GET_DEMAND_GROUP_PENDING,
+    GET_DEMAND_GROUP_RESET,
+    GET_DEMAND_GROUP_SUCCESS
+} from "../types/NanoCreditType";
 
 const initialState = {
-     loading: false,
-     result: null,
-     error: null
+    loading: false,
+    result: null,
+    error: null
 };
 
 export default (state = initialState, action) => {
-     switch (action.type) {
-          case GET_DEMAND_GROUP_PENDING: return {
-               ...state,
-               loading: true
-          }
-          case GET_DEMAND_GROUP_SUCCESS: return {
-               ...state,
-               loading: false,
-               result: action.result.data,
-               error: null
-          }
-          case GET_DEMAND_GROUP_ERROR: return {
-               ...state,
-               loading: false,
-               result: null,
-               error: action.result
-          }
-          case GET_DEMAND_GROUP_RESET: return initialState;
+    switch (action.type) {
+        case GET_DEMAND_GROUP_PENDING:
+            return {
+                ...state,
+                loading: true
+            }
+        case GET_DEMAND_GROUP_SUCCESS:
+            return {
+                ...state,
+                loading: false,
+                result: action.result.data,
+                error: null
+            }
+        case GET_DEMAND_GROUP_ERROR:
+            return {
+                ...state,
+                loading: false,
+                result: null,
+                error: action.result
+            }
+        case GET_DEMAND_GROUP_RESET:
+            return initialState;
 
-          default: {
-               return state;
-          }
-     }
+        default: {
+            return state;
+        }
+    }
 };

redux/reducers/GetEpargneInProgressReducer.js

@@ -0,0 +1,42 @@
+import {
+    GET_EPARGNE_HISTORY_PENDING_USER_ERROR,
+    GET_EPARGNE_HISTORY_PENDING_USER_PENDING,
+    GET_EPARGNE_HISTORY_PENDING_USER_RESET,
+    GET_EPARGNE_HISTORY_PENDING_USER_SUCCESS
+} from "../types/NanoCreditType";
+
+const initialState = {
+    loading: false,
+    result: null,
+    error: null
+};
+
+export default (state = initialState, action) => {
+    switch (action.type) {
+        case GET_EPARGNE_HISTORY_PENDING_USER_PENDING:
+            return {
+                ...state,
+                loading: true
+            }
+        case GET_EPARGNE_HISTORY_PENDING_USER_SUCCESS:
+            return {
+                ...state,
+                loading: false,
+                result: action.result.data,
+                error: null
+            }
+        case GET_EPARGNE_HISTORY_PENDING_USER_ERROR:
+            return {
+                ...state,
+                loading: false,
+                result: null,
+                error: action.result
+            }
+        case GET_EPARGNE_HISTORY_PENDING_USER_RESET:
+            return initialState;
+
+        default: {
+            return state;
+        }
+    }
+};

redux/reducers/GetNanoCreditUserHistoryInProgressReducer.js

@@ -0,0 +1,42 @@
+import {
+    GET_NANO_CREDIT_HISTORY_PENDING_USER_ERROR,
+    GET_NANO_CREDIT_HISTORY_PENDING_USER_PENDING,
+    GET_NANO_CREDIT_HISTORY_PENDING_USER_RESET,
+    GET_NANO_CREDIT_HISTORY_PENDING_USER_SUCCESS
+} from "../types/NanoCreditType";
+
+const initialState = {
+    loading: false,
+    result: null,
+    error: null
+};
+
+export default (state = initialState, action) => {
+    switch (action.type) {
+        case GET_NANO_CREDIT_HISTORY_PENDING_USER_PENDING:
+            return {
+                ...state,
+                loading: true
+            }
+        case GET_NANO_CREDIT_HISTORY_PENDING_USER_SUCCESS:
+            return {
+                ...state,
+                loading: false,
+                result: action.result.data,
+                error: null
+            }
+        case GET_NANO_CREDIT_HISTORY_PENDING_USER_ERROR:
+            return {
+                ...state,
+                loading: false,
+                result: null,
+                error: action.result
+            }
+        case GET_NANO_CREDIT_HISTORY_PENDING_USER_RESET:
+            return initialState;
+
+        default: {
+            return state;
+        }
+    }
+};

redux/reducers/index.js

@@ -44,6 +44,8 @@ import GetNanoCreditHistoryUserReducer from "./GetNanoCreditHistoryUserReducer";
 import GetHyperSuperHistoryReducer from "./GetHyperSuperHistoryReducer";
 import GetBankListReducer from "./GetBankListReducer";
 import EnvoieUserWalletToBank from "./EnvoieUserWalletToBankReducer";
+import GetEpargneInProgressReducer from "./GetEpargneInProgressReducer";
+import GetNanoCreditUserHistoryInProgressReducer from "./GetNanoCreditUserHistoryInProgressReducer";
 
 const persistConfig = {
     key: 'root',
@@ -96,7 +98,9 @@ const rootReducer = persistCombineReducers(persistConfig, {
     getNanoCreditHistoryUserReducer: GetNanoCreditHistoryUserReducer,
     getHyperSuperHistoryReducer: GetHyperSuperHistoryReducer,
     getBankListReducer: GetBankListReducer,
-    envoieUserWalletToBank: EnvoieUserWalletToBank
+    envoieUserWalletToBank: EnvoieUserWalletToBank,
+    getEpargneInProgressReducer: GetEpargneInProgressReducer,
+    getNanoCreditUserHistoryInProgressReducer: GetNanoCreditUserHistoryInProgressReducer
 });
 
 export default rootReducer;

redux/types/NanoCreditType.js

@@ -68,12 +68,22 @@ export const CASSER_EPARGNE_USER_SUCCESS = 'CASSER_EPARGNE_USER_SUCCESS';
 export const CASSER_EPARGNE_USER_ERROR = 'CASSER_EPARGNE_USER_ERROR';
 export const CASSER_EPARGNE_USER_RESET = 'CASSER_EPARGNE_USER_RESET';
 
+export const GET_NANO_CREDIT_HISTORY_USER_ERROR = 'GET_NANO_CREDIT_HISTORY_USER_ERROR';
+export const GET_NANO_CREDIT_HISTORY_USER_RESET = 'GET_NANO_CREDIT_HISTORY_USER_RESET';
+export const GET_NANO_CREDIT_HISTORY_USER_SUCCESS = 'GET_NANO_CREDIT_HISTORY_USER_SUCCESS';
+export const GET_NANO_CREDIT_HISTORY_USER_PENDING = 'GET_NANO_CREDIT_HISTORY_USER_PENDING';
+
 export const GET_NANO_CREDIT_ACCOUNT_USER_PENDING = 'GET_NANO_CREDIT_ACCOUNT_USER_PENDING';
 export const GET_NANO_CREDIT_ACCOUNT_USER_SUCCESS = 'GET_NANO_CREDIT_ACCOUNT_USER_SUCCESS';
 export const GET_NANO_CREDIT_ACCOUNT_USER_ERROR = 'GET_NANO_CREDIT_ACCOUNT_USER_ERROR';
 export const GET_NANO_CREDIT_ACCOUNT_USER_RESET = 'GET_NANO_CREDIT_ACCOUNT_USER_RESET';
 
-export const GET_NANO_CREDIT_HISTORY_USER_PENDING = 'GET_NANO_CREDIT_HISTORY_USER_PENDING';
-export const GET_NANO_CREDIT_HISTORY_USER_SUCCESS = 'GET_NANO_CREDIT_HISTORY_USER_SUCCESS';
-export const GET_NANO_CREDIT_HISTORY_USER_ERROR = 'GET_NANO_CREDIT_HISTORY_USER_ERROR';
-export const GET_NANO_CREDIT_HISTORY_USER_RESET = 'GET_NANO_CREDIT_HISTORY_USER_RESET';
+export const GET_NANO_CREDIT_HISTORY_PENDING_USER_PENDING = 'GET_NANO_CREDIT_HISTORY_PENDING_USER_PENDING';
+export const GET_NANO_CREDIT_HISTORY_PENDING_USER_SUCCESS = 'GET_NANO_CREDIT_HISTORY_PENDING_USER_SUCCESS';
+export const GET_NANO_CREDIT_HISTORY_PENDING_USER_ERROR = 'GET_NANO_CREDIT_HISTORY_PENDING_USER_ERROR';
+export const GET_NANO_CREDIT_HISTORY_PENDING_USER_RESET = 'GET_NANO_CREDIT_HISTORY_PENDING_USER_RESET';
+
+export const GET_EPARGNE_HISTORY_PENDING_USER_PENDING = 'GET_EPARGNE_HISTORY_PENDING_USER_PENDING';
+export const GET_EPARGNE_HISTORY_PENDING_USER_SUCCESS = 'GET_EPARGNE_HISTORY_PENDING_USER_SUCCESS';
+export const GET_EPARGNE_HISTORY_PENDING_USER_ERROR = 'GET_EPARGNE_HISTORY_PENDING_USER_ERROR';
+export const GET_EPARGNE_HISTORY_PENDING_USER_RESET = 'GET_EPARGNE_HISTORY_PENDING_USER_RESET';

screens/home/Home.js

@@ -1656,7 +1656,7 @@ class Home extends BaseScreen {
                     translucent={true}
                 />
                 {/* Start here to comment */}
-                {/*                {
+                {/*{
                     (this.state.loadingDialog || this.props.loading) ?
                         <View
                             style={{

screens/nano-credit/CautionNanoCreditAgent.js

@@ -1,26 +1,32 @@
 import Button from 'apsl-react-native-button';
 import isEqual from 'lodash/isEqual';
 import isNil from 'lodash/isNil';
-import React, { Component } from 'react';
-import { Alert, ScrollView, StyleSheet, Text, View } from 'react-native';
+import React, {Component} from 'react';
+import {Alert, ScrollView, StyleSheet, Text, View} from 'react-native';
 import * as Animatable from 'react-native-animatable';
 import Dialog from "react-native-dialog";
 import I18n from 'react-native-i18n';
-import { store } from "../../redux/store";
-import { Dropdown } from 'react-native-material-dropdown';
-import { responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions';
-import { ProgressDialog } from 'react-native-simple-dialogs';
-import { Fumi } from 'react-native-textinput-effects';
+import {store} from "../../redux/store";
+import {Dropdown} from 'react-native-material-dropdown';
+import {responsiveHeight, responsiveWidth} from 'react-native-responsive-dimensions';
+import {ProgressDialog} from 'react-native-simple-dialogs';
+import {Fumi} from 'react-native-textinput-effects';
 import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
-import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
-import { Color } from '../../config/Color';
-import { FontWeight, Typography } from '../../config/typography';
-import { IlinkEmitter } from '../../utils/events';
-import { cautionCreditDemandAgentAction, cautionCreditDemandAgentReset, getNanoCreditDemandDetailAction, getNanoCreditDemandDetailReset } from '../../webservice/agent/NanoCreditAgentApi';
-import { readUser } from '../../webservice/AuthApi';
-import { withdrawalMode } from '../../utils/UtilsFunction';
+import {connect} from 'react-redux';
+import {bindActionCreators} from 'redux';
+import {Color} from '../../config/Color';
+import {Typography} from '../../config/typography';
+import {IlinkEmitter} from '../../utils/events';
+import {
+    cautionCreditDemandAgentAction,
+    cautionCreditDemandAgentReset,
+    getNanoCreditDemandDetailAction,
+    getNanoCreditDemandDetailReset
+} from '../../webservice/agent/NanoCreditAgentApi';
+import {readUser} from '../../webservice/AuthApi';
+import {withdrawalMode} from '../../utils/UtilsFunction';
 import thousands from 'thousands';
+
 const moment = require('moment');
 
 let theme = require('../../utils/theme.json');
@@ -30,478 +36,494 @@ let route = require('../../route.json');
 class CautionNanoCreditAgent extends Component {
 
 
-     constructor(props) {
-          super(props);
-          this.state = {
-               password: null,
-               idDemand: null,
-               codeGroup: null,
-               loading: false,
-               user: null,
-               triggerSubmitClick: false,
-               isSubmitClick: false,
-               isDataSubmit: false,
-               withdrawalInCashType: withdrawalMode(),
-               withdrawalInCashTypeName: withdrawalMode()[0].name,
-               isModalConfirmVisible: false,
-               isGroupToModify: false,
-               isModalConfirmVisible: false,
-               withdrawalInCash: true,
-               wallet: store.getState().walletDetailReducer.result.response
-          };
+    constructor(props) {
+        super(props);
+        this.state = {
+            password: null,
+            idDemand: null,
+            codeGroup: null,
+            loading: false,
+            user: null,
+            triggerSubmitClick: false,
+            isSubmitClick: false,
+            isDataSubmit: false,
+            withdrawalInCashType: withdrawalMode(),
+            withdrawalInCashTypeName: withdrawalMode()[0].name,
+            isModalConfirmVisible: false,
+            isGroupToModify: false,
+            withdrawalInCash: true,
+            wallet: store.getState().walletDetailReducer.result.response
+        };
 
-          this.props.getNanoCreditDemandDetailReset();
-          this.props.cautionCreditDemandAgentReset();
+        this.props.getNanoCreditDemandDetailReset();
+        this.props.cautionCreditDemandAgentReset();
 
-     }
+    }
 
-     static navigatorStyle = {
-          navBarBackgroundColor: Color.primaryColor,
-          statusBarColor: Color.primaryDarkColor,
-          navBarTextColor: '#FFFFFF',
-          navBarButtonColor: '#FFFFFF'
+    static navigatorStyle = {
+        navBarBackgroundColor: Color.primaryColor,
+        statusBarColor: Color.primaryDarkColor,
+        navBarTextColor: '#FFFFFF',
+        navBarButtonColor: '#FFFFFF'
 
-     };
+    };
 
-     static navigationOptions = () => {
-          return {
-               drawerLabel: () => null,
-               headerTitle: I18n.t('CAUTION_CREDIT'),
-               headerTintColor: 'white',
-               headerStyle: {
-                    backgroundColor: Color.primaryColor,
-                    marginTop: 0,
-                    color: 'white'
-               },
-               headerTitleStyle: {
-                    color: "white"
-               },
-               title: I18n.t('CAUTION_CREDIT')
-          }
-     };
+    static navigationOptions = () => {
+        return {
+            drawerLabel: () => null,
+            headerTitle: I18n.t('CAUTION_CREDIT'),
+            headerTintColor: 'white',
+            headerStyle: {
+                backgroundColor: Color.primaryColor,
+                marginTop: 0,
+                color: 'white'
+            },
+            headerTitleStyle: {
+                color: "white"
+            },
+            title: I18n.t('CAUTION_CREDIT')
+        }
+    };
 
-     componentDidMount() {
+    componentDidMount() {
 
-          readUser().then((user) => {
-               if (user) {
-                    if (user !== undefined) {
-                         this.setState({ user });
-                    }
-               }
-          });
+        readUser().then((user) => {
+            if (user) {
+                if (user !== undefined) {
+                    this.setState({user});
+                }
+            }
+        });
 
-     }
+    }
 
 
-     componentWillReceiveProps(nextProps) {
+    componentWillReceiveProps(nextProps) {
 
-          if (nextProps.resultGetNanoCreditDemandDetail != null) {
+        if (nextProps.resultGetNanoCreditDemandDetail != null) {
 
-               if (typeof nextProps.resultGetNanoCreditDemandDetail.response !== 'undefined') {
+            if (typeof nextProps.resultGetNanoCreditDemandDetail.response !== 'undefined') {
 
-                    if (!nextProps.loadingGetNanoCreditDemandDetail)
-                         this.setState({
-                              isModalConfirmVisible: true
-                         });
-               }
-          }
-     }
+                if (!nextProps.loadingGetNanoCreditDemandDetail)
+                    this.setState({
+                        isModalConfirmVisible: true
+                    });
+            }
+        }
+    }
 
-     modalConfirmTransaction = (data) => {
-          const idDemand = data.response.id_demande;
-          const montant = data.response.montant;
-          const duree = data.response.duree_mois;
-          const etat = data.response.etat;
-          const taxe = data.response.taxe;
-          const interet = data.response.interet;
-          const dateDemand = data.response.date_demande;
-          const dateRemboursementPrevu = data.response.date_remboursement_prevu;
-          const dateRemboursement = data.response.date_remboursement;
-          const retraitCash = data.response.retrait_cash;
-          const dateCreation = data.response.date_creation;
+    modalConfirmTransaction = (data) => {
+        const idDemand = data.response.id_demande;
+        const montant = data.response.montant;
+        const duree = data.response.duree_mois;
+        const etat = data.response.etat;
+        const taxe = data.response.taxe;
+        const interet = data.response.interet;
+        const dateDemand = data.response.date_demande;
+        const dateRemboursementPrevu = data.response.date_remboursement_prevu;
+        const dateRemboursement = data.response.date_remboursement;
+        const retraitCash = data.response.retrait_cash;
+        const dateCreation = data.response.date_creation;
 
-          return (
+        return (
 
-               <Dialog.Container useNativeDriver={true} visible={this.state.isModalConfirmVisible}>
+            <Dialog.Container useNativeDriver={true} visible={this.state.isModalConfirmVisible}>
 
-                    <Dialog.Title>{I18n.t('DEMAND_DETAIL')}</Dialog.Title>
+                <Dialog.Title>{I18n.t('DEMAND_DETAIL')}</Dialog.Title>
 
-                    <View>
+                <View>
 
-                         <View style={[styles.blockView, { borderBottomColor: Color.borderColor }]}>
-                              <View style={{ flexDirection: 'row', marginTop: 10 }}>
-                                   <View style={{ flex: 1 }}>
-                                        <Text style={[styles.body2]}>{I18n.t('ID_DEMAND')}</Text>
-                                   </View>
-                                   <View style={{ flex: 1, alignItems: 'flex-end' }}>
-                                        <Text style={[Typography.caption1, Color.grayColor]}>{idDemand}</Text>
-                                   </View>
-                              </View>
-                              <View style={{ flexDirection: 'row', marginTop: 10 }}>
-                                   <View style={{ flex: 1 }}>
-                                        <Text style={[styles.body2]}>{I18n.t('AMOUNT')}</Text>
-                                   </View>
-                                   <View style={{ flex: 1, alignItems: 'flex-end' }}>
-                                        <Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(montant, ' ')} ${this.state.wallet.currency_code}`}</Text>
-                                   </View>
-                              </View>
-                              <View style={{ flexDirection: 'row', marginTop: 10 }}>
-                                   <View style={{ flex: 1 }}>
-                                        <Text tyle={[Typography.body2]}>{I18n.t('TAXES')}</Text>
-                                   </View>
-                                   <View style={{ flex: 1, alignItems: 'flex-end' }}>
-                                        <Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(taxe, ' ')} ${this.state.wallet.currency_code}`}</Text>
-                                   </View>
-                              </View>
-                              <View style={{ flexDirection: 'row', marginTop: 10 }}>
-                                   <View style={{ flex: 1 }}>
-                                        <Text tyle={[Typography.body2]}>{I18n.t('INTERET')}</Text>
-                                   </View>
-                                   <View style={{ flex: 1, alignItems: 'flex-end' }}>
-                                        <Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(interet, ' ')} ${this.state.wallet.currency_code}`}</Text>
-                                   </View>
-                              </View>
-                              <View style={{ flexDirection: 'row', marginTop: 10 }}>
-                                   <View style={{ flex: 1 }}>
-                                        <Text tyle={[Typography.body2]}>{I18n.t('WITHDRAWAL_TYPE')}</Text>
-                                   </View>
-                                   <View style={{ flex: 1, alignItems: 'flex-end' }}>
-                                        <Text style={[Typography.caption1, Color.grayColor]}>{retraitCash ? I18n.t('WITHDRAWAL_IN_CASH') : I18n.t('TRANSFER_IN_ACCOUNT')}</Text>
-                                   </View>
-                              </View>
-                              <View style={{ flexDirection: 'row', marginTop: 10 }}>
-                                   <View style={{ flex: 1 }}>
-                                        <Text tyle={[Typography.body2]}>{I18n.t('ETAT')}</Text>
-                                   </View>
-                                   <View style={{ flex: 1, alignItems: 'flex-end' }}>
-                                        <Text style={[Typography.caption1, Color.grayColor]}>{I18n.t(etat)}</Text>
-                                   </View>
-                              </View>
-                              <View style={{ flexDirection: 'row', marginTop: 10 }}>
-                                   <View style={{ flex: 1 }}>
-                                        <Text tyle={[Typography.body2]}>{I18n.t('DEMAND_DURATION_IN_MONTH')}</Text>
-                                   </View>
-                                   <View style={{ flex: 1, alignItems: 'flex-end' }}>
-                                        <Text style={[Typography.caption1, Color.grayColor]}>{duree}</Text>
-                                   </View>
-                              </View>
-                              <View style={{ flexDirection: 'row', marginTop: 10 }}>
-                                   <View style={{ flex: 1 }}>
-                                        <Text tyle={[Typography.body2]}>{I18n.t('CREATION_DATE')}</Text>
-                                   </View>
-                                   <View style={{ flex: 1, alignItems: 'flex-end' }}>
-                                        <Text style={[Typography.caption1, Color.grayColor]}>{moment(dateCreation).format('DD-MM-YYYY')}</Text>
-                                   </View>
-                              </View>
-                         </View>
+                    <View style={[styles.blockView, {borderBottomColor: Color.borderColor}]}>
+                        <View style={{flexDirection: 'row', marginTop: 10}}>
+                            <View style={{flex: 1}}>
+                                <Text style={[styles.body2]}>{I18n.t('ID_DEMAND')}</Text>
+                            </View>
+                            <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                <Text style={[Typography.caption1, Color.grayColor]}>{idDemand}</Text>
+                            </View>
+                        </View>
+                        <View style={{flexDirection: 'row', marginTop: 10}}>
+                            <View style={{flex: 1}}>
+                                <Text style={[styles.body2]}>{I18n.t('AMOUNT')}</Text>
+                            </View>
+                            <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                <Text
+                                    style={[Typography.caption1, Color.grayColor]}>{`${thousands(montant, ' ')} ${this.state.wallet.currency_code}`}</Text>
+                            </View>
+                        </View>
+                        <View style={{flexDirection: 'row', marginTop: 10}}>
+                            <View style={{flex: 1}}>
+                                <Text tyle={[Typography.body2]}>{I18n.t('TAXES')}</Text>
+                            </View>
+                            <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                <Text
+                                    style={[Typography.caption1, Color.grayColor]}>{`${thousands(taxe, ' ')} ${this.state.wallet.currency_code}`}</Text>
+                            </View>
+                        </View>
+                        <View style={{flexDirection: 'row', marginTop: 10}}>
+                            <View style={{flex: 1}}>
+                                <Text tyle={[Typography.body2]}>{I18n.t('INTERET')}</Text>
+                            </View>
+                            <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                <Text
+                                    style={[Typography.caption1, Color.grayColor]}>{`${thousands(interet, ' ')} ${this.state.wallet.currency_code}`}</Text>
+                            </View>
+                        </View>
+                        <View style={{flexDirection: 'row', marginTop: 10}}>
+                            <View style={{flex: 1}}>
+                                <Text tyle={[Typography.body2]}>{I18n.t('WITHDRAWAL_TYPE')}</Text>
+                            </View>
+                            <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                <Text
+                                    style={[Typography.caption1, Color.grayColor]}>{retraitCash ? I18n.t('WITHDRAWAL_IN_CASH') : I18n.t('TRANSFER_IN_ACCOUNT')}</Text>
+                            </View>
+                        </View>
+                        <View style={{flexDirection: 'row', marginTop: 10}}>
+                            <View style={{flex: 1}}>
+                                <Text tyle={[Typography.body2]}>{I18n.t('ETAT')}</Text>
+                            </View>
+                            <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                <Text style={[Typography.caption1, Color.grayColor]}>{etat}</Text>
+                            </View>
+                        </View>
+                        <View style={{flexDirection: 'row', marginTop: 10}}>
+                            <View style={{flex: 1}}>
+                                <Text tyle={[Typography.body2]}>{I18n.t('DEMAND_DURATION_IN_MONTH')}</Text>
+                            </View>
+                            <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                <Text style={[Typography.caption1, Color.grayColor]}>{duree}</Text>
+                            </View>
+                        </View>
+                        <View style={{flexDirection: 'row', marginTop: 10}}>
+                            <View style={{flex: 1}}>
+                                <Text tyle={[Typography.body2]}>{I18n.t('CREATION_DATE')}</Text>
+                            </View>
+                            <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                <Text
+                                    style={[Typography.caption1, Color.grayColor]}>{moment(dateCreation).format('DD-MM-YYYY')}</Text>
+                            </View>
+                        </View>
                     </View>
+                </View>
 
-                    <Dialog.Button bold={true} label={I18n.t('CANCEL_LABEL')} onPress={() => {
-                         this.setState({
-                              isModalConfirmVisible: false
-                         });
-                    }} />
-                    <Dialog.Button bold={true} label={I18n.t('SUBMIT_LABEL')} onPress={() => {
-                         this.setState({
-                              isModalConfirmVisible: false,
-                              isDataSubmit: true
-                         });
-                         this.props.cautionCreditDemandAgentAction({
-                              id_demande: this.state.idDemand,
-                              id_wallet_agent: this.state.wallet.id,
-                              retrait_cash: this.state.withdrawalInCash,
-                              password: this.state.password
-                         });
-                         this.props.getNanoCreditDemandDetailReset();
-                    }} />
+                <Dialog.Button bold={true} label={I18n.t('CANCEL_LABEL')} onPress={() => {
+                    this.setState({
+                        isModalConfirmVisible: false
+                    });
+                }}/>
+                <Dialog.Button bold={true} label={I18n.t('SUBMIT_LABEL')} onPress={() => {
+                    this.setState({
+                        isModalConfirmVisible: false,
+                        isDataSubmit: true
+                    });
+                    this.props.cautionCreditDemandAgentAction({
+                        id_demande: this.state.idDemand,
+                        id_wallet_agent: this.state.wallet.id,
+                        retrait_cash: this.state.withdrawalInCash,
+                        password: this.state.password
+                    });
+                    this.props.getNanoCreditDemandDetailReset();
+                }}/>
 
-               </Dialog.Container>
+            </Dialog.Container>
 
-          );
+        );
 
-     }
+    }
 
-     ckeckIfFieldIsOK(champ) {
-          return (isNil(champ) || isEqual(champ.length, 0));
-     }
+    ckeckIfFieldIsOK(champ) {
+        return (isNil(champ) || isEqual(champ.length, 0));
+    }
 
-     renderRefundNanoCreditResponse = () => {
+    renderRefundNanoCreditResponse = () => {
 
-          const { result, error } = this.props;
+        const {result, error} = this.props;
 
-          if (error !== null) {
-               if (typeof error.data !== 'undefined') {
-                    Alert.alert(
-                         I18n.t("ERROR_LABLE"),
-                         error.data.error,
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.cautionCreditDemandAgentReset();
-                                        IlinkEmitter.emit("refreshWallet");
-                                   }
-                              }
-                         ],
-                         { cancelable: false }
-                    )
-               }
-          }
+        if (error !== null) {
+            if (typeof error.data !== 'undefined') {
+                Alert.alert(
+                    I18n.t("ERROR_LABLE"),
+                    error.data.error,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.cautionCreditDemandAgentReset();
+                                IlinkEmitter.emit("refreshWallet");
+                            }
+                        }
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
 
-          if (result !== null) {
-               if (result.response !== null) {
-                    Alert.alert(
-                         I18n.t("REFUND_DONE"),
-                         result.response,
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.cautionCreditDemandAgentReset();
-                                        IlinkEmitter.emit("refreshWallet");
-                                        this.props.navigation.pop();
-                                   }
-                              }
+        if (result !== null) {
+            if (result.response !== null) {
+                Alert.alert(
+                    I18n.t("CAUTIONNEMENT_DONE"),
+                    result.response,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.cautionCreditDemandAgentReset();
+                                IlinkEmitter.emit("refreshWallet");
+                                this.props.navigation.pop();
+                            }
+                        }
 
-                         ],
-                         { cancelable: false }
-                    )
-               }
-          }
-     }
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
+    }
 
-     updateLangue() {
-          this.props.navigation.setParams({ name: I18n.t('REFUND_NANO_CREDIT') })
-          this.forceUpdate()
-     }
+    updateLangue() {
+        this.props.navigation.setParams({name: I18n.t('REFUND_NANO_CREDIT')})
+        this.forceUpdate()
+    }
 
-     ckeckIfFieldIsOK(champ) {
-          return (isNil(champ) || isEqual(champ.length, 0));
-     }
+    ckeckIfFieldIsOK(champ) {
+        return (isNil(champ) || isEqual(champ.length, 0));
+    }
 
-     onSubmitCautionnerNanoCredit = () => {
-          const { idDemand, password } = this.state;
+    onSubmitCautionnerNanoCredit = () => {
+        const {idDemand, password} = this.state;
 
-          if (this.ckeckIfFieldIsOK(idDemand))
-               this.idDemandAnim.shake(800);
-          else if (this.ckeckIfFieldIsOK(password))
-               this.passwordAnim.shake(800);
-          else {
+        if (this.ckeckIfFieldIsOK(idDemand))
+            this.idDemandAnim.shake(800);
+        else if (this.ckeckIfFieldIsOK(password))
+            this.passwordAnim.shake(800);
+        else {
 
-               this.props.getNanoCreditDemandDetailAction(this.state.idDemand);
-          }
-          this.setState({
-               triggerSubmitClick: true
-          });
-     }
+            this.props.getNanoCreditDemandDetailAction(this.state.idDemand);
+        }
+        this.setState({
+            triggerSubmitClick: true
+        });
+    }
 
-     renderGetNanoCreditDemandDetailResponse = () => {
-          const { resultGetNanoCreditDemandDetail, errorGetNanoCreditDemandDetail } = this.props;
+    renderGetNanoCreditDemandDetailResponse = () => {
+        const {resultGetNanoCreditDemandDetail, errorGetNanoCreditDemandDetail} = this.props;
 
-          if (errorGetNanoCreditDemandDetail !== null) {
-               if (typeof errorGetNanoCreditDemandDetail.data !== 'undefined') {
-                    Alert.alert(
-                         I18n.t('ERROR_LABEL'),
-                         errorGetNanoCreditDemandDetail.data.error,
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.getNanoCreditDemandDetailReset();
-                                   }
-                              }
+        if (errorGetNanoCreditDemandDetail !== null) {
+            if (typeof errorGetNanoCreditDemandDetail.data !== 'undefined') {
+                Alert.alert(
+                    I18n.t('ERROR_LABEL'),
+                    errorGetNanoCreditDemandDetail.data.error,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.getNanoCreditDemandDetailReset();
+                            }
+                        }
 
-                         ],
-                         { cancelable: false }
-                    )
-               } else {
-                    Alert.alert(
-                         I18n.t('ERROR_LABEL'),
-                         JSON.stringify(errorGetNanoCreditDemandDetail),
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.getNanoCreditDemandDetailAction();
-                                   }
-                              }
+                    ],
+                    {cancelable: false}
+                )
+            } else {
+                Alert.alert(
+                    I18n.t('ERROR_LABEL'),
+                    JSON.stringify(errorGetNanoCreditDemandDetail),
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.getNanoCreditDemandDetailAction();
+                            }
+                        }
 
-                         ],
-                         { cancelable: false }
-                    )
-               }
-          }
-     }
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
+    }
 
 
-     renderLoader = () => {
-          return (
-               <ProgressDialog
-                    visible={this.props.loading || this.props.loadingGetNanoCreditDemandDetail}
-                    title={I18n.t('LOADING')}
-                    message={I18n.t('LOADING_INFO')}
-               />
-          )
-     }
+    renderLoader = () => {
+        return (
+            <ProgressDialog
+                visible={this.props.loading || this.props.loadingGetNanoCreditDemandDetail}
+                title={I18n.t('LOADING')}
+                message={I18n.t('LOADING_INFO')}
+            />
+        )
+    }
 
-     render() {
-          const { resultGetNanoCreditDemandDetail } = this.props;
+    render() {
+        const {resultGetNanoCreditDemandDetail} = this.props;
 
-          return (
-               <>
-                    {(this.props.loading || this.props.loadingGetNanoCreditDemandDetail) && this.renderLoader()}
-                    {this.state.isDataSubmit && this.renderRefundNanoCreditResponse()}
-                    {
-                         (resultGetNanoCreditDemandDetail !== null) &&
-                         (typeof resultGetNanoCreditDemandDetail.response !== 'undefined') &&
-                         this.modalConfirmTransaction(resultGetNanoCreditDemandDetail)
-                    }
-                    <ScrollView style={styles.container}>
+        return (
+            <>
+                {(this.props.loading || this.props.loadingGetNanoCreditDemandDetail) && this.renderLoader()}
+                {this.state.isDataSubmit && this.renderRefundNanoCreditResponse()}
+                {
+                    (resultGetNanoCreditDemandDetail !== null) &&
+                    (typeof resultGetNanoCreditDemandDetail.response !== 'undefined') &&
+                    this.modalConfirmTransaction(resultGetNanoCreditDemandDetail)
+                }
+                <ScrollView style={styles.container}>
 
-                         <Text style={styles.subbigtitle}>{I18n.t('DEMAND_INFO')}</Text>
+                    <Text style={styles.subbigtitle}>{I18n.t('DEMAND_INFO')}</Text>
 
-                         <Animatable.View ref={(comp) => { this.idDemandAnim = comp }}>
-                              <Fumi iconClass={FontAwesomeIcon} iconName={'id-card'}
-                                   label={I18n.t('ID_DEMAND')}
-                                   iconColor={'#f95a25'}
-                                   iconSize={20}
-                                   value={this.state.idDemand}
-                                   onChangeText={(idDemand) => {
+                    <Animatable.View ref={(comp) => {
+                        this.idDemandAnim = comp
+                    }}>
+                        <Fumi iconClass={FontAwesomeIcon} iconName={'id-card'}
+                              label={I18n.t('ID_DEMAND')}
+                              iconColor={'#f95a25'}
+                              iconSize={20}
+                              value={this.state.idDemand}
+                              onChangeText={(idDemand) => {
 
-                                        this.setState({ idDemand })
-                                   }}
-                                   style={styles.input}
-                              >
-                              </Fumi>
-                         </Animatable.View>
+                                  this.setState({idDemand})
+                              }}
+                              style={styles.input}
+                        >
+                        </Fumi>
+                    </Animatable.View>
 
-                         <Animatable.View ref={(comp) => { this.typeRetraitAnim = comp }}
-                              style={{
-                                   width: responsiveWidth(90),
-                                   height: 60,
-                                   marginTop: 20,
-                                   alignSelf: 'center',
-                                   borderRadius: 10,
-                                   paddingLeft: 20,
-                                   paddingRight: 20,
-                                   backgroundColor: 'white'
-                              }}>
-                              <Dropdown
-                                   label={I18n.t('WITHDRAWAL_TYPE')}
-                                   data={this.state.withdrawalInCashType}
-                                   useNativeDriver={true}
-                                   value={this.state.withdrawalInCashTypeName}
-                                   onChangeText={(value, index, data) => {
-                                        if (value === I18n.t('WITHDRAWAL_IN_CASH'))
-                                             this.setState({
-                                                  withdrawalInCash: true,
-                                                  withdrawalInCashTypeName: I18n.t('WITHDRAWAL_IN_CASH')
-                                             });
-                                        else
-                                             this.setState({
-                                                  withdrawalInCash: false,
-                                                  withdrawalInCashTypeName: I18n.t('TRANSFER_IN_ACCOUNT')
-                                             })
-                                   }}
-                                   valueExtractor={(value) => { return value.name }}
-                                   labelExtractor={(value) => { return value.name }}
-                              />
-                         </Animatable.View>
+                    <Animatable.View ref={(comp) => {
+                        this.typeRetraitAnim = comp
+                    }}
+                                     style={{
+                                         width: responsiveWidth(90),
+                                         height: 60,
+                                         marginTop: 20,
+                                         alignSelf: 'center',
+                                         borderRadius: 10,
+                                         paddingLeft: 20,
+                                         paddingRight: 20,
+                                         backgroundColor: 'white'
+                                     }}>
+                        <Dropdown
+                            label={I18n.t('WITHDRAWAL_TYPE')}
+                            data={this.state.withdrawalInCashType}
+                            useNativeDriver={true}
+                            value={I18n.t(this.state.withdrawalInCashTypeName)}
+                            onChangeText={(value, index, data) => {
+                                if (value === I18n.t('WITHDRAWAL_IN_CASH'))
+                                    this.setState({
+                                        withdrawalInCash: true,
+                                        withdrawalInCashTypeName: I18n.t('WITHDRAWAL_IN_CASH')
+                                    });
+                                else
+                                    this.setState({
+                                        withdrawalInCash: false,
+                                        withdrawalInCashTypeName: I18n.t('TRANSFER_IN_ACCOUNT')
+                                    })
+                            }}
+                            valueExtractor={(value) => {
+                                return value.name
+                            }}
+                            labelExtractor={(value) => {
+                                return value.name
+                            }}
+                        />
+                    </Animatable.View>
 
 
-                         <Animatable.View ref={(comp) => { this.passwordAnim = comp }}>
-                              <Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
-                                   label={I18n.t('PASSWORD')}
-                                   iconColor={'#f95a25'}
-                                   iconSize={20}
-                                   secureTextEntry={true}
-                                   value={this.state.password}
-                                   onChangeText={(password) => {
-                                        this.setState({ password })
-                                   }}
-                                   style={styles.input}
-                              >
-                              </Fumi>
-                         </Animatable.View>
+                    <Animatable.View ref={(comp) => {
+                        this.passwordAnim = comp
+                    }}>
+                        <Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
+                              label={I18n.t('PASSWORD')}
+                              iconColor={'#f95a25'}
+                              iconSize={20}
+                              secureTextEntry={true}
+                              value={this.state.password}
+                              onChangeText={(password) => {
+                                  this.setState({password})
+                              }}
+                              style={styles.input}
+                        >
+                        </Fumi>
+                    </Animatable.View>
 
-                         <Button style={styles.btnvalide}
-                              textStyle={styles.textbtnvalide}
-                              onPress={() => { this.onSubmitCautionnerNanoCredit(); }}>
-                              {this.state.isGroupToModify ? I18n.t('MODIFY') : I18n.t('SUBMIT_LABEL')}</Button>
-                    </ScrollView>
-               </>
-          )
-     }
+                    <Button style={styles.btnvalide}
+                            textStyle={styles.textbtnvalide}
+                            onPress={() => {
+                                this.onSubmitCautionnerNanoCredit();
+                            }}>
+                        {this.state.isGroupToModify ? I18n.t('MODIFY') : I18n.t('SUBMIT_LABEL')}</Button>
+                </ScrollView>
+            </>
+        )
+    }
 }
 
 const maptStateToProps = state => ({
 
-     loading: state.cautionCreditDemandAgentReducer.loading,
-     result: state.cautionCreditDemandAgentReducer.result,
-     error: state.cautionCreditDemandAgentReducer.error,
+    loading: state.cautionCreditDemandAgentReducer.loading,
+    result: state.cautionCreditDemandAgentReducer.result,
+    error: state.cautionCreditDemandAgentReducer.error,
 
-     loadingGetNanoCreditDemandDetail: state.getNanoCreditDemandDetailReducer.loading,
-     resultGetNanoCreditDemandDetail: state.getNanoCreditDemandDetailReducer.result,
-     errorGetNanoCreditDemandDetail: state.getNanoCreditDemandDetailReducer.error,
+    loadingGetNanoCreditDemandDetail: state.getNanoCreditDemandDetailReducer.loading,
+    resultGetNanoCreditDemandDetail: state.getNanoCreditDemandDetailReducer.result,
+    errorGetNanoCreditDemandDetail: state.getNanoCreditDemandDetailReducer.error,
 });
 
 const mapDispatchToProps = dispatch => bindActionCreators({
 
-     cautionCreditDemandAgentAction,
-     cautionCreditDemandAgentReset,
+    cautionCreditDemandAgentAction,
+    cautionCreditDemandAgentReset,
 
-     getNanoCreditDemandDetailAction,
-     getNanoCreditDemandDetailReset
+    getNanoCreditDemandDetailAction,
+    getNanoCreditDemandDetailReset
 
 }, dispatch);
 
 export default connect(maptStateToProps, mapDispatchToProps)(CautionNanoCreditAgent);
 
 const styles = StyleSheet.create({
-     container: {
-          flex: 1,
-          backgroundColor: Color.primaryDarkColor,
-     },
-     textbtnvalide: {
-          color: 'white',
-          fontWeight: 'bold'
-     },
-     bigtitle: {
-          color: 'white',
-          fontSize: 20,
-          flex: 1,
-          fontWeight: 'bold',
-          textAlign: 'center',
-          margin: 20,
-     },
-     blockView: {
-          paddingVertical: 10,
-          borderBottomWidth: 1
-     },
-     subbigtitle: {
-          color: 'white',
-          fontSize: 17,
-          textAlign: 'center',
-          margin: 5,
-     },
-     btnvalide: {
-          marginTop: 20,
-          marginLeft: 20,
-          marginRight: 20,
-          borderColor: 'transparent',
-          backgroundColor: Color.accentLightColor,
-          height: 52
-     },
-     btnSubmit: {
-          marginTop: 20,
-          borderColor: 'transparent',
-          backgroundColor: Color.accentLightColor,
-          height: 52,
-          width: "30%",
-          marginLeft: 20,
-          marginRight: 20,
-     },
-     input: {
-          height: 60,
-          marginTop: responsiveHeight(2),
-          marginLeft: responsiveWidth(5),
-          marginRight: responsiveWidth(5),
-          borderRadius: 5,
-     }
+    container: {
+        flex: 1,
+        backgroundColor: Color.primaryDarkColor,
+    },
+    textbtnvalide: {
+        color: 'white',
+        fontWeight: 'bold'
+    },
+    bigtitle: {
+        color: 'white',
+        fontSize: 20,
+        flex: 1,
+        fontWeight: 'bold',
+        textAlign: 'center',
+        margin: 20,
+    },
+    blockView: {
+        paddingVertical: 10,
+        borderBottomWidth: 1
+    },
+    subbigtitle: {
+        color: 'white',
+        fontSize: 17,
+        textAlign: 'center',
+        margin: 5,
+    },
+    btnvalide: {
+        marginTop: 20,
+        marginLeft: 20,
+        marginRight: 20,
+        borderColor: 'transparent',
+        backgroundColor: Color.accentLightColor,
+        height: 52
+    },
+    btnSubmit: {
+        marginTop: 20,
+        borderColor: 'transparent',
+        backgroundColor: Color.accentLightColor,
+        height: 52,
+        width: "30%",
+        marginLeft: 20,
+        marginRight: 20,
+    },
+    input: {
+        height: 60,
+        marginTop: responsiveHeight(2),
+        marginLeft: responsiveWidth(5),
+        marginRight: responsiveWidth(5),
+        borderRadius: 5,
+    }
 });

screens/nano-credit/EpargnerArgentUser.js

@@ -1,482 +1,503 @@
 import Button from 'apsl-react-native-button';
 import isEqual from 'lodash/isEqual';
 import isNil from 'lodash/isNil';
-import React, { Component } from 'react';
-import { Alert, ScrollView, StyleSheet, Text, View } from 'react-native';
+import React, {Component} from 'react';
+import {Alert, ScrollView, StyleSheet, Text, View} from 'react-native';
 import * as Animatable from 'react-native-animatable';
 import I18n from 'react-native-i18n';
-import { Dropdown } from 'react-native-material-dropdown';
-import { responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions';
-import { ProgressDialog } from 'react-native-simple-dialogs';
-import { Fumi } from 'react-native-textinput-effects';
+import {Dropdown} from 'react-native-material-dropdown';
+import {responsiveHeight, responsiveWidth} from 'react-native-responsive-dimensions';
+import {ProgressDialog} from 'react-native-simple-dialogs';
+import {Fumi} from 'react-native-textinput-effects';
 import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
-import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
-import { Color } from '../../config/Color';
-import { FontWeight, Typography } from '../../config/typography';
-import { store } from "../../redux/store";
-import { isNormalInteger, typeEpargne } from '../../utils/UtilsFunction';
-import { readUser } from '../../webservice/AuthApi';
-import { getNanoCreditDemandDurationAction, getNanoCreditDemandDurationReset } from '../../webservice/NanoCreditApi';
-import { epargnerArgentUserAction, epargnerArgentUserReset } from "../../webservice/user/NanoCreditApi";
+import {connect} from 'react-redux';
+import {bindActionCreators} from 'redux';
+import {Color} from '../../config/Color';
+import {FontWeight, Typography} from '../../config/typography';
+import {store} from "../../redux/store";
+import {isNormalInteger, typeEpargne} from '../../utils/UtilsFunction';
+import {readUser} from '../../webservice/AuthApi';
+import {getNanoCreditDemandDurationAction, getNanoCreditDemandDurationReset} from '../../webservice/NanoCreditApi';
+import {epargnerArgentUserAction, epargnerArgentUserReset} from "../../webservice/user/NanoCreditApi";
+import {IlinkEmitter} from "../../utils/events";
+
 let theme = require('../../utils/theme.json');
 let route = require('../../route.json');
 
 
 class EpargnerArgentUser extends Component {
 
-     static navigatorStyle = {
-          navBarBackgroundColor: Color.primaryColor,
-          statusBarColor: Color.primaryDarkColor,
-          navBarTextColor: '#FFFFFF',
-          navBarButtonColor: '#FFFFFF'
+    static navigatorStyle = {
+        navBarBackgroundColor: Color.primaryColor,
+        statusBarColor: Color.primaryDarkColor,
+        navBarTextColor: '#FFFFFF',
+        navBarButtonColor: '#FFFFFF'
 
-     };
+    };
 
-     static navigationOptions = () => {
-          return {
-               drawerLabel: () => null,
-               headerTitle: I18n.t('SAVE_MONEY'),
-               headerTintColor: 'white',
-               headerStyle: {
-                    backgroundColor: Color.primaryColor,
-                    marginTop: 0,
-                    color: 'white'
-               },
-               headerTitleStyle: {
-                    color: "white"
-               },
-               title: I18n.t('SAVE_MONEY')
-          }
-     };
+    static navigationOptions = () => {
+        return {
+            drawerLabel: () => null,
+            headerTitle: I18n.t('SAVE_MONEY'),
+            headerTintColor: 'white',
+            headerStyle: {
+                backgroundColor: Color.primaryColor,
+                marginTop: 0,
+                color: 'white'
+            },
+            headerTitleStyle: {
+                color: "white"
+            },
+            title: I18n.t('SAVE_MONEY')
+        }
+    };
 
-     constructor(props) {
-          super(props);
-          this.state = {
-               codeGroupe: null,
-               codeSponsor: null,
-               nomGroupe: null,
-               codeSponsor: null,
-               displayDuration: false,
-               user: null,
-               montant: null,
-               password: null,
-               durations: [],
-               durationSelect: null,
-               triggerSubmitClick: false,
-               hasLoadDuration: false,
-               modalVisible: false,
-               isSubmitClick: false,
-               isDataSubmit: false,
-               isModalConfirmVisible: false,
-               typeEpargne: typeEpargne(),
-               typeEpargneName: I18n.t((typeEpargne()[0]).name),
-               typeEpargneToSend: 'simple',
-               wallet: store.getState().walletDetailReducer.result.response
-          };
+    constructor(props) {
+        super(props);
+        this.state = {
+            codeGroupe: null,
+            codeSponsor: null,
+            nomGroupe: null,
+            codeSponsor: null,
+            displayDuration: false,
+            user: null,
+            montant: null,
+            password: null,
+            durations: [],
+            durationSelect: null,
+            triggerSubmitClick: false,
+            hasLoadDuration: false,
+            modalVisible: false,
+            isSubmitClick: false,
+            isDataSubmit: false,
+            isModalConfirmVisible: false,
+            typeEpargne: typeEpargne(),
+            typeEpargneName: I18n.t((typeEpargne()[0]).name),
+            typeEpargneToSend: 'simple',
+            wallet: store.getState().walletDetailReducer.result.response
+        };
 
-          this.props.getNanoCreditDemandDurationReset();
+        this.props.getNanoCreditDemandDurationReset();
 
-          readUser().then((user) => {
-               console.log("USER", user);
-               if (user) {
-                    if (user !== undefined) {
-                         this.props.getNanoCreditDemandDurationAction({ id_user: user.id, type: "epargne" });
-                    };
-               }
-          })
+        readUser().then((user) => {
+            console.log("USER", user);
+            if (user) {
+                if (user !== undefined) {
+                    this.props.getNanoCreditDemandDurationAction({id_user: user.id, type: "epargne"});
+                }
+                ;
+            }
+        })
 
-     }
+    }
 
-     componentDidMount() {
+    componentDidMount() {
 
-          readUser().then((user) => {
-               if (user) {
-                    if (user !== undefined) {
-                         this.setState({ user });
+        readUser().then((user) => {
+            if (user) {
+                if (user !== undefined) {
+                    this.setState({user});
+                }
+            }
+        });
+
+    }
+
+    ckeckIfFieldIsOK(champ) {
+        return (isNil(champ) || isEqual(champ.length, 0));
+    }
+
+    isMontantValid = () => {
+        const {montant} = this.state;
+        if ((parseInt(isEqual(montant, 0)) || montant < 0))
+            return {
+                errorMessage: I18n.t('ENTER_AMOUNT_SUPERIOR_ZEROR'),
+                isValid: false
+            };
+
+        else if (!isNormalInteger(montant))
+            return {
+                errorMessage: I18n.t('ENTER_VALID_AMOUNT'),
+                isValid: false
+            };
+
+
+        else if (montant > parseInt(this.state.comptePrincipal))
+            return {
+                errorMessage: I18n.t('AMOUNT_SUPERIOR_TO_PRINCIPAL_ACCOUNT'),
+                isValid: false
+            };
+
+        else
+            return {
+                errorMessage: '',
+                isValid: true
+            };
+    }
+
+    renderGetDurationesponse = () => {
+        const {resultGetNanoCreditDuration, errorGetNanoCreditDuration} = this.props;
+        if (resultGetNanoCreditDuration !== null) {
+            if (typeof resultGetNanoCreditDuration.response !== 'undefined') {
+                if (resultGetNanoCreditDuration.response.length > 0) {
+                    this.setState({
+                        hasLoadDuration: true,
+                        durations: resultGetNanoCreditDuration.response,
+                        durationSelect: resultGetNanoCreditDuration.response[0].value,
+                        modalVisible: false
+                    });
+                } else if (resultGetNanoCreditDuration.response.length === 0) {
+                    this.setState({
+                        hasLoadDuration: true,
+                        durations: [],
+                        durationSelect: '',
+                        modalVisible: false
+                    });
+                }
+            }
+        }
+
+        if (errorGetNanoCreditDuration !== null) {
+            if (typeof errorGetNanoCreditDuration.data !== 'undefined') {
+                Alert.alert(
+                    I18n.t('ERROR_LABEL'),
+                    errorGetNanoCreditDuration.data.error,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.getNanoCreditDemandDurationReset();
+                            }
+                        }
+
+                    ],
+                    {cancelable: false}
+                )
+            } else {
+                Alert.alert(
+                    I18n.t('ERROR_LABEL'),
+                    JSON.stringify(errorGetNanoCreditDuration),
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.getNanoCreditDemandDurationReset();
+                            }
+                        }
+
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
+    }
+
+
+    renderEpargnerArgentResponse = () => {
+
+        const {result, error} = this.props;
+
+        if (error !== null) {
+            if (typeof error.data !== 'undefined') {
+                Alert.alert(
+                    I18n.t("ERROR_LABLE"),
+                    error.data.error,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.epargnerArgentUserReset();
+                            }
+                        }
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
+
+        if (result !== null) {
+            if (result.response !== null) {
+                Alert.alert(
+                    I18n.t("EPARGNE_DEPOSE"),
+                    result.response,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.epargnerArgentUserReset();
+                                //IlinkEmitter.emit("treatNanoGroupDemand");
+                                IlinkEmitter.emit("updateNanoCreditAccount");
+                                this.props.navigation.pop();
+                            }
+                        }
+
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
+    }
+
+    updateLangue() {
+        this.props.navigation.setParams({name: I18n.t('SAVE_MONEY')})
+        this.forceUpdate()
+    }
+
+
+    onSubmitEpargnerArgent = () => {
+        const {montant, typeEpargneName, durationSelect} = this.state;
+
+        if (this.ckeckIfFieldIsOK(typeEpargneName))
+            this.typeEpargneAnim.shake(800);
+        else if (this.ckeckIfFieldIsOK(durationSelect) && this.state.displayDuration)
+            this.durationAnim.shake(800);
+        else if (this.ckeckIfFieldIsOK(montant) || !this.isMontantValid().isValid)
+            this.montantAnim.shake(800);
+        else {
+
+            this.props.epargnerArgentUserAction({
+                id_user: this.state.user.id,
+                type: this.state.typeEpargneToSend,
+                duree_mois: this.state.durationSelect,
+                montant: this.state.montant,
+                password: this.state.password
+            });
+
+        }
+        this.setState({
+            isDataSubmit: true
+        });
+    }
+
+
+    renderLoader = () => {
+        return (
+            <ProgressDialog
+                visible={this.props.loading || this.props.loadingGetNanoCredit}
+                title={I18n.t('LOADING')}
+                message={I18n.t('LOADING_INFO')}
+            />
+        )
+    }
+
+    render() {
+        return (
+            <>
+                {(this.props.loading || this.props.loadingGetNanoCredit || this.state.modalVisible) && this.renderLoader()}
+                {this.state.isDataSubmit && this.renderEpargnerArgentResponse()}
+                {!this.state.hasLoadDuration && this.renderGetDurationesponse()}
+                <ScrollView style={styles.container}>
+
+                    <Text style={styles.subbigtitle}>{I18n.t('FILL_INFORMATION')}</Text>
+
+                    <Animatable.View ref={(comp) => {
+                        this.typeEpargneAnim = comp
+                    }}
+                                     style={{
+                                         width: responsiveWidth(90),
+                                         height: 60,
+                                         marginTop: 20,
+                                         alignSelf: 'center',
+                                         borderRadius: 10,
+                                         paddingLeft: 20,
+                                         paddingRight: 20,
+                                         backgroundColor: 'white'
+                                     }}>
+                        <Dropdown
+                            label={I18n.t('SAVE_MONEY_TYPE')}
+                            data={this.state.typeEpargne}
+                            useNativeDriver={true}
+                            value={this.state.typeEpargneName}
+                            onChangeText={(value, index, data) => {
+                                if (value === I18n.t('SIMPLE'))
+                                    this.setState({
+                                        typeEpargneToSend: 'simple',
+                                        typeEpargneName: I18n.t('SIMPLE'),
+                                        displayDuration: false
+
+                                    });
+                                else
+                                    this.setState({
+                                        typeEpargneToSend: 'blocked',
+                                        typeEpargneName: I18n.t('BLOCKED'),
+                                        displayDuration: true
+                                    })
+                            }}
+                            valueExtractor={(value) => {
+                                return I18n.t(value.name)
+                            }}
+                            labelExtractor={(value) => {
+                                return I18n.t(value.name)
+                            }}
+                        />
+                    </Animatable.View>
+
+                    {
+                        this.state.displayDuration &&
+                        <Animatable.View ref={(comp) => {
+                            this.durationAnim = comp
+                        }}
+                                         style={{
+                                             width: responsiveWidth(90),
+                                             height: 60,
+                                             marginTop: 20,
+                                             alignSelf: 'center',
+                                             borderRadius: 10,
+                                             paddingLeft: 20,
+                                             paddingRight: 20,
+                                             backgroundColor: 'white'
+                                         }}>
+                            <Dropdown
+                                label={I18n.t('DEMAND_DURATION_IN_MONTH')}
+                                data={this.state.durations}
+                                useNativeDriver={true}
+                                value={this.state.durationSelect !== null ? this.state.durationSelect : ''}
+                                onChangeText={(value, index, data) => {
+                                    this.setState({durationSelect: value});
+                                }}
+                                valueExtractor={(value) => {
+                                    return I18n.t(value.value)
+                                }}
+                                labelExtractor={(value) => {
+                                    return I18n.t(value.value)
+                                }}
+                            />
+                        </Animatable.View>
                     }
-               }
-          });
 
-     }
+                    <Animatable.View ref={(comp) => {
+                        this.montantAnim = comp
+                    }}>
+                        <Fumi iconClass={FontAwesomeIcon} iconName={'money'}
+                              label={I18n.t('AMOUNT')}
+                              iconColor={'#f95a25'}
+                              keyboardType='numeric'
+                              iconSize={20}
+                              value={this.state.montant}
+                              onChangeText={(montant) => {
+                                  this.setState({montant})
+                              }}
+                              style={styles.input}
+                        >
+                        </Fumi>
+                        <View style={{
+                            position: 'absolute',
+                            left: responsiveWidth(82),
+                            top: 35,
+                            flexDirection: 'row'
+                        }}>
+                            <View
+                                style={{
+                                    width: 1,
+                                    borderLeftColor: '#f0f0f0',
+                                    height: 40,
+                                    left: -8,
+                                    top: -10,
+                                    borderLeftWidth: 1,
 
-     ckeckIfFieldIsOK(champ) {
-          return (isNil(champ) || isEqual(champ.length, 0));
-     }
+                                }}
+                            />
+                            <Text style={[Typography.body1, FontWeight.bold]}>{this.state.wallet.currency_code}</Text>
+                        </View>
+                    </Animatable.View>
 
-     isMontantValid = () => {
-          const { montant } = this.state;
-          if ((parseInt(isEqual(montant, 0)) || montant < 0))
-               return {
-                    errorMessage: I18n.t('ENTER_AMOUNT_SUPERIOR_ZEROR'),
-                    isValid: false
-               };
+                    <Animatable.View ref={(comp) => {
+                        this.passwordAnim = comp
+                    }}>
+                        <Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
+                              label={I18n.t('PASSWORD')}
+                              iconColor={'#f95a25'}
+                              iconSize={20}
+                              secureTextEntry={true}
+                              value={this.state.password}
+                              onChangeText={(password) => {
+                                  this.setState({password})
+                              }}
+                              style={styles.input}
+                        >
+                        </Fumi>
+                    </Animatable.View>
 
-          else if (!isNormalInteger(montant))
-               return {
-                    errorMessage: I18n.t('ENTER_VALID_AMOUNT'),
-                    isValid: false
-               };
-
-
-          else if (montant > parseInt(this.state.comptePrincipal))
-               return {
-                    errorMessage: I18n.t('AMOUNT_SUPERIOR_TO_PRINCIPAL_ACCOUNT'),
-                    isValid: false
-               };
-
-          else
-               return {
-                    errorMessage: '',
-                    isValid: true
-               };
-     }
-
-     renderGetDurationesponse = () => {
-          const { resultGetNanoCreditDuration, errorGetNanoCreditDuration } = this.props;
-          if (resultGetNanoCreditDuration !== null) {
-               if (typeof resultGetNanoCreditDuration.response !== 'undefined') {
-                    if (resultGetNanoCreditDuration.response.length > 0) {
-                         this.setState({
-                              hasLoadDuration: true,
-                              durations: resultGetNanoCreditDuration.response,
-                              durationSelect: resultGetNanoCreditDuration.response[0].value,
-                              modalVisible: false
-                         });
-                    }
-                    else if (resultGetNanoCreditDuration.response.length === 0) {
-                         this.setState({
-                              hasLoadDuration: true,
-                              durations: [],
-                              durationSelect: '',
-                              modalVisible: false
-                         });
-                    }
-               }
-          }
-
-          if (errorGetNanoCreditDuration !== null) {
-               if (typeof errorGetNanoCreditDuration.data !== 'undefined') {
-                    Alert.alert(
-                         I18n.t('ERROR_LABEL'),
-                         errorGetNanoCreditDuration.data.error,
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.getNanoCreditDemandDurationReset();
-                                   }
-                              }
-
-                         ],
-                         { cancelable: false }
-                    )
-               } else {
-                    Alert.alert(
-                         I18n.t('ERROR_LABEL'),
-                         JSON.stringify(errorGetNanoCreditDuration),
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.getNanoCreditDemandDurationReset();
-                                   }
-                              }
-
-                         ],
-                         { cancelable: false }
-                    )
-               }
-          }
-     }
-
-
-     renderEpargnerArgentResponse = () => {
-
-          const { result, error } = this.props;
-
-          if (error !== null) {
-               if (typeof error.data !== 'undefined') {
-                    Alert.alert(
-                         I18n.t("ERROR_LABLE"),
-                         error.data.error,
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.epargnerArgentUserReset();
-                                   }
-                              }
-                         ],
-                         { cancelable: false }
-                    )
-               }
-          }
-
-          if (result !== null) {
-               if (result.response !== null) {
-                    Alert.alert(
-                         I18n.t("EPARGNE_DEPOSE"),
-                         result.response,
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.epargnerArgentUserReset();
-                                        //IlinkEmitter.emit("treatNanoGroupDemand");
-                                        this.props.navigation.pop();
-                                   }
-                              }
-
-                         ],
-                         { cancelable: false }
-                    )
-               }
-          }
-     }
-
-     updateLangue() {
-          this.props.navigation.setParams({ name: I18n.t('SAVE_MONEY') })
-          this.forceUpdate()
-     }
-
-
-     onSubmitEpargnerArgent = () => {
-          const { montant, typeEpargneName, durationSelect } = this.state;
-
-          if (this.ckeckIfFieldIsOK(typeEpargneName))
-               this.typeEpargneAnim.shake(800);
-          else if (this.ckeckIfFieldIsOK(durationSelect) && this.state.displayDuration)
-               this.durationAnim.shake(800);
-          else if (this.ckeckIfFieldIsOK(montant) || !this.isMontantValid().isValid)
-               this.montantAnim.shake(800);
-          else {
-
-               this.props.epargnerArgentUserAction({
-                    id_user: this.state.user.id,
-                    type: this.state.typeEpargneToSend,
-                    duree_mois: this.state.durationSelect,
-                    montant: this.state.montant,
-                    password: this.state.password
-               });
-
-          }
-          this.setState({
-               isDataSubmit: true
-          });
-     }
-
-
-     renderLoader = () => {
-          return (
-               <ProgressDialog
-                    visible={this.props.loading || this.props.loadingGetNanoCredit}
-                    title={I18n.t('LOADING')}
-                    message={I18n.t('LOADING_INFO')}
-               />
-          )
-     }
-
-     render() {
-          return (
-               <>
-                    {(this.props.loading || this.props.loadingGetNanoCredit || this.state.modalVisible) && this.renderLoader()}
-                    {this.state.isDataSubmit && this.renderEpargnerArgentResponse()}
-                    {!this.state.hasLoadDuration && this.renderGetDurationesponse()}
-                    <ScrollView style={styles.container}>
-
-                         <Text style={styles.subbigtitle}>{I18n.t('FILL_INFORMATION')}</Text>
-
-                         <Animatable.View ref={(comp) => { this.typeEpargneAnim = comp }}
-                              style={{
-                                   width: responsiveWidth(90),
-                                   height: 60,
-                                   marginTop: 20,
-                                   alignSelf: 'center',
-                                   borderRadius: 10,
-                                   paddingLeft: 20,
-                                   paddingRight: 20,
-                                   backgroundColor: 'white'
-                              }}>
-                              <Dropdown
-                                   label={I18n.t('SAVE_MONEY_TYPE')}
-                                   data={this.state.typeEpargne}
-                                   useNativeDriver={true}
-                                   value={this.state.typeEpargneName}
-                                   onChangeText={(value, index, data) => {
-                                        if (value === I18n.t('SIMPLE'))
-                                             this.setState({
-                                                  typeEpargneToSend: 'simple',
-                                                  typeEpargneName: I18n.t('SIMPLE'),
-                                                  displayDuration: false
-
-                                             });
-                                        else
-                                             this.setState({
-                                                  typeEpargneToSend: 'blocked',
-                                                  typeEpargneName: I18n.t('BLOCKED'),
-                                                  displayDuration: true
-                                             })
-                                   }}
-                                   valueExtractor={(value) => { return I18n.t(value.name) }}
-                                   labelExtractor={(value) => { return I18n.t(value.name) }}
-                              />
-                         </Animatable.View>
-
-                         {
-                              this.state.displayDuration &&
-                              <Animatable.View ref={(comp) => { this.durationAnim = comp }}
-                                   style={{
-                                        width: responsiveWidth(90),
-                                        height: 60,
-                                        marginTop: 20,
-                                        alignSelf: 'center',
-                                        borderRadius: 10,
-                                        paddingLeft: 20,
-                                        paddingRight: 20,
-                                        backgroundColor: 'white'
-                                   }}>
-                                   <Dropdown
-                                        label={I18n.t('DEMAND_DURATION_IN_MONTH')}
-                                        data={this.state.durations}
-                                        useNativeDriver={true}
-                                        value={this.state.durationSelect !== null ? this.state.durationSelect : ''}
-                                        onChangeText={(value, index, data) => {
-                                             this.setState({ durationSelect: value });
-                                        }}
-                                        valueExtractor={(value) => { return I18n.t(value.value) }}
-                                        labelExtractor={(value) => { return I18n.t(value.value) }}
-                                   />
-                              </Animatable.View>
-                         }
-
-                         <Animatable.View ref={(comp) => { this.montantAnim = comp }}>
-                              <Fumi iconClass={FontAwesomeIcon} iconName={'money'}
-                                   label={I18n.t('AMOUNT')}
-                                   iconColor={'#f95a25'}
-                                   keyboardType='numeric'
-                                   iconSize={20}
-                                   value={this.state.montant}
-                                   onChangeText={(montant) => {
-                                        this.setState({ montant })
-                                   }}
-                                   style={styles.input}
-                              >
-                              </Fumi>
-                              <View style={{
-                                   position: 'absolute',
-                                   left: responsiveWidth(82),
-                                   top: 35,
-                                   flexDirection: 'row'
-                              }}>
-                                   <View
-                                        style={{
-                                             width: 1,
-                                             borderLeftColor: '#f0f0f0',
-                                             height: 40,
-                                             left: -8,
-                                             top: -10,
-                                             borderLeftWidth: 1,
-
-                                        }}
-                                   />
-                                   <Text style={[Typography.body1, FontWeight.bold]}>{this.state.wallet.currency_code}</Text>
-                              </View>
-                         </Animatable.View>
-
-                         <Animatable.View ref={(comp) => { this.passwordAnim = comp }}>
-                              <Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
-                                   label={I18n.t('PASSWORD')}
-                                   iconColor={'#f95a25'}
-                                   iconSize={20}
-                                   secureTextEntry={true}
-                                   value={this.state.password}
-                                   onChangeText={(password) => {
-                                        this.setState({ password })
-                                   }}
-                                   style={styles.input}
-                              >
-                              </Fumi>
-                         </Animatable.View>
-
-                         <Button style={styles.btnvalide}
-                              textStyle={styles.textbtnvalide}
-                              onPress={() => { this.onSubmitEpargnerArgent(); }}>
-                              {I18n.t('SUBMIT_LABEL')}</Button>
-                    </ScrollView>
-               </>
-          )
-     }
+                    <Button style={styles.btnvalide}
+                            textStyle={styles.textbtnvalide}
+                            onPress={() => {
+                                this.onSubmitEpargnerArgent();
+                            }}>
+                        {I18n.t('SUBMIT_LABEL')}</Button>
+                </ScrollView>
+            </>
+        )
+    }
 }
 
 const maptStateToProps = state => ({
 
-     loading: state.epargnerArgentUserReducer.loading,
-     result: state.epargnerArgentUserReducer.result,
-     error: state.epargnerArgentUserReducer.error,
+    loading: state.epargnerArgentUserReducer.loading,
+    result: state.epargnerArgentUserReducer.result,
+    error: state.epargnerArgentUserReducer.error,
 
-     loadingGetNanoCreditDuration: state.getNanoCreditDemandDurationReducer.loading,
-     resultGetNanoCreditDuration: state.getNanoCreditDemandDurationReducer.result,
-     errorGetNanoCreditDuration: state.getNanoCreditDemandDurationReducer.error,
+    loadingGetNanoCreditDuration: state.getNanoCreditDemandDurationReducer.loading,
+    resultGetNanoCreditDuration: state.getNanoCreditDemandDurationReducer.result,
+    errorGetNanoCreditDuration: state.getNanoCreditDemandDurationReducer.error,
 });
 
 const mapDispatchToProps = dispatch => bindActionCreators({
 
-     epargnerArgentUserAction,
-     epargnerArgentUserReset,
+    epargnerArgentUserAction,
+    epargnerArgentUserReset,
 
-     getNanoCreditDemandDurationAction,
-     getNanoCreditDemandDurationReset
+    getNanoCreditDemandDurationAction,
+    getNanoCreditDemandDurationReset
 
 }, dispatch);
 
 export default connect(maptStateToProps, mapDispatchToProps)(EpargnerArgentUser);
 
 const styles = StyleSheet.create({
-     container: {
-          flex: 1,
-          backgroundColor: Color.primaryDarkColor,
-     },
-     textbtnvalide: {
-          color: 'white',
-          fontWeight: 'bold'
-     },
-     bigtitle: {
-          color: 'white',
-          fontSize: 20,
-          flex: 1,
-          fontWeight: 'bold',
-          textAlign: 'center',
-          margin: 20,
-     },
-     blockView: {
-          paddingVertical: 10,
-          borderBottomWidth: 1
-     },
-     subbigtitle: {
-          color: 'white',
-          fontSize: 17,
-          textAlign: 'center',
-          margin: 5,
-     },
-     btnvalide: {
-          marginTop: 20,
-          marginLeft: 20,
-          marginRight: 20,
-          borderColor: 'transparent',
-          backgroundColor: Color.accentLightColor,
-          height: 52
-     },
-     btnSubmit: {
-          marginTop: 20,
-          borderColor: 'transparent',
-          backgroundColor: Color.accentLightColor,
-          height: 52,
-          width: "30%",
-          marginLeft: 20,
-          marginRight: 20,
-     },
-     input: {
-          height: 60,
-          marginTop: responsiveHeight(2),
-          marginLeft: responsiveWidth(5),
-          marginRight: responsiveWidth(5),
-          borderRadius: 5,
-     }
+    container: {
+        flex: 1,
+        backgroundColor: Color.primaryDarkColor,
+    },
+    textbtnvalide: {
+        color: 'white',
+        fontWeight: 'bold'
+    },
+    bigtitle: {
+        color: 'white',
+        fontSize: 20,
+        flex: 1,
+        fontWeight: 'bold',
+        textAlign: 'center',
+        margin: 20,
+    },
+    blockView: {
+        paddingVertical: 10,
+        borderBottomWidth: 1
+    },
+    subbigtitle: {
+        color: 'white',
+        fontSize: 17,
+        textAlign: 'center',
+        margin: 5,
+    },
+    btnvalide: {
+        marginTop: 20,
+        marginLeft: 20,
+        marginRight: 20,
+        borderColor: 'transparent',
+        backgroundColor: Color.accentLightColor,
+        height: 52
+    },
+    btnSubmit: {
+        marginTop: 20,
+        borderColor: 'transparent',
+        backgroundColor: Color.accentLightColor,
+        height: 52,
+        width: "30%",
+        marginLeft: 20,
+        marginRight: 20,
+    },
+    input: {
+        height: 60,
+        marginTop: responsiveHeight(2),
+        marginLeft: responsiveWidth(5),
+        marginRight: responsiveWidth(5),
+        borderRadius: 5,
+    }
 });

screens/nano-credit/ForEpargne

@@ -0,0 +1,692 @@
+import isEqual from 'lodash/isEqual';
+import isNil from 'lodash/isNil';
+import React, {Component} from 'react';
+import {
+    ActivityIndicator,
+    Alert,
+    Platform,
+    ProgressBarAndroid,
+    ScrollView,
+    StyleSheet,
+    Text,
+    TouchableOpacity,
+    View
+} from 'react-native';
+import I18n from 'react-native-i18n';
+import {responsiveHeight, responsiveWidth} from 'react-native-responsive-dimensions';
+import {ProgressDialog} from 'react-native-simple-dialogs';
+import {connect} from 'react-redux';
+import omit from 'lodash/omit';
+import {bindActionCreators} from 'redux';
+import {Color} from '../../config/Color';
+import {IlinkEmitter} from '../../utils/events';
+import {readUser} from '../../webservice/AuthApi';
+import {refundCreditDemandUserAction, refundCreditDemandUserReset} from '../../webservice/user/NanoCreditApi';
+import {
+    getNanoCreditUserHistoryInProgressAction,
+    getNanoCreditUserHistoryInProgressReset,
+} from "../../webservice/NanoCreditApi";
+import {Typography} from "../../config/typography";
+import {cutStringWithoutDot, nanoCreditHistoryLabel} from "../../utils/UtilsFunction";
+import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
+import thousands from "thousands";
+import * as Utils from "../../utils/DeviceUtils";
+import Dialog from "react-native-dialog";
+
+let theme = require('../../utils/theme.json');
+let route = require('../../route.json');
+
+
+class RefundNanoCreditUser extends Component {
+
+
+    constructor(props) {
+        super(props);
+        this.state = {
+            password: null,
+            idDemand: null,
+            codeGroup: null,
+            loading: false,
+            user: null,
+            triggerSubmitClick: false,
+            isSubmitClick: false,
+            isDataSubmit: false,
+            isModalConfirmVisible: false,
+            isGroupToModify: false,
+            displayModalHistory: false,
+            historyItemDetail: null,
+            isDataHasLoaded: false,
+            displayPasswordModal: false,
+            wallet: this.props.navigation.state.params.wallet,
+
+        };
+        this.props.getNanoCreditUserHistoryInProgressReset();
+
+    }
+
+    static navigatorStyle = {
+        navBarBackgroundColor: Color.primaryColor,
+        statusBarColor: Color.primaryDarkColor,
+        navBarTextColor: '#FFFFFF',
+        navBarButtonColor: '#FFFFFF'
+
+    };
+
+    static navigationOptions = () => {
+        return {
+            drawerLabel: () => null,
+            headerTitle: I18n.t('REFUND_NANO_CREDIT'),
+            headerTintColor: 'white',
+            headerStyle: {
+                backgroundColor: Color.primaryColor,
+                marginTop: 0,
+                color: 'white'
+            },
+            headerTitleStyle: {
+                color: "white"
+            },
+            title: I18n.t('REFUND_NANO_CREDIT')
+        }
+    };
+
+    componentDidMount() {
+
+        readUser().then((user) => {
+            if (user) {
+                if (user !== undefined) {
+                    this.setState({user});
+                    this.props.getNanoCreditUserHistoryInProgressAction(user.id);
+                }
+            }
+        });
+
+    }
+
+    ckeckIfFieldIsOK(champ) {
+        return (isNil(champ) || isEqual(champ.length, 0));
+    }
+
+    renderRefundNanoCreditResponse = () => {
+
+        const {result, error} = this.props;
+
+        if (error !== null) {
+            if (typeof error.data !== 'undefined') {
+                Alert.alert(
+                    I18n.t("ERROR_LABLE"),
+                    error.data.error,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.refundCreditDemandUserReset();
+                            }
+                        }
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
+
+        if (result !== null) {
+            if (result.response !== null) {
+                Alert.alert(
+                    I18n.t("REFUND_DONE"),
+                    result.response,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.refundCreditDemandUserReset();
+                                IlinkEmitter.emit("refreshWallet");
+                                IlinkEmitter.emit("updateNanoCreditAccount");
+                                this.props.navigation.pop();
+                            }
+                        }
+
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
+    }
+
+    updateLangue() {
+        this.props.navigation.setParams({name: I18n.t('REFUND_NANO_CREDIT')})
+        this.forceUpdate()
+    }
+
+    ckeckIfFieldIsOK(champ) {
+        return (isNil(champ) || isEqual(champ.length, 0));
+    }
+
+    onSubmitRefundNanoCredit = () => {
+        const {idDemand, password} = this.state;
+
+        if (this.ckeckIfFieldIsOK(idDemand))
+            this.idDemandAnim.shake(800);
+        else if (this.ckeckIfFieldIsOK(password))
+            this.passwordAnim.shake(800);
+        else {
+
+            this.props.refundCreditDemandUserAction({
+                id_user: this.state.user.id,
+                id_demande: this.state.idDemand,
+                password: this.state.password
+            }, 0);
+        }
+        this.setState({
+            isDataSubmit: true
+        });
+    }
+
+
+    renderLoader = () => {
+        return (
+            <ProgressDialog
+                visible={this.props.loading || this.props.loadingGetCommission}
+                title={I18n.t('LOADING')}
+                message={I18n.t('LOADING_INFO')}
+            />
+        )
+    }
+
+    renderModalHistoryDetail = () => {
+        return (
+
+            <Dialog.Container useNativeDriver={true} visible={this.state.displayModalHistory}>
+
+                <Dialog.Title>{I18n.t('DEMAND_DETAIL')}</Dialog.Title>
+                {
+                    <ScrollView>
+                        <View style={[styles.blockView, {borderBottomColor: Color.borderColor}]}>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('ID_EPARGNE')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.id_epargne}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('ETAT')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.etat}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('HISTORY_TYPE')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.type}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('DEMAND_DURATION_IN_MONTH')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.duree_mois}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('AMOUNT')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.montant + ' ' + this.state.wallet.currency_code}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('TAXES')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.taxe + ' ' + this.state.wallet.currency_code}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('INTERET')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.interet + ' ' + this.state.wallet.currency_code}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('CREATION_DATE')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.date_creation}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('FINAL_DATE')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.date_fin}</Text>
+                                </View>
+                            </View>
+                        </View>
+                    </ScrollView>
+
+                }
+                <Dialog.Button bold={true} label={I18n.t('CANCEL_LABEL')} onPress={() => {
+                    this.setState({
+                        displayModalHistory: !this.state.displayModalHistory,
+                    });
+
+                }}/>
+
+                <Dialog.Button bold={true} label={I18n.t('SUBMIT_LABEL')} onPress={() => {
+
+                    this.setState({
+                        displayPasswordModal: !this.state.displayPasswordModal,
+                    });
+
+                }}/>
+
+            </Dialog.Container>
+
+        );
+    }
+
+    renderPasswordDialog = () => {
+        return (
+            <Dialog.Container useNativeDriver={true} visible={this.state.displayPasswordModal}>
+
+                <Dialog.Title>{I18n.t('PASSWORD')}</Dialog.Title>
+
+                <Dialog.Input placeholder={I18n.t('PLEASE_ENTER_THE_PASSWORD')}
+                              style={{borderBottomWidth: 1, borderBottomColor: Color.borderColor}}
+                              showSoftInputOnFocus={true}
+                              onChangeText={(password) => {
+                                  this.setState({password})
+                              }}
+                              secureTextEntry={true}
+                              value={this.state.password}
+                              onSubmitEditing={() => {
+                                  this.props.refundCreditDemandUserAction({
+                                      id_user: this.state.user.id,
+                                      id_demande: this.state.historyItemDetail.id_epargne,
+                                      password: this.state.password
+                                  });
+                              }}/>
+
+                <Dialog.Button label={I18n.t('CANCEL_LABEL')} onPress={() => {
+                    this.setState({displayPasswordModal: !this.state.displayPasswordModal});
+                }}/>
+                <Dialog.Button label={I18n.t('SUBMIT_LABEL')} onPress={() => {
+                    this.setState({
+                        displayPasswordModal: false,
+                        displayModalHistory: false,
+                        isDataSubmit: true
+                    })
+                    this.props.refundCreditDemandUserAction({
+                        id_user: this.state.user.id,
+                        id_demande: this.state.historyItemDetail.id_epargne,
+                        password: this.state.password
+                    });
+                }}/>
+            </Dialog.Container>
+        );
+    }
+
+    renderNanoCreditItem = (item, index) => {
+
+        return (
+            <TouchableOpacity onPress={() => {
+                this.setState({displayModalHistory: true, historyItemDetail: item})
+            }} style={[styles.contentService, {borderBottomColor: Color.primaryColor}]}>
+                {
+                    Object.keys(omit(item, ['id', 'id_epargne', 'duree_mois', 'date_fin', 'interet', 'taxe'])).map((element, i) => (
+                        <View style={{alignItems: 'center'}} key={i}>
+
+                            <Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
+                                {
+                                    isEqual(element, 'montant') ?
+                                        `  ${thousands(item[element], ' ')}`
+                                        : isEqual(element, 'date_creation') ?
+                                        cutStringWithoutDot(item[element], 16)
+                                        : item[element]
+                                }
+                            </Text>
+                        </View>
+                    ))
+                }
+            </TouchableOpacity>
+        );
+    }
+
+    renderNanoCreditList = () => {
+        const {errorNanoCreditHistory, resultNanoCreditHistory} = this.props;
+        if (errorNanoCreditHistory !== null) {
+            if (typeof errorNanoCreditHistory.data !== 'undefined') {
+                return (
+                    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+                        <Text style={Typography.body1}>{errorNanoCreditHistory.data.error}</Text>
+                    </View>
+                )
+            } else {
+                return (
+                    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+                        <Text style={Typography.body1}>{errorNanoCreditHistory}</Text>
+                    </View>
+                )
+            }
+        }
+
+
+        if (resultNanoCreditHistory !== null) {
+            if (resultNanoCreditHistory.response !== null) {
+                return (
+                    Array.isArray(resultNanoCreditHistory.response) && (resultNanoCreditHistory.response.length) > 0 ?
+                        (
+                            <>
+                                <View style={[styles.contentService, {borderBottomColor: Color.primaryColor}]}>
+                                    {
+                                        nanoCreditHistoryLabel().map((item, index) => (
+                                            <View style={{alignItems: 'center'}} key={index}>
+                                                <Icon name={item.icon} size={24} color={Color.primaryColor}/>
+                                                <Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
+                                                    {I18n.t(item.label)}
+                                                </Text>
+                                            </View>
+                                        ))
+                                    }
+                                </View>
+                                {
+                                    resultNanoCreditHistory.response.map((item, index) => (
+                                        this.renderNanoCreditItem(item, index)
+                                    ))
+                                }
+                            </>
+                        ) :
+                        (
+                            <View style={{flex: 1, justifyContent: 'center', alignItems: 'flex-start'}}>
+                                <Text style={Typography.body1}>{I18n.t('NO_NANO_CREDIT')}</Text>
+                            </View>
+                        )
+                )
+            }
+        }
+    }
+
+    renderNanoCreditHistory = () => {
+        return (
+            <View style={{backgroundColor: Color.containerBackgroundColor, flex: 1}}>
+
+                {
+                    this.props.loadingNanoCreditHistory ?
+                        (
+                            <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+                                {Platform.OS === 'android'
+                                    ?
+                                    (
+                                        <>
+                                            <ProgressBarAndroid/>
+                                            <Text>{I18n.t('LOADING_DOTS')}</Text>
+
+                                        </>
+                                    ) :
+                                    <>
+                                        <ActivityIndicator size="large" color={'#ccc'}/>
+                                        <Text>{I18n.t('LOADING_DOTS')}</Text>
+                                    </>
+                                }
+                            </View>
+                        ) : this.renderNanoCreditList()
+
+                }
+            </View>
+        );
+    }
+
+    render() {
+        return (
+            <>
+                {(this.props.loading || this.props.loadingGetCommission) && this.renderLoader()}
+                {this.state.isDataSubmit && this.renderRefundNanoCreditResponse()}
+                {this.state.displayModalHistory && this.renderModalHistoryDetail()}
+                {this.state.displayPasswordModal && this.renderPasswordDialog()}
+                <ScrollView style={styles.container}>
+
+                    <View style={[styles.checkDefault, {borderBottomColor: Color.borderColor}]}>
+                        <Text
+                            style={[Typography.title3, Typography.semibold]}>
+                            {I18n.t('NANO_CREDIT_LIST')}
+                        </Text>
+                    </View>
+
+                    {
+                        this.renderNanoCreditHistory()
+                    }
+                    {/*                    <Text style={styles.subbigtitle}>{I18n.t('DEMAND_INFO')}</Text>
+
+                    <Animatable.View ref={(comp) => {
+                        this.idDemandAnim = comp
+                    }}>
+                        <Fumi iconClass={FontAwesomeIcon} iconName={'id-card'}
+                              label={I18n.t('ID_DEMAND')}
+                              iconColor={'#f95a25'}
+                              iconSize={20}
+                              value={this.state.idDemand}
+                              onChangeText={(idDemand) => {
+
+                                  this.setState({idDemand})
+                              }}
+                              style={styles.input}
+                        >
+                        </Fumi>
+                    </Animatable.View>
+
+
+                    <Animatable.View ref={(comp) => {
+                        this.passwordAnim = comp
+                    }}>
+                        <Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
+                              label={I18n.t('PASSWORD')}
+                              iconColor={'#f95a25'}
+                              iconSize={20}
+                              secureTextEntry={true}
+                              value={this.state.password}
+                              onChangeText={(password) => {
+                                  this.setState({password})
+                              }}
+                              style={styles.input}
+                        >
+                        </Fumi>
+                    </Animatable.View>
+
+                    <Button style={styles.btnvalide}
+                            textStyle={styles.textbtnvalide}
+                            onPress={() => {
+                                this.onSubmitRefundNanoCredit();
+                            }}>
+                        {this.state.isGroupToModify ? I18n.t('MODIFY') : I18n.t('SUBMIT_LABEL')}</Button>*/}
+                </ScrollView>
+            </>
+        )
+    }
+}
+
+const maptStateToProps = state => ({
+
+    loading: state.refundCreditDemandReducer.loading,
+    result: state.refundCreditDemandReducer.result,
+    error: state.refundCreditDemandReducer.error,
+
+    loadingNanoCreditHistory: state.getNanoCreditUserHistoryInProgressReducer.loading,
+    resultNanoCreditHistory: state.getNanoCreditUserHistoryInProgressReducer.result,
+    errorNanoCreditHistory: state.getNanoCreditUserHistoryInProgressReducer.error,
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({
+
+    refundCreditDemandUserAction,
+    refundCreditDemandUserReset,
+    getNanoCreditUserHistoryInProgressAction,
+    getNanoCreditUserHistoryInProgressReset
+
+}, dispatch);
+
+export default connect(maptStateToProps, mapDispatchToProps)(RefundNanoCreditUser);
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        backgroundColor: Color.containerBackgroundColor,
+        paddingHorizontal: 20
+    },
+    textbtnvalide: {
+        color: 'white',
+        fontWeight: 'bold'
+    },
+    bigtitle: {
+        color: 'white',
+        fontSize: 20,
+        flex: 1,
+        fontWeight: 'bold',
+        textAlign: 'center',
+        margin: 20,
+    },
+    blockView: {
+        paddingVertical: 10,
+        borderBottomWidth: 1
+    },
+    subbigtitle: {
+        color: 'white',
+        fontSize: 17,
+        textAlign: 'center',
+        margin: 5,
+    },
+    btnvalide: {
+        marginTop: 20,
+        marginLeft: 20,
+        marginRight: 20,
+        borderColor: 'transparent',
+        backgroundColor: Color.accentLightColor,
+        height: 52
+    },
+    btnSubmit: {
+        marginTop: 20,
+        borderColor: 'transparent',
+        backgroundColor: Color.accentLightColor,
+        height: 52,
+        width: "30%",
+        marginLeft: 20,
+        marginRight: 20,
+    },
+    input: {
+        height: 60,
+        marginTop: responsiveHeight(2),
+        marginLeft: responsiveWidth(5),
+        marginRight: responsiveWidth(5),
+        borderRadius: 5,
+    },
+    circlePoint: {
+        width: 50,
+        height: 50,
+        borderRadius: 25,
+        marginRight: 5,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    checkDefault: {
+        flexDirection: "row",
+        justifyContent: "space-between",
+        alignItems: "center",
+        borderBottomWidth: 1,
+        paddingVertical: 10,
+        marginTop: 5
+    },
+    transactionContainer: {
+        flexDirection: 'row',
+        paddingTop: 10,
+    },
+    containerTouch: {
+        flex: 1,
+        flexDirection: 'row',
+        alignItems: 'center',
+        shadowColor: Color.borderColor,
+        borderColor: Color.borderColor,
+        borderWidth: 0.5,
+        shadowOffset: {width: 1.5, height: 1.5},
+        shadowOpacity: 1.0,
+        elevation: 5,
+        borderRadius: 10,
+        backgroundColor: Color.cardBackgroundColor
+    },
+
+    contain: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+    },
+    imageBanner: {
+        marginTop: 15,
+        marginLeft: 5,
+        width: Utils.scaleWithPixel(30),
+        height: Utils.scaleWithPixel(30)
+    },
+    content: {
+        height: Utils.scaleWithPixel(65),
+        paddingHorizontal: 10,
+        justifyContent: 'space-between',
+        alignItems: 'flex-start',
+        flex: 1,
+    },
+    contentTitle: {
+        paddingTop: 12,
+    },
+    contentService: {
+        paddingVertical: 10,
+        borderBottomWidth: 0.5,
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        justifyContent: 'space-between',
+    },
+    containField: {
+        padding: 10,
+        marginBottom: 20,
+        borderWidth: 0.5,
+        shadowOffset: {width: 1.5, height: 1.5},
+        shadowOpacity: 1.0,
+        elevation: 5,
+        flexDirection: "row",
+        height: 140,
+        borderRadius: 10
+    },
+    paymentItem: {
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "space-between",
+        borderBottomWidth: 1,
+        paddingVertical: 5,
+        width: responsiveWidth(100),
+        marginBottom: 15
+    },
+    iconContent: {
+        width: 60,
+        marginRight: 10,
+        alignItems: "center"
+    },
+    contentLeftItem: {
+        flex: 1,
+        paddingTop: 40,
+        paddingLeft: 10,
+        paddingRight: 10,
+        alignItems: "center"
+    },
+});

screens/nano-credit/RefundNanoCreditUser.js

@@ -1,24 +1,38 @@
-import Button from 'apsl-react-native-button';
 import isEqual from 'lodash/isEqual';
 import isNil from 'lodash/isNil';
-import React, { Component } from 'react';
-import { Alert, ScrollView, StyleSheet, Text, View } from 'react-native';
-import * as Animatable from 'react-native-animatable';
+import React, {Component} from 'react';
+import {
+    ActivityIndicator,
+    Alert,
+    Platform,
+    ProgressBarAndroid,
+    ScrollView,
+    StyleSheet,
+    Text,
+    TouchableOpacity,
+    View
+} from 'react-native';
 import I18n from 'react-native-i18n';
-import { responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions';
-import { ProgressDialog } from 'react-native-simple-dialogs';
-import { Fumi } from 'react-native-textinput-effects';
-import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
-import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
-import { Color } from '../../config/Color';
-import { FontWeight, Typography } from '../../config/typography';
-import { store } from "../../redux/store";
-import { IlinkEmitter } from '../../utils/events';
-import { readUser } from '../../webservice/AuthApi';
-import { createGroupAction, createGroupReset } from '../../webservice/NanoCreditApi';
-import { isNormalInteger } from '../../utils/UtilsFunction';
-import { refundCreditDemandUserAction, refundCreditDemandUserReset } from '../../webservice/user/NanoCreditApi';
+import {responsiveHeight, responsiveWidth} from 'react-native-responsive-dimensions';
+import {ProgressDialog} from 'react-native-simple-dialogs';
+import {connect} from 'react-redux';
+import omit from 'lodash/omit';
+import {bindActionCreators} from 'redux';
+import {Color} from '../../config/Color';
+import {IlinkEmitter} from '../../utils/events';
+import {readUser} from '../../webservice/AuthApi';
+import {refundCreditDemandUserAction, refundCreditDemandUserReset} from '../../webservice/user/NanoCreditApi';
+import {
+    getNanoCreditUserHistoryInProgressAction,
+    getNanoCreditUserHistoryInProgressReset,
+} from "../../webservice/NanoCreditApi";
+import {Typography} from "../../config/typography";
+import {cutStringWithoutDot, displayTransactionType, nanoCreditHistoryLabel} from "../../utils/UtilsFunction";
+import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
+import thousands from "thousands";
+import * as Utils from "../../utils/DeviceUtils";
+import Dialog from "react-native-dialog";
+
 let theme = require('../../utils/theme.json');
 let route = require('../../route.json');
 
@@ -26,261 +40,703 @@ let route = require('../../route.json');
 class RefundNanoCreditUser extends Component {
 
 
-     constructor(props) {
-          super(props);
-          this.state = {
-               password: null,
-               idDemand: null,
-               codeGroup: null,
-               loading: false,
-               user: null,
-               triggerSubmitClick: false,
-               isSubmitClick: false,
-               isDataSubmit: false,
-               isModalConfirmVisible: false,
-               isGroupToModify: false,
-          };
+    constructor(props) {
+        super(props);
+        this.state = {
+            password: null,
+            idDemand: null,
+            codeGroup: null,
+            loading: false,
+            user: null,
+            triggerSubmitClick: false,
+            isSubmitClick: false,
+            isDataSubmit: false,
+            isModalConfirmVisible: false,
+            isGroupToModify: false,
+            displayModalHistory: false,
+            historyItemDetail: null,
+            isDataHasLoaded: false,
+            displayPasswordModal: false,
+            wallet: this.props.navigation.state.params.wallet,
 
-     }
+        };
+        this.props.getNanoCreditUserHistoryInProgressReset();
 
-     static navigatorStyle = {
-          navBarBackgroundColor: Color.primaryColor,
-          statusBarColor: Color.primaryDarkColor,
-          navBarTextColor: '#FFFFFF',
-          navBarButtonColor: '#FFFFFF'
+    }
 
-     };
+    static navigatorStyle = {
+        navBarBackgroundColor: Color.primaryColor,
+        statusBarColor: Color.primaryDarkColor,
+        navBarTextColor: '#FFFFFF',
+        navBarButtonColor: '#FFFFFF'
 
-     static navigationOptions = () => {
-          return {
-               drawerLabel: () => null,
-               headerTitle: I18n.t('REFUND_NANO_CREDIT'),
-               headerTintColor: 'white',
-               headerStyle: {
-                    backgroundColor: Color.primaryColor,
-                    marginTop: 0,
-                    color: 'white'
-               },
-               headerTitleStyle: {
-                    color: "white"
-               },
-               title: I18n.t('REFUND_NANO_CREDIT')
-          }
-     };
+    };
 
-     componentDidMount() {
+    static navigationOptions = () => {
+        return {
+            drawerLabel: () => null,
+            headerTitle: I18n.t('REFUND_NANO_CREDIT'),
+            headerTintColor: 'white',
+            headerStyle: {
+                backgroundColor: Color.primaryColor,
+                marginTop: 0,
+                color: 'white'
+            },
+            headerTitleStyle: {
+                color: "white"
+            },
+            title: I18n.t('REFUND_NANO_CREDIT')
+        }
+    };
 
-          readUser().then((user) => {
-               if (user) {
-                    if (user !== undefined) {
-                         this.setState({ user });
-                    }
-               }
-          });
+    componentDidMount() {
 
-     }
+        readUser().then((user) => {
+            if (user) {
+                if (user !== undefined) {
+                    this.setState({user});
+                    this.props.getNanoCreditUserHistoryInProgressAction(user.id);
+                }
+            }
+        });
 
-     ckeckIfFieldIsOK(champ) {
-          return (isNil(champ) || isEqual(champ.length, 0));
-     }
+    }
 
-     renderRefundNanoCreditResponse = () => {
+    ckeckIfFieldIsOK(champ) {
+        return (isNil(champ) || isEqual(champ.length, 0));
+    }
 
-          const { result, error } = this.props;
+    renderRefundNanoCreditResponse = () => {
 
-          if (error !== null) {
-               if (typeof error.data !== 'undefined') {
-                    Alert.alert(
-                         I18n.t("ERROR_LABLE"),
-                         error.data.error,
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.refundCreditDemandUserReset();
-                                   }
-                              }
-                         ],
-                         { cancelable: false }
-                    )
-               }
-          }
+        const {result, error} = this.props;
 
-          if (result !== null) {
-               if (result.response !== null) {
-                    Alert.alert(
-                         I18n.t("REFUND_DONE"),
-                         result.response,
-                         [
-                              {
-                                   text: I18n.t("OK"), onPress: () => {
-                                        this.props.refundCreditDemandUserReset();
-                                        IlinkEmitter.emit("refreshWallet");
-                                        this.props.navigation.pop();
-                                   }
-                              }
+        if (error !== null) {
+            if (typeof error.data !== 'undefined') {
+                Alert.alert(
+                    I18n.t("ERROR_LABLE"),
+                    error.data.error,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.refundCreditDemandUserReset();
+                            }
+                        }
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
 
-                         ],
-                         { cancelable: false }
-                    )
-               }
-          }
-     }
+        if (result !== null) {
+            if (result.response !== null) {
+                Alert.alert(
+                    I18n.t("REFUND_DONE"),
+                    result.response,
+                    [
+                        {
+                            text: I18n.t("OK"), onPress: () => {
+                                this.props.refundCreditDemandUserReset();
+                                IlinkEmitter.emit("refreshWallet");
+                                IlinkEmitter.emit("updateNanoCreditAccount");
+                                this.props.navigation.pop();
+                            }
+                        }
 
-     updateLangue() {
-          this.props.navigation.setParams({ name: I18n.t('REFUND_NANO_CREDIT') })
-          this.forceUpdate()
-     }
+                    ],
+                    {cancelable: false}
+                )
+            }
+        }
+    }
 
-     ckeckIfFieldIsOK(champ) {
-          return (isNil(champ) || isEqual(champ.length, 0));
-     }
+    updateLangue() {
+        this.props.navigation.setParams({name: I18n.t('REFUND_NANO_CREDIT')})
+        this.forceUpdate()
+    }
 
-     onSubmitRefundNanoCredit = () => {
-          const { idDemand, password } = this.state;
+    ckeckIfFieldIsOK(champ) {
+        return (isNil(champ) || isEqual(champ.length, 0));
+    }
 
-          if (this.ckeckIfFieldIsOK(idDemand))
-               this.idDemandAnim.shake(800);
-          else if (this.ckeckIfFieldIsOK(password))
-               this.passwordAnim.shake(800);
-          else {
+    onSubmitRefundNanoCredit = () => {
+        const {idDemand, password} = this.state;
 
-               this.props.refundCreditDemandUserAction({
-                    id_user: this.state.user.id,
-                    id_demande: this.state.idDemand,
-                    password: this.state.password
-               }, 0);
-          }
-          this.setState({
-               isDataSubmit: true
-          });
-     }
+        if (this.ckeckIfFieldIsOK(idDemand))
+            this.idDemandAnim.shake(800);
+        else if (this.ckeckIfFieldIsOK(password))
+            this.passwordAnim.shake(800);
+        else {
+
+            this.props.refundCreditDemandUserAction({
+                id_user: this.state.user.id,
+                id_demande: this.state.idDemand,
+                password: this.state.password
+            }, 0);
+        }
+        this.setState({
+            isDataSubmit: true
+        });
+    }
 
 
-     renderLoader = () => {
-          return (
-               <ProgressDialog
-                    visible={this.props.loading || this.props.loadingGetCommission}
-                    title={I18n.t('LOADING')}
-                    message={I18n.t('LOADING_INFO')}
-               />
-          )
-     }
+    renderLoader = () => {
+        return (
+            <ProgressDialog
+                visible={this.props.loading || this.props.loadingGetCommission}
+                title={I18n.t('LOADING')}
+                message={I18n.t('LOADING_INFO')}
+            />
+        )
+    }
 
-     render() {
-          return (
-               <>
-                    {(this.props.loading || this.props.loadingGetCommission) && this.renderLoader()}
-                    {this.state.isDataSubmit && this.renderRefundNanoCreditResponse()}
-                    <ScrollView style={styles.container}>
+    renderModalHistoryDetail = () => {
+        return (
 
-                         <Text style={styles.subbigtitle}>{I18n.t('DEMAND_INFO')}</Text>
+            <Dialog.Container useNativeDriver={true} visible={this.state.displayModalHistory}>
 
-                         <Animatable.View ref={(comp) => { this.idDemandAnim = comp }}>
-                              <Fumi iconClass={FontAwesomeIcon} iconName={'id-card'}
-                                   label={I18n.t('ID_DEMAND')}
-                                   iconColor={'#f95a25'}
-                                   iconSize={20}
-                                   value={this.state.idDemand}
-                                   onChangeText={(idDemand) => {
-
-                                        this.setState({ idDemand })
-                                   }}
-                                   style={styles.input}
-                              >
-                              </Fumi>
-                         </Animatable.View>
-
-
-                         <Animatable.View ref={(comp) => { this.passwordAnim = comp }}>
-                              <Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
-                                   label={I18n.t('PASSWORD')}
-                                   iconColor={'#f95a25'}
-                                   iconSize={20}
-                                   secureTextEntry={true}
-                                   value={this.state.password}
-                                   onChangeText={(password) => {
-                                        this.setState({ password })
-                                   }}
-                                   style={styles.input}
-                              >
-                              </Fumi>
-                         </Animatable.View>
-
-                         <Button style={styles.btnvalide}
-                              textStyle={styles.textbtnvalide}
-                              onPress={() => { this.onSubmitRefundNanoCredit(); }}>
-                              {this.state.isGroupToModify ? I18n.t('MODIFY') : I18n.t('SUBMIT_LABEL')}</Button>
+                <Dialog.Title>{I18n.t('DEMAND_DETAIL')}</Dialog.Title>
+                {
+                    <ScrollView persistentScrollbar={true}>
+                        <View style={[styles.blockView, {borderBottomColor: Color.borderColor}]}>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>Type</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{I18n.t(displayTransactionType(this.state.historyItemDetail.type_historique))}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('ID_DEMAND')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.id_demande}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('STATUS')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.etat}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('DEMAND_DURATION_IN_MONTH')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.duree_mois}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('AMOUNT')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.montant + ' ' + this.state.wallet.currency_code}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('AMOUNT_REFUND')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.montant_rembourse + ' ' + this.state.wallet.currency_code}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('AMOUNT_PARTIALLY_REFUND')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.partiellement_rembourse + ' ' + this.state.wallet.currency_code}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('TAXES')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.taxe + ' ' + this.state.wallet.currency_code}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('INTERET')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.interet + ' ' + this.state.wallet.currency_code}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('WITHDRAWAL_IN_CASH')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.retrait_cash == 1 ? I18n.t('YES') : I18n.t('NO')}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text style={[styles.body2]}>{I18n.t('CREATION_DATE')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.date_creation}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('VALIDATION_DATE')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.date_validation}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('DATE_REMBOURSEMENT_PREVU')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.date_remboursement_prevu}</Text>
+                                </View>
+                            </View>
+                            <View style={{flexDirection: 'row', marginTop: 10}}>
+                                <View style={{flex: 1}}>
+                                    <Text tyle={[Typography.body2]}>{I18n.t('DATE_REMBOURSEMENT')}</Text>
+                                </View>
+                                <View style={{flex: 1, alignItems: 'flex-end'}}>
+                                    <Text
+                                        style={[Typography.caption1, Color.grayColor]}>{this.state.historyItemDetail.date_remboursement}</Text>
+                                </View>
+                            </View>
+                        </View>
                     </ScrollView>
-               </>
-          )
-     }
+
+                }
+                <Dialog.Button bold={true} label={I18n.t('CANCEL_LABEL')} onPress={() => {
+                    this.setState({
+                        displayModalHistory: !this.state.displayModalHistory,
+                    });
+
+                }}/>
+
+                <Dialog.Button bold={true} label={I18n.t('SUBMIT_LABEL')} onPress={() => {
+
+                    this.setState({
+                        displayPasswordModal: !this.state.displayPasswordModal,
+                    });
+
+                }}/>
+
+            </Dialog.Container>
+
+        );
+    }
+
+    renderPasswordDialog = () => {
+        return (
+            <Dialog.Container useNativeDriver={true} visible={this.state.displayPasswordModal}>
+
+                <Dialog.Title>{I18n.t('PASSWORD')}</Dialog.Title>
+
+                <Dialog.Input placeholder={I18n.t('PLEASE_ENTER_THE_PASSWORD')}
+                              style={{borderBottomWidth: 1, borderBottomColor: Color.borderColor}}
+                              showSoftInputOnFocus={true}
+                              onChangeText={(password) => {
+                                  this.setState({password})
+                              }}
+                              secureTextEntry={true}
+                              value={this.state.password}
+                              onSubmitEditing={() => {
+                                  this.setState({
+                                      displayPasswordModal: false,
+                                      displayModalHistory: false,
+                                      isDataSubmit: true
+                                  });
+                                  this.props.refundCreditDemandUserAction({
+                                      id_user: this.state.user.id,
+                                      id_demande: this.state.historyItemDetail.id_demande,
+                                      password: this.state.password
+                                  });
+                              }}/>
+
+                <Dialog.Button label={I18n.t('CANCEL_LABEL')} onPress={() => {
+                    this.setState({displayPasswordModal: !this.state.displayPasswordModal});
+                }}/>
+                <Dialog.Button label={I18n.t('SUBMIT_LABEL')} onPress={() => {
+                    this.setState({
+                        displayPasswordModal: false,
+                        displayModalHistory: false,
+                        isDataSubmit: true
+                    });
+                    this.props.refundCreditDemandUserAction({
+                        id_user: this.state.user.id,
+                        id_demande: this.state.historyItemDetail.id_demande,
+                        password: this.state.password
+                    });
+                }}/>
+            </Dialog.Container>
+        );
+    }
+
+    renderNanoCreditItem = (item, index) => {
+
+        return (
+            <TouchableOpacity onPress={() => {
+                this.setState({displayModalHistory: true, historyItemDetail: item})
+            }} style={[styles.contentService, {borderBottomColor: Color.primaryColor}]}>
+                {
+                    Object.keys(omit(item, ['id', 'id_demande', 'agent', 'retrait_cash', 'date_remboursement_prevu', 'taxe', 'date_validation', 'duree_mois', 'interet', 'montant_rembourse', 'partiellement_rembourse',])).map((element, i) => (
+                        <View style={{alignItems: 'center'}} key={i}>
+
+                            <Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
+                                {
+                                    isEqual(element, 'montant') ?
+                                        `  ${thousands(item[element], ' ')}`
+                                        : isEqual(element, 'date_creation') ?
+                                        cutStringWithoutDot(item[element], 16)
+                                        : item[element]
+                                }
+                            </Text>
+                        </View>
+                    ))
+                }
+            </TouchableOpacity>
+        );
+    }
+
+    renderNanoCreditList = () => {
+        const {errorNanoCreditHistory, resultNanoCreditHistory} = this.props;
+        if (errorNanoCreditHistory !== null) {
+            if (typeof errorNanoCreditHistory.data !== 'undefined') {
+                return (
+                    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+                        <Text style={Typography.body1}>{errorNanoCreditHistory.data.error}</Text>
+                    </View>
+                )
+            } else {
+                return (
+                    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+                        <Text style={Typography.body1}>{errorNanoCreditHistory}</Text>
+                    </View>
+                )
+            }
+        }
+
+
+        if (resultNanoCreditHistory !== null) {
+            if (resultNanoCreditHistory.response !== null) {
+                return (
+                    Array.isArray(resultNanoCreditHistory.response) && (resultNanoCreditHistory.response.length) > 0 ?
+                        (
+                            <>
+                                <View style={[styles.contentService, {borderBottomColor: Color.primaryColor}]}>
+                                    {
+                                        nanoCreditHistoryLabel().map((item, index) => (
+                                            <View style={{alignItems: 'center'}} key={index}>
+                                                <Icon name={item.icon} size={24} color={Color.primaryColor}/>
+                                                <Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
+                                                    {I18n.t(item.label)}
+                                                </Text>
+                                            </View>
+                                        ))
+                                    }
+                                </View>
+                                {
+                                    resultNanoCreditHistory.response.map((item, index) => (
+                                        this.renderNanoCreditItem(item, index)
+                                    ))
+                                }
+                            </>
+                        ) :
+                        (
+                            <View style={{flex: 1, justifyContent: 'center', alignItems: 'flex-start'}}>
+                                <Text style={Typography.body1}>{I18n.t('NO_NANO_CREDIT')}</Text>
+                            </View>
+                        )
+                )
+            }
+        }
+    }
+
+    renderNanoCreditHistory = () => {
+        return (
+            <View style={{backgroundColor: Color.containerBackgroundColor, flex: 1}}>
+
+                {
+                    this.props.loadingNanoCreditHistory ?
+                        (
+                            <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+                                {Platform.OS === 'android'
+                                    ?
+                                    (
+                                        <>
+                                            <ProgressBarAndroid/>
+                                            <Text>{I18n.t('LOADING_DOTS')}</Text>
+
+                                        </>
+                                    ) :
+                                    <>
+                                        <ActivityIndicator size="large" color={'#ccc'}/>
+                                        <Text>{I18n.t('LOADING_DOTS')}</Text>
+                                    </>
+                                }
+                            </View>
+                        ) : this.renderNanoCreditList()
+
+                }
+            </View>
+        );
+    }
+
+    render() {
+        return (
+            <>
+                {(this.props.loading || this.props.loadingGetCommission) && this.renderLoader()}
+                {this.state.isDataSubmit && this.renderRefundNanoCreditResponse()}
+                {this.state.displayModalHistory && this.renderModalHistoryDetail()}
+                {this.state.displayPasswordModal && this.renderPasswordDialog()}
+                <ScrollView style={styles.container}>
+
+                    <View style={[styles.checkDefault, {borderBottomColor: Color.borderColor}]}>
+                        <Text
+                            style={[Typography.title3, Typography.semibold]}>
+                            {I18n.t('NANO_CREDIT_LIST')}
+                        </Text>
+                    </View>
+
+                    {
+                        this.renderNanoCreditHistory()
+                    }
+                    {/*                    <Text style={styles.subbigtitle}>{I18n.t('DEMAND_INFO')}</Text>
+
+                    <Animatable.View ref={(comp) => {
+                        this.idDemandAnim = comp
+                    }}>
+                        <Fumi iconClass={FontAwesomeIcon} iconName={'id-card'}
+                              label={I18n.t('ID_DEMAND')}
+                              iconColor={'#f95a25'}
+                              iconSize={20}
+                              value={this.state.idDemand}
+                              onChangeText={(idDemand) => {
+
+                                  this.setState({idDemand})
+                              }}
+                              style={styles.input}
+                        >
+                        </Fumi>
+                    </Animatable.View>
+
+
+                    <Animatable.View ref={(comp) => {
+                        this.passwordAnim = comp
+                    }}>
+                        <Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
+                              label={I18n.t('PASSWORD')}
+                              iconColor={'#f95a25'}
+                              iconSize={20}
+                              secureTextEntry={true}
+                              value={this.state.password}
+                              onChangeText={(password) => {
+                                  this.setState({password})
+                              }}
+                              style={styles.input}
+                        >
+                        </Fumi>
+                    </Animatable.View>
+
+                    <Button style={styles.btnvalide}
+                            textStyle={styles.textbtnvalide}
+                            onPress={() => {
+                                this.onSubmitRefundNanoCredit();
+                            }}>
+                        {this.state.isGroupToModify ? I18n.t('MODIFY') : I18n.t('SUBMIT_LABEL')}</Button>*/}
+                </ScrollView>
+            </>
+        )
+    }
 }
 
 const maptStateToProps = state => ({
 
-     loading: state.refundCreditDemandReducer.loading,
-     result: state.refundCreditDemandReducer.result,
-     error: state.refundCreditDemandReducer.error,
+    loading: state.refundCreditDemandReducer.loading,
+    result: state.refundCreditDemandReducer.result,
+    error: state.refundCreditDemandReducer.error,
+
+    loadingNanoCreditHistory: state.getNanoCreditUserHistoryInProgressReducer.loading,
+    resultNanoCreditHistory: state.getNanoCreditUserHistoryInProgressReducer.result,
+    errorNanoCreditHistory: state.getNanoCreditUserHistoryInProgressReducer.error,
 });
 
 const mapDispatchToProps = dispatch => bindActionCreators({
 
-     refundCreditDemandUserAction,
-     refundCreditDemandUserReset,
+    refundCreditDemandUserAction,
+    refundCreditDemandUserReset,
+    getNanoCreditUserHistoryInProgressAction,
+    getNanoCreditUserHistoryInProgressReset
 
 }, dispatch);
 
 export default connect(maptStateToProps, mapDispatchToProps)(RefundNanoCreditUser);
 
 const styles = StyleSheet.create({
-     container: {
-          flex: 1,
-          backgroundColor: Color.primaryDarkColor,
-     },
-     textbtnvalide: {
-          color: 'white',
-          fontWeight: 'bold'
-     },
-     bigtitle: {
-          color: 'white',
-          fontSize: 20,
-          flex: 1,
-          fontWeight: 'bold',
-          textAlign: 'center',
-          margin: 20,
-     },
-     blockView: {
-          paddingVertical: 10,
-          borderBottomWidth: 1
-     },
-     subbigtitle: {
-          color: 'white',
-          fontSize: 17,
-          textAlign: 'center',
-          margin: 5,
-     },
-     btnvalide: {
-          marginTop: 20,
-          marginLeft: 20,
-          marginRight: 20,
-          borderColor: 'transparent',
-          backgroundColor: Color.accentLightColor,
-          height: 52
-     },
-     btnSubmit: {
-          marginTop: 20,
-          borderColor: 'transparent',
-          backgroundColor: Color.accentLightColor,
-          height: 52,
-          width: "30%",
-          marginLeft: 20,
-          marginRight: 20,
-     },
-     input: {
-          height: 60,
-          marginTop: responsiveHeight(2),
-          marginLeft: responsiveWidth(5),
-          marginRight: responsiveWidth(5),
-          borderRadius: 5,
-     }
+    container: {
+        flex: 1,
+        backgroundColor: Color.containerBackgroundColor,
+        paddingHorizontal: 20
+    },
+    textbtnvalide: {
+        color: 'white',
+        fontWeight: 'bold'
+    },
+    bigtitle: {
+        color: 'white',
+        fontSize: 20,
+        flex: 1,
+        fontWeight: 'bold',
+        textAlign: 'center',
+        margin: 20,
+    },
+    blockView: {
+        paddingVertical: 10,
+        borderBottomWidth: 1
+    },
+    subbigtitle: {
+        color: 'white',
+        fontSize: 17,
+        textAlign: 'center',
+        margin: 5,
+    },
+    btnvalide: {
+        marginTop: 20,
+        marginLeft: 20,
+        marginRight: 20,
+        borderColor: 'transparent',
+        backgroundColor: Color.accentLightColor,
+        height: 52
+    },
+    btnSubmit: {
+        marginTop: 20,
+        borderColor: 'transparent',
+        backgroundColor: Color.accentLightColor,
+        height: 52,
+        width: "30%",
+        marginLeft: 20,
+        marginRight: 20,
+    },
+    input: {
+        height: 60,
+        marginTop: responsiveHeight(2),
+        marginLeft: responsiveWidth(5),
+        marginRight: responsiveWidth(5),
+        borderRadius: 5,
+    },
+    circlePoint: {
+        width: 50,
+        height: 50,
+        borderRadius: 25,
+        marginRight: 5,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    checkDefault: {
+        flexDirection: "row",
+        justifyContent: "space-between",
+        alignItems: "center",
+        borderBottomWidth: 1,
+        paddingVertical: 10,
+        marginTop: 5
+    },
+    transactionContainer: {
+        flexDirection: 'row',
+        paddingTop: 10,
+    },
+    containerTouch: {
+        flex: 1,
+        flexDirection: 'row',
+        alignItems: 'center',
+        shadowColor: Color.borderColor,
+        borderColor: Color.borderColor,
+        borderWidth: 0.5,
+        shadowOffset: {width: 1.5, height: 1.5},
+        shadowOpacity: 1.0,
+        elevation: 5,
+        borderRadius: 10,
+        backgroundColor: Color.cardBackgroundColor
+    },
+
+    contain: {
+        flexDirection: 'row',
+        justifyContent: 'space-between',
+    },
+    imageBanner: {
+        marginTop: 15,
+        marginLeft: 5,
+        width: Utils.scaleWithPixel(30),
+        height: Utils.scaleWithPixel(30)
+    },
+    content: {
+        height: Utils.scaleWithPixel(65),
+        paddingHorizontal: 10,
+        justifyContent: 'space-between',
+        alignItems: 'flex-start',
+        flex: 1,
+    },
+    contentTitle: {
+        paddingTop: 12,
+    },
+    contentService: {
+        paddingVertical: 10,
+        borderBottomWidth: 0.5,
+        flexDirection: 'row',
+        flexWrap: 'wrap',
+        justifyContent: 'space-between',
+    },
+    containField: {
+        padding: 10,
+        marginBottom: 20,
+        borderWidth: 0.5,
+        shadowOffset: {width: 1.5, height: 1.5},
+        shadowOpacity: 1.0,
+        elevation: 5,
+        flexDirection: "row",
+        height: 140,
+        borderRadius: 10
+    },
+    paymentItem: {
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "space-between",
+        borderBottomWidth: 1,
+        paddingVertical: 5,
+        width: responsiveWidth(100),
+        marginBottom: 15
+    },
+    iconContent: {
+        width: 60,
+        marginRight: 10,
+        alignItems: "center"
+    },
+    contentLeftItem: {
+        flex: 1,
+        paddingTop: 40,
+        paddingLeft: 10,
+        paddingRight: 10,
+        alignItems: "center"
+    },
 });

screens/wallet/OperateurOptionSelect.js

@@ -120,9 +120,9 @@ class OperateurOptionSelect extends Component {
                 }}>
                 <View style={{flexDirection: 'row', alignItems: 'center'}}>
                     <View>
-                        <Text style={Typography.body1}>{item.bank_name}</Text>
+                        <Text style={Typography.body1}>{item.operator_name}</Text>
                         <Text style={[Typography.footnote, Color.grayColor]} style={{marginTop: 5}}>
-                            {I18n.t('COUNTRY')}: {item.country}
+                            {I18n.t('COUNTRY')}: {`${item.operator_address}, ${item.country}`}
                         </Text>
                     </View>
                 </View>
@@ -177,7 +177,10 @@ class OperateurOptionSelect extends Component {
                 key={index}
                 style={[styles.paymentItem, {borderBottomColor: Color.borderColor}]}
                 onPress={() => {
-
+                    this.props.navigation.navigate(item.screen, {
+                        type: item.type,
+                        title: item.title
+                    })
                 }}>
 
                 <View style={{flexDirection: 'row', alignItems: 'center'}}>

screens/wallet/agent/EnvoieWalletToBankAgent.js

@@ -285,7 +285,7 @@ class EnvoieWalletToBankAgent extends Component {
                 id_wallet_agent: this.state.wallet.id,
                 id_wallet_network: this.state.wallet.id_network,
                 iban: codeIban,
-                id_bank: this.state.bank.id_bank,
+                id_bank: this.state.bank.id_operator,
                 montant: montant,
                 password: password
 

utils/UtilsFunction.js

@@ -223,6 +223,26 @@ export const transactionHistoryIlinkLabel = () => {
         },
     ]
 }
+export const nanoCreditHistoryLabel = () => {
+    return [
+        {
+            icon: 'arrow-expand',
+            label: 'HISTORY_TYPE'
+        },
+        {
+            icon: 'inbox-arrow-up',
+            label: 'ETAT'
+        },
+        {
+            icon: 'cash',
+            label: 'AMOUNT_LABEL'
+        },
+        {
+            icon: 'calendar-clock',
+            label: 'DATE'
+        },
+    ]
+}
 export const transactionHistoryNanoCreditLabel = () => {
     return [
         /*{

utils/i18n/en.json

@@ -155,6 +155,8 @@
   "DEPOSIT_TO_CARD": "Your Wallet to card",
   "DEPOSIT_TO_BANK": "Your Wallet to bank",
   "NANO_CREDIT": "Nano credit",
+  "NANO_CREDIT_LIST": "Nano credit list",
+  "NO_NANO_CREDIT": "No nano credit demand",
   "NANO_CREDIT_DESCRIPTION": "Nano credit description",
   "NANO_SANTE": "Nano health",
   "NANO_SANTE_DESCRIPTION": "Nano health description",
@@ -165,6 +167,7 @@
   "SAVE_MONEY": "Save money",
   "SAVE_MONEY_TYPE": "Savings type",
   "CAUTION_CREDIT": "Caution credit demand",
+  "CAUTIONNEMENT_DONE": "Caution done",
   "ID_DEMAND": "Demand ID",
   "DATE": "Date",
   "PAIEMENT_EAU_ELECTRICITY": "Water/electricity bill",

utils/i18n/fr.json

@@ -162,6 +162,8 @@
   "DEPOSIT_TO_CARD": "Votre Wallet vers carte",
   "DEPOSIT_TO_BANK": "Votre Wallet vers banque",
   "NANO_CREDIT": "Nano crédit",
+  "NANO_CREDIT_LIST": "Liste des nano crédit",
+  "NO_NANO_CREDIT": "Aucune demande de nano crédit",
   "NANO_CREDIT_DESCRIPTION": "Nano crédit iLink",
   "NANO_SANTE": "Nano santé",
   "NANO_SANTE_DESCRIPTION": "Nano santé iLink",
@@ -172,6 +174,7 @@
   "SAVE_MONEY_TYPE": "Type d'épargne",
   "REFUND_DONE": "Remboursement effectué",
   "CAUTION_CREDIT": "Cautionner une demande de crédit",
+  "CAUTIONNEMENT_DONE": "Cautionnement effectué",
   "ID_DEMAND": "Identifiant de la demande",
   "PAIEMENT_EAU_ELECTRICITY": "Paiement eau/électricité",
   "PAIEMENT_ECOLE": "Paiement école",

webservice/IlinkConstants.js

@@ -69,7 +69,9 @@ export const getNanoCreditAccount = testBaseUrl + '/walletService/groups/nanoCre
 export const getNanoCreditUserHistoryUrl = testBaseUrl + '/walletService/groups/nanoCredit/all_demands';
 export const getNanoCreditAgentHistoryUrl = testBaseUrl + '/walletService/groups/nanoCredit/guarantee_demands';
 export const getHyperviseurHistoriqueUrl = testBaseUrl + '/walletService/wallets/all_hyper_history';
-export const getBankUrl = testBaseUrl + '/walletService/wallets/users/banks';
+export const getBankUrl = testBaseUrl + '/walletService/wallets/users/operators/bank';
+export const getHistoryNanoPendingCreditUrl = testBaseUrl + '/walletService/groups/nanoCredit/demands_in_progress';
+export const getHistoryEpargnePendingUrl = testBaseUrl + '/walletService/groups/nanoCredit/savings/demands_in_progress';
 
 export const authKeyUrl = testBaseUrl + '/oauth/token';
 export const videoUrl = "https://www.youtube.com/watch?v=wwGPDPsSLWY";

webservice/NanoCreditApi.js

@@ -1,237 +1,349 @@
-
 import axios from "axios";
 import I18n from 'react-native-i18n';
-import { fetchCreateGroupError, fetchCreateGroupPending, fetchCreateGroupReset, fetchCreateGroupSuccess, fetchTreatDemandsGroupPending, fetchTreatDemandsGroupSuccess, fetchTreatDemandsGroupError, fetchTreatDemandsGroupReset, fetchJoinGroupPending, fetchJoinGroupSuccess, fetchJoinGroupError, fetchJoinGroupReset, fetchAskNanoCreditPending, fetchAskNanoCreditSuccess, fetchAskNanoCreditError, fetchAskNanoCreditReset, fetchGetNanoCreditDemandDurationPending, fetchGetNanoCreditDemandDurationSuccess, fetchGetNanoCreditDemandDurationError, fetchGetNanoCreditDemandDurationReset } from "../redux/actions/NanoCreditAction";
-import { store } from "../redux/store";
-import { groupUrl, getNanoCreditDemandDureationUrl, treatDemandUrl, joinGroupUrl, cancelDemandUrl, askNanoCreditUrl } from "./IlinkConstants";
+import {
+    fetchAskNanoCreditError,
+    fetchAskNanoCreditPending,
+    fetchAskNanoCreditReset,
+    fetchAskNanoCreditSuccess,
+    fetchCreateGroupError,
+    fetchCreateGroupPending,
+    fetchCreateGroupReset,
+    fetchCreateGroupSuccess,
+    fetchGetEpargneInProgressError,
+    fetchGetEpargneInProgressPending,
+    fetchGetEpargneInProgressReset,
+    fetchGetEpargneInProgressSuccess,
+    fetchGetNanoCreditDemandDurationError,
+    fetchGetNanoCreditDemandDurationPending,
+    fetchGetNanoCreditDemandDurationReset,
+    fetchGetNanoCreditDemandDurationSuccess,
+    fetchGetNanoCreditUserHistoryInProgressError,
+    fetchGetNanoCreditUserHistoryInProgressPending,
+    fetchGetNanoCreditUserHistoryInProgressReset,
+    fetchGetNanoCreditUserHistoryInProgressSuccess,
+    fetchJoinGroupError,
+    fetchJoinGroupPending,
+    fetchJoinGroupReset,
+    fetchJoinGroupSuccess,
+    fetchTreatDemandsGroupError,
+    fetchTreatDemandsGroupPending,
+    fetchTreatDemandsGroupReset,
+    fetchTreatDemandsGroupSuccess
+} from "../redux/actions/NanoCreditAction";
+import {store} from "../redux/store";
+import {
+    askNanoCreditUrl,
+    cancelDemandUrl,
+    getHistoryNanoPendingCreditUrl,
+    getNanoCreditDemandDureationUrl,
+    groupUrl,
+    joinGroupUrl,
+    treatDemandUrl
+} from "./IlinkConstants";
 
 /**
- * 
- * @param {*} data 
+ *
+ * @param {*} data
  * @param {*} isToMofidy  | 0-> CREATE 1->MODIFY 2->DELETE
  */
 export const createGroupAction = (data, isToMofidy) => {
 
 
-     const auth = store.getState().authKeyReducer;
-     const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+    const auth = store.getState().authKeyReducer;
+    const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
 
-     return dispatch => {
-          dispatch(fetchCreateGroupPending());
+    return dispatch => {
+        dispatch(fetchCreateGroupPending());
 
-          axios({
-               url: `${groupUrl}`,
-               method: isToMofidy === 0 ?
-                    'POST' :
-                    isToMofidy === 1 ? 'PUT' : 'DELETE',
-               data,
-               headers: {
-                    'Authorization': authKey,
-                    'X-Localization': I18n.currentLocale()
-               }
-          })
-               .then(response => {
-                    console.log(response);
-                    dispatch(fetchCreateGroupSuccess(response));
-               })
-               .catch(error => {
-                    if (error.response)
-                         dispatch(fetchCreateGroupError(error.response));
-                    else if (error.request)
-                         dispatch(fetchCreateGroupError(error.request))
-                    else
-                         dispatch(fetchCreateGroupError(error.message))
-               });
-     }
+        axios({
+            url: `${groupUrl}`,
+            method: isToMofidy === 0 ?
+                'POST' :
+                isToMofidy === 1 ? 'PUT' : 'DELETE',
+            data,
+            headers: {
+                'Authorization': authKey,
+                'X-Localization': I18n.currentLocale()
+            }
+        })
+            .then(response => {
+                console.log(response);
+                dispatch(fetchCreateGroupSuccess(response));
+            })
+            .catch(error => {
+                if (error.response)
+                    dispatch(fetchCreateGroupError(error.response));
+                else if (error.request)
+                    dispatch(fetchCreateGroupError(error.request))
+                else
+                    dispatch(fetchCreateGroupError(error.message))
+            });
+    }
 }
 
 export const createGroupReset = () => {
-     return dispatch => {
-          dispatch(fetchCreateGroupReset());
-     }
+    return dispatch => {
+        dispatch(fetchCreateGroupReset());
+    }
 }
 
 export const treatDemandGroupAction = (data) => {
 
-     const auth = store.getState().authKeyReducer;
-     const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+    const auth = store.getState().authKeyReducer;
+    const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
 
-     return dispatch => {
-          dispatch(fetchTreatDemandsGroupPending());
+    return dispatch => {
+        dispatch(fetchTreatDemandsGroupPending());
 
-          axios({
-               url: `${treatDemandUrl}`,
-               method: 'POST',
-               data,
-               headers: {
-                    'Authorization': authKey,
-                    'X-Localization': I18n.currentLocale()
-               }
-          })
-               .then(response => {
-                    console.log(response);
-                    dispatch(fetchTreatDemandsGroupSuccess(response));
-               })
-               .catch(error => {
-                    if (error.response)
-                         dispatch(fetchTreatDemandsGroupError(error.response));
-                    else if (error.request)
-                         dispatch(fetchTreatDemandsGroupError(error.request))
-                    else
-                         dispatch(fetchTreatDemandsGroupError(error.message))
-               });
-     }
+        axios({
+            url: `${treatDemandUrl}`,
+            method: 'POST',
+            data,
+            headers: {
+                'Authorization': authKey,
+                'X-Localization': I18n.currentLocale()
+            }
+        })
+            .then(response => {
+                console.log(response);
+                dispatch(fetchTreatDemandsGroupSuccess(response));
+            })
+            .catch(error => {
+                if (error.response)
+                    dispatch(fetchTreatDemandsGroupError(error.response));
+                else if (error.request)
+                    dispatch(fetchTreatDemandsGroupError(error.request))
+                else
+                    dispatch(fetchTreatDemandsGroupError(error.message))
+            });
+    }
 }
 
 export const cancelDemandGroupAction = (data) => {
 
-     const auth = store.getState().authKeyReducer;
-     const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+    const auth = store.getState().authKeyReducer;
+    const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
 
-     return dispatch => {
-          dispatch(fetchTreatDemandsGroupPending());
+    return dispatch => {
+        dispatch(fetchTreatDemandsGroupPending());
 
-          axios({
-               url: `${cancelDemandUrl}`,
-               method: 'POST',
-               data,
-               headers: {
-                    'Authorization': authKey,
-                    'X-Localization': I18n.currentLocale()
-               }
-          })
-               .then(response => {
-                    console.log(response);
-                    dispatch(fetchTreatDemandsGroupSuccess(response));
-               })
-               .catch(error => {
-                    if (error.response)
-                         dispatch(fetchTreatDemandsGroupError(error.response));
-                    else if (error.request)
-                         dispatch(fetchTreatDemandsGroupError(error.request))
-                    else
-                         dispatch(fetchTreatDemandsGroupError(error.message))
-               });
-     }
+        axios({
+            url: `${cancelDemandUrl}`,
+            method: 'POST',
+            data,
+            headers: {
+                'Authorization': authKey,
+                'X-Localization': I18n.currentLocale()
+            }
+        })
+            .then(response => {
+                console.log(response);
+                dispatch(fetchTreatDemandsGroupSuccess(response));
+            })
+            .catch(error => {
+                if (error.response)
+                    dispatch(fetchTreatDemandsGroupError(error.response));
+                else if (error.request)
+                    dispatch(fetchTreatDemandsGroupError(error.request))
+                else
+                    dispatch(fetchTreatDemandsGroupError(error.message))
+            });
+    }
 }
 
 export const treatDemandGroupReset = () => {
-     return dispatch => {
-          dispatch(fetchTreatDemandsGroupReset());
-     }
+    return dispatch => {
+        dispatch(fetchTreatDemandsGroupReset());
+    }
 }
 
 export const joinGroupAction = (data) => {
 
-     const auth = store.getState().authKeyReducer;
-     const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+    const auth = store.getState().authKeyReducer;
+    const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
 
-     return dispatch => {
-          dispatch(fetchJoinGroupPending());
+    return dispatch => {
+        dispatch(fetchJoinGroupPending());
 
-          axios({
-               url: `${joinGroupUrl}`,
-               method: 'POST',
-               data,
-               headers: {
-                    'Authorization': authKey,
-                    'X-Localization': I18n.currentLocale()
-               }
-          })
-               .then(response => {
-                    console.log(response);
-                    dispatch(fetchJoinGroupSuccess(response));
-               })
-               .catch(error => {
-                    if (error.response)
-                         dispatch(fetchJoinGroupError(error.response));
-                    else if (error.request)
-                         dispatch(fetchJoinGroupError(error.request))
-                    else
-                         dispatch(fetchJoinGroupError(error.message))
-               });
-     }
+        axios({
+            url: `${joinGroupUrl}`,
+            method: 'POST',
+            data,
+            headers: {
+                'Authorization': authKey,
+                'X-Localization': I18n.currentLocale()
+            }
+        })
+            .then(response => {
+                console.log(response);
+                dispatch(fetchJoinGroupSuccess(response));
+            })
+            .catch(error => {
+                if (error.response)
+                    dispatch(fetchJoinGroupError(error.response));
+                else if (error.request)
+                    dispatch(fetchJoinGroupError(error.request))
+                else
+                    dispatch(fetchJoinGroupError(error.message))
+            });
+    }
 }
 
 export const joinGroupReset = () => {
-     return dispatch => {
-          dispatch(fetchJoinGroupReset());
-     }
+    return dispatch => {
+        dispatch(fetchJoinGroupReset());
+    }
 }
 
 
 export const askNanoCreditAction = (data) => {
 
-     const auth = store.getState().authKeyReducer;
-     const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+    const auth = store.getState().authKeyReducer;
+    const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
 
-     return dispatch => {
-          dispatch(fetchAskNanoCreditPending());
+    return dispatch => {
+        dispatch(fetchAskNanoCreditPending());
 
-          axios({
-               url: `${askNanoCreditUrl}`,
-               method: 'POST',
-               data,
-               headers: {
-                    'Authorization': authKey,
-                    'X-Localization': I18n.currentLocale()
-               }
-          })
-               .then(response => {
-                    console.log(response);
-                    dispatch(fetchAskNanoCreditSuccess(response));
-               })
-               .catch(error => {
-                    if (error.response)
-                         dispatch(fetchAskNanoCreditError(error.response));
-                    else if (error.request)
-                         dispatch(fetchAskNanoCreditError(error.request))
-                    else
-                         dispatch(fetchAskNanoCreditError(error.message))
-               });
-     }
+        axios({
+            url: `${askNanoCreditUrl}`,
+            method: 'POST',
+            data,
+            headers: {
+                'Authorization': authKey,
+                'X-Localization': I18n.currentLocale()
+            }
+        })
+            .then(response => {
+                console.log(response);
+                dispatch(fetchAskNanoCreditSuccess(response));
+            })
+            .catch(error => {
+                if (error.response)
+                    dispatch(fetchAskNanoCreditError(error.response));
+                else if (error.request)
+                    dispatch(fetchAskNanoCreditError(error.request))
+                else
+                    dispatch(fetchAskNanoCreditError(error.message))
+            });
+    }
 }
 
 export const askNanoCreditReset = () => {
-     return dispatch => {
-          dispatch(fetchAskNanoCreditReset());
-     }
+    return dispatch => {
+        dispatch(fetchAskNanoCreditReset());
+    }
 }
 
 export const getNanoCreditDemandDurationAction = (data) => {
 
-     const auth = store.getState().authKeyReducer;
-     const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+    const auth = store.getState().authKeyReducer;
+    const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
 
-     return dispatch => {
-          dispatch(fetchGetNanoCreditDemandDurationPending());
+    return dispatch => {
+        dispatch(fetchGetNanoCreditDemandDurationPending());
 
-          axios({
-               url: `${getNanoCreditDemandDureationUrl}`,
-               method: 'POST',
-               data,
-               headers: {
-                    'Authorization': authKey,
-                    'X-Localization': I18n.currentLocale()
-               }
-          })
-               .then(response => {
-                    console.log(response);
-                    dispatch(fetchGetNanoCreditDemandDurationSuccess(response));
-               })
-               .catch(error => {
-                    if (error.response)
-                         dispatch(fetchGetNanoCreditDemandDurationError(error.response));
-                    else if (error.request)
-                         dispatch(fetchGetNanoCreditDemandDurationError(error.request))
-                    else
-                         dispatch(fetchGetNanoCreditDemandDurationError(error.message))
-               });
-     }
+        axios({
+            url: `${getNanoCreditDemandDureationUrl}`,
+            method: 'POST',
+            data,
+            headers: {
+                'Authorization': authKey,
+                'X-Localization': I18n.currentLocale()
+            }
+        })
+            .then(response => {
+                console.log(response);
+                dispatch(fetchGetNanoCreditDemandDurationSuccess(response));
+            })
+            .catch(error => {
+                if (error.response)
+                    dispatch(fetchGetNanoCreditDemandDurationError(error.response));
+                else if (error.request)
+                    dispatch(fetchGetNanoCreditDemandDurationError(error.request))
+                else
+                    dispatch(fetchGetNanoCreditDemandDurationError(error.message))
+            });
+    }
 }
 
 export const getNanoCreditDemandDurationReset = () => {
-     return dispatch => {
-          dispatch(fetchGetNanoCreditDemandDurationReset());
-     }
+    return dispatch => {
+        dispatch(fetchGetNanoCreditDemandDurationReset());
+    }
+}
+
+
+export const getEpargneInProgressAction = (data) => {
+
+    const auth = store.getState().authKeyReducer;
+    const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+
+    return dispatch => {
+        dispatch(fetchGetEpargneInProgressPending());
+
+        axios({
+            url: `${getHistoryNanoPendingCreditUrl}`,
+            method: 'POST',
+            data,
+            headers: {
+                'Authorization': authKey,
+                'X-Localization': I18n.currentLocale()
+            }
+        })
+            .then(response => {
+                console.log(response);
+                dispatch(fetchGetEpargneInProgressSuccess(response));
+            })
+            .catch(error => {
+                if (error.response)
+                    dispatch(fetchGetEpargneInProgressError(error.response));
+                else if (error.request)
+                    dispatch(fetchGetEpargneInProgressError(error.request))
+                else
+                    dispatch(fetchGetEpargneInProgressError(error.message))
+            });
+    }
+}
+
+
+export const getEpargneInProgressReset = () => {
+    return dispatch => {
+        dispatch(fetchGetEpargneInProgressReset());
+    }
+}
+export const getNanoCreditUserHistoryInProgressAction = (data) => {
+
+    const auth = store.getState().authKeyReducer;
+    const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+
+    return dispatch => {
+        dispatch(fetchGetNanoCreditUserHistoryInProgressPending());
+
+        axios({
+            url: `${getHistoryNanoPendingCreditUrl}/${data}`,
+            method: 'GET',
+            headers: {
+                'Authorization': authKey,
+                'X-Localization': I18n.currentLocale()
+            }
+        })
+            .then(response => {
+                console.log(response);
+                dispatch(fetchGetNanoCreditUserHistoryInProgressSuccess(response));
+            })
+            .catch(error => {
+                if (error.response)
+                    dispatch(fetchGetNanoCreditUserHistoryInProgressError(error.response));
+                else if (error.request)
+                    dispatch(fetchGetNanoCreditUserHistoryInProgressError(error.request))
+                else
+                    dispatch(fetchGetNanoCreditUserHistoryInProgressError(error.message))
+            });
+    }
+}
+
+export const getNanoCreditUserHistoryInProgressReset = () => {
+    return dispatch => {
+        dispatch(fetchGetNanoCreditUserHistoryInProgressReset());
+    }
 }