How to use rememo - 10 common examples

import { get, omit } from 'lodash';

/**
 * Returns the total number of pages for the given query, or null if the page
 * count is not yet known.
 *
 * @param  {Object}  state Global state object
 * @param  {Object}  query Query object
 * @return {?Number}       Page count if known
 */
export function getDonesTotalPages( state, query ) {
	query = stringify( omit( query, 'page' ) );
	return get( state.dones.totalPages, query, null );
}

export default createSelector(
	getDonesTotalPages,
	( state ) => state.dones.totalPages
);

/**
 * External dependencies
 */
import createSelector from 'rememo';

/**
 * Returns the annotations for a specific client ID.
 *
 * @param {Object} state Editor state.
 * @param {string} clientId The ID of the block to get the annotations for.
 *
 * @return {Array} The annotations applicable to this block.
 */
export const __experimentalGetAnnotationsForBlock = createSelector(
	( state, blockClientId ) => {
		return state.all.filter( ( annotation ) => {
			return annotation.selector === 'block' && annotation.blockClientId === blockClientId;
		} );
	},
	( state, blockClientId ) => [
		state.byBlockClientId[ blockClientId ],
	]
);

/**
 * Returns the annotations that apply to the given RichText instance.
 *
 * Both a blockClientId and a richTextIdentifier are required. This is because
 * a block might have multiple `RichText` components. This does mean that every
 * block needs to implement annotations itself.

modelName = singularModelName( modelName );
		return state.dirty.trash.has( modelName ) ?
			state.dirty.trash.get( modelName ).toArray() :
			[];
	},
	( state, modelName ) => [ state.dirty.trash.get( modelName ) ]
);

/**
 * Retrieves an array of entity ids queued for delete for the given model.
 *
 * @param {Object} state
 * @param {string} modelName
 * @return {Array} An array of entity ids.
 */
const getEntityIdsQueuedForDelete = createSelector(
	( state, modelName ) => {
		modelName = singularModelName( modelName );
		return state.dirty.delete.has( modelName ) ?
			state.dirty.delete.get( modelName ).toArray() :
			[];
	},
	( state, modelName ) => [ state.dirty.delete.get( modelName ) ]
);

/**
 * Retrieves all the models currently having ids queued for trash
 *
 * @param {Object} state
 * @return {Array} An array of model names.
 */
const getModelsQueuedForTrash = createSelector(

* @param  {String} uid   Block unique ID
 * @return {Object}       Parsed block object
 */
export function getBlock( state, uid ) {
	return state.editor.blocksByUid[ uid ];
}

/**
 * Returns all block objects for the current post being edited as an array in
 * the order they appear in the post.
 * Note: It's important to memoize this selector to avoid return a new instance on each call
 *
 * @param  {Object}   state Global application state
 * @return {Object[]}       Post blocks
 */
export const getBlocks = createSelector(
	( state ) => {
		return state.editor.blockOrder.map( ( uid ) => getBlock( state, uid ) );
	},
	( state ) => [
		state.editor.blockOrder,
		state.editor.blocksByUid,
	]
);

/**
 * Returns the number of blocks currently present in the post.
 *
 * @param  {Object} state Global application state
 * @return {Object}       Number of blocks in the post
 */
export function getBlockCount( state ) {

* @param {string} modelName
 * @return {Object} Returns an object keyed by entity ids for the given model.
 * The values on for each entity id is an object keyed by relation names and
 * with values being an array of ids for relation. Example:
 * {
 *   10: {
 *     datetimes: [ 22, 23 ],
 *     message_template_groups: [ 2, 4 ],
 *   },
 *   20: {
 *     datetimes: [ 24, 25 ],
 *   },
 * }
 *
 */
const getRelationAdditionsQueuedForModel = createSelector(
	( state, modelName ) => {
		return lookupRelationsQueuedForModel( state, modelName );
	},
	( state, modelName ) => [
		state.dirty.relations.getIn( [ 'add', singularModelName( modelName ) ] ),
		state.dirty.relations.getIn( [ 'index', singularModelName( modelName ) ] ),
	]
);

/**
 * Retrieves all the queued relation deletions for the given model
 * Similar to `getRelationAdditionsQueuedForModel` except this is relations
 * queued for deletion.
 *
 * @param {Object} state
 * @param {string} modelName

]
);

/**
 * Returns all block objects for the current post being edited as an array in
 * the order they appear in the post.
 *
 * Note: It's important to memoize this selector to avoid return a new instance
 * on each call
 *
 * @param {Object}  state        Editor state.
 * @param {?string} rootClientId Optional root client ID of block list.
 *
 * @return {Object[]} Post blocks.
 */
export const getBlocks = createSelector(
	( state, rootClientId ) => {
		return map(
			getBlockOrder( state, rootClientId ),
			( clientId ) => getBlock( state, clientId )
		);
	},
	( state ) => [
		state.blocks.byClientId,
		state.blocks.order,
		state.blocks.attributes,
	]
);

/**
 * Returns an array containing the clientIds of all descendants
 * of the blocks given.

* External imports
 */
import createSelector from 'rememo';
import { normalizeEntityId } from '@eventespresso/helpers';
import { singularModelName } from '@eventespresso/model';

/**
 * Returns all entity records for the given modelName in the current state.
 * An entity record is the Map of entities (entityId => entity).
 * @param {Object} state
 * @param {string} modelName
 * @return {Object}|null} A collection of entity
 * records for the given model indexed by primary key value or null if none
 * have been set in the state.
 */
const getEntityRecordsForModel = createSelector(
	( state, modelName ) => {
		modelName = singularModelName( modelName );
		return state.entities.has( modelName ) ?
			state.entities.get( modelName ).toJS() :
			null;
	},
	( state, modelName ) => [ state.entities.get( modelName ) ]
);

/**
 * Returns all entities for the given model.
 * This differs from entityRecords, in that the entities are NOT indexed by
 * primary key value and an Array of entities is returned instead of an object.
 *
 * @param {Object} state
 * @param {string} modelName

*
 * @return {Object} Current user object.
 */
export function getCurrentUser( state ) {
	return state.currentUser;
}

/**
 * Returns all the users returned by a query ID.
 *
 * @param {Object} state   Data state.
 * @param {string} queryID Query ID.
 *
 * @return {Array} Users list.
 */
export const getUserQueryResults = createSelector(
	( state, queryID ) => {
		const queryResults = state.users.queries[ queryID ];

		return map( queryResults, ( id ) => state.users.byId[ id ] );
	},
	( state, queryID ) => [ state.users.queries[ queryID ], state.users.byId ]
);

/**
 * Returns whether the entities for the give kind are loaded.
 *
 * @param {Object} state   Data state.
 * @param {string} kind  Entity kind.
 *
 * @return {boolean} Whether the entities are loaded
 */

* @return {Object} Block type object.
 */
const getNormalizedBlockType = ( state, nameOrType ) => (
	'string' === typeof nameOrType ?
		getBlockType( state, nameOrType ) :
		nameOrType
);

/**
 * Returns all the available block types.
 *
 * @param {Object} state Data state.
 *
 * @return {Array} Block Types.
 */
export const getBlockTypes = createSelector(
	( state ) => Object.values( state.blockTypes ),
	( state ) => [
		state.blockTypes,
	]
);

/**
 * Returns a block type by name.
 *
 * @param {Object} state Data state.
 * @param {string} name Block type name.
 *
 * @return {Object?} Block Type.
 */
export function getBlockType( state, name ) {
	return state.blockTypes[ name ];

* @return {Array} ids of descendants.
 */
export const getClientIdsOfDescendants = ( state, clientIds ) => flatMap( clientIds, ( clientId ) => {
	const descendants = getBlockOrder( state, clientId );
	return [ ...descendants, ...getClientIdsOfDescendants( state, descendants ) ];
} );

/**
 * Returns an array containing the clientIds of the top-level blocks
 * and their descendants of any depth (for nested blocks).
 *
 * @param {Object} state Global application state.
 *
 * @return {Array} ids of top-level and descendant blocks.
 */
export const getClientIdsWithDescendants = createSelector(
	( state ) => {
		const topLevelIds = getBlockOrder( state );
		return [ ...topLevelIds, ...getClientIdsOfDescendants( state, topLevelIds ) ];
	},
	( state ) => [
		state.blocks.order,
	]
);

/**
 * Returns the total number of blocks, or the total number of blocks with a specific name in a post.
 * The number returned includes nested blocks.
 *
 * @param {Object}  state     Global application state.
 * @param {?string} blockName Optional block name, if specified only blocks of that type will be counted.
 *