Fix table manipulation. (#22728)

Author: cjcenizal

x-pack/plugins/rollup/public/crud_app/sections/job_list/job_table/job_table.js

@@ -110,7 +110,16 @@ const COLUMNS = [{
 export class JobTableUi extends Component {
   static propTypes = {
     jobs: PropTypes.array,
+    pager: PropTypes.object.isRequired,
+    filter: PropTypes.string.isRequired,
+    sortField: PropTypes.string.isRequired,
+    isSortAscending: PropTypes.bool.isRequired,
     closeDetailPanel: PropTypes.func.isRequired,
+    filterChanged: PropTypes.func.isRequired,
+    pageChanged: PropTypes.func.isRequired,
+    pageSizeChanged: PropTypes.func.isRequired,
+    sortChanged: PropTypes.func.isRequired,
+    dispatch: PropTypes.func.isRequired,
   }
 
   static defaultProps = {

x-pack/plugins/rollup/public/crud_app/store/action_types.js

@@ -23,8 +23,6 @@ export const CLEAR_CREATE_JOB_ERRORS = 'CLEAR_CREATE_JOB_ERRORS';
 export const DELETE_JOBS_SUCCESS = 'DELETE_JOBS_SUCCESS';
 
 // Table state
-export const APPLY_FILTERS = 'APPLY_FILTERS';
-export const FILTERS_APPLIED = 'FILTERS_APPLIED';
 export const FILTER_CHANGED = 'FILTER_CHANGED';
 export const PAGE_CHANGED = 'PAGE_CHANGED';
 export const PAGE_SIZE_CHANGED = 'PAGE_SIZE_CHANGED';

x-pack/plugins/rollup/public/crud_app/store/actions/index.js

@@ -28,8 +28,6 @@ export {
 } from './detail_panel';
 
 export {
-  applyFilters,
-  filtersApplied,
   filterChanged,
   pageChanged,
   pageSizeChanged,

x-pack/plugins/rollup/public/crud_app/store/actions/table_state.js

@@ -5,46 +5,36 @@
  */
 
 import {
-  APPLY_FILTERS,
-  FILTERS_APPLIED,
   FILTER_CHANGED,
   PAGE_CHANGED,
   PAGE_SIZE_CHANGED,
   SORT_CHANGED,
 } from '../action_types';
 
-export const applyFilters = () => (dispatch) => {
-  dispatch({
-    type: APPLY_FILTERS,
-  });
-};
-
-export const filtersApplied = () => (dispatch) => {
-  dispatch({
-    type: FILTERS_APPLIED,
-  });
-};
-
-export const filterChanged = () => (dispatch) => {
+export const filterChanged = ({ filter }) => (dispatch) => {
   dispatch({
     type: FILTER_CHANGED,
+    payload: { filter },
   });
 };
 
-export const pageChanged = () => (dispatch) => {
+export const pageChanged = ({ pageNumber }) => (dispatch) => {
   dispatch({
     type: PAGE_CHANGED,
+    payload: { pageNumber },
   });
 };
 
-export const pageSizeChanged = () => (dispatch) => {
+export const pageSizeChanged = ({ pageSize }) => (dispatch) => {
   dispatch({
     type: PAGE_SIZE_CHANGED,
+    payload: { pageSize },
   });
 };
 
-export const sortChanged = () => (dispatch) => {
+export const sortChanged = ({ sortField, isSortAscending }) => (dispatch) => {
   dispatch({
     type: SORT_CHANGED,
+    payload: { sortField, isSortAscending },
   });
 };