sdnr/wt/odlux/framework/src/components/material-table/utilities.ts

   1 /**
   2  * ============LICENSE_START========================================================================
   3  * ONAP : ccsdk feature sdnr wt odlux
   4  * =================================================================================================
   5  * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved.
   6  * =================================================================================================
   7  * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
   8  * in compliance with the License. You may obtain a copy of the License at
   9  *
  10  * http://www.apache.org/licenses/LICENSE-2.0
  11  *
  12  * Unless required by applicable law or agreed to in writing, software distributed under the License
  13  * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
  14  * or implied. See the License for the specific language governing permissions and limitations under
  15  * the License.
  16  * ============LICENSE_END==========================================================================
  17  */
  18 import { Action, IActionHandler } from '../../flux/action';
  19 import { Dispatch } from '../../flux/store';
  20
  21 import { AddErrorInfoAction } from '../../actions/errorActions';
  22 import { IApplicationStoreState } from '../../store/applicationStore';
  23
  24 import { DataCallback } from ".";
  25 export interface IExternalTableState<TData> {
  26   order: 'asc' | 'desc';
  27   orderBy: string | null;
  28   selected: any[] | null;
  29   rows: TData[];
  30   rowCount: number;
  31   page: number;
  32   rowsPerPage: number;
  33   loading: boolean;
  34   showFilter: boolean;
  35   filter: { [property: string]: string };
  36   preFilter: { [property: string]: string };
  37 }
  38
  39 /** Create an actionHandler and actions for external table states. */
  40 export function createExternal<TData>(callback: DataCallback<TData>, selectState: (appState: IApplicationStoreState) => IExternalTableState<TData>) {
  41
  42   //#region Actions
  43   abstract class TableAction extends Action { }
  44
  45
  46   class RequestSortAction extends TableAction {
  47     constructor(public orderBy: string) {
  48       super();
  49     }
  50   }
  51
  52   class SetSelectedAction extends TableAction {
  53     constructor(public selected: TData[] | null) {
  54       super();
  55     }
  56   }
  57
  58   class SetPageAction extends TableAction {
  59     constructor(public page: number) {
  60       super();
  61     }
  62   }
  63
  64   class SetRowsPerPageAction extends TableAction {
  65     constructor(public rowsPerPage: number) {
  66       super();
  67     }
  68   }
  69
  70   class SetPreFilterChangedAction extends TableAction {
  71     constructor(public preFilter: {[key: string]: string}) {
  72       super();
  73     }
  74   }
  75
  76   class SetFilterChangedAction extends TableAction {
  77     constructor (public filter: { [key: string]: string }) {
  78       super();
  79     }
  80   }
  81
  82   class SetShowFilterAction extends TableAction {
  83     constructor(public show: boolean) {
  84       super();
  85     }
  86   }
  87
  88   class RefreshAction extends TableAction {
  89     constructor() {
  90       super();
  91     }
  92   }
  93
  94   class SetResultAction extends TableAction {
  95     constructor(public result: { page: number, rowCount: number, rows: TData[] }) {
  96       super();
  97     }
  98   }
  99
 100   // #endregion
 101
 102   //#region Action Handler
 103   const externalTableStateInit: IExternalTableState<TData> = {
 104     order: 'asc',
 105     orderBy: null,
 106     selected: null,
 107     rows: [],
 108     rowCount: 0,
 109     page: 0,
 110     rowsPerPage: 10,
 111     loading: false,
 112     showFilter: false,
 113     filter: {},
 114     preFilter: {}
 115   };
 116
 117   const externalTableStateActionHandler: IActionHandler<IExternalTableState<TData>> = (state = externalTableStateInit, action) => {
 118     if (!(action instanceof TableAction)) return state;
 119     if (action instanceof RefreshAction) {
 120       state = {
 121         ...state,
 122         loading: true
 123       }
 124     } else if (action instanceof SetResultAction) {
 125       state = {
 126         ...state,
 127         loading: false,
 128         rows: action.result.rows,
 129         rowCount: action.result.rowCount,
 130         page: action.result.page,
 131       }
 132     } else if (action instanceof RequestSortAction) {
 133       state = {
 134         ...state,
 135         loading: true,
 136         orderBy : state.orderBy === action.orderBy && state.order === 'desc' ? null : action.orderBy ,
 137         order: state.orderBy === action.orderBy && state.order === 'asc' ? 'desc' : 'asc',
 138       }
 139     } else if (action instanceof SetShowFilterAction) {
 140       state = {
 141         ...state,
 142         loading: true,
 143         showFilter: action.show
 144       }
 145     } else if (action instanceof SetPreFilterChangedAction) {
 146       state = {
 147         ...state,
 148         loading: true,
 149         preFilter: action.preFilter
 150       }
 151     } else if (action instanceof SetFilterChangedAction) {
 152       state = {
 153         ...state,
 154         loading: true,
 155         filter: action.filter
 156       }
 157     } else if (action instanceof SetPageAction) {
 158       state = {
 159         ...state,
 160         loading: true,
 161         page: action.page
 162       }
 163     } else if (action instanceof SetRowsPerPageAction) {
 164       state = {
 165         ...state,
 166         loading: true,
 167         rowsPerPage: action.rowsPerPage
 168       }
 169     }
 170     return state;
 171   }
 172
 173   //const createTableAction(tableAction)
 174
 175   //#endregion
 176   const reloadAction = (dispatch: Dispatch, getAppState: () => IApplicationStoreState) => {
 177     dispatch(new RefreshAction());
 178     const ownState = selectState(getAppState());
 179     const filter = { ...ownState.preFilter, ...(ownState.showFilter && ownState.filter || {})};
 180     Promise.resolve(callback(ownState.page, ownState.rowsPerPage, ownState.orderBy, ownState.order, filter )).then(result => {
 181       dispatch(new SetResultAction(result));
 182     }).catch(error => new AddErrorInfoAction(error));
 183   };
 184
 185   const createPreActions = (dispatch: Dispatch, skipRefresh: boolean = false) => {
 186     return {
 187       onPreFilterChanged: (preFilter: { [key: string]: string }) => {
 188         dispatch(new SetPreFilterChangedAction(preFilter));
 189           (!skipRefresh) && dispatch(reloadAction);
 190         }
 191     };
 192   }
 193
 194   const createActions = (dispatch: Dispatch, skipRefresh: boolean = false) => {
 195     return {
 196       onRefresh: () => {
 197         dispatch(reloadAction);
 198       },
 199       onHandleRequestSort: (orderBy: string) => {
 200         dispatch((dispatch: Dispatch) => {
 201           dispatch(new RequestSortAction(orderBy));
 202           (!skipRefresh) && dispatch(reloadAction);
 203         });
 204       },
 205       onToggleFilter: () => {
 206         dispatch((dispatch: Dispatch, getAppState: () => IApplicationStoreState) => {
 207           const { showFilter } = selectState(getAppState());
 208           dispatch(new SetShowFilterAction(!showFilter));
 209           (!skipRefresh) && dispatch(reloadAction);
 210         });
 211       },
 212       onFilterChanged: (property: string, filterTerm: string) => {
 213         dispatch((dispatch: Dispatch, getAppState: () => IApplicationStoreState) => {
 214           let { filter } = selectState(getAppState());
 215           filter = { ...filter, [property]: filterTerm };
 216           dispatch(new SetFilterChangedAction(filter));
 217           (!skipRefresh) && dispatch(reloadAction);
 218         });
 219       },
 220       onHandleChangePage: (page: number) => {
 221         dispatch((dispatch: Dispatch) => {
 222           dispatch(new SetPageAction(page));
 223           (!skipRefresh) && dispatch(reloadAction);
 224         });
 225       },
 226       onHandleChangeRowsPerPage: (rowsPerPage: number | null) => {
 227         dispatch((dispatch: Dispatch) => {
 228           dispatch(new SetRowsPerPageAction(rowsPerPage || 10));
 229           (!skipRefresh) && dispatch(reloadAction);
 230         });
 231       }
 232       // selected:
 233     };
 234   };
 235
 236   const createProperties = (state: IApplicationStoreState) => {
 237     return {
 238       ...selectState(state)
 239      }
 240   }
 241
 242   return {
 243     reloadAction: reloadAction,
 244     createActions: createActions,
 245     createProperties: createProperties,
 246     createPreActions: createPreActions,
 247     actionHandler: externalTableStateActionHandler
 248   }
 249 }