Merge pull request #59 from AnWhiteM/Dashboard

tasks redux

src/redux/store.js

@@ -12,6 +12,7 @@ import {
 import { boardsReducer } from "./boards/slice";
 import { authReducer } from "./auth/slice";
 import { columnReducer } from "./columns/slice";
+import { tasksReducer } from "./tasks/slice";
 import storage from "redux-persist/lib/storage";
 
 const authPersistConfig = {
@@ -27,6 +28,7 @@ export const store = configureStore({
     boards: boardsReducer,
     auth: persistedAuthReducer,
     column: columnReducer,
+    tasks: tasksReducer,
   },
   middleware: (getDefaultMiddleware) =>
     getDefaultMiddleware({

src/redux/tasks/operations.js

@@ -0,0 +1,40 @@
+import axios from "axios";
+import { createAsyncThunk } from "@reduxjs/toolkit";
+
+axios.defaults.baseURL = "https://project06back.onrender.com";
+
+export const fetchTasks = createAsyncThunk("/tasks/getAll", async ({deskId, columnId}, thunkAPI) => {
+    try {
+        const response = await axios.get(`/home/${deskId}/columns/${columnId}/tasks`);
+        return response.data;
+    } catch (e) {
+        return thunkAPI.rejectWithValue(e.message);
+    }
+});
+
+export const addTask = createAsyncThunk("/tasks/addTask", async ({deskId, columnId}, thunkAPI) => {
+    try {
+        const response = await axios.post(`/home/${deskId}/columns/${columnId}/tasks`);
+        return response.data;
+    } catch (e) {
+        return thunkAPI.rejectWithValue(e.message);
+    }
+});
+
+export const updateTask = createAsyncThunk("/tasks/updateTask", async ({deskId, columnId, taskId}, thunkAPI)=> {
+    try {
+        const response = await axios.put(`/home/${deskId}/columns/${columnId}/tasks/${taskId}`);
+        return response.data;
+    } catch (e) {
+        return thunkAPI.rejectWithValue(e.message);
+    }
+})  
+
+export const deleteTask = createAsyncThunk("/tasks/deleteTask", async ({deskId, columnId, taskId}, thunkAPI) => {
+    try {
+        const response = await axios.delete(`/home/${deskId}/columns/${columnId}/tasks/${taskId}`);
+        return response.data;
+    } catch (e) {
+        return thunkAPI.rejectWithValue(e.message);
+    }
+})

src/redux/tasks/selectors.js

@@ -0,0 +1,5 @@
+export const selectTasks = (state) => state.tasks.items;
+
+export const selectLoading = (state) => state.tasks.loading;
+
+export const selectError = (state) => state.tasks.error;

src/redux/tasks/slice.js

@@ -0,0 +1,64 @@
+import { createSlice } from "@reduxjs/toolkit";
+import { addTask, fetchTasks, updateTask, deleteTask } from "./operations";
+
+const taskSlice = createSlice({
+    name: "tasks",
+    initialState: { items: [], loading: false, error: null },
+
+    extraReducers: (builder) =>
+        builder
+        .addCase(fetchTasks.pending, (state) => {
+            state.loading = true;
+        })
+        .addCase(fetchTasks.fulfilled, (state, action) => {
+            state.loading = false;
+            state.error = null;
+            state.items = action.payload;
+        })
+        .addCase(fetchTasks.rejected, (state, action) => {
+            state.loading = false;
+            state.error = action.payload;
+        })
+        .addCase(addTask.pending, (state) => {
+            state.loading = true;
+        })
+        .addCase(addTask.fulfilled, (state, action) => {
+            state.loading = false;
+            state.error = null;
+            state.items = action.payload;
+        })
+        .addCase(addTask.rejected, (state, action) => {
+            state.loading = false;
+            state.error = action.payload;
+        })
+        .addCase(updateTask.pending, (state) => {
+            state.loading = true;
+        })
+        .addCase(updateTask.fulfilled, (state, action) => {
+            state.loading = false;
+            state.error = null;
+            state.items = state.items.map(task => 
+                task.id === action.payload.id ? action.payload : task
+            );
+        })
+        .addCase(updateTask.rejected, (state, action) => {
+            state.loading = false;
+            state.error = action.payload;
+        })
+        .addCase(deleteTask.pending, (state) => {
+            state.loading = true;
+        })
+        .addCase(updateTask.fulfilled, (state, action) => {
+            state.loading = false;
+            state.error = null;
+            state.items = state.items.filter(
+                (task) => task.id !== action.payload.id
+            );
+        })
+        .addCase(updateTask.rejected, (state, action) => {
+            state.loading = false;
+            state.error = action.payload;
+        })
+})
+
+export const tasksReducer = taskSlice.reducer;