Guest User

Untitled

a guest
Jan 16th, 2019
73
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.87 KB | None | 0 0
  1. {
  2. "Object Destructure from this.props": {
  3. "prefix": "odprops",
  4. "body": ["const { ${1:value} } = this.props;"],
  5. "description": ""
  6. },
  7. "Re-export": {
  8. "prefix": "rexp",
  9. "body": [
  10. "export { default as ${1:MyComponent} } from './${1:MyComponent}';"
  11. ],
  12. "description": ""
  13. },
  14. "Re-export as default": {
  15. "prefix": "rexpd",
  16. "body": ["export { default } from './${1:MyComponent}';"],
  17. "description": ""
  18. },
  19. "Create Typed Functional Component": {
  20. "prefix": "rsc",
  21. "body": [
  22. "import * as React from 'react';",
  23. "import './${1:${TM_FILENAME_BASE}}.scss';",
  24. "",
  25. "interface ${1:${TM_FILENAME_BASE}}Props {}",
  26. "",
  27. "const ${1:${TM_FILENAME_BASE}}: React.SFC<${1:${TM_FILENAME_BASE}}Props> = props => {",
  28. " return <div className=\"${1:${TM_FILENAME_BASE}}\">${1:${TM_FILENAME_BASE}}</div>;",
  29. "};",
  30. "",
  31. "export default ${1:${TM_FILENAME_BASE}};",
  32. ""
  33. ],
  34. "description": ""
  35. },
  36. "Get injected props": {
  37. "prefix": "gip",
  38. "body": [
  39. "get injected() {",
  40. " return this.props as InjectedProps;",
  41. " }"
  42. ]
  43. },
  44. "Create Class Component": {
  45. "prefix": "rcc",
  46. "body": [
  47. "import * as React from 'react';",
  48. "${2:import './${TM_FILENAME_BASE}.scss';}",
  49. "",
  50. "interface ${1:${TM_FILENAME_BASE}}Props {}",
  51. "",
  52. "class ${1:${TM_FILENAME_BASE}} extends React.Component<${1:${TM_FILENAME_BASE}}Props> {",
  53. " public render() {",
  54. " return <div>${1:${TM_FILENAME_BASE}}</div>;",
  55. " }",
  56. "}",
  57. "",
  58. "export default ${1:${TM_FILENAME_BASE}};",
  59. ""
  60. ],
  61. "description": ""
  62. },
  63. "inject from root store": {
  64. "prefix": "ijr",
  65. "body": ["@inject(({ }: RootStore) => ({}))"],
  66. "description": ""
  67. },
  68. "Created styled stateless component": {
  69. "prefix": "scrsc",
  70. "body": [
  71. "import * as React from 'react';",
  72. "import styled from 'styled-components';",
  73. "",
  74. "const ${TM_FILENAME_BASE}Wrapper = styled.div``;",
  75. "",
  76. "interface ${TM_FILENAME_BASE}Props {}",
  77. "const ${TM_FILENAME_BASE}: React.SFC<${TM_FILENAME_BASE}Props> = props => {",
  78. " return <AppTemplateWrapper />;",
  79. "};",
  80. "",
  81. "export default ${TM_FILENAME_BASE};",
  82. ""
  83. ],
  84. "description": ""
  85. },
  86. "tsrsc": {
  87. "prefix": "tsrsc",
  88. "body": [
  89. "import * as React from 'react';",
  90. "import styled from 'styled-components';",
  91. "",
  92. "const ${1:${TM_FILENAME_BASE}}Block = styled.div``;",
  93. "",
  94. "interface ${1:${TM_FILENAME_BASE}}Props {}",
  95. "",
  96. "const ${1:${TM_FILENAME_BASE}}: React.SFC<${1:${TM_FILENAME_BASE}}Props> = props => {",
  97. " return <${1:${TM_FILENAME_BASE}}Block></${1:${TM_FILENAME_BASE}}Block>;",
  98. "};",
  99. "",
  100. "export default ${1:${TM_FILENAME_BASE}};",
  101. ""
  102. ],
  103. "description": ""
  104. },
  105. "Test React Code": {
  106. "prefix": "tstreact",
  107. "body": [
  108. "import React from 'react';",
  109. "import { shallow, ShallowWrapper } from 'enzyme';",
  110. "import ${1:ComponentName} from './${1:ComponentName}';",
  111. "",
  112. "describe('${1:ComponentName}', () => {",
  113. " let component: ShallowWrapper | null = null;",
  114. " it('renders correctly', () => {",
  115. " component = shallow(<${1:ComponentName} />);",
  116. " });",
  117. " it('matches snapshot', () => {",
  118. " expect(component).toMatchSnapshot();",
  119. " });",
  120. "});",
  121. ""
  122. ],
  123. "description": ""
  124. },
  125. "Create TypeScript React Class Component": {
  126. "prefix": "tsrcc",
  127. "body": [
  128. "import * as React from 'react';",
  129. "",
  130. "interface ${1:ComponentName}Props {}",
  131. "interface ${1:ComponentName}State {}",
  132. "",
  133. "class ${1:ComponentName} extends React.Component<${1:ComponentName}Props, ${1:ComponentName}State> {",
  134. " render() {",
  135. " return null;",
  136. " }",
  137. "}",
  138. "",
  139. "export default ${1:ComponentName};",
  140. ""
  141. ],
  142. "description": ""
  143. },
  144. "Create TypeScript React Redux Container Class Component": {
  145. "prefix": "tsreduxcc",
  146. "body": [
  147. "import * as React from 'react';",
  148. "import { connect } from 'react-redux';",
  149. "import { RootState } from '../../store';",
  150. "",
  151. "interface OwnProps {}",
  152. "interface StateProps {}",
  153. "interface DispatchProps {}",
  154. "interface ${1:${TM_FILENAME_BASE}}Props extends OwnProps, StateProps, DispatchProps {}",
  155. "interface ${1:${TM_FILENAME_BASE}}State {}",
  156. "",
  157. "class ${1:${TM_FILENAME_BASE}} extends React.Component<${1:${TM_FILENAME_BASE}}Props, ${1:${TM_FILENAME_BASE}}State> {",
  158. " render() {",
  159. " return null;",
  160. " }",
  161. "}",
  162. "",
  163. "export default connect<StateProps, DispatchProps, OwnProps, RootState>(",
  164. " state => ({}),",
  165. " {},",
  166. ")(${1:${TM_FILENAME_BASE}});",
  167. ""
  168. ],
  169. "description": ""
  170. }
  171. }
Add Comment
Please, Sign In to add comment