From 8773ad5a1189738605a6b74f8365004e4bfc53af Mon Sep 17 00:00:00 2001
From: Steve Mak <steave.mkm@hotmail.com>
Date: Thu, 18 Apr 2019 12:56:55 +0800
Subject: [PATCH] Add snippets include Error Boundary Component and Lazyload
 import.

---
 package-lock.json              | 46 ++++++++++++++++++++++++++++++++++
 snippets/JavaScript (JSX).cson | 16 ++++++++++++
 2 files changed, 62 insertions(+)
 create mode 100644 package-lock.json

diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..825a3a8
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,46 @@
+{
+  "name": "react",
+  "version": "0.18.0",
+  "lockfileVersion": 1,
+  "requires": true,
+  "dependencies": {
+    "esprima-fb": {
+      "version": "4001.3001.0-dev-harmony-fb",
+      "resolved": "https://registry.npmjs.org/esprima-fb/-/esprima-fb-4001.3001.0-dev-harmony-fb.tgz",
+      "integrity": "sha1-ZZ8fXch/L0dNsjSn2yobbD5ArxQ="
+    },
+    "jsxformat": {
+      "version": "0.0.10",
+      "resolved": "https://registry.npmjs.org/jsxformat/-/jsxformat-0.0.10.tgz",
+      "integrity": "sha1-0Dtt16nmtYxyO5u70FzRyIeiS8s=",
+      "requires": {
+        "lodash": "~2.4.1",
+        "rocambole": "git+https://github.com/millermedeiros/rocambole.git#1bd5044df1d6c888a1bd1b511158fb34b011e9aa",
+        "rocambole-token": "~1.2.1",
+        "underscore.string": "~2.4.0"
+      }
+    },
+    "lodash": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-2.4.2.tgz",
+      "integrity": "sha1-+t2DS5aDBz2hebPq5tnA0VBT9z4="
+    },
+    "rocambole": {
+      "version": "git+https://github.com/millermedeiros/rocambole.git#1bd5044df1d6c888a1bd1b511158fb34b011e9aa",
+      "from": "git+https://github.com/millermedeiros/rocambole.git#1bd5044df1d6c888a1bd1b511158fb34b011e9aa",
+      "requires": {
+        "esprima-fb": "^4001.3001.0-dev-harmony-fb"
+      }
+    },
+    "rocambole-token": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/rocambole-token/-/rocambole-token-1.2.1.tgz",
+      "integrity": "sha1-x4XfdCjcPLJ614lwR71SOMwHDTU="
+    },
+    "underscore.string": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/underscore.string/-/underscore.string-2.4.0.tgz",
+      "integrity": "sha1-jN2PusTi0uoefi6Al8QvRCKA+Fs="
+    }
+  }
+}
diff --git a/snippets/JavaScript (JSX).cson b/snippets/JavaScript (JSX).cson
index 6f3fff3..a79200e 100755
--- a/snippets/JavaScript (JSX).cson	
+++ b/snippets/JavaScript (JSX).cson	
@@ -8,6 +8,10 @@
     prefix: "imr"
     body: "import React from 'react';"
 
+  "React: import component with lazy load":
+    prefix: "imlazy"
+    body: "const $1 = React.lazy(() => import('${1}'));"
+
   "React: componentDidMount: fn() { ... }":
     prefix: "cdm"
     body: "componentDidMount: function() {\n\t${1}\n},"
@@ -16,6 +20,10 @@
     prefix: "cdup"
     body: "componentDidUpdate: function(prevProps, prevState) {\n\t${1}\n},"
 
+  "React: componentDidCatch: fn(error, info) { ... }":
+    prefix: "cdc"
+    body: "componentDidCatch: function(error, info) {\n\t${1}\n},"
+
   "React: componentWillMount: fn() { ... }":
     prefix: "cwm"
     body: "componentWillMount: function() {\n\t${1}\n},"
@@ -92,6 +100,10 @@
     prefix: "cdup6"
     body: "componentDidUpdate(prevProps, prevState) {\n\t${1}\n}"
 
+  "React: componentDidCatch(error, info) { ... } (ES6)":
+    prefix: "cdc6"
+    body: "componentDidCatch(error, info) {\n\t${1}\n}"
+
   "React: componentWillMount() { ... } (ES6)":
     prefix: "cwm6"
     body: "componentWillMount() {\n\t${1}\n}"
@@ -132,6 +144,10 @@
     prefix: "rcs"
     body: "import React from \'react\'\nimport PropTypes from \'prop-types\'\n\nconst $1 = (${2:props}) => {\n\treturn (\n\t\t${3:<div />}\n\t)\n}\n\nexport default ${1}\n"
 
+  "React: error boundary skeleton (ES6)":
+    prefix: 'reb6'
+    body: "import React from 'react';\nimport PropTypes from 'prop-types';\n\nclass $1 extends React.Component {\n  constructor(props) {\n    super(props);\n    this.state = { hasError: false };\n  }\n\n  static getDerivedStateFromError(error) {\n    // Update state so the next render will show the fallback UI.\n    return { hasError: true };\n  }\n\n  componentDidCatch(error, info) {\n    // You can also log the error to an error reporting service\n  }\n\n  render() {\n    if (this.state.hasError) {\n      // You can render any custom fallback UI\n      return <h1>Something went wrong.</h1>;\n    }\n\n    return this.props.children; \n  }\n}\n\nexport default ${1};"
+
   "React: render() { return ... } (ES6)":
     prefix: "ren6"
     body: "render() {\n\treturn (\n\t\t${1:<div />}\n\t);\n}"