Insert React Functional Component Snippet for Atom

init.js

// steps:
// 1. copy this file to ~/.atom/init.js
// 2. in Atom, dispatch command "Window:Reload", Atom would run this file rather than init.coffee
// 3. create new empty file Foo.js
// 4. focus to new tab, send command "react:insert-functional-component-template"

atom.commands.add('atom-text-editor', 'react:insert-functional-component-template', () => {
  editor = atom.workspace.getActiveTextEditor()
  if (!editor) { return null }
  const fileNameCap = getCamelCaseNameFromPath(editor.getPath())
  const template = `import React from 'react'\n\nconst ${fileNameCap} = (props) => {\n  return (\n    <div></div>\n  )\n}\n\nexport default ${fileNameCap}`
  editor.getLastSelection().insertText(template)
})

const getCamelCaseNameFromPath = (filePath) => {
  const [ _, filenameNoExt ] = /(.*?)(?:\.[^.]+)?$/.exec(path.basename(filePath))
  return filenameNoExt
    .replace(/[\W_]/g, ' ')
    .replace(/\w+/g, match => match[0].toUpperCase() + match.slice(1))
    .replace(/\s+/g, '')
}