lore-generate-component

Generates a new React component in src/components

--connect

Providing --connect as an argument will generate a component wrapped in the lore.connect decorator.

Usage

lore generate component MyComponent --connect
import React from 'react';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';
import { connect } from 'lore-hook-connect';

export default connect((getState, props) => {
  return {
    // models: getState('model.find')
  };
})(
createReactClass({
  displayName: 'MyComponent',

  propTypes: {
    // models: PropTypes.object.isRequired
  },

  render() {
    return (
      <div></div>
    );
  }
})
);
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'lore-hook-connect';

class MyComponent extends React.Component {

  constructor(props) {
    super(props);

    // Set your initial state here
    // this.setState = {};

    // Bind your custom methods so you can access the expected 'this'
    // this.myCustomMethod = this.myCustomMethod.bind(this);
  }

  render() {
    return (
      <div></div>
    );
  }

}

MyComponent.propTypes = {
  // models: PropTypes.object.isRequired
};

export default connect((getState, props) => {
  return {
    // models: getState('model.find')
  };
})(MyComponent);
import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'lore-hook-connect';

@connect((getState, props) => {
  return {
    // models: getState('model.find')
  };
})
class MyComponent extends React.Component {

  static propTypes = {
    // models: PropTypes.object.isRequired
  };

  constructor(props) {
    super(props);

    // Set your initial state here
    // this.setState = {};

    // Bind your custom methods so you can access the expected 'this'
    // this.myCustomMethod = this.myCustomMethod.bind(this);
  }

  render() {
    return (
      <div></div>
    );
  }

}

export default MyComponent;