List of to dos is initialized on database.

At the beginning, the app will fetch the to dos from the back end and
write all of them on Redux.

3 files changed, 55 insertions, 4 deletions

diff --git a/src/App.jsx b/src/App.jsx
index a77c0d2..8397a9f 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -3,7 +3,32 @@ import { Search } from "./ToDo-UI/Search";
 import { NewToDo } from "./ToDo-UI/NewToDo";
 import { ListToDos } from "./ToDo-UI/ListToDo";
 
+import { useDispatch } from "react-redux";
+import { set_todo, refresh_filtered_todos } from "./features/todo/reducer";
+
+import { get_todos_function } from "./api/axios_methods";
+
 function App() {
+    const get_todos = get_todos_function();
+
+    const dispatch = useDispatch();
+    function handler(data) {
+        data.map((todo) => {
+            dispatch(
+                set_todo({
+                    id: todo.id,
+                    text: todo.text,
+                    due_date: todo.dueDate.substring(0, 16),
+                    done: todo.done,
+                    priority: todo.priority,
+                    creation_date: todo.creationDate,
+                })
+            );
+        });
+        dispatch(refresh_filtered_todos());
+    }
+    get_todos(handler);
+
     return (
         <div>
             <Search />
diff --git a/src/api/axios_methods.js b/src/api/axios_methods.js
index 2e2329f..b9e40dc 100644
--- a/src/api/axios_methods.js
+++ b/src/api/axios_methods.js
@@ -1,13 +1,13 @@
 import api from "./axios_config";
 
 // findAll() on Back End.
-export function get_todos_function(hook) {
+export function get_todos_function() {
     // Get a list of all to dos.
     // GET "/v1/todos"
-    return async () => {
+    return async (handler) => {
         try {
-            const response = await api.get("/v1/todos");
-            hook(response.data);
+            const response = await api.get("/todos");
+            handler(response.data);
         } catch (err) {
             console.log(err);
         }
diff --git a/src/features/todo/reducer.js b/src/features/todo/reducer.js
index 960ab97..d62e599 100644
--- a/src/features/todo/reducer.js
+++ b/src/features/todo/reducer.js
@@ -31,6 +31,31 @@ export const todo_slice = createSlice({
             ];
         },
 
+        set_todo: (state, action) => {
+            let selected_todo = state.todos.findIndex(
+                (x) => x.id == action.payload.id
+            );
+            if (selected_todo == -1) {
+                state.todos = [
+                    ...state.todos,
+                    {
+                        id: action.payload.id,
+                        text: action.payload.text,
+                        due_date: action.payload.due_date,
+                        done: action.payload.done,
+                        priority: action.payload.priority,
+                        creation_date: action.payload.creation_date,
+                    },
+                ];
+                state.last_id++;
+            } else {
+                state.todos[selected_todo].text = action.payload.text;
+                state.todos[selected_todo].due_date = action.payload.due_date;
+                state.todos[selected_todo].done = action.payload.done;
+                state.todos[selected_todo].priority = action.payload.priority;
+            }
+        },
+
         change_done: (state, action) => {
             let selected_todo = state.todos.findIndex(
                 (x) => x.id == action.payload.id
@@ -173,6 +198,7 @@ export const todo_slice = createSlice({
 
 export const {
     add_todo,
+    set_todo,
     change_done,
     remove_todo,
     edit_todo,