@wordpress/core-data
Version:
Access to and manipulation of core WordPress entities.
113 lines (109 loc) • 3.53 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.__experimentalUseEntityRecords = __experimentalUseEntityRecords;
exports.default = useEntityRecords;
var _url = require("@wordpress/url");
var _deprecated = _interopRequireDefault(require("@wordpress/deprecated"));
var _data = require("@wordpress/data");
var _useQuerySelect = _interopRequireDefault(require("./use-query-select"));
var _ = require("../");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const EMPTY_ARRAY = [];
/**
* Resolves the specified entity records.
*
* @since 6.1.0 Introduced in WordPress core.
*
* @param kind Kind of the entity, e.g. `root` or a `postType`. See rootEntitiesConfig in ../entities.ts for a list of available kinds.
* @param name Name of the entity, e.g. `plugin` or a `post`. See rootEntitiesConfig in ../entities.ts for a list of available names.
* @param queryArgs Optional HTTP query description for how to fetch the data, passed to the requested API endpoint.
* @param options Optional hook options.
* @example
* ```js
* import { useEntityRecords } from '@wordpress/core-data';
*
* function PageTitlesList() {
* const { records, isResolving } = useEntityRecords( 'postType', 'page' );
*
* if ( isResolving ) {
* return 'Loading...';
* }
*
* return (
* <ul>
* {records.map(( page ) => (
* <li>{ page.title }</li>
* ))}
* </ul>
* );
* }
*
* // Rendered in the application:
* // <PageTitlesList />
* ```
*
* In the above example, when `PageTitlesList` is rendered into an
* application, the list of records and the resolution details will be retrieved from
* the store state using `getEntityRecords()`, or resolved if missing.
*
* @return Entity records data.
* @template RecordType
*/
function useEntityRecords(kind, name, queryArgs = {}, options = {
enabled: true
}) {
// Serialize queryArgs to a string that can be safely used as a React dep.
// We can't just pass queryArgs as one of the deps, because if it is passed
// as an object literal, then it will be a different object on each call even
// if the values remain the same.
const queryAsString = (0, _url.addQueryArgs)('', queryArgs);
const {
data: records,
...rest
} = (0, _useQuerySelect.default)(query => {
if (!options.enabled) {
return {
// Avoiding returning a new reference on every execution.
data: EMPTY_ARRAY
};
}
return query(_.store).getEntityRecords(kind, name, queryArgs);
}, [kind, name, queryAsString, options.enabled]);
const {
totalItems,
totalPages
} = (0, _data.useSelect)(select => {
if (!options.enabled) {
return {
totalItems: null,
totalPages: null
};
}
return {
totalItems: select(_.store).getEntityRecordsTotalItems(kind, name, queryArgs),
totalPages: select(_.store).getEntityRecordsTotalPages(kind, name, queryArgs)
};
}, [kind, name, queryAsString, options.enabled]);
return {
records,
totalItems,
totalPages,
...rest
};
}
function __experimentalUseEntityRecords(kind, name, queryArgs, options) {
(0, _deprecated.default)(`wp.data.__experimentalUseEntityRecords`, {
alternative: 'wp.data.useEntityRecords',
since: '6.1'
});
return useEntityRecords(kind, name, queryArgs, options);
}
//# sourceMappingURL=use-entity-records.js.map