update react snippets

UltiSnips/javascript.snippets

@@ -42,36 +42,74 @@ setTimeout(() => {$0
 endsnippet
 
 snippet jsx "import React ..."
-import React from "react"
+import React from "react";
 
-export default () => (
-  <${1:div}>$0</$1>
-)
-endsnippet
-
-snippet jsxs "import React ... (styled)"
-import React from "react"
-import styled from "styled-components"
-
-const $1 = styled.${2:div}\`
-  $3
-\`
-
-export default () => (
-  <$1>$0</$1>
-)
-endsnippet
-
-snippet xc "class ..."
-class $1 extends React.component {
+class $1 extends React.Component {
 	constructor(props) {
-    super(props)
-    this.setState({$0})
+		super(props);
+		this.state = {
+		}
 	}
 
 	render() {
 		return (
-    )
+			<${2:div} className={this.props.className}>
+				$0
+			</$2>
+		);
+	}
+}
+
+export default () => (
+	<S.$1}></S.$1>
+);
+endsnippet
+
+snippet jsxs "import React ... styled"
+import React from "react";
+import styled from "styled-components";
+
+const S = {};
+
+class $1 extends React.Component {
+	constructor(props) {
+		super(props);
+		this.state = {
+		}
+	}
+
+	render() {
+		return (
+			<${2:div} className={this.props.className}>
+				$0
+			</$2>
+		);
+	}
+}
+
+S.$1 = styled($1)\`
+\`;
+
+export default () => (
+	<S.$1}></S.$1>
+);
+endsnippet
+
+snippet jsc "class ... extends React.Component"
+class $1 extends React.Component \{
+${2:	constructor(props) \{
+		super(props);
+		this.state = \{
+		\}
+	\}}
+
+	render() \{
+		return (
+			<${3:div}${4: className=\{this.props.className\}}>
+				$0
+			</$3>
+		);
 	}
 }
 endsnippet
+