global !p
# Capitalize the first letter without affecting the rest of the letters
def capitalize_first(word):
	if(word):
		word = word[0].upper() + word[1:]
	return word
endglobal

# Functional components
snippet rfc "react functional component" b
import React, {useState} from "react"

function ${1:`!p snip.rv = snip.basename`}(${2}){
	return(
		<div>
			${3:<p>Body</p>}
		</div>
		)
}

export default $4`!p snip.rv = snip.basename`
endsnippet
# React Hooks
snippet useS "useState Hook" b
const [${1}, set`!p snip.rv=capitalize_first(t[1])`] = useState(${3:"${4}"})
endsnippet
snippet useE "useEffect Hook" b
useEffect(() => {
	${1:${0}}
		}${2})
endsnippet
snippet useC "useContext Hook" b
const ${1:context} = useContext(${2})
endsnippet
snippet useRe "useReducer Hook" b
const [${3:state}, ${4:dispatch}] = useReducer(${5:reducer}, ${2:initial_value})
endsnippet
snippet useCB "useCallback(fn, inputs)" b
const ${1:callback} = useCallback((${2})) => ${3:{
	${4}
}}, [${5}])
endsnippet
snippet useM "useMemo(fn, inputs)" b
const ${1:memorized} = useMemo(() => ${2:{
	${3}
}}, [${4}])
endsnippet
snippet useR "useRef(defaultValue)" b
const ${1:ref} = useRef(${2:null})
endsnippet
snippet ir "import React"
import React from "react"
endsnippet
snippet irc "import React and Component"
import React, { Component } from "react"
endsnippet