New to do now communicates to API.

WE'RE DOING IT!!!!

2 files changed, 27 insertions, 1 deletions

diff --git a/src/ToDo-UI/NewToDo.jsx b/src/ToDo-UI/NewToDo.jsx
index e81cb4e..8c926b2 100644
--- a/src/ToDo-UI/NewToDo.jsx
+++ b/src/ToDo-UI/NewToDo.jsx
@@ -7,6 +7,8 @@ import {
     select_last_index,
 } from "../features/todo/reducer";
 
+import { new_todo_function } from "../api/axios_methods";
+
 function new_button(trigger_id) {
     return (
         <div className="container mt-3 mb-3">
@@ -44,6 +46,8 @@ export function NewToDo() {
     const [new_due_date, set_new_due_date] = useState("");
     const [new_priority, set_new_priority] = useState("Low");
 
+    const new_todo_api = new_todo_function();
+
     function handle_exit_modal() {
         // https://stackoverflow.com/questions/27826381/clearing-form-input-fields-in-bootstrap
         $("form").get(0).reset(); // Reset form
@@ -53,6 +57,11 @@ export function NewToDo() {
         set_new_priority("Low");
     }
     function handle_add_todo() {
+        new_todo_api({
+            text: new_text,
+            due_date: new_due_date,
+            priority: new_priority,
+        });
         dispatch(
             add_todo({
                 text: new_text,
diff --git a/src/api/axios_methods.js b/src/api/axios_methods.js
index b9e40dc..c68cc21 100644
--- a/src/api/axios_methods.js
+++ b/src/api/axios_methods.js
@@ -3,7 +3,7 @@ import api from "./axios_config";
 // findAll() on Back End.
 export function get_todos_function() {
     // Get a list of all to dos.
-    // GET "/v1/todos"
+    // GET "/todos"
     return async (handler) => {
         try {
             const response = await api.get("/todos");
@@ -13,3 +13,20 @@ export function get_todos_function() {
         }
     };
 }
+
+// addToDo() on Back End.
+export function new_todo_function() {
+    // Add a new to do on database.
+    // POST "/todos"
+    return async (data) => {
+        try {
+            await api.post("/todos", {
+                text: data.text,
+                dueDate: data.due_date,
+                priority: data.priority,
+            });
+        } catch (err) {
+            console.log(err);
+        }
+    };
+}