diff --git a/README.md b/README.md
index acd7ed9..b0cd6a4 100644
--- a/README.md
+++ b/README.md
@@ -1,46 +1,116 @@
# es6-react-redux-snippets
-This is the best package ever created for ES6, React and Redux
+This is the best package ever created for ES6, React and Redux.
+Enjoy :D
-Here is a table with all available snippets.
-**Note:** The _$1_ or _${1:params}_ is the position where the cursor will be when the snippet is triggered, if you see a following number, it means that you can press tab and cursor will move to that space.
+## ES6+ Snippets
-Enjoy :D
+**log → console.log()**
+
+
+**anfn → annonymous function**
+
+
-## ES6+ Snippets
+**nfn→ named function**
+
+
+
+**fn → ES5 fucntion**
+
+
+
+**imp → import statement**
+
+
+
+**imd → import statement desctructured**
+
+
+
+**ime → import everything as**
+
+
+
+**fof → for of loop**
+
+
+
+**fin → for in loop**
+
+
+
+**met → method**
+
+
+
+**seto → setTimeout**
+
+
+
+**npro → new Promise**
+
+
+
+**catch → catch() with nested annonymous function**
+
+
+
+**then → then() with nested annonymous function**
+
+
+
+## React Snippets
+
+**rcc → React Class Based Component**
+
+
+
+**cpwm → | componentWillMount Method**
+
+
+
+**cla → | className attribute**
+
+
+
+## React Redux Snippets
+
+**rcredux → Renders a React connected component**
+
+
+
+**mapSta → mapStateToProps function**
+
+
-|Prefix|Method|
-|-------:|-------|
-|`log→`|`console.log(${1:msg})`|
-|`anf→`|`(${1:params}) => { $2 }`|
-|`nfn→`|`const ${1:functionName} = (${2:params}) => { $3 }`|
-|`fn→`|`function ${1:functionName} (${2:params}) { $3 }`|
-|`imp→`|`import ${1:ModuleName} from '${2:Module}';`|
-|`imd→`|`import { ${1:destructuredModule} } from '${2:module}'`|
-|`ime→`|`import * as ${1:alias} from '${2:module}`|
-|`fof→`|`for(let ${1:itemName} of ${2:iterable} { $3 }`|
-|`fin→`|`for(let ${1:itemName} in ${2:iterable} { $3 }`|
-|`met→`|`${1:methodName} = (${2:params}) => { $3 }`|
+**mapDis → mapDispatchToProps**
+
+
-## React
+## Redux Snippets
-|Prefix|Method|
-|-------:|-------|
-|`rcc→`|`import React, { Component } from 'react';`
`export default class ${1:componentName}`
`extends Component {`
`render () {`
`return (`
``
` $2`
`
`
`)`
`}`
`}`|
+**rxconst → creates redux constant**
+
+
+**rxaction → redux action**
+
+
-## React Redux
+**rxreducer → Redux reducer template**
+
+
-|Prefix|Method|
-|-------:|-------|
-|`rcredux→`|`React component with Redux`|
+#### Funding
-#Redux
+This software is provided to you as open source, free of charge. The time and
+effort to develop and maintain this project is dedicated by [@papaponmx](https://twitter.com/papaponmx).
+If you (or your employer) benefit from this project, please consider a financial
+contribution. Your contribution helps continue the efforts that produce this
+and other open source software.
-|Prefix|Method|
-|-------:|-------|
-|`rxconst→`|`export const ${1:constName} = '${1:constName}';`|
-|`rxaction→`|`export const ${1:actionName} = ({2:param}) => ({`
`type: ${3:type}`
`payload: ${4:payload}`
`})`|
+Funds are accepted via [PayPal](paypal.me/papaponmx) and Bitcoin Cash in this wallet `qqve8s6trj0wxquq24zlpp9u4d6g7zdt7us2tsus67`. Any amount is appreciated.
diff --git a/docs/anfn.gif b/docs/anfn.gif
new file mode 100644
index 0000000..05be87d
Binary files /dev/null and b/docs/anfn.gif differ
diff --git a/docs/catch.gif b/docs/catch.gif
new file mode 100644
index 0000000..fecbfa5
Binary files /dev/null and b/docs/catch.gif differ
diff --git a/docs/cla.gif b/docs/cla.gif
new file mode 100644
index 0000000..4113534
Binary files /dev/null and b/docs/cla.gif differ
diff --git a/docs/cpwm.gif b/docs/cpwm.gif
new file mode 100644
index 0000000..7dcb118
Binary files /dev/null and b/docs/cpwm.gif differ
diff --git a/docs/fin.gif b/docs/fin.gif
new file mode 100644
index 0000000..1a969e5
Binary files /dev/null and b/docs/fin.gif differ
diff --git a/docs/fn.gif b/docs/fn.gif
new file mode 100644
index 0000000..daac869
Binary files /dev/null and b/docs/fn.gif differ
diff --git a/docs/fof.gif b/docs/fof.gif
new file mode 100644
index 0000000..7a30238
Binary files /dev/null and b/docs/fof.gif differ
diff --git a/docs/imd.gif b/docs/imd.gif
new file mode 100644
index 0000000..567ccdf
Binary files /dev/null and b/docs/imd.gif differ
diff --git a/docs/ime.gif b/docs/ime.gif
new file mode 100644
index 0000000..ba2fb76
Binary files /dev/null and b/docs/ime.gif differ
diff --git a/docs/imp.gif b/docs/imp.gif
new file mode 100644
index 0000000..3f697dd
Binary files /dev/null and b/docs/imp.gif differ
diff --git a/docs/log.gif b/docs/log.gif
new file mode 100644
index 0000000..c6d2fb4
Binary files /dev/null and b/docs/log.gif differ
diff --git a/docs/mapDis.gif b/docs/mapDis.gif
new file mode 100644
index 0000000..1f7bbba
Binary files /dev/null and b/docs/mapDis.gif differ
diff --git a/docs/mapSta.gif b/docs/mapSta.gif
new file mode 100644
index 0000000..b748c4e
Binary files /dev/null and b/docs/mapSta.gif differ
diff --git a/docs/met.gif b/docs/met.gif
new file mode 100644
index 0000000..b67fe7f
Binary files /dev/null and b/docs/met.gif differ
diff --git a/docs/nfn.gif b/docs/nfn.gif
new file mode 100644
index 0000000..3a9c5e5
Binary files /dev/null and b/docs/nfn.gif differ
diff --git a/docs/npro.gif b/docs/npro.gif
new file mode 100644
index 0000000..9983af9
Binary files /dev/null and b/docs/npro.gif differ
diff --git a/docs/rcc.gif b/docs/rcc.gif
new file mode 100644
index 0000000..89277ba
Binary files /dev/null and b/docs/rcc.gif differ
diff --git a/docs/rcredux.gif b/docs/rcredux.gif
new file mode 100644
index 0000000..876bc9a
Binary files /dev/null and b/docs/rcredux.gif differ
diff --git a/docs/rxaction.gif b/docs/rxaction.gif
new file mode 100644
index 0000000..2e76dce
Binary files /dev/null and b/docs/rxaction.gif differ
diff --git a/docs/rxconst.gif b/docs/rxconst.gif
new file mode 100644
index 0000000..f2c2135
Binary files /dev/null and b/docs/rxconst.gif differ
diff --git a/docs/rxreducer.gif b/docs/rxreducer.gif
new file mode 100644
index 0000000..bb2caea
Binary files /dev/null and b/docs/rxreducer.gif differ
diff --git a/docs/seto.gif b/docs/seto.gif
new file mode 100644
index 0000000..5cb63c0
Binary files /dev/null and b/docs/seto.gif differ
diff --git a/docs/then.gif b/docs/then.gif
new file mode 100644
index 0000000..b72d123
Binary files /dev/null and b/docs/then.gif differ
diff --git a/package.json b/package.json
index 10022c0..aeea1d1 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "es6-react-redux-snippets",
"main": "./lib/es6-react-redux-snippets",
- "version": "1.2.0",
+ "version": "3.9.0",
"description": "This is one of the best packages for ES6+, React and Redux packages out there",
"keywords": [
"ES6",
diff --git a/snippets/snippets.cson b/snippets/snippets.cson
index cfb6c95..9af567d 100644
--- a/snippets/snippets.cson
+++ b/snippets/snippets.cson
@@ -2,103 +2,126 @@
# You can contact me at https://github.com/papaponmx
# https://riosjaime.com or hola@riosjaime.com
+# v3.2.0
# JavaScript
'.source.js':
'Console log':
'prefix': 'log'
- 'body': 'console.log(${1:msg})';
-
-
-'.source.js':
+ 'body': 'console.log(${1:msg});';
'Annonymous function':
'prefix': 'anfn'
'body': """(${1:params}) => {
$2
- }"""
-
-'.source.js':
+ };"""
'Named function':
'prefix': 'nfn'
'body': 'const ${1:functionName} = (${2:params}) => { $3 }'
-
-'.source.js':
'function':
'prefix': 'fn'
'body': """function ${1:functionName} (${2:params}) {
$3
}"""
-
-'.source.js':
'Import snippet':
'prefix': 'imp'
- 'body': """import ${1:ModuleName} from '${2:Module}';"""
-
-
-'.source.js':
+ 'body': """import ${2:ModuleName} from '${1:Module}';"""
'Import destructured':
'prefix': 'imd'
- 'body': """import { ${1:destructuredModule} } from '${2:module}'"""
-
-'.source.js':
+ 'body': """import { ${1:destructuredModule} } from '${2:module}';"""
'Import Everything':
'prefix': 'ime'
- 'body': """import * as ${1:alias} from '${2:module}"""
-
-'.source.js':
+ 'body': """import * as ${2:alias} from '${1:module}';"""
'For of loop':
'prefix': 'fof'
- 'body': """ for(let ${1:itemName} of ${2:iterable} {
+ 'body': """ for(let ${1:itemName} of ${2:iterable}) {
${3}
- }
+ };
"""
-'.source.js':
'For in loop':
'prefix': 'fin'
- 'body': """for(let ${1:itemName} in ${2:iterable} {
+ 'body': """for(let ${1:itemName} in ${2:iterable}) {
$3
}"""
-
-
-'.source.js':
'Method':
'prefix': 'met'
- 'body': """ ${1:methodName} = (${2:params}) => { $3 }
+ 'body': """ ${1:methodName} = (${2:params}) => { $3 };
+ """
+ 'setTimeOut function':
+ 'prefix': 'seto'
+ 'body': """setTimeout(($2) => {
+ $3
+ }, ${1:timeOut});
+ """
+ 'new Promise':
+ 'prefix': 'npro'
+ 'body': 'new Promise((${1:resolve}, ${2:reject}) => );'
+ 'then() with nested annonymous function':
+ 'prefix': 'then'
+ 'body': """then( ${1:response} => {
+ $2
+ });
+ """
+ 'catch() with nested annonymous function':
+ 'prefix': 'catch'
+ 'body': """catch( ${1:err} => {
+ $2
+ });
"""
# React
-'.source.js':
'React Component Snipet':
'prefix': 'rcc'
'body': """import React, { Component } from 'react';
-export default class ${1:componentName} extends Component {
+class ${1:componentName} extends Component {
render() {
return (
$2
- )
+ );
}
}
+export default ${1:componentName}
+ """
+ 'componentWillMount method':
+ 'prefix': 'cpwm'
+ 'body': """componentWillMount($1) {
+ $2
+ }
+ """
+ 'className attribute':
+ 'prefix': 'cla'
+ 'body': """className='$1'
"""
-
# React Redux
-'.source.js':
+ 'mapStateToProps funtion':
+ 'prefix': 'mapSta'
+ 'body': """const mapStateToProps= state => ({
+ $1
+ });
+ """
+ 'mapDispatchToProps funtion':
+ 'prefix': 'mapDisp'
+ 'body': """const mapDispatchToProps = (dispatch) => ({
+ $1
+ });
+ """
+
'Component with redux':
'prefix': 'rcredux'
'body': """
import React, { Component } from 'react';
import { connect } from 'react-redux';
-export class ${1:componentName} extends Component {
+ class ${1:componentName} extends Component {
render() {
return (
- )
+ );
}
}
@@ -106,26 +129,38 @@ const mapStateToProps = (state) => ({
});
-const mapDispatchToProps = {
+const mapDispatchToProps = (dispatch) => ({
-}
+});
export default connect(mapStateToProps, mapDispatchToProps)(${1:componentName});
"""
-
-
# Redux
-'.source.js':
'Redux conts':
'prefix': 'rxconst'
'body': """export const ${1:constName} = '${1:constName}';"""
-
-
-'.source.js':
'Snippet Name':
'prefix': 'rxaction'
- 'body': """export const ${1:actionName} = ({2:param}) => ({
- type: ${3:type},
- payload: ${4:payload}
+ 'body': """export const ${1:actionName} = (action) => ({
+ type: type,
+ payload: action.payload
});
"""
+ 'redux-saga Generator Function':
+ 'prefix': 'rxgen'
+ 'body': """ export function* ${1:workerName}Saga() {
+
+ }
+ """
+ 'Redux reducer':
+ 'prefix': 'rxreducer'
+ 'body': """export default (state = { }, action) => {
+ switch (action.type) {
+
+ case typeName:
+ return { ...state }
+
+ default:
+ return state
+ }
+}"""
diff --git a/spec/es6-react-redux-snippets-view-spec.js b/spec/es6-react-redux-snippets-view-spec.js
deleted file mode 100644
index f03b584..0000000
--- a/spec/es6-react-redux-snippets-view-spec.js
+++ /dev/null
@@ -1,9 +0,0 @@
-'use babel';
-
-import Es6ReactReduxSnippetsView from '../lib/es6-react-redux-snippets-view';
-
-describe('Es6ReactReduxSnippetsView', () => {
- it('has one valid test', () => {
- expect('life').toBe('easy');
- });
-});