Bug fix PLATIA-2534

.env

@@ -1,5 +1,5 @@
 SASS_PATH=node_modules:src
-REACT_APP_MAIN_DOMAIN=https://awsplatiagro02.aquarius.cpqd.com.br
+REACT_APP_MAIN_DOMAIN=https://awsplatiagro17.aquarius.cpqd.com.br
 REACT_APP_PROJECTS_API=${REACT_APP_MAIN_DOMAIN}/projects/apis
 REACT_APP_DATASET_API=${REACT_APP_MAIN_DOMAIN}/datasets/apis
 REACT_APP_JUPYTER_API=${REACT_APP_MAIN_DOMAIN}/notebook/anonymous/server

src/pages/Tasks/TasksTable/TasksTableContainer.js

@@ -4,10 +4,16 @@ import { useDispatch, useSelector } from 'react-redux';
 import { useIsLoading } from 'hooks';
 import { TASK_CATEGORIES } from 'configs';
 import { TasksEmptyPlaceholder } from 'components/EmptyPlaceholders';
-import { TASKS_TYPES, deleteTask, fetchTasks, createTask } from 'store/tasks';
+import {
+  TASKS_TYPES,
+  deleteTask,
+  createTask,
+  fetchPaginatedTasks,
+} from 'store/tasks';
 
 import TasksTable from './index';
 import { useHistory } from 'react-router';
+import TasksTablePaginationContainer from '../TasksTablePagination/TasksTablePaginationContainer';
 
 const tasksSelector = ({ tasksReducer }) => {
   const tasks = tasksReducer.tasks || [];
@@ -23,7 +29,7 @@ const TasksTableContainer = () => {
   const tasks = useSelector(tasksSelector);
 
   const isLoadingOrDeleting = useIsLoading(
-    TASKS_TYPES.FETCH_TASKS_REQUEST,
+    TASKS_TYPES.FETCH_TASKS_PAGE_REQUEST,
     TASKS_TYPES.DELETE_TASK_REQUEST
   );
 
@@ -58,20 +64,24 @@ const TasksTableContainer = () => {
   };
 
   useLayoutEffect(() => {
-    dispatch(fetchTasks());
+    dispatch(fetchPaginatedTasks(1, 10));
   }, [dispatch]);
 
   return isLoadingOrDeleting || tasks.length > 0 ? (
-    <div className='tasksContainer'>
-      <TasksTable
-        tasks={tasks}
-        isLoading={isLoadingOrDeleting}
-        handleCopyTask={handleCopyTask}
-        handleDeleteTask={handleDeleteTask}
-        handleSeeTaskCode={handleSeeTaskCode}
-        handleOpenTaskDetails={handleOpenTaskDetails}
-      />
-    </div>
+    <>
+      <div className='tasksContainer'>
+        <TasksTable
+          tasks={tasks}
+          isLoading={isLoadingOrDeleting}
+          handleCopyTask={handleCopyTask}
+          handleDeleteTask={handleDeleteTask}
+          handleSeeTaskCode={handleSeeTaskCode}
+          handleOpenTaskDetails={handleOpenTaskDetails}
+        />
+        <br />
+        <TasksTablePaginationContainer />
+      </div>
+    </>
   ) : (
     <TasksEmptyPlaceholder />
   );

src/pages/Tasks/TasksTable/index.js

@@ -232,11 +232,6 @@ const TasksTable = ({
       className='tasksTable'
       columns={columnsConfig}
       rowKey={(record) => record.uuid}
-      pagination={{
-        defaultPageSize: 10,
-        showSizeChanger: true,
-        pageSizeOptions: ['10', '20', '30', '40', '50'],
-      }}
     />
   );
 };

src/pages/Tasks/TasksTablePagination/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { Pagination } from 'antd';
 import PropTypes from 'prop-types';
 
-const ProjectsTablePagination = ({ pageSize, total, onChange }) => {
+const TasksTablePagination = ({ pageSize, total, onChange }) => {
   return (
     <Pagination
       total={total}
@@ -17,10 +17,10 @@ const ProjectsTablePagination = ({ pageSize, total, onChange }) => {
   );
 };
 
-ProjectsTablePagination.propTypes = {
+TasksTablePagination.propTypes = {
   pageSize: PropTypes.number,
   total: PropTypes.number,
   onChange: PropTypes.func,
 };
 
-export default ProjectsTablePagination;
+export default TasksTablePagination;

src/store/tasks/__tests__/Tasks.actions.test.js

@@ -190,7 +190,7 @@ describe('Tasks Action', () => {
   it('should create the fetch paginated task success action', () => {
     expect(fetchPaginatedTasksSuccess(fakeTasks, 1)).toEqual({
       type: TASKS_TYPES.FETCH_TASKS_PAGE_SUCCESS,
-      tasks: fakeTasks,
+      tasks: fakeTasks.tasks,
       pageSize: 1,
     });
   });
@@ -214,7 +214,7 @@ describe('Tasks Action', () => {
         },
         {
           type: TASKS_TYPES.FETCH_TASKS_PAGE_SUCCESS,
-          tasks: fakeTasks,
+          tasks: fakeTasks.tasks,
           pageSize: 10,
         },
         {

src/store/tasks/tasks.actions.js

@@ -111,13 +111,16 @@ export const deleteTask = (id, successCallback) => async (dispatch) => {
 /**
  * Fetch paginated tasks success action creator
  *
- * @param {Array} tasks Tasks array
+ * @param {object} data Tasks Object
+ * @param {Array} data.tasks Tasks Array
+ * @param {number} data.total Total Tasks
  * @param {number} pageSize Page size
  * @returns {object} Action
  */
-export const fetchPaginatedTasksSuccess = (tasks, pageSize) => {
+export const fetchPaginatedTasksSuccess = ({ total, tasks }, pageSize) => {
   return {
     type: TASKS_TYPES.FETCH_TASKS_PAGE_SUCCESS,
+    totalTasks: total,
     tasks,
     pageSize,
   };
@@ -144,7 +147,7 @@ export const fetchPaginatedTasksFail = () => {
 export const fetchPaginatedTasks = (page, pageSize) => async (dispatch) => {
   try {
     dispatch(addLoading(TASKS_TYPES.FETCH_TASKS_PAGE_REQUEST));
-    const response = await tasksApi.getPaginatedTasks(page, pageSize);
+    const response = await tasksApi.getPaginatedTasks({ page, pageSize });
     dispatch(fetchPaginatedTasksSuccess(response.data, pageSize));
   } catch (e) {
     dispatch(fetchPaginatedTasksFail());

src/store/tasks/tasks.reducer.js

@@ -36,7 +36,7 @@ export const tasksReducer = (state = initialState, action = {}) => {
       return {
         ...state,
         tasks: action.tasks,
-        totalTasks: action.tasks.length,
+        totalTasks: action.totalTasks,
         pageSize: action.pageSize,
       };
     }
@@ -45,6 +45,7 @@ export const tasksReducer = (state = initialState, action = {}) => {
       return {
         ...state,
         tasks: action.tasks,
+        totalTasks: action.totalTasks,
       };
     }