feat: transform filename into PascalCase (#4)

package.json

@@ -64,7 +64,8 @@
     "format": "prettier --write \"src/**/*.js\"",
     "lint": "eslint .",
     "release": "mversion `conventional-recommended-bump -p angular` -m",
-    "test": "jest --runInBand --coverage && codecov",
+    "clear": "rm -rf __fixtures_build__ lib",
+    "test": "npm run clear && jest --runInBand --coverage && codecov",
     "prepublish": "yarn run build"
   }
 }

src/cli/dirCommand.js

@@ -3,13 +3,22 @@ import fs from 'mz/fs'
 import path from 'path'
 import outputFileSync from 'output-file-sync'
 import { convertFile, isCompilableExtension, readdir } from './util'
+import { pascalCase } from '../transforms/rename'
+
+export const rename = (relative) => {
+  const relativePath = path.parse(relative)
+  relativePath.ext = '.js'
+  relativePath.name = pascalCase(relativePath.name)
+  relativePath.base = null
+
+  return path.format(relativePath)
+}
 
 async function dirCommand(program, filenames, opts) {
   async function write(src, relative) {
     if (!isCompilableExtension(relative)) return false
 
-    // remove extension and then append back on .js
-    relative = `${relative.replace(/\.(\w*?)$/, '')}.js`
+    relative = rename(relative)
 
     const dest = path.join(program.outDir, relative)
 

src/cli/dirCommand.test.js

@@ -0,0 +1,15 @@
+import { rename } from './dirCommand'
+
+describe('rename', () => {
+  it('should transform fileName to the PascalCase', () => {
+    expect(rename('camel-case.js')).toBe('CamelCase.js')
+    expect(rename('camelCase.js')).toBe('CamelCase.js')
+    expect(rename('camel_case.js')).toBe('CamelCase.js')
+    expect(rename('camelcase.js')).toBe('Camelcase.js')
+  })
+
+  it('should change the extension to js', () => {
+    const result = rename('camel-case.svg')
+    expect(result).toBe('CamelCase.js')
+  })
+})

src/cli/index.test.js

@@ -83,10 +83,10 @@ describe('cli', () => {
   it('should work with output directory', async () => {
     await exec('babel-node src/cli --out-dir __fixtures_build__ __fixtures__')
     expect(
-      await fs.readFile('__fixtures_build__/one.js', 'utf-8'),
+      await fs.readFile('__fixtures_build__/One.js', 'utf-8'),
     ).toMatchSnapshot()
     expect(
-      await fs.readFile('__fixtures_build__/nested/two.js', 'utf-8'),
+      await fs.readFile('__fixtures_build__/nested/Two.js', 'utf-8'),
     ).toMatchSnapshot()
   })
 })

src/index.js

@@ -5,6 +5,7 @@ import h2x from './plugins/h2x'
 import prettier from './plugins/prettier'
 import transform from './plugins/transform'
 import wrapIntoComponent from './transforms/wrapIntoComponent'
+import { pascalCase } from './transforms/rename'
 import stripAttribute from './h2x/stripAttribute'
 import emSize from './h2x/emSize'
 import expandProps from './h2x/expandProps'
@@ -22,14 +23,8 @@ export {
   removeComments,
 }
 
-const firstUpperCase = str => `${str.charAt(0).toUpperCase()}${str.slice(1)}`
-const hyphenToCamelCase = str =>
-  str.replace(/-(.)/g, (match, chr) => chr.toUpperCase())
-
 function expandState(state) {
-  const componentName = firstUpperCase(
-    hyphenToCamelCase(path.parse(state.filePath).name),
-  )
+  const componentName = pascalCase(path.parse(state.filePath).name)
 
   return { ...state, componentName }
 }

src/transforms/rename.js

@@ -0,0 +1,3 @@
+import { upperFirst, camelCase } from 'lodash'
+
+export const pascalCase = str => upperFirst(camelCase(str))

src/transforms/rename.test.js

@@ -0,0 +1,11 @@
+import { pascalCase } from './rename'
+
+describe('pascalCase', () => {
+  it('should transform fileName to the PascalCase', () => {
+    expect(pascalCase('camel-case')).toBe('CamelCase')
+    expect(pascalCase('camel_case')).toBe('CamelCase')
+    expect(pascalCase('camelCase')).toBe('CamelCase')
+    expect(pascalCase('camel--Case')).toBe('CamelCase')
+    expect(pascalCase('camel_case')).toBe('CamelCase')
+  })
+})