import React from 'react'

export const ${1:${file_name}} = () => {
  return (
    ${2:<div>Hello</div>}
  )
}

const [${1:'kek'}, set${1:'Kek'}] = useState(${2:'kek'})

useEffect(() => {
  ${1:// ...}
}, [])

{${1:data}.map((item, ind) => (
  ${2:<div key={ind\}>Kek</div>}
))}

{${1:condition} && ${2:data}.map((item, ind) => (
  ${3:<div key={ind\}>Kek</div>}
))}

const ${1:SomeComponent} = memo(function ${1:SomeComponent}({ prop }) {
  return (
    ${2:<div>Hello</div>}
  )
})

const ${1:variableName} = useMemo(() => {
  return ${2:null}
}, [])

const ${1:functionName} = useCallback(() => {
  ${2: // ...}
}, [])

import { useSelector } from 'react-redux'

const ${1:kek} = useSelector((state) => state${2:kekSlice?.kek})

import { useDispatch } from 'react-redux'

const dispatch = useDispatch()

console.log(${1:'kek'})

if (${1:condition}) {
  ${2:// ...}
}

if (${1:condition}) {
  ${2:// ...}
} else {
  ${3:// ...}
}

${1:condition} ? ${2:expresion} : ${3:expresion}

for (let i = 0; i < ${1:10}; i++) {
  ${2:// ...}
}

for (let i = 0; i < ${1:10}; i++) {
  ${2:// ...}
} else {
  ${3:// ...}
}

while (${1:condition}) {
  ${1: // ...}
}

switch(${1:expression}) {
  case 'x':
    {2: // ...}
    break;
  case 'y':
    {3: // ...}
    break;
  default:
    {4: // ...}
}

() => {
  ${1:// ...}
}

${1:window}.addEventListener(${2:'click'}), ${3:'handleClick'})

${1:window}.removeEventListener(${2:'click'}), ${3:'handleClick'})

setTimeout(() => {
  ${1:// ...}
}, ${2:1000})

setInterval(() => {
  ${1:// ...}
}, ${2:1000})

Object.keys(${1:obj}).forEach((key) {
  ${2:// ...}
})

Math.floor(Math.random() * ${1:5})