Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- {
- "Stateless Functional Component": {
- "prefix": "sfc",
- "body": [
- "import React from 'react';",
- "import PropTypes from 'prop-types';",
- "",
- "function ${TM_FILENAME_BASE/(.*)\\..+$/$1/}({ children }) {",
- " return <div className=\"\">{children}</div>;",
- "}",
- "",
- "${TM_FILENAME_BASE/(.*)\\..+$/$1/}.defaultProps = {};",
- "",
- "${TM_FILENAME_BASE/(.*)\\..+$/$1/}.propTypes = {};",
- "",
- "export default ${TM_FILENAME_BASE/(.*)\\..+$/$1/};"
- ],
- "description": "A stateless functional component"
- },
- "Class Component": {
- "prefix": "cc",
- "body": [
- "import React, { Component } from 'react';",
- "import PropTypes from 'prop-types';",
- "",
- "class ${TM_FILENAME_BASE/(.*)\\\\..+$/$1/} extends Component {",
- " constructor(props) {",
- " super(props);",
- " }",
- "",
- " render() {",
- " const { children } = this.props;",
- " return <div className=\"\">{children}</div>;",
- " }",
- "}",
- "",
- "${TM_FILENAME_BASE/(.*)\\\\..+$/$1/}.defaultProps = {};",
- "",
- "${TM_FILENAME_BASE/(.*)\\\\..+$/$1/}.propTypes = {};",
- "",
- "export default ${TM_FILENAME_BASE/(.*)\\\\..+$/$1/};"
- ],
- "description": "A class component"
- },
- "Connected Class Component": {
- "prefix": "ccc",
- "body": [
- "import React, { Component } from 'react';",
- "import PropTypes from 'prop-types';",
- "import { connect } from 'react-redux';",
- "",
- "class ${TM_FILENAME_BASE/(.*)\\\\..+$/$1/} extends Component {",
- " constructor(props) {",
- " super(props);",
- " }",
- "",
- " render() {",
- " const { children } = this.props;",
- " return <div className=\"\">{children}</div>;",
- " }",
- "}",
- "",
- "${TM_FILENAME_BASE/(.*)\\\\..+$/$1/}.defaultProps = {};",
- "",
- "${TM_FILENAME_BASE/(.*)\\\\..+$/$1/}.propTypes = {};",
- "",
- "function mapStateToProps(state) {",
- " return {};",
- "}",
- "",
- "function mapDispatchToProps(state) {",
- " return {};",
- "}",
- "",
- "export default connect(mapStateToProps, mapDispatchToProps)(${TM_FILENAME_BASE/(.*)\\\\..+$/$1/});"
- ],
- "description": "A connected class component"
- },
- "Unit test": {
- "prefix": "jest",
- "description": "Setup for a jest unit test",
- "body": [
- "import React from 'react';",
- "import ${TM_FILENAME_BASE/(.*)\\..+$/$1/} from './${TM_FILENAME_BASE/(.*)\\..+$/$1/}';",
- "import { shallow } from 'enzyme';",
- "",
- "describe('${TM_FILENAME_BASE/(.*)\\..+$/$1/}', () => {",
- " const defaultProps = {};",
- "",
- " function renderComponent(props) {",
- " return shallow(<${TM_FILENAME_BASE/(.*)\\..+$/$1/} {...defaultProps} {...props} />);",
- " }",
- "",
- " it('should render', () => {",
- " renderComponent({});",
- " });",
- "});"
- ]
- },
- "Unit test w/ Store": {
- "prefix": "jestStore",
- "description": "Setup for a jest unit test with redux",
- "body": [
- "import React from 'react';",
- "import ${TM_FILENAME_BASE/(.*)\\..+$/$1/} from './${TM_FILENAME_BASE/(.*)\\..+$/$1/}';",
- "import { shallow } from 'enzyme';",
- "import configureMockStore from 'redux-mock-store';",
- "import thunk from 'redux-thunk';",
- "",
- "describe('${TM_FILENAME_BASE/(.*)\\..+$/$1/}', () => {",
- " const defaultProps = {};",
- " const initialStoreState = {};",
- "",
- " const middleware = [thunk];",
- " const mockStore = configureMockStore(middleware);",
- "",
- " function renderComponent(props, storeState) {",
- " const store = mockStore({ ...initialStoreState, ...storeState });",
- " return shallow(<${TM_FILENAME_BASE/(.*)\\..+$/$1/} {...defaultProps} {...props} store={store} />).dive();",
- " }",
- "",
- " it('should render', () => {",
- " renderComponent();",
- " });",
- "});"
- ]
- },
- "Reducer Template": {
- "prefix": "reducer",
- "description": "Its a reducer template",
- "body": [
- "import { $1 } from '$2'",
- "",
- "const initialState = {}",
- "",
- "export default function(state = initialState, action) {",
- " const { payload, type } = action",
- "",
- " switch (type) {",
- " case $1:",
- " return { ...payload }",
- "",
- " default:",
- " return state",
- " }",
- "}"
- ]
- }
- }
Add Comment
Please, Sign In to add comment