How to use the recompose.setPropTypes function in recompose

import React, { Component, PropTypes } from 'react';
import { compose, onlyUpdateForPropTypes, setPropTypes } from 'recompose';
import GenderMenu from '../../molecules/GenderMenu';
import HairLengthMenu from '../../molecules/HairLengthMenu';

export default compose(
  onlyUpdateForPropTypes,
  setPropTypes({
    // from store
    genderItems: PropTypes.object.isRequired,
    hairLengthItems: PropTypes.object.isRequired,

    // from router
    children: PropTypes.object,
    params: PropTypes.shape({
      gender: PropTypes.string,
      hairLength: PropTypes.string,
    }),
  }),
)(class Style extends Component {
  render(props = this.props) {
    const { genderItems, hairLengthItems, children, params: { gender, hairLength } } = props;

    return (

/* Spinner */
import cx from 'classnames'
import PT from 'prop-types'
import * as React from 'react'
import * as RC from 'recompose'
import { withStyles } from '@material-ui/styles'

import * as RT from 'utils/reactTools'

export default RT.composeComponent(
  'Spinner',
  RC.setPropTypes({
    className: PT.string,
    drop: PT.any,
  }),
  withStyles(() => ({
    root: {
      display: 'inline-block',
      paddingTop: (props) => props.drop || 0,
    },
  })),
  ({ classes, className, drop, ...props }) => (
    <div>
      <i>
    </i></div><i>
  ),
)
</i>

}
  // TODO: Make this aware of if the action template is a copy or not
  return (
    some(environments, 'locked') ||
    instanceTypeInUse(environments, 'read') ||
    instanceTypeInUse(environments, 'write')
  )
}

export default compose(
  setDisplayName('EnhancedActionsPage'),
  withNotifications,
  withFirestore,
  withFirebase,
  // Proptypes for props used in HOCs
  setPropTypes({
    projectId: PropTypes.string.isRequired,
    firebase: PropTypes.shape({
      pushWithMeta: PropTypes.func.isRequired // used in handlers
    }),
    firestore: PropTypes.shape({
      add: PropTypes.func.isRequired // used in handlers
    }),
    showMessage: PropTypes.func.isRequired // used in handlers
  }),
  // Map redux state to props
  connect((state, { projectId }) => {
    const {
      firebase: { auth },
      firestore: { data, ordered }
    } = state
    const formSelector = formValueSelector(ACTION_RUNNER_FORM_NAME)

{this.props.message}
            
          
        
      
    )
  }
}

const enhance = compose(
  proxyStyledStatics(TooltipWrapper),
  setDisplayName('Tooltip'),
  setPropTypes({
    message: PropTypes.node,
    children: PropTypes.node,
    position: PropTypes.string,
    delay: PropTypes.number,
  }),
  defaultProps({
    position: 'above',
    delay: 0,
  }),
)

export default enhance(TooltipBase)

import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { Map } from 'immutable';
import withStyles from 'isomorphic-style-loader/lib/withStyles';
import { compose, withProps, setPropTypes, withState } from 'recompose';
import { withModels } from 'ui/utils/hocs';
import AddTextIconButton from 'ui/components/TextIconButton/AddTextIconButton';
import NewRow from './NewRow';
import SavedRow from './SavedRow';
import styles from './styles.css';

const enhance = compose(
  setPropTypes({
    personaId: PropTypes.string.isRequired,
  }),
  withProps(({ personaId }) => ({
    filter: new Map({ personaId: new Map({ $oid: personaId }) }),
    schema: 'personaAttribute',
    first: 100,
    sort: new Map({ _id: -1 }),
  })),
  withModels,
  withState('isNewAttributeVisible', 'changeNewAttributeVisibility', false),
  withStyles(styles)
);

const render = ({
  personaId,
  models,

} from 'recompose';
import 'diff2html/dist/diff2html.css';

export const RenderDiffResult = ({ genDiffHTML }) => (
  <div>
);

export const ReactGhLikeDiff = compose(
  defaultProps({
    diffString: '',
    past: '',
    current: '',
    options: defaultOptions
  }),
  onlyUpdateForPropTypes,
  setPropTypes({
    past: PropTypes.string,
    current: PropTypes.string,
    options: PropTypes.object,
    diffString: PropTypes.string
  }),
  branch(
    ({ diffString }) =&gt; diffString.length !== 0,
    () =&gt; props =&gt; ,
    mapProps(props =&gt; ({
      genDiffHTML: diffHelper(props)
    }))
  )
)(RenderDiffResult);
</div>

toggleSelectRow: props.toggleSelectRow,
  toggleSelectAll: props.toggleSelectAll,
  toggleSearchBar: props.toggleSearchBar,
  handleSearchValue: props.handleSearchValue,
  handleSort: props.handleSort,
  addFilter: props.addFilter,
  removeFilter: props.removeFilter,
  resetFilter: props.resetFilter,
  changePage: props.changePage,
  changePerPage: props.changePerPage,
  handleSelect: props.handleSelect,
  handleDelete: props.handleDelete,
});

export default compose(
  setPropTypes({
    data: PropTypes.array.isRequired,
    columns: PropTypes.array.isRequired,
    title: PropTypes.string.isRequired,
    showSearchBar: PropTypes.bool,
    searchValue: PropTypes.string,
    sort: PropTypes.shape({
      columnName: PropTypes.string,
      direction: PropTypes.oneOf[('ASC', 'DESC')],
    }),
    toolbarSelectActions: PropTypes.func,
    toolbarActions: PropTypes.func,
    page: PropTypes.number,
    perPage: PropTypes.number,
    perPageOption: PropTypes.arrayOf(PropTypes.number),
    selectedData: PropTypes.arrayOf(PropTypes.object),
    filterValues: PropTypes.object,

import React from 'react';
import PropTypes from 'prop-types';
import { compose, setPropTypes, withState } from 'recompose';
import AddIconButton from 'ui/components/IconButton/AddIconButton';
import CancelIconButton from 'ui/components/IconButton/CancelIconButton';
import Input from 'ui/components/Input/Input';
import TypedInput from 'ui/components/Input/TypedInput';
import { TableActionsData, TableData } from './tableComponents';

const enhance = compose(
  setPropTypes({
    onAdd: PropTypes.func.isRequired,
    onCancel: PropTypes.func.isRequired,
  }),
  withState('attributeKey', 'setAttributeKey', ''),
  withState('attributeValue', 'setAttributeValue', '')
);

const render = ({
  attributeKey,
  attributeValue,
  setAttributeKey,
  setAttributeValue,
  onAdd,
  onCancel,
}) => {
  let keyRef = null;

<div>
    Sending  to <span>{address}</span>.
    Please confirm the following transaction details when prompted by your wallet.
    To:, <span>{txData.to}</span> {assetSymbol !== 'ETH' &amp;&amp; (<i>({assetSymbol} contract)</i>)}],
      [Value:, ],
      [Gas:, ],
      [Gas price:, ],
      [Data:, <span>{txData.data}</span>],
    ]}/&gt;
  </div>
)

export default compose(
  setDisplayName('EthereumInstructions'),
  setPropTypes({
    tx: PropTypes.object.isRequired,
  })
)(EthereumInstructions)

import React from 'react'
import PropTypes from 'prop-types'
import { compose, setDisplayName, setPropTypes, defaultProps } from 'recompose'
import { Button } from 'reactstrap'

import withToggle from 'Hoc/withToggle'
import ShareModal from 'Components/ShareModal'

export default compose(
  setDisplayName('ShareButton'),
  setPropTypes({
    wallet: PropTypes.object,
  }),
  defaultProps({
    wallet: null,
  }),
  withToggle('open', false),
)(({ wallet, isOpen, toggleOpen }) => (
  <button disabled="{!(wallet" size="sm" color="light">
    <i> share
    { wallet &amp;&amp; ()}
  </i></button><i>
))
</i>