redux-paginator-immutable 17.0.16 → 17.0.21

package/src/createPaginator.ts

@@ -0,0 +1,107 @@
+/* eslint-disable max-lines-per-function,  */
+
+import { rowsPerLoad as defaultRowsPerLoad } from "x25/utility/others";
+import * as Immutable from "immutable";
+import { pages as pagesReducer, items as itemsReducer, dataItems as dataItemsReducer } from "./reducers";
+import actions from "./actions";
+
+import type { PaginatorSettings } from "./types";
+
+type EndpointData = {
+  path: string;
+  cb: () => string;
+};
+
+type Endpoint = EndpointData | string;
+type CreatePaginator = (endpoint: Endpoint, info: PaginatorSettings) => any;
+type OnlyForEndpoint = (endpoint: string, reducer: any) => (state: any, action: {
+  meta: {
+    endpoint: string;
+  };
+}) => any;
+
+
+const getEndpoint = (data: Endpoint) => {
+  if (typeof data === "object") {
+    return {
+      path : data.path,
+      cb   : data.cb,
+    };
+  }
+
+  return {
+    path : data,
+    cb   : null,
+  };
+};
+
+export const
+  onlyForEndpoint: OnlyForEndpoint = (endpoint, reducer) => (state = Immutable.Map(), action) => {
+    if (typeof action.meta === "undefined" || action.meta.endpoint !== endpoint) {
+      return state;
+    }
+
+    return reducer(state, action);
+  },
+  createPaginator: CreatePaginator = (endpointData: Endpoint, settings: PaginatorSettings) => {
+    const
+      {
+        path: endpoint,
+        cb: endpointCb,
+      } = getEndpoint(endpointData),
+      {
+        key,
+        normalizeDataItem,
+        dataItemURL,
+        manageEntity,
+        resultsKey,
+        totalKey = "Total",
+        pageArgName = "page",
+        idKey = "ID",
+        rowsPerLoad = defaultRowsPerLoad,
+        manipulateItems = (items) => items,
+      } = settings,
+      endpointedActions = {
+        requestPage: (page: number, token: string) => actions.requestPage({
+          endpoint,
+          endpointCb,
+          manageEntity,
+          resultsKey,
+          totalKey,
+          pageArgName,
+          idKey,
+          page,
+          token,
+        }),
+
+        resetView (token : any) {
+          return actions.resetView(endpoint, token);
+        },
+
+        changeView ({ view, token }: { view: number; token: string; }) {
+          return actions.changeView(endpoint, {
+            view,
+            token,
+          });
+        },
+
+        clearData () {
+          return actions.clearData(endpoint);
+        },
+      };
+
+    return {
+      key,
+      normalizeDataItem,
+      dataItemURL,
+      manipulateItems,
+      rowsPerLoad,
+      manageEntity,
+      resultsKey,
+      endpoint,
+      pagesReducer     : onlyForEndpoint(endpoint, pagesReducer),
+      itemsReducer     : onlyForEndpoint(endpoint, itemsReducer),
+      dataItemsReducer : onlyForEndpoint(endpoint, dataItemsReducer),
+      ...endpointedActions,
+    };
+  };

package/src/{index.js → index.ts}

@@ -1,17 +1,11 @@
-// @flow
-
 import { createPaginator } from "./createPaginator";
 import paginatorMiddleware from "./paginatorMiddleware";
-
 import paginatorSelectors from "./selectors";
-
 import { manageDataEntity, manipulateDataItems, manipulateItems, manageEntity } from "./util";
-
 import Info from "./Info";
 import LoadingButton from "./LoadingButton";
 import LoadPaginator from "./LoadPaginator";
 import LoadDataItem from "./LoadDataItem";
-
 import createDataReducer from "./createDataReducer";
 import createItemReducer from "./createItemReducer";
 
@@ -20,19 +14,12 @@ export {
   LoadingButton,
   LoadPaginator,
   LoadDataItem,
-
   createPaginator,
-
   paginatorMiddleware,
-
   paginatorSelectors,
-
-  // util
   createDataReducer,
-
   manageDataEntity,
   manipulateDataItems,
-
   createItemReducer,
   manipulateItems,
   manageEntity,

package/src/paginatorMiddleware.ts

@@ -0,0 +1,93 @@
+/* eslint-disable no-console, max-lines-per-function */
+import type { Dispatch, Action } from "./types";
+import { REQUEST_PAGE } from "./actionTypes";
+import actions from "./actions";
+import { fetchPage } from "./agent";
+
+const
+  { receivePage } = actions,
+
+  paginatorMiddleware = ({ dispatch }: { dispatch: Dispatch;}) => (next: any) => (action: Action) => {
+    if (action.type === REQUEST_PAGE) {
+      const {
+        meta: {
+          endpoint,
+          endpointCb,
+          manageEntity,
+          resultsKey,
+          totalKey,
+          pageArgName,
+          idKey,
+        },
+        payload: {
+          page,
+          token,
+        },
+      } = action;
+
+      dispatch((dispatch2) => {
+        const
+          markAsError = () => {
+            dispatch2(receivePage({
+              endpoint,
+              endpointCb,
+              manageEntity,
+              pageArgName,
+              idKey,
+              page,
+              error : true,
+              token,
+              items : [],
+              total : 0,
+            }));
+          },
+
+          rawPath = typeof endpointCb === "function" ? endpointCb(token) : endpoint,
+          path = rawPath === null ? "" : rawPath;
+
+        try {
+          fetchPage({
+            endpoint: path,
+            pageArgName,
+            page,
+            token,
+          }).then((res: { response: any; }) => {
+            const { response } = res;
+
+            let
+              results = [],
+              total = 0;
+
+            if (typeof resultsKey === "undefined") {
+              results = response;
+            } else {
+              results = response[resultsKey];
+              total = response[totalKey];
+            }
+
+            dispatch2(receivePage({
+              endpoint,
+              endpointCb,
+              manageEntity,
+              pageArgName,
+              idKey,
+              page,
+              error : false,
+              token,
+              items : results,
+              total,
+            }));
+          }).
+            catch(() => {
+              markAsError();
+            });
+        } catch (err) {
+          markAsError();
+        }
+      });
+    }
+
+    return next(action);
+  };
+
+export default paginatorMiddleware;

package/src/reducerItemData.ts

@@ -0,0 +1,74 @@
+type FetchItemDataFulFilledProps = {
+  payload: {
+    Data: any;
+  };
+  meta: {
+    id: string;
+  };
+};
+import * as Immutable from "immutable";
+
+const
+  defaultOptions = Immutable.Map({
+    fetching : true,
+    fetched  : false,
+    error    : false,
+  }),
+
+  fetchItemDataPending = (state: any, {
+    meta: {
+      id,
+    },
+  }: {
+  meta: {
+    id: string;
+  };
+}) => (
+    state.update(id, (current : any) => {
+      if (typeof current === "undefined") {
+        return defaultOptions;
+      }
+
+      return current.mergeDeep(defaultOptions);
+    })
+  ),
+  fetchItemDataRejected = (state: any, {
+    meta: {
+      id,
+    },
+  }: {
+  meta: {
+    id: string;
+  };
+}) => state.update(id, (current : any) => {
+    if (typeof current === "undefined") {
+      return current;
+    }
+
+    return current.mergeDeep(Immutable.Map({
+      fetching : false,
+      fetched  : false,
+      error    : true,
+    }));
+  }),
+  fetchItemDataFulFilled = (state: any, {
+    payload: {
+      Data,
+    },
+    meta: {
+      id,
+    },
+  }: FetchItemDataFulFilledProps) => state.update(id, (current : any) => {
+    if (typeof current === "undefined") {
+      return current;
+    }
+
+    return current.mergeDeep(Immutable.Map({
+      Data,
+      fetching : false,
+      fetched  : true,
+      error    : false,
+    }));
+  });
+
+export { fetchItemDataPending, fetchItemDataRejected, fetchItemDataFulFilled };

package/src/reducerOperations.ts

@@ -0,0 +1,101 @@
+import * as Immutable from "immutable";
+import type {
+  ItemsState,
+  PagesState,
+  Action,
+  ReceivePageAction,
+  ChangeViewAction,
+  RequestPageAction,
+} from "./types";
+
+const requestPage = (state: PagesState, action: RequestPageAction) => {
+    const {
+        payload: {
+          token,
+          page,
+        },
+      } = action,
+      elements = Immutable.Map({
+        page,
+        error    : false,
+        fetching : true,
+        fetched  : false,
+      });
+
+    if (state.has(token)) {
+      return state.update(token, (current : any) => current.merge(elements));
+    }
+
+    const init = elements.merge({
+      view : 1,
+      token,
+      ids  : Immutable.List(),
+    });
+
+    return state.set(token, init);
+  },
+  receivePage = (state: PagesState, action: ReceivePageAction) => {
+    const {
+      meta: {
+        idKey,
+      },
+      payload: {
+        token,
+        items,
+        total,
+        error,
+      },
+    } = action;
+
+    if (state.has(token)) {
+      const hasError = error === true;
+
+      return state.update(token, (
+        (current : any) => current.update((page : any) => current.merge(Immutable.Map({
+          ids      : page.get("ids").concat(Immutable.List(items.map((item) => String(item[idKey])))),
+          fetching : false,
+          error    : hasError,
+          fetched  : true,
+          total    : hasError ? page.get("total") : total,
+        })))
+      ));
+    }
+
+    return state;
+  },
+  performChangeView = (state: PagesState, action: any, view: number) => {
+    const {
+        payload: {
+          token,
+        },
+      } = action,
+      item = state.get(token);
+
+    if (typeof item === "undefined") {
+      return state;
+    }
+
+    return state.update(token, (current : any) => current.set("view", view));
+  },
+  changeView = (state: PagesState, action: ChangeViewAction) => (
+    performChangeView(state, action, action.payload.view)
+  ),
+  resetView = (state: PagesState, action: Action) => performChangeView(state, action, 1),
+  receivePageItems = (state: ItemsState, action: ReceivePageAction) => {
+    const
+      { payload, meta } = action,
+      { items: payloadItems } = payload,
+      { idKey, manageEntity } = meta,
+      manage = typeof manageEntity === "function" ? manageEntity : (
+        (item : any) => Immutable.Map(item)
+      ),
+      newItems = payloadItems.reduce(
+        (previous, item) => (
+          previous.set(String(item[idKey]), manage(item, state, idKey))
+        ), Immutable.Map(),
+      );
+
+    return state.merge(newItems);
+  };
+
+export { requestPage, receivePage, performChangeView, changeView, resetView, receivePageItems };

package/src/{reducers.js → reducers.ts}

@@ -1,12 +1,4 @@
-// @flow
-
-import type {
-  ItemsState,
-  PagesState,
-
-  Action,
-} from "./types";
-
+import * as Immutable from "immutable";
 import {
   REQUEST_PAGE,
   RECEIVE_PAGE,
@@ -14,18 +6,15 @@ import {
   CHANGE_VIEW,
   CLEAR_DATA,
   FETCH_CURRENT_COMPANY_INFO_PENDING,
-
   FETCH_ITEM_DATA_PENDING,
   FETCH_ITEM_DATA_REJECTED,
   FETCH_ITEM_DATA_FULFILLED,
 } from "./actionTypes";
-
-import * as Immutable from "immutable";
-
+import type { ItemsState, PagesState, Action } from "./types";
 import * as reducerItemData from "./reducerItemData";
 import * as reducerOperations from "./reducerOperations";
 
-export const pages = (state : PagesState = Immutable.Map(), action : Action) => {
+export const pages = (state: PagesState = Immutable.Map(), action: Action) => {
   switch (action.type) {
     case REQUEST_PAGE:
       return reducerOperations.requestPage(state, action);
@@ -47,8 +36,7 @@ export const pages = (state : PagesState = Immutable.Map(), action : Action) =>
       return state;
   }
 };
-
-export const items = (state : ItemsState = Immutable.Map(), action : Action) => {
+export const items = (state: ItemsState = Immutable.Map(), action: Action) => {
   switch (action.type) {
     case RECEIVE_PAGE:
       return reducerOperations.receivePageItems(state, action);
@@ -56,26 +44,29 @@ export const items = (state : ItemsState = Immutable.Map(), action : Action) =>
     case FETCH_CURRENT_COMPANY_INFO_PENDING:
     case CLEAR_DATA:
       return state.clear();
+
     default:
       return state;
   }
 };
-
-export const dataItems = (state : ItemsState = Immutable.Map(), action : Action) => {
+export const dataItems = (state: ItemsState = Immutable.Map(), action: Action) => {
   switch (action.type) {
     case RECEIVE_PAGE:
       return reducerOperations.receivePageItems(state, action);
 
     case FETCH_ITEM_DATA_PENDING:
       return reducerItemData.fetchItemDataPending(state, action);
+
     case FETCH_ITEM_DATA_REJECTED:
       return reducerItemData.fetchItemDataRejected(state, action);
+
     case FETCH_ITEM_DATA_FULFILLED:
       return reducerItemData.fetchItemDataFulFilled(state, action);
 
     case FETCH_CURRENT_COMPANY_INFO_PENDING:
     case CLEAR_DATA:
       return state.clear();
+
     default:
       return state;
   }

package/src/selectors.ts

@@ -0,0 +1,113 @@
+import * as Immutable from "immutable";
+import { createSelector } from "reselect";
+import type { State, PagesState } from "./types";
+
+const
+  pagesSelector = (state: State) => state,
+
+  rowsPerPage = 50,
+  pageSelector = createSelector(
+    pagesSelector,
+    (_state: State, token: string) => token,
+    (pages: PagesState, token: string) => pages.get(token),
+  ),
+  getAllResults = createSelector(
+    pageSelector,
+    (_state : State, _token : string, items : any) => items,
+    (page : any, items : any) => {
+      if (typeof page === "undefined") {
+        return Immutable.List();
+      }
+
+      return page.get("ids").map((id : number) => items.get(String(id)));
+    },
+  ),
+  getResultsUpToPage = createSelector(
+    pageSelector,
+    (_state : State, _token : string, items : any) => items,
+    (_state : State, _token : string, _items: any, target: any) => target,
+    (_state : State, _token : string, _items : any, _target : any, perPage : number) => (
+      perPage || rowsPerPage
+    ),
+    (page : any, items : any, target : any, perPage : any) => {
+      if (typeof page === "undefined") {
+        return Immutable.List();
+      }
+
+      const ids = page.get("ids").slice(0, perPage * target);
+
+      return ids.map((id : number) => items.get(String(id)));
+    }),
+  getCurrentTotalResultsCount = createSelector(
+    pageSelector,
+    (page : any) => {
+      if (typeof page === "undefined") {
+        return 0;
+      }
+
+      return page.get("total");
+    }),
+  isPageFetching = createSelector(
+    pageSelector,
+    (_state : State, _token : string, target : any) => target,
+    (page : any, target : any) => {
+      if (typeof page === "undefined") {
+        return false;
+      }
+
+      return page.get("fetching") && target === page.get("page");
+    }),
+  isPageFetched = createSelector(
+    pageSelector,
+    (_state : State, _token : string, target : any) => target,
+    (page : any, target : any) => {
+      if (typeof page === "undefined") {
+        return false;
+      }
+
+      return page.get("fetched") && target <= page.get("page");
+    }),
+  hasPageProblems = createSelector(
+    pageSelector,
+    (page : any) => {
+      if (typeof page === "undefined") {
+        return false;
+      }
+
+      return page.get("error");
+    }),
+  getCurrentView = createSelector(
+    pageSelector,
+    (page : any) => {
+      if (typeof page === "undefined") {
+        return 1;
+      }
+
+      return page.get("view");
+    }),
+
+  // these selectors are used for the entire app
+  getPaginatorPaginations = (state: any, name: string) => state.getIn(["paginations", name]),
+  getPaginatorEntities = (state: any, name: string) => state.getIn(["entities", name]),
+  getPaginators = createSelector(
+    getPaginatorPaginations,
+    getPaginatorEntities,
+    (list : any, entities : any) => ({
+      list,
+      entities,
+    }),
+  );
+
+export default {
+  getAllResults,
+  getCurrentTotalResultsCount,
+  getResultsUpToPage,
+  isPageFetching,
+  isPageFetched,
+  hasPageProblems,
+  getCurrentView,
+  // for state
+  getPaginatorPaginations,
+  getPaginatorEntities,
+  getPaginators,
+};