Redux Resource
  • Home
  • Introduction
    • Motivation
    • Core Concepts
    • Similar Projects
    • Examples
  • Resources
    • Resource Reducers
    • Resource Objects
    • Meta
    • Lists
    • Modifying Resources
  • Requests
    • Request Objects
    • Keys
    • Names
    • Statuses
    • Request Actions
      • Updating Lists
      • Reading Resources
      • Updating Resources
      • Creating Resources
      • Deleting Resources
  • Other Guides
    • Usage With React
    • Tracking Request Statuses
    • Using Request Statuses
    • Custom Action Types
    • Migration Guides
  • Recipes
    • Forms
    • Canceling Requests
    • Unauthorized Responses
    • User Feedback
    • Related Resources
    • Caching
  • Ecosystem Extras
    • Redux Resource Action Creators
    • Redux Resource XHR
    • Redux Resource Prop Types
    • Redux Resource Plugins
      • HTTP Status Codes
      • Selection
      • Reset
      • Included Resources
  • FAQ
    • General
    • State Tree
    • Actions
    • Lists
  • API Reference
    • resourceReducer
    • getStatus
    • getResources
    • upsertResources
    • setResourceMeta
    • actionTypes
    • requestStatuses
Powered by GitBook
On this page
  • Other Guides
  • Installation
  • Usage
  • idPropType
  • statusPropType
  • requestStatusPropType
  • resourcePropType
  • requestPropType
  1. Ecosystem Extras

Redux Resource Prop Types

PreviousRedux Resource XHRNextRedux Resource Plugins

Last updated 7 years ago

A collection of objects.

Other Guides

Old Documentation

Migration Guides

Installation

Install redux-resource-prop-types with npm:

npm install redux-resource-prop-types --save

Then, import the prop types that you need:

import { resourcesPropType } from 'redux-resource-prop-types';

Usage

We recommend using the prop types in this library to build your own prop types, which you can reuse throughout your application.

idPropType

Validates a single resource ID.

Tip: This prop type requires that your IDs be either strings or numbers.

import PropTypes from 'prop-types';
import { idPropType } from 'redux-resource-prop-types';

MyComponent.propTypes = {
  selectedBookIds: PropTypes.arrayOf(idPropType).isRequired
};

mapStateToProps(state) {
  return {
    selectedBookIds: state.books.selectedIds
  };
}

statusPropType

import { getStatus } from 'redux-resource';
import { statusPropType } from 'redux-resource-prop-types';

MyComponent.propTypes = {
  booksReadStatus: statusPropType
};

mapStateToProps(state) {
  return {
    bookReadStatus: getStatus(state, 'books.meta[23].readStatus');
  };
}

requestStatusPropType

import { requestStatusPropType } from 'redux-resource-prop-types';

MyComponent.propTypes = {
  bookRequestStatus: requestStatusPropType
};

mapStateToProps(state) {
  return {
    bookRequestStatus: state.books.meta[23].readStatus
  };
}

resourcePropType

Validates a resource. Similar to PropTypes.shape(), except that it enforces an ID.

import PropTypes from 'prop-types';
import { resourcePropType } from 'redux-resource-prop-types';

MyComponent.propTypes = {
  book: resourcePropType({
    name: PropTypes.string.isRequired,
    releaseYear: PropTypes.number.isRequired
  })
};

mapStateToProps(state) {
  return {
    book: state.books.resources[23]
  };
}

requestPropType

import PropTypes from 'prop-types';
import { requestPropType } from 'redux-resource-prop-types';

MyComponent.propTypes = {
  searchRequest: requestPropType({
    statusCode: PropTypes.number.isRequired
  })
};

mapStateToProps(state) {
  return {
    searchRequest: state.books.requests.search
  };
}

If you're using React, refer to the guide on how to use the exported prop types. If you're not using React, refer to the documentation of the library.

Validates the object returned by .

Validates that a value is one of the . Typically, you'll want to use statusPropType instead, but this can be useful when verifying the structure of your slice.

Validates a . Similar to PropTypes.shape(), except that it enforces ids, status, requestKey and resourceType. Typically, you won't need to use this, but it can be useful to verify the structure of your state.

Typechecking with PropTypes
prop-types
getStatus
requestStatuses
request object
prop-types
2.x documentation
3.x documentation
v2 to v3
v3 to v4
npm version
gzip size