recomposeExample

recomposeExample.js

import { connect } from 'react-redux';
import compose from 'recompose/compose';
import withState from 'recompose/withState';
import withHandlers from 'recompose/withHandlers';
import lifecycle from 'recompose/lifecycle';


import { renderMonth, schoolyearsFilter, renderLessons } from './helpers';

export default compose(
  connect(
    state => ({
      selectId: state.classes.HowShow.selectId,
      period: state.classes.HowShow.period,
      schoolyears: state.admin.schoolyears.years.schoolyears,
      toggleRender: state.classes.HowShow.toggleRender,
    })
  ),
  withState('arrayCount', 'updateCount', []),
  withState('lessons', 'updateLessons', []),
  withHandlers({
    arrayMonth: props => e =>
      props.updateCount((n) => {
        n = []; // eslint-disable-line no-param-reassign
        return n.concat(e);
      }),
    renderLessons: props => e =>
      props.updateLessons((n) => {
        n = []; // eslint-disable-line no-param-reassign
        return n.concat(e);
      }),
  }),
  lifecycle({
    componentDidMount() {
      const { selectId } = this.props;

      this.props.renderLessons(renderLessons(31));
      this.props.arrayMonth(renderMonth(selectId, []));
    },
    componentDidUpdate(nextProps) {
      if (this.props.selectId !== nextProps.selectId || (this.props.toggleRender !== nextProps.toggleRender && this.props.toggleRender === true)) {
        const { selectId } = this.props;

        this.props.renderLessons(renderLessons(31));
        this.props.arrayMonth(renderMonth(selectId, []));
      }
      if (this.props.period !== nextProps.period || (this.props.toggleRender !== nextProps.toggleRender && this.props.toggleRender === false)) {
        const schoolyearsObject = schoolyearsFilter(this.props.schoolyears, this.props.match.params.id);
        const { selectId, period } = this.props;
        const periodLength = renderMonth(selectId, [], schoolyearsObject, period);

        this.props.renderLessons(renderLessons(periodLength.length));
        this.props.arrayMonth(renderMonth(selectId, [], schoolyearsObject, period));
      }
    },
  })
);



import { connect } from 'react-redux';
import compose from 'recompose/compose';
import withState from 'recompose/withState';
import withHandlers from 'recompose/withHandlers';
import getClassName from 'app/selectors/Classes/Class/Timetable/getClassName';

import { changeMonth, changePeriod, toggleRenderAction } from 'app/actions/classes/Timetable/change';

export default compose(
  connect(
    (state, props) => ({
      className: getClassName(state, props),
      selectId: state.classes.HowShow.selectId,
      period: state.classes.HowShow.period,
      toggleRender: state.classes.HowShow.toggleRender,
      schoolyears: state.admin.schoolyears.years.schoolyears,
    }),
    dispatch => ({
      changeMonth: id => dispatch(changeMonth(id)),
      changePeriod: id => dispatch(changePeriod(id)),
      toggleRenderAction: id => dispatch(toggleRenderAction()),
    })
  ),

  withState('isOpen', 'selectionItems', false),
  withHandlers({
    selectionItems: props => () => props.selectionItems(n => !n),
  })

);




import { connect } from 'react-redux';
import compose from 'recompose/compose';
import lifecycle from 'recompose/lifecycle';

import {
  listFetch,
  checkboxToogleOn,
  checkboxToogleOff,
  presentFetch,
} from '../../actions/Apps/list';


export default compose(
  connect(
    state => ({
      title: `Приложения - ${state.dealer.project_name}`,
      toogle: state.apps.checkboxToogle,
      enable: state.apps.enable,
      data: state.apps.data,
      present: state.apps.present,
      apps: state.settings.fav,
    }),

    dispatch => ({
      listFetch: () => dispatch(listFetch()),
      checkboxToogleOn: () => dispatch(checkboxToogleOn()),
      checkboxToogleOff: () => dispatch(checkboxToogleOff()),
      presentFetch: () => dispatch(presentFetch()),
    })
  ),

  lifecycle({
    componentDidMount() {
      this.props.listFetch();
      this.props.presentFetch();
    },
  })
);