Enabled Financial Settings

src/App/Pages/Financial/Settings.js

@@ -2,7 +2,7 @@ import Button from "@material-ui/core/Button";
 import Container from "@material-ui/core/Container";
 import Typography from "@material-ui/core/Typography";
 import PropTypes from "prop-types";
-import React, {useState} from "react";
+import React, {useEffect, useState} from "react";
 import {ValidatorForm} from "react-material-ui-form-validator";
 
 import NumberField from "../../Components/Fields/NumberField";
@@ -15,23 +15,42 @@ const Settings = ({ association: propAssociation }) => {
     const alerthandler = useAlertHandler();
     const API = useAPI();
 
-    const [association, setAssociation] = useState({...propAssociation});
+    const [financialSettings, setFinancialSettings] = useState({});
+
+    const getFinancialSettings = () => {
+        API.callv4({
+            url: propAssociation.url,
+            queryParams: {fields: "debt_collection_threshold"},
+            method: "GET",
+            on_succes: (response) => {
+                setFinancialSettings(response);
+            },
+            on_failure: () => {
+                alerthandler.handleAlertHandler("error", "Something went wrong");
+            }
+        });
+    };
+
+    useEffect(getFinancialSettings, [propAssociation]); // eslint-disable-line react-hooks/exhaustive-deps
 
     const handleSubmit = () => {
-        alerthandler.handleAlertHandler("info", "Not implemented");
         API.callv4({
             url: propAssociation.url,
+            queryParams: {fields: "debt_collection_threshold"},
             method: "PATCH",
-            object: {debt_collection_threshold: association.debt_collection_threshold},
-            on_succes: (response) => setAssociation({...association}),
+            object: financialSettings,
+            on_succes: (response) => {
+                alerthandler.handleAlertHandler("success", "Association succesfully updated");
+                setFinancialSettings({...response});
+            },
             on_failure: () => {
                 alerthandler.handleAlertHandler("error", "Something went wrong");
             }
         });
     };
 
-    const handleAssociationChange = (field, value) => {
-        setAssociation(prevState => ({
+    const handleChange = (field, value) => {
+        setFinancialSettings(prevState => ({
             ...prevState,
             [field]: value
         }));
@@ -49,8 +68,8 @@ const Settings = ({ association: propAssociation }) => {
                     <Wrapper>
                         <NumberField
                             name={"Debt Collection Threshold"}
-                            value={association.debt_collection_threshold}
-                            onChange={(event) => handleAssociationChange("debt_collection_threshold", event.target.value)}
+                            value={financialSettings.debt_collection_threshold}
+                            onChange={(event) => handleChange("debt_collection_threshold", event.target.value)}
                             InputProps={{
                                 inputProps: {
                                     step: 0.1, min: 0