From edf49527a0de594ac717892b7806980f1e4013f8 Mon Sep 17 00:00:00 2001
From: Rishi Ghan <rishi.ghan@gmail.com>
Date: Wed, 1 Dec 2021 14:37:29 -0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=BD=20Wiring=20up=20the=20flushDb=20ca?=
 =?UTF-8?q?ll?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/client/actions/settings.actions.tsx       | 25 ++++++++++++++++---
 .../SystemSettings/SystemSettingsForm.tsx     | 19 ++++++++++++--
 src/client/constants/action-types.ts          |  1 +
 src/client/reducers/settings.reducer.ts       | 10 ++++++++
 4 files changed, 50 insertions(+), 5 deletions(-)

diff --git a/src/client/actions/settings.actions.tsx b/src/client/actions/settings.actions.tsx
index 92c915f..d9429a1 100644
--- a/src/client/actions/settings.actions.tsx
+++ b/src/client/actions/settings.actions.tsx
@@ -2,8 +2,13 @@ import axios from "axios";
 import {
   SETTINGS_OBJECT_FETCHED,
   SETTINGS_OBJECT_DELETED,
+  SETTINGS_CALL_IN_PROGRESS,
+  SETTINGS_DB_FLUSH_SUCCESS,
 } from "../constants/action-types";
-import { SETTINGS_SERVICE_BASE_URI } from "../constants/endpoints";
+import {
+  IMPORT_SERVICE_BASE_URI,
+  SETTINGS_SERVICE_BASE_URI,
+} from "../constants/endpoints";
 
 export const saveSettings =
   (settingsPayload, settingsObjectId?) => async (dispatch) => {
@@ -48,5 +53,19 @@ export const deleteSettings = () => async (dispatch) => {
 };
 
 export const flushDb = () => async (dispatch) => {
-  
-}
+  dispatch({
+    type: SETTINGS_CALL_IN_PROGRESS,
+  });
+
+  const flushDbResult = await axios({
+    url: `${IMPORT_SERVICE_BASE_URI}/flushDb`,
+    method: "POST",
+  });
+
+  if (flushDbResult) {
+    dispatch({
+      type: SETTINGS_DB_FLUSH_SUCCESS,
+      data: flushDbResult.data,
+    });
+  }
+};
diff --git a/src/client/components/SystemSettings/SystemSettingsForm.tsx b/src/client/components/SystemSettings/SystemSettingsForm.tsx
index 6ecf694..f14586e 100644
--- a/src/client/components/SystemSettings/SystemSettingsForm.tsx
+++ b/src/client/components/SystemSettings/SystemSettingsForm.tsx
@@ -1,10 +1,18 @@
 import React, { ReactElement, useCallback } from "react";
 import { flushDb } from "../../actions/settings.actions";
+import { useDispatch, useSelector } from "react-redux";
 
 export const SystemSettingsForm = (settingsObject): ReactElement => {
   const { settings } = settingsObject;
 
-  // const flushDb = useC
+  const dispatch = useDispatch();
+  const isSettingsCallInProgress = useSelector(
+    (state: RootState) => state.settings.inProgress,
+  );
+  const flushDatabase = useCallback(() => {
+    dispatch(flushDb());
+  }, []);
+
   return (
     <div className="is-clearfix">
       <div className="mt-4">
@@ -34,7 +42,14 @@ export const SystemSettingsForm = (settingsObject): ReactElement => {
           </div>
         </article>
 
-        <button className="button is-danger" onClick={flushDb}>
+        <button
+          className={
+            isSettingsCallInProgress
+              ? "button is-danger is-loading"
+              : "button is-danger"
+          }
+          onClick={flushDatabase}
+        >
           <span className="icon">
             <i className="fas fa-eraser"></i>
           </span>
diff --git a/src/client/constants/action-types.ts b/src/client/constants/action-types.ts
index 2b91d01..a848613 100644
--- a/src/client/constants/action-types.ts
+++ b/src/client/constants/action-types.ts
@@ -68,3 +68,4 @@ export const SETTINGS_CALL_IN_PROGRESS = "SETTINGS_CALL_IN_PROGRESS";
 export const SETTINGS_OBJECT_FETCHED = "SETTINGS_OBJECT_FETCHED";
 export const SETTINGS_CALL_FAILED = "SETTINGS_CALL_FAILED";
 export const SETTINGS_OBJECT_DELETED = "SETTINGS_OBJECT_DELETED";
+export const SETTINGS_DB_FLUSH_SUCCESS = "SETTINGS_DB_FLUSH_SUCCESS";
diff --git a/src/client/reducers/settings.reducer.ts b/src/client/reducers/settings.reducer.ts
index c9b0e1b..3455b43 100644
--- a/src/client/reducers/settings.reducer.ts
+++ b/src/client/reducers/settings.reducer.ts
@@ -3,10 +3,12 @@ import {
   SETTINGS_OBJECT_FETCHED,
   SETTINGS_OBJECT_DELETED,
   SETTINGS_CALL_IN_PROGRESS,
+  SETTINGS_DB_FLUSH_SUCCESS,
 } from "../constants/action-types";
 const initialState = {
   data: {},
   inProgress: false,
+  DbFlushed: false,
 };
 
 function settingsReducer(state = initialState, action) {
@@ -31,6 +33,14 @@ function settingsReducer(state = initialState, action) {
         inProgress: false,
       };
 
+    case SETTINGS_DB_FLUSH_SUCCESS:
+      console.log(state);
+      return {
+        ...state,
+        DbFlushed: action.data,
+        inProgress: false,
+      };
+
     default:
       return { ...state };
   }