@mui/x-data-grid/node/hooks/features/pagination/useGridPage.js

The community edition of the data grid component (MUI X).

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useGridPage = exports.getPageCount = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var React = _interopRequireWildcard(require("react"));

var _utils = require("../../utils");

var _filter = require("../filter");

var _gridPaginationSelector = require("./gridPaginationSelector");

var _pipeProcessing = require("../../core/pipeProcessing");

var _warning = require("../../../utils/warning");

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

const getPageCount = (rowCount, pageSize) => {
  if (pageSize > 0 && rowCount > 0) {
    return Math.ceil(rowCount / pageSize);
  }

  return 0;
};

exports.getPageCount = getPageCount;

const applyValidPage = paginationState => {
  if (!paginationState.pageCount) {
    return paginationState;
  }

  return (0, _extends2.default)({}, paginationState, {
    page: Math.max(Math.min(paginationState.page, paginationState.pageCount - 1), 0)
  });
};

const mergeStateWithPage = page => state => (0, _extends2.default)({}, state, {
  pagination: applyValidPage((0, _extends2.default)({}, state.pagination, {
    page
  }))
});

const noRowCountInServerMode = (0, _warning.buildWarning)(["MUI: the 'rowCount' prop is undefined while using paginationMode='server'", 'For more detail, see http://mui.com/components/data-grid/pagination/#basic-implementation'], 'error');
/**
 * @requires useGridPageSize (event)
 */

const useGridPage = (apiRef, props) => {
  var _props$initialState2, _props$initialState2$;

  const logger = (0, _utils.useGridLogger)(apiRef, 'useGridPage');
  const visibleTopLevelRowCount = (0, _utils.useGridSelector)(apiRef, _filter.gridVisibleTopLevelRowCountSelector);
  apiRef.current.unstable_registerControlState({
    stateId: 'page',
    propModel: props.page,
    propOnChange: props.onPageChange,
    stateSelector: _gridPaginationSelector.gridPageSelector,
    changeEvent: 'pageChange'
  });
  /**
   * API METHODS
   */

  const setPage = React.useCallback(page => {
    logger.debug(`Setting page to ${page}`);
    apiRef.current.setState(mergeStateWithPage(page));
    apiRef.current.forceUpdate();
  }, [apiRef, logger]);
  const pageApi = {
    setPage
  };
  (0, _utils.useGridApiMethod)(apiRef, pageApi, 'GridPageApi');
  /**
   * PRE-PROCESSING
   */

  const stateExportPreProcessing = React.useCallback((prevState, context) => {
    var _props$initialState, _props$initialState$p;

    const pageToExport = (0, _gridPaginationSelector.gridPageSelector)(apiRef);
    const shouldExportPage = // Always export if the `exportOnlyDirtyModels` property is activated
    !context.exportOnlyDirtyModels || // Always export if the page is controlled
    props.page != null || // Always export if the page has been initialized
    ((_props$initialState = props.initialState) == null ? void 0 : (_props$initialState$p = _props$initialState.pagination) == null ? void 0 : _props$initialState$p.page) != null || // Export if the page is not equal to the default value
    pageToExport !== 0;

    if (!shouldExportPage) {
      return prevState;
    }

    return (0, _extends2.default)({}, prevState, {
      pagination: (0, _extends2.default)({}, prevState.pagination, {
        page: pageToExport
      })
    });
  }, [apiRef, props.page, (_props$initialState2 = props.initialState) == null ? void 0 : (_props$initialState2$ = _props$initialState2.pagination) == null ? void 0 : _props$initialState2$.page]);
  const stateRestorePreProcessing = React.useCallback((params, context) => {
    var _context$stateToResto, _context$stateToResto2;

    // We apply the constraint even if the page did not change in case the pageSize changed.
    const page = (_context$stateToResto = (_context$stateToResto2 = context.stateToRestore.pagination) == null ? void 0 : _context$stateToResto2.page) != null ? _context$stateToResto : (0, _gridPaginationSelector.gridPageSelector)(apiRef);
    apiRef.current.setState(mergeStateWithPage(page));
    return params;
  }, [apiRef]);
  (0, _pipeProcessing.useGridRegisterPipeProcessor)(apiRef, 'exportState', stateExportPreProcessing);
  (0, _pipeProcessing.useGridRegisterPipeProcessor)(apiRef, 'restoreState', stateRestorePreProcessing);
  /**
   * EVENTS
   */

  const handlePageSizeChange = pageSize => {
    apiRef.current.setState(state => {
      const pageCount = getPageCount(state.pagination.rowCount, pageSize);
      return (0, _extends2.default)({}, state, {
        pagination: applyValidPage((0, _extends2.default)({}, state.pagination, {
          pageCount,
          page: state.pagination.page
        }))
      });
    });
    apiRef.current.forceUpdate();
  };

  const handlePageChange = () => apiRef.current.scrollToIndexes({
    rowIndex: (0, _gridPaginationSelector.gridPageSelector)(apiRef) * (0, _gridPaginationSelector.gridPageSizeSelector)(apiRef)
  });

  (0, _utils.useGridApiEventHandler)(apiRef, 'pageSizeChange', handlePageSizeChange);
  (0, _utils.useGridApiEventHandler)(apiRef, 'pageChange', handlePageChange);
  /**
   * EFFECTS
   */

  React.useEffect(() => {
    if (process.env.NODE_ENV !== 'production') {
      if (props.paginationMode === 'server' && props.rowCount == null) {
        noRowCountInServerMode();
      }
    }
  }, [props.rowCount, props.paginationMode]);
  React.useEffect(() => {
    apiRef.current.setState(state => {
      const rowCount = props.rowCount !== undefined ? props.rowCount : visibleTopLevelRowCount;
      const pageCount = getPageCount(rowCount, state.pagination.pageSize);
      const page = props.page == null ? state.pagination.page : props.page;
      return (0, _extends2.default)({}, state, {
        pagination: applyValidPage((0, _extends2.default)({}, state.pagination, {
          page,
          rowCount,
          pageCount
        }))
      });
    });
    apiRef.current.forceUpdate();
  }, [visibleTopLevelRowCount, props.rowCount, props.page, props.paginationMode, apiRef]);
};

exports.useGridPage = useGridPage;